import{d as A,r as b,_ as y,l as h,w as s,j as p,k as i,f as e,e as a,b as n,a as v,h as Y,t as Z,F as f,m as K,n as S,q as G}from"./index.3fe853a6.js";import{a as V,A as H}from"./AppleOutlined.1ca6425b.js";const L=A({setup(){return{activeKey:b("1")}}});function D(o,t,d,r,I,m){const c=p("a-tab-pane"),u=p("a-tabs"),l=p("demo-box");return i(),h(l,{jsfiddle:{us:"Default activate first tab.",cn:"\u9ED8\u8BA4\u9009\u4E2D\u7B2C\u4E00\u9879\u3002",docHtml:`<h2 id="zh-CN">zh-CN <a class="header-anchor" href="#zh-CN">
          <span aria-hidden="true" class="anchor">#</span>
        </a></h2>
<p>\u9ED8\u8BA4\u9009\u4E2D\u7B2C\u4E00\u9879\u3002</p>
<h2 id="en-US">en-US <a class="header-anchor" href="#en-US">
          <span aria-hidden="true" class="anchor">#</span>
        </a></h2>
<p>Default activate first tab.</p>
`,order:0,title:{"zh-CN":"\u57FA\u672C\u7528\u6CD5","en-US":"Basic Usage"},relativePath:"components/tabs/demo/basic.vue",sourceCode:"PHRlbXBsYXRlPgogIDxhLXRhYnMgdi1tb2RlbDphY3RpdmVLZXk9ImFjdGl2ZUtleSI+CiAgICA8YS10YWItcGFuZSBrZXk9IjEiIHRhYj0iVGFiIDEiPkNvbnRlbnQgb2YgVGFiIFBhbmUgMTwvYS10YWItcGFuZT4KICAgIDxhLXRhYi1wYW5lIGtleT0iMiIgdGFiPSJUYWIgMiIgZm9yY2UtcmVuZGVyPkNvbnRlbnQgb2YgVGFiIFBhbmUgMjwvYS10YWItcGFuZT4KICAgIDxhLXRhYi1wYW5lIGtleT0iMyIgdGFiPSJUYWIgMyI+Q29udGVudCBvZiBUYWIgUGFuZSAzPC9hLXRhYi1wYW5lPgogIDwvYS10YWJzPgo8L3RlbXBsYXRlPgo8c2NyaXB0IGxhbmc9InRzIj4KaW1wb3J0IHsgZGVmaW5lQ29tcG9uZW50LCByZWYgfSBmcm9tICd2dWUnOwoKZXhwb3J0IGRlZmF1bHQgZGVmaW5lQ29tcG9uZW50KHsKICBzZXR1cCgpIHsKICAgIHJldHVybiB7CiAgICAgIGFjdGl2ZUtleTogcmVmKCcxJyksCiAgICB9OwogIH0sCn0pOwo8L3NjcmlwdD4KCg==",jsSourceCode:"PHRlbXBsYXRlPgogIDxhLXRhYnMgdi1tb2RlbDphY3RpdmVLZXk9ImFjdGl2ZUtleSI+CiAgICA8YS10YWItcGFuZSBrZXk9IjEiIHRhYj0iVGFiIDEiPkNvbnRlbnQgb2YgVGFiIFBhbmUgMTwvYS10YWItcGFuZT4KICAgIDxhLXRhYi1wYW5lIGtleT0iMiIgdGFiPSJUYWIgMiIgZm9yY2UtcmVuZGVyPkNvbnRlbnQgb2YgVGFiIFBhbmUgMjwvYS10YWItcGFuZT4KICAgIDxhLXRhYi1wYW5lIGtleT0iMyIgdGFiPSJUYWIgMyI+Q29udGVudCBvZiBUYWIgUGFuZSAzPC9hLXRhYi1wYW5lPgogIDwvYS10YWJzPgo8L3RlbXBsYXRlPgo8c2NyaXB0PgppbXBvcnQgeyBkZWZpbmVDb21wb25lbnQsIHJlZiB9IGZyb20gJ3Z1ZSc7CmV4cG9ydCBkZWZhdWx0IGRlZmluZUNvbXBvbmVudCh7CiAgc2V0dXAoKSB7CiAgICByZXR1cm4gewogICAgICBhY3RpdmVLZXk6IHJlZignMScpLAogICAgfTsKICB9LAp9KTsKPC9zY3JpcHQ+"}},{default:s(()=>[e(u,{activeKey:o.activeKey,"onUpdate:activeKey":t[0]||(t[0]=k=>o.activeKey=k)},{default:s(()=>[e(c,{key:"1",tab:"Tab 1"},{default:s(()=>t[1]||(t[1]=[a("Content of Tab Pane 1")])),_:1,__:[1]}),e(c,{key:"2",tab:"Tab 2","force-render":""},{default:s(()=>t[2]||(t[2]=[a("Content of Tab Pane 2")])),_:1,__:[2]}),e(c,{key:"3",tab:"Tab 3"},{default:s(()=>t[3]||(t[3]=[a("Content of Tab Pane 3")])),_:1,__:[3]})]),_:1},8,["activeKey"])]),htmlCode:s(()=>t[4]||(t[4]=[n("pre",{class:"language-vue"},[n("code",null,[n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),a("template")]),n("span",{class:"token punctuation"},">")]),a(`
  `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),a("a-tabs")]),a(),n("span",{class:"token attr-name"},[n("span",{class:"token namespace"},"v-model:"),a("activeKey")]),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),a("activeKey"),n("span",{class:"token punctuation"},'"')]),n("span",{class:"token punctuation"},">")]),a(`
    `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),a("a-tab-pane")]),a(),n("span",{class:"token attr-name"},"key"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),a("1"),n("span",{class:"token punctuation"},'"')]),a(),n("span",{class:"token attr-name"},"tab"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),a("Tab 1"),n("span",{class:"token punctuation"},'"')]),n("span",{class:"token punctuation"},">")]),a("Content of Tab Pane 1"),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"</"),a("a-tab-pane")]),n("span",{class:"token punctuation"},">")]),a(`
    `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),a("a-tab-pane")]),a(),n("span",{class:"token attr-name"},"key"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),a("2"),n("span",{class:"token punctuation"},'"')]),a(),n("span",{class:"token attr-name"},"tab"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),a("Tab 2"),n("span",{class:"token punctuation"},'"')]),a(),n("span",{class:"token attr-name"},"force-render"),n("span",{class:"token punctuation"},">")]),a("Content of Tab Pane 2"),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"</"),a("a-tab-pane")]),n("span",{class:"token punctuation"},">")]),a(`
    `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),a("a-tab-pane")]),a(),n("span",{class:"token attr-name"},"key"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),a("3"),n("span",{class:"token punctuation"},'"')]),a(),n("span",{class:"token attr-name"},"tab"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),a("Tab 3"),n("span",{class:"token punctuation"},'"')]),n("span",{class:"token punctuation"},">")]),a("Content of Tab Pane 3"),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"</"),a("a-tab-pane")]),n("span",{class:"token punctuation"},">")]),a(`
  `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"</"),a("a-tabs")]),n("span",{class:"token punctuation"},">")]),a(`
`),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"</"),a("template")]),n("span",{class:"token punctuation"},">")]),a(`
`),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),a("script")]),a(),n("span",{class:"token attr-name"},"lang"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),a("ts"),n("span",{class:"token punctuation"},'"')]),n("span",{class:"token punctuation"},">")]),n("span",{class:"token script"},[n("span",{class:"token language-javascript"},[a(`
`),n("span",{class:"token keyword"},"import"),a(),n("span",{class:"token punctuation"},"{"),a(" defineComponent"),n("span",{class:"token punctuation"},","),a(" ref "),n("span",{class:"token punctuation"},"}"),a(),n("span",{class:"token keyword"},"from"),a(),n("span",{class:"token string"},"'vue'"),n("span",{class:"token punctuation"},";"),a(`

`),n("span",{class:"token keyword"},"export"),a(),n("span",{class:"token keyword"},"default"),a(),n("span",{class:"token function"},"defineComponent"),n("span",{class:"token punctuation"},"("),n("span",{class:"token punctuation"},"{"),a(`
  `),n("span",{class:"token function"},"setup"),n("span",{class:"token punctuation"},"("),n("span",{class:"token punctuation"},")"),a(),n("span",{class:"token punctuation"},"{"),a(`
    `),n("span",{class:"token keyword"},"return"),a(),n("span",{class:"token punctuation"},"{"),a(`
      `),n("span",{class:"token literal-property property"},"activeKey"),n("span",{class:"token operator"},":"),a(),n("span",{class:"token function"},"ref"),n("span",{class:"token punctuation"},"("),n("span",{class:"token string"},"'1'"),n("span",{class:"token punctuation"},")"),n("span",{class:"token punctuation"},","),a(`
    `),n("span",{class:"token punctuation"},"}"),n("span",{class:"token punctuation"},";"),a(`
  `),n("span",{class:"token punctuation"},"}"),n("span",{class:"token punctuation"},","),a(`
`),n("span",{class:"token punctuation"},"}"),n("span",{class:"token punctuation"},")"),n("span",{class:"token punctuation"},";"),a(`
`)])]),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"</"),a("script")]),n("span",{class:"token punctuation"},">")]),a(`
`)])],-1)])),jsVersionHtml:s(()=>t[5]||(t[5]=[n("pre",{class:"language-vue"},[n("code",null,[n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),a("template")]),n("span",{class:"token punctuation"},">")]),a(`
  `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),a("a-tabs")]),a(),n("span",{class:"token attr-name"},[n("span",{class:"token namespace"},"v-model:"),a("activeKey")]),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),a("activeKey"),n("span",{class:"token punctuation"},'"')]),n("span",{class:"token punctuation"},">")]),a(`
    `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),a("a-tab-pane")]),a(),n("span",{class:"token attr-name"},"key"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),a("1"),n("span",{class:"token punctuation"},'"')]),a(),n("span",{class:"token attr-name"},"tab"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),a("Tab 1"),n("span",{class:"token punctuation"},'"')]),n("span",{class:"token punctuation"},">")]),a("Content of Tab Pane 1"),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"</"),a("a-tab-pane")]),n("span",{class:"token punctuation"},">")]),a(`
    `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),a("a-tab-pane")]),a(),n("span",{class:"token attr-name"},"key"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),a("2"),n("span",{class:"token punctuation"},'"')]),a(),n("span",{class:"token attr-name"},"tab"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),a("Tab 2"),n("span",{class:"token punctuation"},'"')]),a(),n("span",{class:"token attr-name"},"force-render"),n("span",{class:"token punctuation"},">")]),a("Content of Tab Pane 2"),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"</"),a("a-tab-pane")]),n("span",{class:"token punctuation"},">")]),a(`
    `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),a("a-tab-pane")]),a(),n("span",{class:"token attr-name"},"key"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),a("3"),n("span",{class:"token punctuation"},'"')]),a(),n("span",{class:"token attr-name"},"tab"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),a("Tab 3"),n("span",{class:"token punctuation"},'"')]),n("span",{class:"token punctuation"},">")]),a("Content of Tab Pane 3"),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"</"),a("a-tab-pane")]),n("span",{class:"token punctuation"},">")]),a(`
  `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"</"),a("a-tabs")]),n("span",{class:"token punctuation"},">")]),a(`
`),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"</"),a("template")]),n("span",{class:"token punctuation"},">")]),a(`
`),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),a("script")]),n("span",{class:"token punctuation"},">")]),n("span",{class:"token script"},[n("span",{class:"token language-javascript"},[a(`
`),n("span",{class:"token keyword"},"import"),a(),n("span",{class:"token punctuation"},"{"),a(" defineComponent"),n("span",{class:"token punctuation"},","),a(" ref "),n("span",{class:"token punctuation"},"}"),a(),n("span",{class:"token keyword"},"from"),a(),n("span",{class:"token string"},"'vue'"),n("span",{class:"token punctuation"},";"),a(`
`),n("span",{class:"token keyword"},"export"),a(),n("span",{class:"token keyword"},"default"),a(),n("span",{class:"token function"},"defineComponent"),n("span",{class:"token punctuation"},"("),n("span",{class:"token punctuation"},"{"),a(`
  `),n("span",{class:"token function"},"setup"),n("span",{class:"token punctuation"},"("),n("span",{class:"token punctuation"},")"),a(),n("span",{class:"token punctuation"},"{"),a(`
    `),n("span",{class:"token keyword"},"return"),a(),n("span",{class:"token punctuation"},"{"),a(`
      `),n("span",{class:"token literal-property property"},"activeKey"),n("span",{class:"token operator"},":"),a(),n("span",{class:"token function"},"ref"),n("span",{class:"token punctuation"},"("),n("span",{class:"token string"},"'1'"),n("span",{class:"token punctuation"},")"),n("span",{class:"token punctuation"},","),a(`
    `),n("span",{class:"token punctuation"},"}"),n("span",{class:"token punctuation"},";"),a(`
  `),n("span",{class:"token punctuation"},"}"),n("span",{class:"token punctuation"},","),a(`
`),n("span",{class:"token punctuation"},"}"),n("span",{class:"token punctuation"},")"),n("span",{class:"token punctuation"},";"),a(`
`)])]),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"</"),a("script")]),n("span",{class:"token punctuation"},">")]),a(`
`)])],-1)])),_:1})}const J=y(L,[["render",D]]),x=A({setup(){return{activeKey:b("2")}}});const U={class:"card-container"};function j(o,t,d,r,I,m){const c=p("a-tab-pane"),u=p("a-tabs"),l=p("demo-box");return i(),h(l,{jsfiddle:{us:"Should be used at the top of container, needs to override styles.",cn:"\u7528\u4E8E\u5BB9\u5668\u9876\u90E8\uFF0C\u9700\u8981\u4E00\u70B9\u989D\u5916\u7684\u6837\u5F0F\u8986\u76D6\u3002",docHtml:`<h2 id="zh-CN">zh-CN <a class="header-anchor" href="#zh-CN">
          <span aria-hidden="true" class="anchor">#</span>
        </a></h2>
<p>\u7528\u4E8E\u5BB9\u5668\u9876\u90E8\uFF0C\u9700\u8981\u4E00\u70B9\u989D\u5916\u7684\u6837\u5F0F\u8986\u76D6\u3002</p>
<h2 id="en-US">en-US <a class="header-anchor" href="#en-US">
          <span aria-hidden="true" class="anchor">#</span>
        </a></h2>
<p>Should be used at the top of container, needs to override styles.</p>
`,order:9,title:{"zh-CN":"\u5361\u7247\u5F0F\u9875\u7B7E\u5BB9\u5668","en-US":"Container of card type Tab"},relativePath:"components/tabs/demo/card-top.vue",sourceCode:"PHRlbXBsYXRlPgogIDxkaXYgY2xhc3M9ImNhcmQtY29udGFpbmVyIj4KICAgIDxhLXRhYnMgdi1tb2RlbDphY3RpdmVLZXk9ImFjdGl2ZUtleSIgdHlwZT0iY2FyZCI+CiAgICAgIDxhLXRhYi1wYW5lIGtleT0iMSIgdGFiPSJUYWIgVGl0bGUgMSI+CiAgICAgICAgPHA+Q29udGVudCBvZiBUYWIgUGFuZSAxPC9wPgogICAgICAgIDxwPkNvbnRlbnQgb2YgVGFiIFBhbmUgMTwvcD4KICAgICAgICA8cD5Db250ZW50IG9mIFRhYiBQYW5lIDE8L3A+CiAgICAgIDwvYS10YWItcGFuZT4KICAgICAgPGEtdGFiLXBhbmUga2V5PSIyIiB0YWI9IlRhYiBUaXRsZSAyIj4KICAgICAgICA8cD5Db250ZW50IG9mIFRhYiBQYW5lIDI8L3A+CiAgICAgICAgPHA+Q29udGVudCBvZiBUYWIgUGFuZSAyPC9wPgogICAgICAgIDxwPkNvbnRlbnQgb2YgVGFiIFBhbmUgMjwvcD4KICAgICAgPC9hLXRhYi1wYW5lPgogICAgICA8YS10YWItcGFuZSBrZXk9IjMiIHRhYj0iVGFiIFRpdGxlIDMiPgogICAgICAgIDxwPkNvbnRlbnQgb2YgVGFiIFBhbmUgMzwvcD4KICAgICAgICA8cD5Db250ZW50IG9mIFRhYiBQYW5lIDM8L3A+CiAgICAgICAgPHA+Q29udGVudCBvZiBUYWIgUGFuZSAzPC9wPgogICAgICA8L2EtdGFiLXBhbmU+CiAgICA8L2EtdGFicz4KICA8L2Rpdj4KPC90ZW1wbGF0ZT4KPHNjcmlwdCBsYW5nPSJ0cyI+CmltcG9ydCB7IGRlZmluZUNvbXBvbmVudCwgcmVmIH0gZnJvbSAndnVlJzsKCmV4cG9ydCBkZWZhdWx0IGRlZmluZUNvbXBvbmVudCh7CiAgc2V0dXAoKSB7CiAgICByZXR1cm4gewogICAgICBhY3RpdmVLZXk6IHJlZignMicpLAogICAgfTsKICB9LAp9KTsKPC9zY3JpcHQ+CjxzdHlsZT4KLmNhcmQtY29udGFpbmVyIHAgewogIG1hcmdpbjogMDsKfQouY2FyZC1jb250YWluZXIgPiAuYW50LXRhYnMtY2FyZCAuYW50LXRhYnMtY29udGVudCB7CiAgaGVpZ2h0OiAxMjBweDsKICBtYXJnaW4tdG9wOiAtMTZweDsKfQouY2FyZC1jb250YWluZXIgPiAuYW50LXRhYnMtY2FyZCAuYW50LXRhYnMtY29udGVudCA+IC5hbnQtdGFicy10YWJwYW5lIHsKICBwYWRkaW5nOiAxNnB4OwogIGJhY2tncm91bmQ6ICNmZmY7Cn0KLmNhcmQtY29udGFpbmVyID4gLmFudC10YWJzLWNhcmQgPiAuYW50LXRhYnMtbmF2OjpiZWZvcmUgewogIGRpc3BsYXk6IG5vbmU7Cn0KLmNhcmQtY29udGFpbmVyID4gLmFudC10YWJzLWNhcmQgLmFudC10YWJzLXRhYiwKW2RhdGEtdGhlbWU9J2NvbXBhY3QnXSAuY2FyZC1jb250YWluZXIgPiAuYW50LXRhYnMtY2FyZCAuYW50LXRhYnMtdGFiIHsKICBiYWNrZ3JvdW5kOiB0cmFuc3BhcmVudDsKICBib3JkZXItY29sb3I6IHRyYW5zcGFyZW50Owp9Ci5jYXJkLWNvbnRhaW5lciA+IC5hbnQtdGFicy1jYXJkIC5hbnQtdGFicy10YWItYWN0aXZlLApbZGF0YS10aGVtZT0nY29tcGFjdCddIC5jYXJkLWNvbnRhaW5lciA+IC5hbnQtdGFicy1jYXJkIC5hbnQtdGFicy10YWItYWN0aXZlIHsKICBiYWNrZ3JvdW5kOiAjZmZmOwogIGJvcmRlci1jb2xvcjogI2ZmZjsKfQojY29tcG9uZW50cy10YWJzLWRlbW8tY2FyZC10b3AgLmNvZGUtYm94LWRlbW8gewogIHBhZGRpbmc6IDI0cHg7CiAgb3ZlcmZsb3c6IGhpZGRlbjsKICBiYWNrZ3JvdW5kOiAjZjVmNWY1Owp9CltkYXRhLXRoZW1lPSdjb21wYWN0J10gLmNhcmQtY29udGFpbmVyID4gLmFudC10YWJzLWNhcmQgLmFudC10YWJzLWNvbnRlbnQgewogIGhlaWdodDogMTIwcHg7CiAgbWFyZ2luLXRvcDogLThweDsKfQpbZGF0YS10aGVtZT0nZGFyayddIC5jYXJkLWNvbnRhaW5lciA+IC5hbnQtdGFicy1jYXJkIC5hbnQtdGFicy10YWIgewogIGJhY2tncm91bmQ6IHRyYW5zcGFyZW50OwogIGJvcmRlci1jb2xvcjogdHJhbnNwYXJlbnQ7Cn0KW2RhdGEtdGhlbWU9J2RhcmsnXSAjY29tcG9uZW50cy10YWJzLWRlbW8tY2FyZC10b3AgLmNvZGUtYm94LWRlbW8gewogIGJhY2tncm91bmQ6ICMwMDA7Cn0KW2RhdGEtdGhlbWU9J2RhcmsnXSAuY2FyZC1jb250YWluZXIgPiAuYW50LXRhYnMtY2FyZCAuYW50LXRhYnMtY29udGVudCA+IC5hbnQtdGFicy10YWJwYW5lIHsKICBiYWNrZ3JvdW5kOiAjMTQxNDE0Owp9CltkYXRhLXRoZW1lPSdkYXJrJ10gLmNhcmQtY29udGFpbmVyID4gLmFudC10YWJzLWNhcmQgLmFudC10YWJzLXRhYi1hY3RpdmUgewogIGJhY2tncm91bmQ6ICMxNDE0MTQ7CiAgYm9yZGVyLWNvbG9yOiAjMTQxNDE0Owp9Cjwvc3R5bGU+Cg==",jsSourceCode:"PHRlbXBsYXRlPgogIDxkaXYgY2xhc3M9ImNhcmQtY29udGFpbmVyIj4KICAgIDxhLXRhYnMgdi1tb2RlbDphY3RpdmVLZXk9ImFjdGl2ZUtleSIgdHlwZT0iY2FyZCI+CiAgICAgIDxhLXRhYi1wYW5lIGtleT0iMSIgdGFiPSJUYWIgVGl0bGUgMSI+CiAgICAgICAgPHA+Q29udGVudCBvZiBUYWIgUGFuZSAxPC9wPgogICAgICAgIDxwPkNvbnRlbnQgb2YgVGFiIFBhbmUgMTwvcD4KICAgICAgICA8cD5Db250ZW50IG9mIFRhYiBQYW5lIDE8L3A+CiAgICAgIDwvYS10YWItcGFuZT4KICAgICAgPGEtdGFiLXBhbmUga2V5PSIyIiB0YWI9IlRhYiBUaXRsZSAyIj4KICAgICAgICA8cD5Db250ZW50IG9mIFRhYiBQYW5lIDI8L3A+CiAgICAgICAgPHA+Q29udGVudCBvZiBUYWIgUGFuZSAyPC9wPgogICAgICAgIDxwPkNvbnRlbnQgb2YgVGFiIFBhbmUgMjwvcD4KICAgICAgPC9hLXRhYi1wYW5lPgogICAgICA8YS10YWItcGFuZSBrZXk9IjMiIHRhYj0iVGFiIFRpdGxlIDMiPgogICAgICAgIDxwPkNvbnRlbnQgb2YgVGFiIFBhbmUgMzwvcD4KICAgICAgICA8cD5Db250ZW50IG9mIFRhYiBQYW5lIDM8L3A+CiAgICAgICAgPHA+Q29udGVudCBvZiBUYWIgUGFuZSAzPC9wPgogICAgICA8L2EtdGFiLXBhbmU+CiAgICA8L2EtdGFicz4KICA8L2Rpdj4KPC90ZW1wbGF0ZT4KPHNjcmlwdD4KaW1wb3J0IHsgZGVmaW5lQ29tcG9uZW50LCByZWYgfSBmcm9tICd2dWUnOwpleHBvcnQgZGVmYXVsdCBkZWZpbmVDb21wb25lbnQoewogIHNldHVwKCkgewogICAgcmV0dXJuIHsKICAgICAgYWN0aXZlS2V5OiByZWYoJzInKSwKICAgIH07CiAgfSwKfSk7Cjwvc2NyaXB0Pgo8c3R5bGU+Ci5jYXJkLWNvbnRhaW5lciBwIHsKICBtYXJnaW46IDA7Cn0KLmNhcmQtY29udGFpbmVyID4gLmFudC10YWJzLWNhcmQgLmFudC10YWJzLWNvbnRlbnQgewogIGhlaWdodDogMTIwcHg7CiAgbWFyZ2luLXRvcDogLTE2cHg7Cn0KLmNhcmQtY29udGFpbmVyID4gLmFudC10YWJzLWNhcmQgLmFudC10YWJzLWNvbnRlbnQgPiAuYW50LXRhYnMtdGFicGFuZSB7CiAgcGFkZGluZzogMTZweDsKICBiYWNrZ3JvdW5kOiAjZmZmOwp9Ci5jYXJkLWNvbnRhaW5lciA+IC5hbnQtdGFicy1jYXJkID4gLmFudC10YWJzLW5hdjo6YmVmb3JlIHsKICBkaXNwbGF5OiBub25lOwp9Ci5jYXJkLWNvbnRhaW5lciA+IC5hbnQtdGFicy1jYXJkIC5hbnQtdGFicy10YWIsCltkYXRhLXRoZW1lPSdjb21wYWN0J10gLmNhcmQtY29udGFpbmVyID4gLmFudC10YWJzLWNhcmQgLmFudC10YWJzLXRhYiB7CiAgYmFja2dyb3VuZDogdHJhbnNwYXJlbnQ7CiAgYm9yZGVyLWNvbG9yOiB0cmFuc3BhcmVudDsKfQouY2FyZC1jb250YWluZXIgPiAuYW50LXRhYnMtY2FyZCAuYW50LXRhYnMtdGFiLWFjdGl2ZSwKW2RhdGEtdGhlbWU9J2NvbXBhY3QnXSAuY2FyZC1jb250YWluZXIgPiAuYW50LXRhYnMtY2FyZCAuYW50LXRhYnMtdGFiLWFjdGl2ZSB7CiAgYmFja2dyb3VuZDogI2ZmZjsKICBib3JkZXItY29sb3I6ICNmZmY7Cn0KI2NvbXBvbmVudHMtdGFicy1kZW1vLWNhcmQtdG9wIC5jb2RlLWJveC1kZW1vIHsKICBwYWRkaW5nOiAyNHB4OwogIG92ZXJmbG93OiBoaWRkZW47CiAgYmFja2dyb3VuZDogI2Y1ZjVmNTsKfQpbZGF0YS10aGVtZT0nY29tcGFjdCddIC5jYXJkLWNvbnRhaW5lciA+IC5hbnQtdGFicy1jYXJkIC5hbnQtdGFicy1jb250ZW50IHsKICBoZWlnaHQ6IDEyMHB4OwogIG1hcmdpbi10b3A6IC04cHg7Cn0KW2RhdGEtdGhlbWU9J2RhcmsnXSAuY2FyZC1jb250YWluZXIgPiAuYW50LXRhYnMtY2FyZCAuYW50LXRhYnMtdGFiIHsKICBiYWNrZ3JvdW5kOiB0cmFuc3BhcmVudDsKICBib3JkZXItY29sb3I6IHRyYW5zcGFyZW50Owp9CltkYXRhLXRoZW1lPSdkYXJrJ10gI2NvbXBvbmVudHMtdGFicy1kZW1vLWNhcmQtdG9wIC5jb2RlLWJveC1kZW1vIHsKICBiYWNrZ3JvdW5kOiAjMDAwOwp9CltkYXRhLXRoZW1lPSdkYXJrJ10gLmNhcmQtY29udGFpbmVyID4gLmFudC10YWJzLWNhcmQgLmFudC10YWJzLWNvbnRlbnQgPiAuYW50LXRhYnMtdGFicGFuZSB7CiAgYmFja2dyb3VuZDogIzE0MTQxNDsKfQpbZGF0YS10aGVtZT0nZGFyayddIC5jYXJkLWNvbnRhaW5lciA+IC5hbnQtdGFicy1jYXJkIC5hbnQtdGFicy10YWItYWN0aXZlIHsKICBiYWNrZ3JvdW5kOiAjMTQxNDE0OwogIGJvcmRlci1jb2xvcjogIzE0MTQxNDsKfQo8L3N0eWxlPg=="}},{default:s(()=>[n("div",U,[e(u,{activeKey:o.activeKey,"onUpdate:activeKey":t[0]||(t[0]=k=>o.activeKey=k),type:"card"},{default:s(()=>[e(c,{key:"1",tab:"Tab Title 1"},{default:s(()=>t[1]||(t[1]=[n("p",null,"Content of Tab Pane 1",-1),n("p",null,"Content of Tab Pane 1",-1),n("p",null,"Content of Tab Pane 1",-1)])),_:1,__:[1]}),e(c,{key:"2",tab:"Tab Title 2"},{default:s(()=>t[2]||(t[2]=[n("p",null,"Content of Tab Pane 2",-1),n("p",null,"Content of Tab Pane 2",-1),n("p",null,"Content of Tab Pane 2",-1)])),_:1,__:[2]}),e(c,{key:"3",tab:"Tab Title 3"},{default:s(()=>t[3]||(t[3]=[n("p",null,"Content of Tab Pane 3",-1),n("p",null,"Content of Tab Pane 3",-1),n("p",null,"Content of Tab Pane 3",-1)])),_:1,__:[3]})]),_:1},8,["activeKey"])])]),htmlCode:s(()=>t[4]||(t[4]=[n("pre",{class:"language-vue"},[n("code",null,[n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),a("template")]),n("span",{class:"token punctuation"},">")]),a(`
  `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),a("div")]),a(),n("span",{class:"token attr-name"},"class"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),a("card-container"),n("span",{class:"token punctuation"},'"')]),n("span",{class:"token punctuation"},">")]),a(`
    `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),a("a-tabs")]),a(),n("span",{class:"token attr-name"},[n("span",{class:"token namespace"},"v-model:"),a("activeKey")]),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),a("activeKey"),n("span",{class:"token punctuation"},'"')]),a(),n("span",{class:"token attr-name"},"type"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),a("card"),n("span",{class:"token punctuation"},'"')]),n("span",{class:"token punctuation"},">")]),a(`
      `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),a("a-tab-pane")]),a(),n("span",{class:"token attr-name"},"key"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),a("1"),n("span",{class:"token punctuation"},'"')]),a(),n("span",{class:"token attr-name"},"tab"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),a("Tab Title 1"),n("span",{class:"token punctuation"},'"')]),n("span",{class:"token punctuation"},">")]),a(`
        `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),a("p")]),n("span",{class:"token punctuation"},">")]),a("Content of Tab Pane 1"),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"</"),a("p")]),n("span",{class:"token punctuation"},">")]),a(`
        `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),a("p")]),n("span",{class:"token punctuation"},">")]),a("Content of Tab Pane 1"),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"</"),a("p")]),n("span",{class:"token punctuation"},">")]),a(`
        `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),a("p")]),n("span",{class:"token punctuation"},">")]),a("Content of Tab Pane 1"),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"</"),a("p")]),n("span",{class:"token punctuation"},">")]),a(`
      `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"</"),a("a-tab-pane")]),n("span",{class:"token punctuation"},">")]),a(`
      `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),a("a-tab-pane")]),a(),n("span",{class:"token attr-name"},"key"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),a("2"),n("span",{class:"token punctuation"},'"')]),a(),n("span",{class:"token attr-name"},"tab"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),a("Tab Title 2"),n("span",{class:"token punctuation"},'"')]),n("span",{class:"token punctuation"},">")]),a(`
        `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),a("p")]),n("span",{class:"token punctuation"},">")]),a("Content of Tab Pane 2"),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"</"),a("p")]),n("span",{class:"token punctuation"},">")]),a(`
        `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),a("p")]),n("span",{class:"token punctuation"},">")]),a("Content of Tab Pane 2"),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"</"),a("p")]),n("span",{class:"token punctuation"},">")]),a(`
        `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),a("p")]),n("span",{class:"token punctuation"},">")]),a("Content of Tab Pane 2"),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"</"),a("p")]),n("span",{class:"token punctuation"},">")]),a(`
      `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"</"),a("a-tab-pane")]),n("span",{class:"token punctuation"},">")]),a(`
      `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),a("a-tab-pane")]),a(),n("span",{class:"token attr-name"},"key"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),a("3"),n("span",{class:"token punctuation"},'"')]),a(),n("span",{class:"token attr-name"},"tab"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),a("Tab Title 3"),n("span",{class:"token punctuation"},'"')]),n("span",{class:"token punctuation"},">")]),a(`
        `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),a("p")]),n("span",{class:"token punctuation"},">")]),a("Content of Tab Pane 3"),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"</"),a("p")]),n("span",{class:"token punctuation"},">")]),a(`
        `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),a("p")]),n("span",{class:"token punctuation"},">")]),a("Content of Tab Pane 3"),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"</"),a("p")]),n("span",{class:"token punctuation"},">")]),a(`
        `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),a("p")]),n("span",{class:"token punctuation"},">")]),a("Content of Tab Pane 3"),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"</"),a("p")]),n("span",{class:"token punctuation"},">")]),a(`
      `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"</"),a("a-tab-pane")]),n("span",{class:"token punctuation"},">")]),a(`
    `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"</"),a("a-tabs")]),n("span",{class:"token punctuation"},">")]),a(`
  `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"</"),a("div")]),n("span",{class:"token punctuation"},">")]),a(`
`),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"</"),a("template")]),n("span",{class:"token punctuation"},">")]),a(`
`),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),a("script")]),a(),n("span",{class:"token attr-name"},"lang"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),a("ts"),n("span",{class:"token punctuation"},'"')]),n("span",{class:"token punctuation"},">")]),n("span",{class:"token script"},[n("span",{class:"token language-javascript"},[a(`
`),n("span",{class:"token keyword"},"import"),a(),n("span",{class:"token punctuation"},"{"),a(" defineComponent"),n("span",{class:"token punctuation"},","),a(" ref "),n("span",{class:"token punctuation"},"}"),a(),n("span",{class:"token keyword"},"from"),a(),n("span",{class:"token string"},"'vue'"),n("span",{class:"token punctuation"},";"),a(`

`),n("span",{class:"token keyword"},"export"),a(),n("span",{class:"token keyword"},"default"),a(),n("span",{class:"token function"},"defineComponent"),n("span",{class:"token punctuation"},"("),n("span",{class:"token punctuation"},"{"),a(`
  `),n("span",{class:"token function"},"setup"),n("span",{class:"token punctuation"},"("),n("span",{class:"token punctuation"},")"),a(),n("span",{class:"token punctuation"},"{"),a(`
    `),n("span",{class:"token keyword"},"return"),a(),n("span",{class:"token punctuation"},"{"),a(`
      `),n("span",{class:"token literal-property property"},"activeKey"),n("span",{class:"token operator"},":"),a(),n("span",{class:"token function"},"ref"),n("span",{class:"token punctuation"},"("),n("span",{class:"token string"},"'2'"),n("span",{class:"token punctuation"},")"),n("span",{class:"token punctuation"},","),a(`
    `),n("span",{class:"token punctuation"},"}"),n("span",{class:"token punctuation"},";"),a(`
  `),n("span",{class:"token punctuation"},"}"),n("span",{class:"token punctuation"},","),a(`
`),n("span",{class:"token punctuation"},"}"),n("span",{class:"token punctuation"},")"),n("span",{class:"token punctuation"},";"),a(`
`)])]),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"</"),a("script")]),n("span",{class:"token punctuation"},">")]),a(`
`),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),a("style")]),n("span",{class:"token punctuation"},">")]),n("span",{class:"token style"},[n("span",{class:"token language-css"},[a(`
`),n("span",{class:"token selector"},".card-container p"),a(),n("span",{class:"token punctuation"},"{"),a(`
  `),n("span",{class:"token property"},"margin"),n("span",{class:"token punctuation"},":"),a(" 0"),n("span",{class:"token punctuation"},";"),a(`
`),n("span",{class:"token punctuation"},"}"),a(`
`),n("span",{class:"token selector"},".card-container > .ant-tabs-card .ant-tabs-content"),a(),n("span",{class:"token punctuation"},"{"),a(`
  `),n("span",{class:"token property"},"height"),n("span",{class:"token punctuation"},":"),a(" 120px"),n("span",{class:"token punctuation"},";"),a(`
  `),n("span",{class:"token property"},"margin-top"),n("span",{class:"token punctuation"},":"),a(" -16px"),n("span",{class:"token punctuation"},";"),a(`
`),n("span",{class:"token punctuation"},"}"),a(`
`),n("span",{class:"token selector"},".card-container > .ant-tabs-card .ant-tabs-content > .ant-tabs-tabpane"),a(),n("span",{class:"token punctuation"},"{"),a(`
  `),n("span",{class:"token property"},"padding"),n("span",{class:"token punctuation"},":"),a(" 16px"),n("span",{class:"token punctuation"},";"),a(`
  `),n("span",{class:"token property"},"background"),n("span",{class:"token punctuation"},":"),a(" #fff"),n("span",{class:"token punctuation"},";"),a(`
`),n("span",{class:"token punctuation"},"}"),a(`
`),n("span",{class:"token selector"},".card-container > .ant-tabs-card > .ant-tabs-nav::before"),a(),n("span",{class:"token punctuation"},"{"),a(`
  `),n("span",{class:"token property"},"display"),n("span",{class:"token punctuation"},":"),a(" none"),n("span",{class:"token punctuation"},";"),a(`
`),n("span",{class:"token punctuation"},"}"),a(`
`),n("span",{class:"token selector"},`.card-container > .ant-tabs-card .ant-tabs-tab,
[data-theme='compact'] .card-container > .ant-tabs-card .ant-tabs-tab`),a(),n("span",{class:"token punctuation"},"{"),a(`
  `),n("span",{class:"token property"},"background"),n("span",{class:"token punctuation"},":"),a(" transparent"),n("span",{class:"token punctuation"},";"),a(`
  `),n("span",{class:"token property"},"border-color"),n("span",{class:"token punctuation"},":"),a(" transparent"),n("span",{class:"token punctuation"},";"),a(`
`),n("span",{class:"token punctuation"},"}"),a(`
`),n("span",{class:"token selector"},`.card-container > .ant-tabs-card .ant-tabs-tab-active,
[data-theme='compact'] .card-container > .ant-tabs-card .ant-tabs-tab-active`),a(),n("span",{class:"token punctuation"},"{"),a(`
  `),n("span",{class:"token property"},"background"),n("span",{class:"token punctuation"},":"),a(" #fff"),n("span",{class:"token punctuation"},";"),a(`
  `),n("span",{class:"token property"},"border-color"),n("span",{class:"token punctuation"},":"),a(" #fff"),n("span",{class:"token punctuation"},";"),a(`
`),n("span",{class:"token punctuation"},"}"),a(`
`),n("span",{class:"token selector"},"#components-tabs-demo-card-top .code-box-demo"),a(),n("span",{class:"token punctuation"},"{"),a(`
  `),n("span",{class:"token property"},"padding"),n("span",{class:"token punctuation"},":"),a(" 24px"),n("span",{class:"token punctuation"},";"),a(`
  `),n("span",{class:"token property"},"overflow"),n("span",{class:"token punctuation"},":"),a(" hidden"),n("span",{class:"token punctuation"},";"),a(`
  `),n("span",{class:"token property"},"background"),n("span",{class:"token punctuation"},":"),a(" #f5f5f5"),n("span",{class:"token punctuation"},";"),a(`
`),n("span",{class:"token punctuation"},"}"),a(`
`),n("span",{class:"token selector"},"[data-theme='compact'] .card-container > .ant-tabs-card .ant-tabs-content"),a(),n("span",{class:"token punctuation"},"{"),a(`
  `),n("span",{class:"token property"},"height"),n("span",{class:"token punctuation"},":"),a(" 120px"),n("span",{class:"token punctuation"},";"),a(`
  `),n("span",{class:"token property"},"margin-top"),n("span",{class:"token punctuation"},":"),a(" -8px"),n("span",{class:"token punctuation"},";"),a(`
`),n("span",{class:"token punctuation"},"}"),a(`
`),n("span",{class:"token selector"},"[data-theme='dark'] .card-container > .ant-tabs-card .ant-tabs-tab"),a(),n("span",{class:"token punctuation"},"{"),a(`
  `),n("span",{class:"token property"},"background"),n("span",{class:"token punctuation"},":"),a(" transparent"),n("span",{class:"token punctuation"},";"),a(`
  `),n("span",{class:"token property"},"border-color"),n("span",{class:"token punctuation"},":"),a(" transparent"),n("span",{class:"token punctuation"},";"),a(`
`),n("span",{class:"token punctuation"},"}"),a(`
`),n("span",{class:"token selector"},"[data-theme='dark'] #components-tabs-demo-card-top .code-box-demo"),a(),n("span",{class:"token punctuation"},"{"),a(`
  `),n("span",{class:"token property"},"background"),n("span",{class:"token punctuation"},":"),a(" #000"),n("span",{class:"token punctuation"},";"),a(`
`),n("span",{class:"token punctuation"},"}"),a(`
`),n("span",{class:"token selector"},"[data-theme='dark'] .card-container > .ant-tabs-card .ant-tabs-content > .ant-tabs-tabpane"),a(),n("span",{class:"token punctuation"},"{"),a(`
  `),n("span",{class:"token property"},"background"),n("span",{class:"token punctuation"},":"),a(" #141414"),n("span",{class:"token punctuation"},";"),a(`
`),n("span",{class:"token punctuation"},"}"),a(`
`),n("span",{class:"token selector"},"[data-theme='dark'] .card-container > .ant-tabs-card .ant-tabs-tab-active"),a(),n("span",{class:"token punctuation"},"{"),a(`
  `),n("span",{class:"token property"},"background"),n("span",{class:"token punctuation"},":"),a(" #141414"),n("span",{class:"token punctuation"},";"),a(`
  `),n("span",{class:"token property"},"border-color"),n("span",{class:"token punctuation"},":"),a(" #141414"),n("span",{class:"token punctuation"},";"),a(`
`),n("span",{class:"token punctuation"},"}"),a(`
`)])]),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"</"),a("style")]),n("span",{class:"token punctuation"},">")]),a(`
`)])],-1)])),jsVersionHtml:s(()=>t[5]||(t[5]=[n("pre",{class:"language-vue"},[n("code",null,[n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),a("template")]),n("span",{class:"token punctuation"},">")]),a(`
  `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),a("div")]),a(),n("span",{class:"token attr-name"},"class"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),a("card-container"),n("span",{class:"token punctuation"},'"')]),n("span",{class:"token punctuation"},">")]),a(`
    `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),a("a-tabs")]),a(),n("span",{class:"token attr-name"},[n("span",{class:"token namespace"},"v-model:"),a("activeKey")]),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),a("activeKey"),n("span",{class:"token punctuation"},'"')]),a(),n("span",{class:"token attr-name"},"type"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),a("card"),n("span",{class:"token punctuation"},'"')]),n("span",{class:"token punctuation"},">")]),a(`
      `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),a("a-tab-pane")]),a(),n("span",{class:"token attr-name"},"key"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),a("1"),n("span",{class:"token punctuation"},'"')]),a(),n("span",{class:"token attr-name"},"tab"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),a("Tab Title 1"),n("span",{class:"token punctuation"},'"')]),n("span",{class:"token punctuation"},">")]),a(`
        `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),a("p")]),n("span",{class:"token punctuation"},">")]),a("Content of Tab Pane 1"),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"</"),a("p")]),n("span",{class:"token punctuation"},">")]),a(`
        `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),a("p")]),n("span",{class:"token punctuation"},">")]),a("Content of Tab Pane 1"),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"</"),a("p")]),n("span",{class:"token punctuation"},">")]),a(`
        `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),a("p")]),n("span",{class:"token punctuation"},">")]),a("Content of Tab Pane 1"),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"</"),a("p")]),n("span",{class:"token punctuation"},">")]),a(`
      `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"</"),a("a-tab-pane")]),n("span",{class:"token punctuation"},">")]),a(`
      `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),a("a-tab-pane")]),a(),n("span",{class:"token attr-name"},"key"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),a("2"),n("span",{class:"token punctuation"},'"')]),a(),n("span",{class:"token attr-name"},"tab"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),a("Tab Title 2"),n("span",{class:"token punctuation"},'"')]),n("span",{class:"token punctuation"},">")]),a(`
        `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),a("p")]),n("span",{class:"token punctuation"},">")]),a("Content of Tab Pane 2"),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"</"),a("p")]),n("span",{class:"token punctuation"},">")]),a(`
        `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),a("p")]),n("span",{class:"token punctuation"},">")]),a("Content of Tab Pane 2"),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"</"),a("p")]),n("span",{class:"token punctuation"},">")]),a(`
        `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),a("p")]),n("span",{class:"token punctuation"},">")]),a("Content of Tab Pane 2"),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"</"),a("p")]),n("span",{class:"token punctuation"},">")]),a(`
      `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"</"),a("a-tab-pane")]),n("span",{class:"token punctuation"},">")]),a(`
      `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),a("a-tab-pane")]),a(),n("span",{class:"token attr-name"},"key"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),a("3"),n("span",{class:"token punctuation"},'"')]),a(),n("span",{class:"token attr-name"},"tab"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),a("Tab Title 3"),n("span",{class:"token punctuation"},'"')]),n("span",{class:"token punctuation"},">")]),a(`
        `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),a("p")]),n("span",{class:"token punctuation"},">")]),a("Content of Tab Pane 3"),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"</"),a("p")]),n("span",{class:"token punctuation"},">")]),a(`
        `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),a("p")]),n("span",{class:"token punctuation"},">")]),a("Content of Tab Pane 3"),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"</"),a("p")]),n("span",{class:"token punctuation"},">")]),a(`
        `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),a("p")]),n("span",{class:"token punctuation"},">")]),a("Content of Tab Pane 3"),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"</"),a("p")]),n("span",{class:"token punctuation"},">")]),a(`
      `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"</"),a("a-tab-pane")]),n("span",{class:"token punctuation"},">")]),a(`
    `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"</"),a("a-tabs")]),n("span",{class:"token punctuation"},">")]),a(`
  `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"</"),a("div")]),n("span",{class:"token punctuation"},">")]),a(`
`),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"</"),a("template")]),n("span",{class:"token punctuation"},">")]),a(`
`),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),a("script")]),n("span",{class:"token punctuation"},">")]),n("span",{class:"token script"},[n("span",{class:"token language-javascript"},[a(`
`),n("span",{class:"token keyword"},"import"),a(),n("span",{class:"token punctuation"},"{"),a(" defineComponent"),n("span",{class:"token punctuation"},","),a(" ref "),n("span",{class:"token punctuation"},"}"),a(),n("span",{class:"token keyword"},"from"),a(),n("span",{class:"token string"},"'vue'"),n("span",{class:"token punctuation"},";"),a(`
`),n("span",{class:"token keyword"},"export"),a(),n("span",{class:"token keyword"},"default"),a(),n("span",{class:"token function"},"defineComponent"),n("span",{class:"token punctuation"},"("),n("span",{class:"token punctuation"},"{"),a(`
  `),n("span",{class:"token function"},"setup"),n("span",{class:"token punctuation"},"("),n("span",{class:"token punctuation"},")"),a(),n("span",{class:"token punctuation"},"{"),a(`
    `),n("span",{class:"token keyword"},"return"),a(),n("span",{class:"token punctuation"},"{"),a(`
      `),n("span",{class:"token literal-property property"},"activeKey"),n("span",{class:"token operator"},":"),a(),n("span",{class:"token function"},"ref"),n("span",{class:"token punctuation"},"("),n("span",{class:"token string"},"'2'"),n("span",{class:"token punctuation"},")"),n("span",{class:"token punctuation"},","),a(`
    `),n("span",{class:"token punctuation"},"}"),n("span",{class:"token punctuation"},";"),a(`
  `),n("span",{class:"token punctuation"},"}"),n("span",{class:"token punctuation"},","),a(`
`),n("span",{class:"token punctuation"},"}"),n("span",{class:"token punctuation"},")"),n("span",{class:"token punctuation"},";"),a(`
`)])]),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"</"),a("script")]),n("span",{class:"token punctuation"},">")]),a(`
`),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),a("style")]),n("span",{class:"token punctuation"},">")]),n("span",{class:"token style"},[n("span",{class:"token language-css"},[a(`
`),n("span",{class:"token selector"},".card-container p"),a(),n("span",{class:"token punctuation"},"{"),a(`
  `),n("span",{class:"token property"},"margin"),n("span",{class:"token punctuation"},":"),a(" 0"),n("span",{class:"token punctuation"},";"),a(`
`),n("span",{class:"token punctuation"},"}"),a(`
`),n("span",{class:"token selector"},".card-container > .ant-tabs-card .ant-tabs-content"),a(),n("span",{class:"token punctuation"},"{"),a(`
  `),n("span",{class:"token property"},"height"),n("span",{class:"token punctuation"},":"),a(" 120px"),n("span",{class:"token punctuation"},";"),a(`
  `),n("span",{class:"token property"},"margin-top"),n("span",{class:"token punctuation"},":"),a(" -16px"),n("span",{class:"token punctuation"},";"),a(`
`),n("span",{class:"token punctuation"},"}"),a(`
`),n("span",{class:"token selector"},".card-container > .ant-tabs-card .ant-tabs-content > .ant-tabs-tabpane"),a(),n("span",{class:"token punctuation"},"{"),a(`
  `),n("span",{class:"token property"},"padding"),n("span",{class:"token punctuation"},":"),a(" 16px"),n("span",{class:"token punctuation"},";"),a(`
  `),n("span",{class:"token property"},"background"),n("span",{class:"token punctuation"},":"),a(" #fff"),n("span",{class:"token punctuation"},";"),a(`
`),n("span",{class:"token punctuation"},"}"),a(`
`),n("span",{class:"token selector"},".card-container > .ant-tabs-card > .ant-tabs-nav::before"),a(),n("span",{class:"token punctuation"},"{"),a(`
  `),n("span",{class:"token property"},"display"),n("span",{class:"token punctuation"},":"),a(" none"),n("span",{class:"token punctuation"},";"),a(`
`),n("span",{class:"token punctuation"},"}"),a(`
`),n("span",{class:"token selector"},`.card-container > .ant-tabs-card .ant-tabs-tab,
[data-theme='compact'] .card-container > .ant-tabs-card .ant-tabs-tab`),a(),n("span",{class:"token punctuation"},"{"),a(`
  `),n("span",{class:"token property"},"background"),n("span",{class:"token punctuation"},":"),a(" transparent"),n("span",{class:"token punctuation"},";"),a(`
  `),n("span",{class:"token property"},"border-color"),n("span",{class:"token punctuation"},":"),a(" transparent"),n("span",{class:"token punctuation"},";"),a(`
`),n("span",{class:"token punctuation"},"}"),a(`
`),n("span",{class:"token selector"},`.card-container > .ant-tabs-card .ant-tabs-tab-active,
[data-theme='compact'] .card-container > .ant-tabs-card .ant-tabs-tab-active`),a(),n("span",{class:"token punctuation"},"{"),a(`
  `),n("span",{class:"token property"},"background"),n("span",{class:"token punctuation"},":"),a(" #fff"),n("span",{class:"token punctuation"},";"),a(`
  `),n("span",{class:"token property"},"border-color"),n("span",{class:"token punctuation"},":"),a(" #fff"),n("span",{class:"token punctuation"},";"),a(`
`),n("span",{class:"token punctuation"},"}"),a(`
`),n("span",{class:"token selector"},"#components-tabs-demo-card-top .code-box-demo"),a(),n("span",{class:"token punctuation"},"{"),a(`
  `),n("span",{class:"token property"},"padding"),n("span",{class:"token punctuation"},":"),a(" 24px"),n("span",{class:"token punctuation"},";"),a(`
  `),n("span",{class:"token property"},"overflow"),n("span",{class:"token punctuation"},":"),a(" hidden"),n("span",{class:"token punctuation"},";"),a(`
  `),n("span",{class:"token property"},"background"),n("span",{class:"token punctuation"},":"),a(" #f5f5f5"),n("span",{class:"token punctuation"},";"),a(`
`),n("span",{class:"token punctuation"},"}"),a(`
`),n("span",{class:"token selector"},"[data-theme='compact'] .card-container > .ant-tabs-card .ant-tabs-content"),a(),n("span",{class:"token punctuation"},"{"),a(`
  `),n("span",{class:"token property"},"height"),n("span",{class:"token punctuation"},":"),a(" 120px"),n("span",{class:"token punctuation"},";"),a(`
  `),n("span",{class:"token property"},"margin-top"),n("span",{class:"token punctuation"},":"),a(" -8px"),n("span",{class:"token punctuation"},";"),a(`
`),n("span",{class:"token punctuation"},"}"),a(`
`),n("span",{class:"token selector"},"[data-theme='dark'] .card-container > .ant-tabs-card .ant-tabs-tab"),a(),n("span",{class:"token punctuation"},"{"),a(`
  `),n("span",{class:"token property"},"background"),n("span",{class:"token punctuation"},":"),a(" transparent"),n("span",{class:"token punctuation"},";"),a(`
  `),n("span",{class:"token property"},"border-color"),n("span",{class:"token punctuation"},":"),a(" transparent"),n("span",{class:"token punctuation"},";"),a(`
`),n("span",{class:"token punctuation"},"}"),a(`
`),n("span",{class:"token selector"},"[data-theme='dark'] #components-tabs-demo-card-top .code-box-demo"),a(),n("span",{class:"token punctuation"},"{"),a(`
  `),n("span",{class:"token property"},"background"),n("span",{class:"token punctuation"},":"),a(" #000"),n("span",{class:"token punctuation"},";"),a(`
`),n("span",{class:"token punctuation"},"}"),a(`
`),n("span",{class:"token selector"},"[data-theme='dark'] .card-container > .ant-tabs-card .ant-tabs-content > .ant-tabs-tabpane"),a(),n("span",{class:"token punctuation"},"{"),a(`
  `),n("span",{class:"token property"},"background"),n("span",{class:"token punctuation"},":"),a(" #141414"),n("span",{class:"token punctuation"},";"),a(`
`),n("span",{class:"token punctuation"},"}"),a(`
`),n("span",{class:"token selector"},"[data-theme='dark'] .card-container > .ant-tabs-card .ant-tabs-tab-active"),a(),n("span",{class:"token punctuation"},"{"),a(`
  `),n("span",{class:"token property"},"background"),n("span",{class:"token punctuation"},":"),a(" #141414"),n("span",{class:"token punctuation"},";"),a(`
  `),n("span",{class:"token property"},"border-color"),n("span",{class:"token punctuation"},":"),a(" #141414"),n("span",{class:"token punctuation"},";"),a(`
`),n("span",{class:"token punctuation"},"}"),a(`
`)])]),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"</"),a("style")]),n("span",{class:"token punctuation"},">")]),a(`
`)])],-1)])),_:1})}const E=y(x,[["render",j]]),N=A({setup(){return{activeKey:b("1")}}});function z(o,t,d,r,I,m){const c=p("a-tab-pane"),u=p("a-tabs"),l=p("demo-box");return i(),h(l,{jsfiddle:{us:"Another type Tabs, which doesn't support vertical mode.",cn:"\u53E6\u4E00\u79CD\u6837\u5F0F\u7684\u9875\u7B7E\uFF0C\u4E0D\u63D0\u4F9B\u5BF9\u5E94\u7684\u5782\u76F4\u6837\u5F0F\u3002",docHtml:`<h2 id="zh-CN">zh-CN <a class="header-anchor" href="#zh-CN">
          <span aria-hidden="true" class="anchor">#</span>
        </a></h2>
<p>\u53E6\u4E00\u79CD\u6837\u5F0F\u7684\u9875\u7B7E\uFF0C\u4E0D\u63D0\u4F9B\u5BF9\u5E94\u7684\u5782\u76F4\u6837\u5F0F\u3002</p>
<h2 id="en-US">en-US <a class="header-anchor" href="#en-US">
          <span aria-hidden="true" class="anchor">#</span>
        </a></h2>
<p>Another type Tabs, which doesn't support vertical mode.</p>
`,order:7,title:{"zh-CN":"\u5361\u7247\u5F0F\u9875\u7B7E","en-US":"Card type tab"},relativePath:"components/tabs/demo/card.vue",sourceCode:"PHRlbXBsYXRlPgogIDxhLXRhYnMgdi1tb2RlbDphY3RpdmVLZXk9ImFjdGl2ZUtleSIgdHlwZT0iY2FyZCI+CiAgICA8YS10YWItcGFuZSBrZXk9IjEiIHRhYj0iVGFiIDEiPkNvbnRlbnQgb2YgVGFiIFBhbmUgMTwvYS10YWItcGFuZT4KICAgIDxhLXRhYi1wYW5lIGtleT0iMiIgdGFiPSJUYWIgMiI+Q29udGVudCBvZiBUYWIgUGFuZSAyPC9hLXRhYi1wYW5lPgogICAgPGEtdGFiLXBhbmUga2V5PSIzIiB0YWI9IlRhYiAzIj5Db250ZW50IG9mIFRhYiBQYW5lIDM8L2EtdGFiLXBhbmU+CiAgPC9hLXRhYnM+CjwvdGVtcGxhdGU+CjxzY3JpcHQgbGFuZz0idHMiPgppbXBvcnQgeyBkZWZpbmVDb21wb25lbnQsIHJlZiB9IGZyb20gJ3Z1ZSc7CgpleHBvcnQgZGVmYXVsdCBkZWZpbmVDb21wb25lbnQoewogIHNldHVwKCkgewogICAgcmV0dXJuIHsKICAgICAgYWN0aXZlS2V5OiByZWYoJzEnKSwKICAgIH07CiAgfSwKfSk7Cjwvc2NyaXB0PgoK",jsSourceCode:"PHRlbXBsYXRlPgogIDxhLXRhYnMgdi1tb2RlbDphY3RpdmVLZXk9ImFjdGl2ZUtleSIgdHlwZT0iY2FyZCI+CiAgICA8YS10YWItcGFuZSBrZXk9IjEiIHRhYj0iVGFiIDEiPkNvbnRlbnQgb2YgVGFiIFBhbmUgMTwvYS10YWItcGFuZT4KICAgIDxhLXRhYi1wYW5lIGtleT0iMiIgdGFiPSJUYWIgMiI+Q29udGVudCBvZiBUYWIgUGFuZSAyPC9hLXRhYi1wYW5lPgogICAgPGEtdGFiLXBhbmUga2V5PSIzIiB0YWI9IlRhYiAzIj5Db250ZW50IG9mIFRhYiBQYW5lIDM8L2EtdGFiLXBhbmU+CiAgPC9hLXRhYnM+CjwvdGVtcGxhdGU+CjxzY3JpcHQ+CmltcG9ydCB7IGRlZmluZUNvbXBvbmVudCwgcmVmIH0gZnJvbSAndnVlJzsKZXhwb3J0IGRlZmF1bHQgZGVmaW5lQ29tcG9uZW50KHsKICBzZXR1cCgpIHsKICAgIHJldHVybiB7CiAgICAgIGFjdGl2ZUtleTogcmVmKCcxJyksCiAgICB9OwogIH0sCn0pOwo8L3NjcmlwdD4="}},{default:s(()=>[e(u,{activeKey:o.activeKey,"onUpdate:activeKey":t[0]||(t[0]=k=>o.activeKey=k),type:"card"},{default:s(()=>[e(c,{key:"1",tab:"Tab 1"},{default:s(()=>t[1]||(t[1]=[a("Content of Tab Pane 1")])),_:1,__:[1]}),e(c,{key:"2",tab:"Tab 2"},{default:s(()=>t[2]||(t[2]=[a("Content of Tab Pane 2")])),_:1,__:[2]}),e(c,{key:"3",tab:"Tab 3"},{default:s(()=>t[3]||(t[3]=[a("Content of Tab Pane 3")])),_:1,__:[3]})]),_:1},8,["activeKey"])]),htmlCode:s(()=>t[4]||(t[4]=[n("pre",{class:"language-vue"},[n("code",null,[n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),a("template")]),n("span",{class:"token punctuation"},">")]),a(`
  `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),a("a-tabs")]),a(),n("span",{class:"token attr-name"},[n("span",{class:"token namespace"},"v-model:"),a("activeKey")]),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),a("activeKey"),n("span",{class:"token punctuation"},'"')]),a(),n("span",{class:"token attr-name"},"type"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),a("card"),n("span",{class:"token punctuation"},'"')]),n("span",{class:"token punctuation"},">")]),a(`
    `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),a("a-tab-pane")]),a(),n("span",{class:"token attr-name"},"key"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),a("1"),n("span",{class:"token punctuation"},'"')]),a(),n("span",{class:"token attr-name"},"tab"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),a("Tab 1"),n("span",{class:"token punctuation"},'"')]),n("span",{class:"token punctuation"},">")]),a("Content of Tab Pane 1"),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"</"),a("a-tab-pane")]),n("span",{class:"token punctuation"},">")]),a(`
    `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),a("a-tab-pane")]),a(),n("span",{class:"token attr-name"},"key"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),a("2"),n("span",{class:"token punctuation"},'"')]),a(),n("span",{class:"token attr-name"},"tab"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),a("Tab 2"),n("span",{class:"token punctuation"},'"')]),n("span",{class:"token punctuation"},">")]),a("Content of Tab Pane 2"),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"</"),a("a-tab-pane")]),n("span",{class:"token punctuation"},">")]),a(`
    `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),a("a-tab-pane")]),a(),n("span",{class:"token attr-name"},"key"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),a("3"),n("span",{class:"token punctuation"},'"')]),a(),n("span",{class:"token attr-name"},"tab"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),a("Tab 3"),n("span",{class:"token punctuation"},'"')]),n("span",{class:"token punctuation"},">")]),a("Content of Tab Pane 3"),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"</"),a("a-tab-pane")]),n("span",{class:"token punctuation"},">")]),a(`
  `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"</"),a("a-tabs")]),n("span",{class:"token punctuation"},">")]),a(`
`),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"</"),a("template")]),n("span",{class:"token punctuation"},">")]),a(`
`),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),a("script")]),a(),n("span",{class:"token attr-name"},"lang"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),a("ts"),n("span",{class:"token punctuation"},'"')]),n("span",{class:"token punctuation"},">")]),n("span",{class:"token script"},[n("span",{class:"token language-javascript"},[a(`
`),n("span",{class:"token keyword"},"import"),a(),n("span",{class:"token punctuation"},"{"),a(" defineComponent"),n("span",{class:"token punctuation"},","),a(" ref "),n("span",{class:"token punctuation"},"}"),a(),n("span",{class:"token keyword"},"from"),a(),n("span",{class:"token string"},"'vue'"),n("span",{class:"token punctuation"},";"),a(`

`),n("span",{class:"token keyword"},"export"),a(),n("span",{class:"token keyword"},"default"),a(),n("span",{class:"token function"},"defineComponent"),n("span",{class:"token punctuation"},"("),n("span",{class:"token punctuation"},"{"),a(`
  `),n("span",{class:"token function"},"setup"),n("span",{class:"token punctuation"},"("),n("span",{class:"token punctuation"},")"),a(),n("span",{class:"token punctuation"},"{"),a(`
    `),n("span",{class:"token keyword"},"return"),a(),n("span",{class:"token punctuation"},"{"),a(`
      `),n("span",{class:"token literal-property property"},"activeKey"),n("span",{class:"token operator"},":"),a(),n("span",{class:"token function"},"ref"),n("span",{class:"token punctuation"},"("),n("span",{class:"token string"},"'1'"),n("span",{class:"token punctuation"},")"),n("span",{class:"token punctuation"},","),a(`
    `),n("span",{class:"token punctuation"},"}"),n("span",{class:"token punctuation"},";"),a(`
  `),n("span",{class:"token punctuation"},"}"),n("span",{class:"token punctuation"},","),a(`
`),n("span",{class:"token punctuation"},"}"),n("span",{class:"token punctuation"},")"),n("span",{class:"token punctuation"},";"),a(`
`)])]),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"</"),a("script")]),n("span",{class:"token punctuation"},">")]),a(`
`)])],-1)])),jsVersionHtml:s(()=>t[5]||(t[5]=[n("pre",{class:"language-vue"},[n("code",null,[n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),a("template")]),n("span",{class:"token punctuation"},">")]),a(`
  `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),a("a-tabs")]),a(),n("span",{class:"token attr-name"},[n("span",{class:"token namespace"},"v-model:"),a("activeKey")]),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),a("activeKey"),n("span",{class:"token punctuation"},'"')]),a(),n("span",{class:"token attr-name"},"type"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),a("card"),n("span",{class:"token punctuation"},'"')]),n("span",{class:"token punctuation"},">")]),a(`
    `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),a("a-tab-pane")]),a(),n("span",{class:"token attr-name"},"key"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),a("1"),n("span",{class:"token punctuation"},'"')]),a(),n("span",{class:"token attr-name"},"tab"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),a("Tab 1"),n("span",{class:"token punctuation"},'"')]),n("span",{class:"token punctuation"},">")]),a("Content of Tab Pane 1"),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"</"),a("a-tab-pane")]),n("span",{class:"token punctuation"},">")]),a(`
    `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),a("a-tab-pane")]),a(),n("span",{class:"token attr-name"},"key"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),a("2"),n("span",{class:"token punctuation"},'"')]),a(),n("span",{class:"token attr-name"},"tab"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),a("Tab 2"),n("span",{class:"token punctuation"},'"')]),n("span",{class:"token punctuation"},">")]),a("Content of Tab Pane 2"),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"</"),a("a-tab-pane")]),n("span",{class:"token punctuation"},">")]),a(`
    `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),a("a-tab-pane")]),a(),n("span",{class:"token attr-name"},"key"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),a("3"),n("span",{class:"token punctuation"},'"')]),a(),n("span",{class:"token attr-name"},"tab"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),a("Tab 3"),n("span",{class:"token punctuation"},'"')]),n("span",{class:"token punctuation"},">")]),a("Content of Tab Pane 3"),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"</"),a("a-tab-pane")]),n("span",{class:"token punctuation"},">")]),a(`
  `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"</"),a("a-tabs")]),n("span",{class:"token punctuation"},">")]),a(`
`),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"</"),a("template")]),n("span",{class:"token punctuation"},">")]),a(`
`),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),a("script")]),n("span",{class:"token punctuation"},">")]),n("span",{class:"token script"},[n("span",{class:"token language-javascript"},[a(`
`),n("span",{class:"token keyword"},"import"),a(),n("span",{class:"token punctuation"},"{"),a(" defineComponent"),n("span",{class:"token punctuation"},","),a(" ref "),n("span",{class:"token punctuation"},"}"),a(),n("span",{class:"token keyword"},"from"),a(),n("span",{class:"token string"},"'vue'"),n("span",{class:"token punctuation"},";"),a(`
`),n("span",{class:"token keyword"},"export"),a(),n("span",{class:"token keyword"},"default"),a(),n("span",{class:"token function"},"defineComponent"),n("span",{class:"token punctuation"},"("),n("span",{class:"token punctuation"},"{"),a(`
  `),n("span",{class:"token function"},"setup"),n("span",{class:"token punctuation"},"("),n("span",{class:"token punctuation"},")"),a(),n("span",{class:"token punctuation"},"{"),a(`
    `),n("span",{class:"token keyword"},"return"),a(),n("span",{class:"token punctuation"},"{"),a(`
      `),n("span",{class:"token literal-property property"},"activeKey"),n("span",{class:"token operator"},":"),a(),n("span",{class:"token function"},"ref"),n("span",{class:"token punctuation"},"("),n("span",{class:"token string"},"'1'"),n("span",{class:"token punctuation"},")"),n("span",{class:"token punctuation"},","),a(`
    `),n("span",{class:"token punctuation"},"}"),n("span",{class:"token punctuation"},";"),a(`
  `),n("span",{class:"token punctuation"},"}"),n("span",{class:"token punctuation"},","),a(`
`),n("span",{class:"token punctuation"},"}"),n("span",{class:"token punctuation"},")"),n("span",{class:"token punctuation"},";"),a(`
`)])]),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"</"),a("script")]),n("span",{class:"token punctuation"},">")]),a(`
`)])],-1)])),_:1})}const q=y(N,[["render",z]]),Q=A({setup(){const o=b(new Array(2).fill(null).map((c,u)=>{const l=String(u+1);return{title:`Tab ${l}`,content:`Content of Tab Pane ${l}`,key:l}})),t=b(o.value[0].key),d=b(0),r=()=>{t.value=`newTab${d.value++}`,o.value.push({title:`New Tab ${t.value}`,content:`Content of new Tab ${t.value}`,key:t.value})},I=c=>{let u=0;o.value.forEach((l,k)=>{l.key===c&&(u=k-1)}),o.value=o.value.filter(l=>l.key!==c),o.value.length&&t.value===c&&(u>=0?t.value=o.value[u].key:t.value=o.value[0].key)};return{panes:o,activeKey:t,onEdit:c=>{I(c)},add:r}}}),_={style:{marginBottom:"16px"}};function M(o,t,d,r,I,m){const c=p("a-button"),u=p("a-tab-pane"),l=p("a-tabs"),k=p("demo-box");return i(),h(k,{jsfiddle:{us:"Hide default plus icon, and bind event for customized trigger.",cn:"\u9690\u85CF\u9ED8\u8BA4\u7684\u9875\u7B7E\u589E\u52A0\u56FE\u6807\uFF0C\u7ED9\u81EA\u5B9A\u4E49\u89E6\u53D1\u5668\u7ED1\u5B9A\u4E8B\u4EF6\u3002",docHtml:`<h2 id="zh-CN">zh-CN <a class="header-anchor" href="#zh-CN">
          <span aria-hidden="true" class="anchor">#</span>
        </a></h2>
<p>\u9690\u85CF\u9ED8\u8BA4\u7684\u9875\u7B7E\u589E\u52A0\u56FE\u6807\uFF0C\u7ED9\u81EA\u5B9A\u4E49\u89E6\u53D1\u5668\u7ED1\u5B9A\u4E8B\u4EF6\u3002</p>
<h2 id="en-US">en-US <a class="header-anchor" href="#en-US">
          <span aria-hidden="true" class="anchor">#</span>
        </a></h2>
<p>Hide default plus icon, and bind event for customized trigger.</p>
`,order:10,title:{"zh-CN":"\u81EA\u5B9A\u4E49\u65B0\u589E\u9875\u7B7E\u89E6\u53D1\u5668","en-US":"Customized trigger of new tab"},relativePath:"components/tabs/demo/custom-add-trigger.vue",sourceCode:"PHRlbXBsYXRlPgogIDxkaXY+CiAgICA8ZGl2IDpzdHlsZT0ieyBtYXJnaW5Cb3R0b206ICcxNnB4JyB9Ij4KICAgICAgPGEtYnV0dG9uIEBjbGljaz0iYWRkIj5BREQ8L2EtYnV0dG9uPgogICAgPC9kaXY+CiAgICA8YS10YWJzIHYtbW9kZWw6YWN0aXZlS2V5PSJhY3RpdmVLZXkiIGhpZGUtYWRkIHR5cGU9ImVkaXRhYmxlLWNhcmQiIEBlZGl0PSJvbkVkaXQiPgogICAgICA8YS10YWItcGFuZSB2LWZvcj0icGFuZSBpbiBwYW5lcyIgOmtleT0icGFuZS5rZXkiIDp0YWI9InBhbmUudGl0bGUiIDpjbG9zYWJsZT0icGFuZS5jbG9zYWJsZSI+CiAgICAgICAge3sgcGFuZS5jb250ZW50IH19CiAgICAgIDwvYS10YWItcGFuZT4KICAgIDwvYS10YWJzPgogIDwvZGl2Pgo8L3RlbXBsYXRlPgo8c2NyaXB0IGxhbmc9InRzIj4KaW1wb3J0IHsgZGVmaW5lQ29tcG9uZW50LCByZWYgfSBmcm9tICd2dWUnOwoKZXhwb3J0IGRlZmF1bHQgZGVmaW5lQ29tcG9uZW50KHsKICBzZXR1cCgpIHsKICAgIGNvbnN0IHBhbmVzID0gcmVmPHsgdGl0bGU6IHN0cmluZzsgY29udGVudDogc3RyaW5nOyBrZXk6IHN0cmluZzsgY2xvc2FibGU/OiBib29sZWFuIH1bXT4oCiAgICAgIG5ldyBBcnJheSgyKS5maWxsKG51bGwpLm1hcCgoXywgaW5kZXgpID0+IHsKICAgICAgICBjb25zdCBpZCA9IFN0cmluZyhpbmRleCArIDEpOwogICAgICAgIHJldHVybiB7IHRpdGxlOiBgVGFiICR7aWR9YCwgY29udGVudDogYENvbnRlbnQgb2YgVGFiIFBhbmUgJHtpZH1gLCBrZXk6IGlkIH07CiAgICAgIH0pLAogICAgKTsKICAgIGNvbnN0IGFjdGl2ZUtleSA9IHJlZihwYW5lcy52YWx1ZVswXS5rZXkpOwogICAgY29uc3QgbmV3VGFiSW5kZXggPSByZWYoMCk7CgogICAgY29uc3QgYWRkID0gKCkgPT4gewogICAgICBhY3RpdmVLZXkudmFsdWUgPSBgbmV3VGFiJHtuZXdUYWJJbmRleC52YWx1ZSsrfWA7CiAgICAgIHBhbmVzLnZhbHVlLnB1c2goewogICAgICAgIHRpdGxlOiBgTmV3IFRhYiAke2FjdGl2ZUtleS52YWx1ZX1gLAogICAgICAgIGNvbnRlbnQ6IGBDb250ZW50IG9mIG5ldyBUYWIgJHthY3RpdmVLZXkudmFsdWV9YCwKICAgICAgICBrZXk6IGFjdGl2ZUtleS52YWx1ZSwKICAgICAgfSk7CiAgICB9OwoKICAgIGNvbnN0IHJlbW92ZSA9ICh0YXJnZXRLZXk6IHN0cmluZykgPT4gewogICAgICBsZXQgbGFzdEluZGV4ID0gMDsKICAgICAgcGFuZXMudmFsdWUuZm9yRWFjaCgocGFuZSwgaSkgPT4gewogICAgICAgIGlmIChwYW5lLmtleSA9PT0gdGFyZ2V0S2V5KSB7CiAgICAgICAgICBsYXN0SW5kZXggPSBpIC0gMTsKICAgICAgICB9CiAgICAgIH0pOwogICAgICBwYW5lcy52YWx1ZSA9IHBhbmVzLnZhbHVlLmZpbHRlcihwYW5lID0+IHBhbmUua2V5ICE9PSB0YXJnZXRLZXkpOwogICAgICBpZiAocGFuZXMudmFsdWUubGVuZ3RoICYmIGFjdGl2ZUtleS52YWx1ZSA9PT0gdGFyZ2V0S2V5KSB7CiAgICAgICAgaWYgKGxhc3RJbmRleCA+PSAwKSB7CiAgICAgICAgICBhY3RpdmVLZXkudmFsdWUgPSBwYW5lcy52YWx1ZVtsYXN0SW5kZXhdLmtleTsKICAgICAgICB9IGVsc2UgewogICAgICAgICAgYWN0aXZlS2V5LnZhbHVlID0gcGFuZXMudmFsdWVbMF0ua2V5OwogICAgICAgIH0KICAgICAgfQogICAgfTsKCiAgICBjb25zdCBvbkVkaXQgPSAodGFyZ2V0S2V5OiBzdHJpbmcpID0+IHsKICAgICAgcmVtb3ZlKHRhcmdldEtleSk7CiAgICB9OwoKICAgIHJldHVybiB7CiAgICAgIHBhbmVzLAogICAgICBhY3RpdmVLZXksCiAgICAgIG9uRWRpdCwKICAgICAgYWRkLAogICAgfTsKICB9LAp9KTsKPC9zY3JpcHQ+Cgo=",jsSourceCode:"PHRlbXBsYXRlPgogIDxkaXY+CiAgICA8ZGl2IDpzdHlsZT0ieyBtYXJnaW5Cb3R0b206ICcxNnB4JyB9Ij4KICAgICAgPGEtYnV0dG9uIEBjbGljaz0iYWRkIj5BREQ8L2EtYnV0dG9uPgogICAgPC9kaXY+CiAgICA8YS10YWJzIHYtbW9kZWw6YWN0aXZlS2V5PSJhY3RpdmVLZXkiIGhpZGUtYWRkIHR5cGU9ImVkaXRhYmxlLWNhcmQiIEBlZGl0PSJvbkVkaXQiPgogICAgICA8YS10YWItcGFuZSB2LWZvcj0icGFuZSBpbiBwYW5lcyIgOmtleT0icGFuZS5rZXkiIDp0YWI9InBhbmUudGl0bGUiIDpjbG9zYWJsZT0icGFuZS5jbG9zYWJsZSI+CiAgICAgICAge3sgcGFuZS5jb250ZW50IH19CiAgICAgIDwvYS10YWItcGFuZT4KICAgIDwvYS10YWJzPgogIDwvZGl2Pgo8L3RlbXBsYXRlPgo8c2NyaXB0PgppbXBvcnQgeyBkZWZpbmVDb21wb25lbnQsIHJlZiB9IGZyb20gJ3Z1ZSc7CmV4cG9ydCBkZWZhdWx0IGRlZmluZUNvbXBvbmVudCh7CiAgc2V0dXAoKSB7CiAgICBjb25zdCBwYW5lcyA9IHJlZihuZXcgQXJyYXkoMikuZmlsbChudWxsKS5tYXAoKF8sIGluZGV4KSA9PiB7CiAgICAgIGNvbnN0IGlkID0gU3RyaW5nKGluZGV4ICsgMSk7CiAgICAgIHJldHVybiB7CiAgICAgICAgdGl0bGU6IGBUYWIgJHtpZH1gLAogICAgICAgIGNvbnRlbnQ6IGBDb250ZW50IG9mIFRhYiBQYW5lICR7aWR9YCwKICAgICAgICBrZXk6IGlkLAogICAgICB9OwogICAgfSkpOwogICAgY29uc3QgYWN0aXZlS2V5ID0gcmVmKHBhbmVzLnZhbHVlWzBdLmtleSk7CiAgICBjb25zdCBuZXdUYWJJbmRleCA9IHJlZigwKTsKICAgIGNvbnN0IGFkZCA9ICgpID0+IHsKICAgICAgYWN0aXZlS2V5LnZhbHVlID0gYG5ld1RhYiR7bmV3VGFiSW5kZXgudmFsdWUrK31gOwogICAgICBwYW5lcy52YWx1ZS5wdXNoKHsKICAgICAgICB0aXRsZTogYE5ldyBUYWIgJHthY3RpdmVLZXkudmFsdWV9YCwKICAgICAgICBjb250ZW50OiBgQ29udGVudCBvZiBuZXcgVGFiICR7YWN0aXZlS2V5LnZhbHVlfWAsCiAgICAgICAga2V5OiBhY3RpdmVLZXkudmFsdWUsCiAgICAgIH0pOwogICAgfTsKICAgIGNvbnN0IHJlbW92ZSA9IHRhcmdldEtleSA9PiB7CiAgICAgIGxldCBsYXN0SW5kZXggPSAwOwogICAgICBwYW5lcy52YWx1ZS5mb3JFYWNoKChwYW5lLCBpKSA9PiB7CiAgICAgICAgaWYgKHBhbmUua2V5ID09PSB0YXJnZXRLZXkpIHsKICAgICAgICAgIGxhc3RJbmRleCA9IGkgLSAxOwogICAgICAgIH0KICAgICAgfSk7CiAgICAgIHBhbmVzLnZhbHVlID0gcGFuZXMudmFsdWUuZmlsdGVyKHBhbmUgPT4gcGFuZS5rZXkgIT09IHRhcmdldEtleSk7CiAgICAgIGlmIChwYW5lcy52YWx1ZS5sZW5ndGggJiYgYWN0aXZlS2V5LnZhbHVlID09PSB0YXJnZXRLZXkpIHsKICAgICAgICBpZiAobGFzdEluZGV4ID49IDApIHsKICAgICAgICAgIGFjdGl2ZUtleS52YWx1ZSA9IHBhbmVzLnZhbHVlW2xhc3RJbmRleF0ua2V5OwogICAgICAgIH0gZWxzZSB7CiAgICAgICAgICBhY3RpdmVLZXkudmFsdWUgPSBwYW5lcy52YWx1ZVswXS5rZXk7CiAgICAgICAgfQogICAgICB9CiAgICB9OwogICAgY29uc3Qgb25FZGl0ID0gdGFyZ2V0S2V5ID0+IHsKICAgICAgcmVtb3ZlKHRhcmdldEtleSk7CiAgICB9OwogICAgcmV0dXJuIHsKICAgICAgcGFuZXMsCiAgICAgIGFjdGl2ZUtleSwKICAgICAgb25FZGl0LAogICAgICBhZGQsCiAgICB9OwogIH0sCn0pOwo8L3NjcmlwdD4="}},{default:s(()=>[n("div",null,[n("div",_,[e(c,{onClick:o.add},{default:s(()=>t[1]||(t[1]=[a("ADD")])),_:1,__:[1]},8,["onClick"])]),e(l,{activeKey:o.activeKey,"onUpdate:activeKey":t[0]||(t[0]=g=>o.activeKey=g),"hide-add":"",type:"editable-card",onEdit:o.onEdit},{default:s(()=>[(i(!0),v(f,null,Y(o.panes,g=>(i(),h(u,{key:g.key,tab:g.title,closable:g.closable},{default:s(()=>[a(Z(g.content),1)]),_:2},1032,["tab","closable"]))),128))]),_:1},8,["activeKey","onEdit"])])]),htmlCode:s(()=>t[2]||(t[2]=[n("pre",{class:"language-vue"},[n("code",null,[n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),a("template")]),n("span",{class:"token punctuation"},">")]),a(`
  `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),a("div")]),n("span",{class:"token punctuation"},">")]),a(`
    `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),a("div")]),a(),n("span",{class:"token attr-name"},":style"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),a("{ marginBottom: '16px' }"),n("span",{class:"token punctuation"},'"')]),n("span",{class:"token punctuation"},">")]),a(`
      `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),a("a-button")]),a(),n("span",{class:"token attr-name"},"@click"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),a("add"),n("span",{class:"token punctuation"},'"')]),n("span",{class:"token punctuation"},">")]),a("ADD"),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"</"),a("a-button")]),n("span",{class:"token punctuation"},">")]),a(`
    `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"</"),a("div")]),n("span",{class:"token punctuation"},">")]),a(`
    `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),a("a-tabs")]),a(),n("span",{class:"token attr-name"},[n("span",{class:"token namespace"},"v-model:"),a("activeKey")]),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),a("activeKey"),n("span",{class:"token punctuation"},'"')]),a(),n("span",{class:"token attr-name"},"hide-add"),a(),n("span",{class:"token attr-name"},"type"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),a("editable-card"),n("span",{class:"token punctuation"},'"')]),a(),n("span",{class:"token attr-name"},"@edit"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),a("onEdit"),n("span",{class:"token punctuation"},'"')]),n("span",{class:"token punctuation"},">")]),a(`
      `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),a("a-tab-pane")]),a(),n("span",{class:"token attr-name"},"v-for"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),a("pane in panes"),n("span",{class:"token punctuation"},'"')]),a(),n("span",{class:"token attr-name"},":key"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),a("pane.key"),n("span",{class:"token punctuation"},'"')]),a(),n("span",{class:"token attr-name"},":tab"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),a("pane.title"),n("span",{class:"token punctuation"},'"')]),a(),n("span",{class:"token attr-name"},":closable"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),a("pane.closable"),n("span",{class:"token punctuation"},'"')]),n("span",{class:"token punctuation"},">")]),a(`
        {{ pane.content }}
      `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"</"),a("a-tab-pane")]),n("span",{class:"token punctuation"},">")]),a(`
    `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"</"),a("a-tabs")]),n("span",{class:"token punctuation"},">")]),a(`
  `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"</"),a("div")]),n("span",{class:"token punctuation"},">")]),a(`
`),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"</"),a("template")]),n("span",{class:"token punctuation"},">")]),a(`
`),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),a("script")]),a(),n("span",{class:"token attr-name"},"lang"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),a("ts"),n("span",{class:"token punctuation"},'"')]),n("span",{class:"token punctuation"},">")]),n("span",{class:"token script"},[n("span",{class:"token language-javascript"},[a(`
`),n("span",{class:"token keyword"},"import"),a(),n("span",{class:"token punctuation"},"{"),a(" defineComponent"),n("span",{class:"token punctuation"},","),a(" ref "),n("span",{class:"token punctuation"},"}"),a(),n("span",{class:"token keyword"},"from"),a(),n("span",{class:"token string"},"'vue'"),n("span",{class:"token punctuation"},";"),a(`

`),n("span",{class:"token keyword"},"export"),a(),n("span",{class:"token keyword"},"default"),a(),n("span",{class:"token function"},"defineComponent"),n("span",{class:"token punctuation"},"("),n("span",{class:"token punctuation"},"{"),a(`
  `),n("span",{class:"token function"},"setup"),n("span",{class:"token punctuation"},"("),n("span",{class:"token punctuation"},")"),a(),n("span",{class:"token punctuation"},"{"),a(`
    `),n("span",{class:"token keyword"},"const"),a(" panes "),n("span",{class:"token operator"},"="),a(" ref"),n("span",{class:"token operator"},"<"),n("span",{class:"token punctuation"},"{"),a(),n("span",{class:"token literal-property property"},"title"),n("span",{class:"token operator"},":"),a(" string"),n("span",{class:"token punctuation"},";"),a(" content"),n("span",{class:"token operator"},":"),a(" string"),n("span",{class:"token punctuation"},";"),a(" key"),n("span",{class:"token operator"},":"),a(" string"),n("span",{class:"token punctuation"},";"),a(" closable"),n("span",{class:"token operator"},"?"),n("span",{class:"token operator"},":"),a(" boolean "),n("span",{class:"token punctuation"},"}"),n("span",{class:"token punctuation"},"["),n("span",{class:"token punctuation"},"]"),n("span",{class:"token operator"},">"),n("span",{class:"token punctuation"},"("),a(`
      `),n("span",{class:"token keyword"},"new"),a(),n("span",{class:"token class-name"},"Array"),n("span",{class:"token punctuation"},"("),n("span",{class:"token number"},"2"),n("span",{class:"token punctuation"},")"),n("span",{class:"token punctuation"},"."),n("span",{class:"token function"},"fill"),n("span",{class:"token punctuation"},"("),n("span",{class:"token keyword"},"null"),n("span",{class:"token punctuation"},")"),n("span",{class:"token punctuation"},"."),n("span",{class:"token function"},"map"),n("span",{class:"token punctuation"},"("),n("span",{class:"token punctuation"},"("),n("span",{class:"token parameter"},[a("_"),n("span",{class:"token punctuation"},","),a(" index")]),n("span",{class:"token punctuation"},")"),a(),n("span",{class:"token operator"},"=>"),a(),n("span",{class:"token punctuation"},"{"),a(`
        `),n("span",{class:"token keyword"},"const"),a(" id "),n("span",{class:"token operator"},"="),a(),n("span",{class:"token function"},"String"),n("span",{class:"token punctuation"},"("),a("index "),n("span",{class:"token operator"},"+"),a(),n("span",{class:"token number"},"1"),n("span",{class:"token punctuation"},")"),n("span",{class:"token punctuation"},";"),a(`
        `),n("span",{class:"token keyword"},"return"),a(),n("span",{class:"token punctuation"},"{"),a(),n("span",{class:"token literal-property property"},"title"),n("span",{class:"token operator"},":"),a(),n("span",{class:"token template-string"},[n("span",{class:"token template-punctuation string"},"`"),n("span",{class:"token string"},"Tab "),n("span",{class:"token interpolation"},[n("span",{class:"token interpolation-punctuation punctuation"},"${"),a("id"),n("span",{class:"token interpolation-punctuation punctuation"},"}")]),n("span",{class:"token template-punctuation string"},"`")]),n("span",{class:"token punctuation"},","),a(),n("span",{class:"token literal-property property"},"content"),n("span",{class:"token operator"},":"),a(),n("span",{class:"token template-string"},[n("span",{class:"token template-punctuation string"},"`"),n("span",{class:"token string"},"Content of Tab Pane "),n("span",{class:"token interpolation"},[n("span",{class:"token interpolation-punctuation punctuation"},"${"),a("id"),n("span",{class:"token interpolation-punctuation punctuation"},"}")]),n("span",{class:"token template-punctuation string"},"`")]),n("span",{class:"token punctuation"},","),a(),n("span",{class:"token literal-property property"},"key"),n("span",{class:"token operator"},":"),a(" id "),n("span",{class:"token punctuation"},"}"),n("span",{class:"token punctuation"},";"),a(`
      `),n("span",{class:"token punctuation"},"}"),n("span",{class:"token punctuation"},")"),n("span",{class:"token punctuation"},","),a(`
    `),n("span",{class:"token punctuation"},")"),n("span",{class:"token punctuation"},";"),a(`
    `),n("span",{class:"token keyword"},"const"),a(" activeKey "),n("span",{class:"token operator"},"="),a(),n("span",{class:"token function"},"ref"),n("span",{class:"token punctuation"},"("),a("panes"),n("span",{class:"token punctuation"},"."),a("value"),n("span",{class:"token punctuation"},"["),n("span",{class:"token number"},"0"),n("span",{class:"token punctuation"},"]"),n("span",{class:"token punctuation"},"."),a("key"),n("span",{class:"token punctuation"},")"),n("span",{class:"token punctuation"},";"),a(`
    `),n("span",{class:"token keyword"},"const"),a(" newTabIndex "),n("span",{class:"token operator"},"="),a(),n("span",{class:"token function"},"ref"),n("span",{class:"token punctuation"},"("),n("span",{class:"token number"},"0"),n("span",{class:"token punctuation"},")"),n("span",{class:"token punctuation"},";"),a(`

    `),n("span",{class:"token keyword"},"const"),a(),n("span",{class:"token function-variable function"},"add"),a(),n("span",{class:"token operator"},"="),a(),n("span",{class:"token punctuation"},"("),n("span",{class:"token punctuation"},")"),a(),n("span",{class:"token operator"},"=>"),a(),n("span",{class:"token punctuation"},"{"),a(`
      activeKey`),n("span",{class:"token punctuation"},"."),a("value "),n("span",{class:"token operator"},"="),a(),n("span",{class:"token template-string"},[n("span",{class:"token template-punctuation string"},"`"),n("span",{class:"token string"},"newTab"),n("span",{class:"token interpolation"},[n("span",{class:"token interpolation-punctuation punctuation"},"${"),a("newTabIndex"),n("span",{class:"token punctuation"},"."),a("value"),n("span",{class:"token operator"},"++"),n("span",{class:"token interpolation-punctuation punctuation"},"}")]),n("span",{class:"token template-punctuation string"},"`")]),n("span",{class:"token punctuation"},";"),a(`
      panes`),n("span",{class:"token punctuation"},"."),a("value"),n("span",{class:"token punctuation"},"."),n("span",{class:"token function"},"push"),n("span",{class:"token punctuation"},"("),n("span",{class:"token punctuation"},"{"),a(`
        `),n("span",{class:"token literal-property property"},"title"),n("span",{class:"token operator"},":"),a(),n("span",{class:"token template-string"},[n("span",{class:"token template-punctuation string"},"`"),n("span",{class:"token string"},"New Tab "),n("span",{class:"token interpolation"},[n("span",{class:"token interpolation-punctuation punctuation"},"${"),a("activeKey"),n("span",{class:"token punctuation"},"."),a("value"),n("span",{class:"token interpolation-punctuation punctuation"},"}")]),n("span",{class:"token template-punctuation string"},"`")]),n("span",{class:"token punctuation"},","),a(`
        `),n("span",{class:"token literal-property property"},"content"),n("span",{class:"token operator"},":"),a(),n("span",{class:"token template-string"},[n("span",{class:"token template-punctuation string"},"`"),n("span",{class:"token string"},"Content of new Tab "),n("span",{class:"token interpolation"},[n("span",{class:"token interpolation-punctuation punctuation"},"${"),a("activeKey"),n("span",{class:"token punctuation"},"."),a("value"),n("span",{class:"token interpolation-punctuation punctuation"},"}")]),n("span",{class:"token template-punctuation string"},"`")]),n("span",{class:"token punctuation"},","),a(`
        `),n("span",{class:"token literal-property property"},"key"),n("span",{class:"token operator"},":"),a(" activeKey"),n("span",{class:"token punctuation"},"."),a("value"),n("span",{class:"token punctuation"},","),a(`
      `),n("span",{class:"token punctuation"},"}"),n("span",{class:"token punctuation"},")"),n("span",{class:"token punctuation"},";"),a(`
    `),n("span",{class:"token punctuation"},"}"),n("span",{class:"token punctuation"},";"),a(`

    `),n("span",{class:"token keyword"},"const"),a(),n("span",{class:"token function-variable function"},"remove"),a(),n("span",{class:"token operator"},"="),a(),n("span",{class:"token punctuation"},"("),n("span",{class:"token parameter"},[n("span",{class:"token literal-property property"},"targetKey"),n("span",{class:"token operator"},":"),a(" string")]),n("span",{class:"token punctuation"},")"),a(),n("span",{class:"token operator"},"=>"),a(),n("span",{class:"token punctuation"},"{"),a(`
      `),n("span",{class:"token keyword"},"let"),a(" lastIndex "),n("span",{class:"token operator"},"="),a(),n("span",{class:"token number"},"0"),n("span",{class:"token punctuation"},";"),a(`
      panes`),n("span",{class:"token punctuation"},"."),a("value"),n("span",{class:"token punctuation"},"."),n("span",{class:"token function"},"forEach"),n("span",{class:"token punctuation"},"("),n("span",{class:"token punctuation"},"("),n("span",{class:"token parameter"},[a("pane"),n("span",{class:"token punctuation"},","),a(" i")]),n("span",{class:"token punctuation"},")"),a(),n("span",{class:"token operator"},"=>"),a(),n("span",{class:"token punctuation"},"{"),a(`
        `),n("span",{class:"token keyword"},"if"),a(),n("span",{class:"token punctuation"},"("),a("pane"),n("span",{class:"token punctuation"},"."),a("key "),n("span",{class:"token operator"},"==="),a(" targetKey"),n("span",{class:"token punctuation"},")"),a(),n("span",{class:"token punctuation"},"{"),a(`
          lastIndex `),n("span",{class:"token operator"},"="),a(" i "),n("span",{class:"token operator"},"-"),a(),n("span",{class:"token number"},"1"),n("span",{class:"token punctuation"},";"),a(`
        `),n("span",{class:"token punctuation"},"}"),a(`
      `),n("span",{class:"token punctuation"},"}"),n("span",{class:"token punctuation"},")"),n("span",{class:"token punctuation"},";"),a(`
      panes`),n("span",{class:"token punctuation"},"."),a("value "),n("span",{class:"token operator"},"="),a(" panes"),n("span",{class:"token punctuation"},"."),a("value"),n("span",{class:"token punctuation"},"."),n("span",{class:"token function"},"filter"),n("span",{class:"token punctuation"},"("),n("span",{class:"token parameter"},"pane"),a(),n("span",{class:"token operator"},"=>"),a(" pane"),n("span",{class:"token punctuation"},"."),a("key "),n("span",{class:"token operator"},"!=="),a(" targetKey"),n("span",{class:"token punctuation"},")"),n("span",{class:"token punctuation"},";"),a(`
      `),n("span",{class:"token keyword"},"if"),a(),n("span",{class:"token punctuation"},"("),a("panes"),n("span",{class:"token punctuation"},"."),a("value"),n("span",{class:"token punctuation"},"."),a("length "),n("span",{class:"token operator"},"&&"),a(" activeKey"),n("span",{class:"token punctuation"},"."),a("value "),n("span",{class:"token operator"},"==="),a(" targetKey"),n("span",{class:"token punctuation"},")"),a(),n("span",{class:"token punctuation"},"{"),a(`
        `),n("span",{class:"token keyword"},"if"),a(),n("span",{class:"token punctuation"},"("),a("lastIndex "),n("span",{class:"token operator"},">="),a(),n("span",{class:"token number"},"0"),n("span",{class:"token punctuation"},")"),a(),n("span",{class:"token punctuation"},"{"),a(`
          activeKey`),n("span",{class:"token punctuation"},"."),a("value "),n("span",{class:"token operator"},"="),a(" panes"),n("span",{class:"token punctuation"},"."),a("value"),n("span",{class:"token punctuation"},"["),a("lastIndex"),n("span",{class:"token punctuation"},"]"),n("span",{class:"token punctuation"},"."),a("key"),n("span",{class:"token punctuation"},";"),a(`
        `),n("span",{class:"token punctuation"},"}"),a(),n("span",{class:"token keyword"},"else"),a(),n("span",{class:"token punctuation"},"{"),a(`
          activeKey`),n("span",{class:"token punctuation"},"."),a("value "),n("span",{class:"token operator"},"="),a(" panes"),n("span",{class:"token punctuation"},"."),a("value"),n("span",{class:"token punctuation"},"["),n("span",{class:"token number"},"0"),n("span",{class:"token punctuation"},"]"),n("span",{class:"token punctuation"},"."),a("key"),n("span",{class:"token punctuation"},";"),a(`
        `),n("span",{class:"token punctuation"},"}"),a(`
      `),n("span",{class:"token punctuation"},"}"),a(`
    `),n("span",{class:"token punctuation"},"}"),n("span",{class:"token punctuation"},";"),a(`

    `),n("span",{class:"token keyword"},"const"),a(),n("span",{class:"token function-variable function"},"onEdit"),a(),n("span",{class:"token operator"},"="),a(),n("span",{class:"token punctuation"},"("),n("span",{class:"token parameter"},[n("span",{class:"token literal-property property"},"targetKey"),n("span",{class:"token operator"},":"),a(" string")]),n("span",{class:"token punctuation"},")"),a(),n("span",{class:"token operator"},"=>"),a(),n("span",{class:"token punctuation"},"{"),a(`
      `),n("span",{class:"token function"},"remove"),n("span",{class:"token punctuation"},"("),a("targetKey"),n("span",{class:"token punctuation"},")"),n("span",{class:"token punctuation"},";"),a(`
    `),n("span",{class:"token punctuation"},"}"),n("span",{class:"token punctuation"},";"),a(`

    `),n("span",{class:"token keyword"},"return"),a(),n("span",{class:"token punctuation"},"{"),a(`
      panes`),n("span",{class:"token punctuation"},","),a(`
      activeKey`),n("span",{class:"token punctuation"},","),a(`
      onEdit`),n("span",{class:"token punctuation"},","),a(`
      add`),n("span",{class:"token punctuation"},","),a(`
    `),n("span",{class:"token punctuation"},"}"),n("span",{class:"token punctuation"},";"),a(`
  `),n("span",{class:"token punctuation"},"}"),n("span",{class:"token punctuation"},","),a(`
`),n("span",{class:"token punctuation"},"}"),n("span",{class:"token punctuation"},")"),n("span",{class:"token punctuation"},";"),a(`
`)])]),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"</"),a("script")]),n("span",{class:"token punctuation"},">")]),a(`
`)])],-1)])),jsVersionHtml:s(()=>t[3]||(t[3]=[n("pre",{class:"language-vue"},[n("code",null,[n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),a("template")]),n("span",{class:"token punctuation"},">")]),a(`
  `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),a("div")]),n("span",{class:"token punctuation"},">")]),a(`
    `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),a("div")]),a(),n("span",{class:"token attr-name"},":style"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),a("{ marginBottom: '16px' }"),n("span",{class:"token punctuation"},'"')]),n("span",{class:"token punctuation"},">")]),a(`
      `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),a("a-button")]),a(),n("span",{class:"token attr-name"},"@click"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),a("add"),n("span",{class:"token punctuation"},'"')]),n("span",{class:"token punctuation"},">")]),a("ADD"),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"</"),a("a-button")]),n("span",{class:"token punctuation"},">")]),a(`
    `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"</"),a("div")]),n("span",{class:"token punctuation"},">")]),a(`
    `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),a("a-tabs")]),a(),n("span",{class:"token attr-name"},[n("span",{class:"token namespace"},"v-model:"),a("activeKey")]),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),a("activeKey"),n("span",{class:"token punctuation"},'"')]),a(),n("span",{class:"token attr-name"},"hide-add"),a(),n("span",{class:"token attr-name"},"type"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),a("editable-card"),n("span",{class:"token punctuation"},'"')]),a(),n("span",{class:"token attr-name"},"@edit"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),a("onEdit"),n("span",{class:"token punctuation"},'"')]),n("span",{class:"token punctuation"},">")]),a(`
      `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),a("a-tab-pane")]),a(),n("span",{class:"token attr-name"},"v-for"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),a("pane in panes"),n("span",{class:"token punctuation"},'"')]),a(),n("span",{class:"token attr-name"},":key"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),a("pane.key"),n("span",{class:"token punctuation"},'"')]),a(),n("span",{class:"token attr-name"},":tab"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),a("pane.title"),n("span",{class:"token punctuation"},'"')]),a(),n("span",{class:"token attr-name"},":closable"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),a("pane.closable"),n("span",{class:"token punctuation"},'"')]),n("span",{class:"token punctuation"},">")]),a(`
        {{ pane.content }}
      `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"</"),a("a-tab-pane")]),n("span",{class:"token punctuation"},">")]),a(`
    `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"</"),a("a-tabs")]),n("span",{class:"token punctuation"},">")]),a(`
  `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"</"),a("div")]),n("span",{class:"token punctuation"},">")]),a(`
`),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"</"),a("template")]),n("span",{class:"token punctuation"},">")]),a(`
`),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),a("script")]),n("span",{class:"token punctuation"},">")]),n("span",{class:"token script"},[n("span",{class:"token language-javascript"},[a(`
`),n("span",{class:"token keyword"},"import"),a(),n("span",{class:"token punctuation"},"{"),a(" defineComponent"),n("span",{class:"token punctuation"},","),a(" ref "),n("span",{class:"token punctuation"},"}"),a(),n("span",{class:"token keyword"},"from"),a(),n("span",{class:"token string"},"'vue'"),n("span",{class:"token punctuation"},";"),a(`
`),n("span",{class:"token keyword"},"export"),a(),n("span",{class:"token keyword"},"default"),a(),n("span",{class:"token function"},"defineComponent"),n("span",{class:"token punctuation"},"("),n("span",{class:"token punctuation"},"{"),a(`
  `),n("span",{class:"token function"},"setup"),n("span",{class:"token punctuation"},"("),n("span",{class:"token punctuation"},")"),a(),n("span",{class:"token punctuation"},"{"),a(`
    `),n("span",{class:"token keyword"},"const"),a(" panes "),n("span",{class:"token operator"},"="),a(),n("span",{class:"token function"},"ref"),n("span",{class:"token punctuation"},"("),n("span",{class:"token keyword"},"new"),a(),n("span",{class:"token class-name"},"Array"),n("span",{class:"token punctuation"},"("),n("span",{class:"token number"},"2"),n("span",{class:"token punctuation"},")"),n("span",{class:"token punctuation"},"."),n("span",{class:"token function"},"fill"),n("span",{class:"token punctuation"},"("),n("span",{class:"token keyword"},"null"),n("span",{class:"token punctuation"},")"),n("span",{class:"token punctuation"},"."),n("span",{class:"token function"},"map"),n("span",{class:"token punctuation"},"("),n("span",{class:"token punctuation"},"("),n("span",{class:"token parameter"},[a("_"),n("span",{class:"token punctuation"},","),a(" index")]),n("span",{class:"token punctuation"},")"),a(),n("span",{class:"token operator"},"=>"),a(),n("span",{class:"token punctuation"},"{"),a(`
      `),n("span",{class:"token keyword"},"const"),a(" id "),n("span",{class:"token operator"},"="),a(),n("span",{class:"token function"},"String"),n("span",{class:"token punctuation"},"("),a("index "),n("span",{class:"token operator"},"+"),a(),n("span",{class:"token number"},"1"),n("span",{class:"token punctuation"},")"),n("span",{class:"token punctuation"},";"),a(`
      `),n("span",{class:"token keyword"},"return"),a(),n("span",{class:"token punctuation"},"{"),a(`
        `),n("span",{class:"token literal-property property"},"title"),n("span",{class:"token operator"},":"),a(),n("span",{class:"token template-string"},[n("span",{class:"token template-punctuation string"},"`"),n("span",{class:"token string"},"Tab "),n("span",{class:"token interpolation"},[n("span",{class:"token interpolation-punctuation punctuation"},"${"),a("id"),n("span",{class:"token interpolation-punctuation punctuation"},"}")]),n("span",{class:"token template-punctuation string"},"`")]),n("span",{class:"token punctuation"},","),a(`
        `),n("span",{class:"token literal-property property"},"content"),n("span",{class:"token operator"},":"),a(),n("span",{class:"token template-string"},[n("span",{class:"token template-punctuation string"},"`"),n("span",{class:"token string"},"Content of Tab Pane "),n("span",{class:"token interpolation"},[n("span",{class:"token interpolation-punctuation punctuation"},"${"),a("id"),n("span",{class:"token interpolation-punctuation punctuation"},"}")]),n("span",{class:"token template-punctuation string"},"`")]),n("span",{class:"token punctuation"},","),a(`
        `),n("span",{class:"token literal-property property"},"key"),n("span",{class:"token operator"},":"),a(" id"),n("span",{class:"token punctuation"},","),a(`
      `),n("span",{class:"token punctuation"},"}"),n("span",{class:"token punctuation"},";"),a(`
    `),n("span",{class:"token punctuation"},"}"),n("span",{class:"token punctuation"},")"),n("span",{class:"token punctuation"},")"),n("span",{class:"token punctuation"},";"),a(`
    `),n("span",{class:"token keyword"},"const"),a(" activeKey "),n("span",{class:"token operator"},"="),a(),n("span",{class:"token function"},"ref"),n("span",{class:"token punctuation"},"("),a("panes"),n("span",{class:"token punctuation"},"."),a("value"),n("span",{class:"token punctuation"},"["),n("span",{class:"token number"},"0"),n("span",{class:"token punctuation"},"]"),n("span",{class:"token punctuation"},"."),a("key"),n("span",{class:"token punctuation"},")"),n("span",{class:"token punctuation"},";"),a(`
    `),n("span",{class:"token keyword"},"const"),a(" newTabIndex "),n("span",{class:"token operator"},"="),a(),n("span",{class:"token function"},"ref"),n("span",{class:"token punctuation"},"("),n("span",{class:"token number"},"0"),n("span",{class:"token punctuation"},")"),n("span",{class:"token punctuation"},";"),a(`
    `),n("span",{class:"token keyword"},"const"),a(),n("span",{class:"token function-variable function"},"add"),a(),n("span",{class:"token operator"},"="),a(),n("span",{class:"token punctuation"},"("),n("span",{class:"token punctuation"},")"),a(),n("span",{class:"token operator"},"=>"),a(),n("span",{class:"token punctuation"},"{"),a(`
      activeKey`),n("span",{class:"token punctuation"},"."),a("value "),n("span",{class:"token operator"},"="),a(),n("span",{class:"token template-string"},[n("span",{class:"token template-punctuation string"},"`"),n("span",{class:"token string"},"newTab"),n("span",{class:"token interpolation"},[n("span",{class:"token interpolation-punctuation punctuation"},"${"),a("newTabIndex"),n("span",{class:"token punctuation"},"."),a("value"),n("span",{class:"token operator"},"++"),n("span",{class:"token interpolation-punctuation punctuation"},"}")]),n("span",{class:"token template-punctuation string"},"`")]),n("span",{class:"token punctuation"},";"),a(`
      panes`),n("span",{class:"token punctuation"},"."),a("value"),n("span",{class:"token punctuation"},"."),n("span",{class:"token function"},"push"),n("span",{class:"token punctuation"},"("),n("span",{class:"token punctuation"},"{"),a(`
        `),n("span",{class:"token literal-property property"},"title"),n("span",{class:"token operator"},":"),a(),n("span",{class:"token template-string"},[n("span",{class:"token template-punctuation string"},"`"),n("span",{class:"token string"},"New Tab "),n("span",{class:"token interpolation"},[n("span",{class:"token interpolation-punctuation punctuation"},"${"),a("activeKey"),n("span",{class:"token punctuation"},"."),a("value"),n("span",{class:"token interpolation-punctuation punctuation"},"}")]),n("span",{class:"token template-punctuation string"},"`")]),n("span",{class:"token punctuation"},","),a(`
        `),n("span",{class:"token literal-property property"},"content"),n("span",{class:"token operator"},":"),a(),n("span",{class:"token template-string"},[n("span",{class:"token template-punctuation string"},"`"),n("span",{class:"token string"},"Content of new Tab "),n("span",{class:"token interpolation"},[n("span",{class:"token interpolation-punctuation punctuation"},"${"),a("activeKey"),n("span",{class:"token punctuation"},"."),a("value"),n("span",{class:"token interpolation-punctuation punctuation"},"}")]),n("span",{class:"token template-punctuation string"},"`")]),n("span",{class:"token punctuation"},","),a(`
        `),n("span",{class:"token literal-property property"},"key"),n("span",{class:"token operator"},":"),a(" activeKey"),n("span",{class:"token punctuation"},"."),a("value"),n("span",{class:"token punctuation"},","),a(`
      `),n("span",{class:"token punctuation"},"}"),n("span",{class:"token punctuation"},")"),n("span",{class:"token punctuation"},";"),a(`
    `),n("span",{class:"token punctuation"},"}"),n("span",{class:"token punctuation"},";"),a(`
    `),n("span",{class:"token keyword"},"const"),a(),n("span",{class:"token function-variable function"},"remove"),a(),n("span",{class:"token operator"},"="),a(),n("span",{class:"token parameter"},"targetKey"),a(),n("span",{class:"token operator"},"=>"),a(),n("span",{class:"token punctuation"},"{"),a(`
      `),n("span",{class:"token keyword"},"let"),a(" lastIndex "),n("span",{class:"token operator"},"="),a(),n("span",{class:"token number"},"0"),n("span",{class:"token punctuation"},";"),a(`
      panes`),n("span",{class:"token punctuation"},"."),a("value"),n("span",{class:"token punctuation"},"."),n("span",{class:"token function"},"forEach"),n("span",{class:"token punctuation"},"("),n("span",{class:"token punctuation"},"("),n("span",{class:"token parameter"},[a("pane"),n("span",{class:"token punctuation"},","),a(" i")]),n("span",{class:"token punctuation"},")"),a(),n("span",{class:"token operator"},"=>"),a(),n("span",{class:"token punctuation"},"{"),a(`
        `),n("span",{class:"token keyword"},"if"),a(),n("span",{class:"token punctuation"},"("),a("pane"),n("span",{class:"token punctuation"},"."),a("key "),n("span",{class:"token operator"},"==="),a(" targetKey"),n("span",{class:"token punctuation"},")"),a(),n("span",{class:"token punctuation"},"{"),a(`
          lastIndex `),n("span",{class:"token operator"},"="),a(" i "),n("span",{class:"token operator"},"-"),a(),n("span",{class:"token number"},"1"),n("span",{class:"token punctuation"},";"),a(`
        `),n("span",{class:"token punctuation"},"}"),a(`
      `),n("span",{class:"token punctuation"},"}"),n("span",{class:"token punctuation"},")"),n("span",{class:"token punctuation"},";"),a(`
      panes`),n("span",{class:"token punctuation"},"."),a("value "),n("span",{class:"token operator"},"="),a(" panes"),n("span",{class:"token punctuation"},"."),a("value"),n("span",{class:"token punctuation"},"."),n("span",{class:"token function"},"filter"),n("span",{class:"token punctuation"},"("),n("span",{class:"token parameter"},"pane"),a(),n("span",{class:"token operator"},"=>"),a(" pane"),n("span",{class:"token punctuation"},"."),a("key "),n("span",{class:"token operator"},"!=="),a(" targetKey"),n("span",{class:"token punctuation"},")"),n("span",{class:"token punctuation"},";"),a(`
      `),n("span",{class:"token keyword"},"if"),a(),n("span",{class:"token punctuation"},"("),a("panes"),n("span",{class:"token punctuation"},"."),a("value"),n("span",{class:"token punctuation"},"."),a("length "),n("span",{class:"token operator"},"&&"),a(" activeKey"),n("span",{class:"token punctuation"},"."),a("value "),n("span",{class:"token operator"},"==="),a(" targetKey"),n("span",{class:"token punctuation"},")"),a(),n("span",{class:"token punctuation"},"{"),a(`
        `),n("span",{class:"token keyword"},"if"),a(),n("span",{class:"token punctuation"},"("),a("lastIndex "),n("span",{class:"token operator"},">="),a(),n("span",{class:"token number"},"0"),n("span",{class:"token punctuation"},")"),a(),n("span",{class:"token punctuation"},"{"),a(`
          activeKey`),n("span",{class:"token punctuation"},"."),a("value "),n("span",{class:"token operator"},"="),a(" panes"),n("span",{class:"token punctuation"},"."),a("value"),n("span",{class:"token punctuation"},"["),a("lastIndex"),n("span",{class:"token punctuation"},"]"),n("span",{class:"token punctuation"},"."),a("key"),n("span",{class:"token punctuation"},";"),a(`
        `),n("span",{class:"token punctuation"},"}"),a(),n("span",{class:"token keyword"},"else"),a(),n("span",{class:"token punctuation"},"{"),a(`
          activeKey`),n("span",{class:"token punctuation"},"."),a("value "),n("span",{class:"token operator"},"="),a(" panes"),n("span",{class:"token punctuation"},"."),a("value"),n("span",{class:"token punctuation"},"["),n("span",{class:"token number"},"0"),n("span",{class:"token punctuation"},"]"),n("span",{class:"token punctuation"},"."),a("key"),n("span",{class:"token punctuation"},";"),a(`
        `),n("span",{class:"token punctuation"},"}"),a(`
      `),n("span",{class:"token punctuation"},"}"),a(`
    `),n("span",{class:"token punctuation"},"}"),n("span",{class:"token punctuation"},";"),a(`
    `),n("span",{class:"token keyword"},"const"),a(),n("span",{class:"token function-variable function"},"onEdit"),a(),n("span",{class:"token operator"},"="),a(),n("span",{class:"token parameter"},"targetKey"),a(),n("span",{class:"token operator"},"=>"),a(),n("span",{class:"token punctuation"},"{"),a(`
      `),n("span",{class:"token function"},"remove"),n("span",{class:"token punctuation"},"("),a("targetKey"),n("span",{class:"token punctuation"},")"),n("span",{class:"token punctuation"},";"),a(`
    `),n("span",{class:"token punctuation"},"}"),n("span",{class:"token punctuation"},";"),a(`
    `),n("span",{class:"token keyword"},"return"),a(),n("span",{class:"token punctuation"},"{"),a(`
      panes`),n("span",{class:"token punctuation"},","),a(`
      activeKey`),n("span",{class:"token punctuation"},","),a(`
      onEdit`),n("span",{class:"token punctuation"},","),a(`
      add`),n("span",{class:"token punctuation"},","),a(`
    `),n("span",{class:"token punctuation"},"}"),n("span",{class:"token punctuation"},";"),a(`
  `),n("span",{class:"token punctuation"},"}"),n("span",{class:"token punctuation"},","),a(`
`),n("span",{class:"token punctuation"},"}"),n("span",{class:"token punctuation"},")"),n("span",{class:"token punctuation"},";"),a(`
`)])]),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"</"),a("script")]),n("span",{class:"token punctuation"},">")]),a(`
`)])],-1)])),_:1})}const O=y(Q,[["render",M]]),$=A({setup(){return{activeKey:b("1")}}});function nn(o,t,d,r,I,m){const c=p("a-tab-pane"),u=p("a-tabs"),l=p("demo-box");return i(),h(l,{jsfiddle:{us:"Disabled a tab.",cn:"\u7981\u7528\u67D0\u4E00\u9879\u3002",docHtml:`<h2 id="zh-CN">zh-CN <a class="header-anchor" href="#zh-CN">
          <span aria-hidden="true" class="anchor">#</span>
        </a></h2>
<p>\u7981\u7528\u67D0\u4E00\u9879\u3002</p>
<h2 id="en-US">en-US <a class="header-anchor" href="#en-US">
          <span aria-hidden="true" class="anchor">#</span>
        </a></h2>
<p>Disabled a tab.</p>
`,order:1,title:{"zh-CN":"\u7981\u7528","en-US":"Disabled"},relativePath:"components/tabs/demo/disabled.vue",sourceCode:"PHRlbXBsYXRlPgogIDxhLXRhYnMgdi1tb2RlbDphY3RpdmVLZXk9ImFjdGl2ZUtleSI+CiAgICA8YS10YWItcGFuZSBrZXk9IjEiIHRhYj0iVGFiIDEiPlRhYiAxPC9hLXRhYi1wYW5lPgogICAgPGEtdGFiLXBhbmUga2V5PSIyIiB0YWI9IlRhYiAyIiBkaXNhYmxlZD5UYWIgMjwvYS10YWItcGFuZT4KICAgIDxhLXRhYi1wYW5lIGtleT0iMyIgdGFiPSJUYWIgMyI+VGFiIDM8L2EtdGFiLXBhbmU+CiAgPC9hLXRhYnM+CjwvdGVtcGxhdGU+CjxzY3JpcHQgbGFuZz0idHMiPgppbXBvcnQgeyBkZWZpbmVDb21wb25lbnQsIHJlZiB9IGZyb20gJ3Z1ZSc7CgpleHBvcnQgZGVmYXVsdCBkZWZpbmVDb21wb25lbnQoewogIHNldHVwKCkgewogICAgcmV0dXJuIHsKICAgICAgYWN0aXZlS2V5OiByZWYoJzEnKSwKICAgIH07CiAgfSwKfSk7Cjwvc2NyaXB0PgoK",jsSourceCode:"PHRlbXBsYXRlPgogIDxhLXRhYnMgdi1tb2RlbDphY3RpdmVLZXk9ImFjdGl2ZUtleSI+CiAgICA8YS10YWItcGFuZSBrZXk9IjEiIHRhYj0iVGFiIDEiPlRhYiAxPC9hLXRhYi1wYW5lPgogICAgPGEtdGFiLXBhbmUga2V5PSIyIiB0YWI9IlRhYiAyIiBkaXNhYmxlZD5UYWIgMjwvYS10YWItcGFuZT4KICAgIDxhLXRhYi1wYW5lIGtleT0iMyIgdGFiPSJUYWIgMyI+VGFiIDM8L2EtdGFiLXBhbmU+CiAgPC9hLXRhYnM+CjwvdGVtcGxhdGU+CjxzY3JpcHQ+CmltcG9ydCB7IGRlZmluZUNvbXBvbmVudCwgcmVmIH0gZnJvbSAndnVlJzsKZXhwb3J0IGRlZmF1bHQgZGVmaW5lQ29tcG9uZW50KHsKICBzZXR1cCgpIHsKICAgIHJldHVybiB7CiAgICAgIGFjdGl2ZUtleTogcmVmKCcxJyksCiAgICB9OwogIH0sCn0pOwo8L3NjcmlwdD4="}},{default:s(()=>[e(u,{activeKey:o.activeKey,"onUpdate:activeKey":t[0]||(t[0]=k=>o.activeKey=k)},{default:s(()=>[e(c,{key:"1",tab:"Tab 1"},{default:s(()=>t[1]||(t[1]=[a("Tab 1")])),_:1,__:[1]}),e(c,{key:"2",tab:"Tab 2",disabled:""},{default:s(()=>t[2]||(t[2]=[a("Tab 2")])),_:1,__:[2]}),e(c,{key:"3",tab:"Tab 3"},{default:s(()=>t[3]||(t[3]=[a("Tab 3")])),_:1,__:[3]})]),_:1},8,["activeKey"])]),htmlCode:s(()=>t[4]||(t[4]=[n("pre",{class:"language-vue"},[n("code",null,[n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),a("template")]),n("span",{class:"token punctuation"},">")]),a(`
  `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),a("a-tabs")]),a(),n("span",{class:"token attr-name"},[n("span",{class:"token namespace"},"v-model:"),a("activeKey")]),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),a("activeKey"),n("span",{class:"token punctuation"},'"')]),n("span",{class:"token punctuation"},">")]),a(`
    `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),a("a-tab-pane")]),a(),n("span",{class:"token attr-name"},"key"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),a("1"),n("span",{class:"token punctuation"},'"')]),a(),n("span",{class:"token attr-name"},"tab"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),a("Tab 1"),n("span",{class:"token punctuation"},'"')]),n("span",{class:"token punctuation"},">")]),a("Tab 1"),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"</"),a("a-tab-pane")]),n("span",{class:"token punctuation"},">")]),a(`
    `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),a("a-tab-pane")]),a(),n("span",{class:"token attr-name"},"key"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),a("2"),n("span",{class:"token punctuation"},'"')]),a(),n("span",{class:"token attr-name"},"tab"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),a("Tab 2"),n("span",{class:"token punctuation"},'"')]),a(),n("span",{class:"token attr-name"},"disabled"),n("span",{class:"token punctuation"},">")]),a("Tab 2"),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"</"),a("a-tab-pane")]),n("span",{class:"token punctuation"},">")]),a(`
    `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),a("a-tab-pane")]),a(),n("span",{class:"token attr-name"},"key"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),a("3"),n("span",{class:"token punctuation"},'"')]),a(),n("span",{class:"token attr-name"},"tab"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),a("Tab 3"),n("span",{class:"token punctuation"},'"')]),n("span",{class:"token punctuation"},">")]),a("Tab 3"),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"</"),a("a-tab-pane")]),n("span",{class:"token punctuation"},">")]),a(`
  `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"</"),a("a-tabs")]),n("span",{class:"token punctuation"},">")]),a(`
`),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"</"),a("template")]),n("span",{class:"token punctuation"},">")]),a(`
`),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),a("script")]),a(),n("span",{class:"token attr-name"},"lang"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),a("ts"),n("span",{class:"token punctuation"},'"')]),n("span",{class:"token punctuation"},">")]),n("span",{class:"token script"},[n("span",{class:"token language-javascript"},[a(`
`),n("span",{class:"token keyword"},"import"),a(),n("span",{class:"token punctuation"},"{"),a(" defineComponent"),n("span",{class:"token punctuation"},","),a(" ref "),n("span",{class:"token punctuation"},"}"),a(),n("span",{class:"token keyword"},"from"),a(),n("span",{class:"token string"},"'vue'"),n("span",{class:"token punctuation"},";"),a(`

`),n("span",{class:"token keyword"},"export"),a(),n("span",{class:"token keyword"},"default"),a(),n("span",{class:"token function"},"defineComponent"),n("span",{class:"token punctuation"},"("),n("span",{class:"token punctuation"},"{"),a(`
  `),n("span",{class:"token function"},"setup"),n("span",{class:"token punctuation"},"("),n("span",{class:"token punctuation"},")"),a(),n("span",{class:"token punctuation"},"{"),a(`
    `),n("span",{class:"token keyword"},"return"),a(),n("span",{class:"token punctuation"},"{"),a(`
      `),n("span",{class:"token literal-property property"},"activeKey"),n("span",{class:"token operator"},":"),a(),n("span",{class:"token function"},"ref"),n("span",{class:"token punctuation"},"("),n("span",{class:"token string"},"'1'"),n("span",{class:"token punctuation"},")"),n("span",{class:"token punctuation"},","),a(`
    `),n("span",{class:"token punctuation"},"}"),n("span",{class:"token punctuation"},";"),a(`
  `),n("span",{class:"token punctuation"},"}"),n("span",{class:"token punctuation"},","),a(`
`),n("span",{class:"token punctuation"},"}"),n("span",{class:"token punctuation"},")"),n("span",{class:"token punctuation"},";"),a(`
`)])]),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"</"),a("script")]),n("span",{class:"token punctuation"},">")]),a(`
`)])],-1)])),jsVersionHtml:s(()=>t[5]||(t[5]=[n("pre",{class:"language-vue"},[n("code",null,[n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),a("template")]),n("span",{class:"token punctuation"},">")]),a(`
  `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),a("a-tabs")]),a(),n("span",{class:"token attr-name"},[n("span",{class:"token namespace"},"v-model:"),a("activeKey")]),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),a("activeKey"),n("span",{class:"token punctuation"},'"')]),n("span",{class:"token punctuation"},">")]),a(`
    `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),a("a-tab-pane")]),a(),n("span",{class:"token attr-name"},"key"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),a("1"),n("span",{class:"token punctuation"},'"')]),a(),n("span",{class:"token attr-name"},"tab"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),a("Tab 1"),n("span",{class:"token punctuation"},'"')]),n("span",{class:"token punctuation"},">")]),a("Tab 1"),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"</"),a("a-tab-pane")]),n("span",{class:"token punctuation"},">")]),a(`
    `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),a("a-tab-pane")]),a(),n("span",{class:"token attr-name"},"key"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),a("2"),n("span",{class:"token punctuation"},'"')]),a(),n("span",{class:"token attr-name"},"tab"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),a("Tab 2"),n("span",{class:"token punctuation"},'"')]),a(),n("span",{class:"token attr-name"},"disabled"),n("span",{class:"token punctuation"},">")]),a("Tab 2"),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"</"),a("a-tab-pane")]),n("span",{class:"token punctuation"},">")]),a(`
    `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),a("a-tab-pane")]),a(),n("span",{class:"token attr-name"},"key"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),a("3"),n("span",{class:"token punctuation"},'"')]),a(),n("span",{class:"token attr-name"},"tab"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),a("Tab 3"),n("span",{class:"token punctuation"},'"')]),n("span",{class:"token punctuation"},">")]),a("Tab 3"),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"</"),a("a-tab-pane")]),n("span",{class:"token punctuation"},">")]),a(`
  `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"</"),a("a-tabs")]),n("span",{class:"token punctuation"},">")]),a(`
`),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"</"),a("template")]),n("span",{class:"token punctuation"},">")]),a(`
`),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),a("script")]),n("span",{class:"token punctuation"},">")]),n("span",{class:"token script"},[n("span",{class:"token language-javascript"},[a(`
`),n("span",{class:"token keyword"},"import"),a(),n("span",{class:"token punctuation"},"{"),a(" defineComponent"),n("span",{class:"token punctuation"},","),a(" ref "),n("span",{class:"token punctuation"},"}"),a(),n("span",{class:"token keyword"},"from"),a(),n("span",{class:"token string"},"'vue'"),n("span",{class:"token punctuation"},";"),a(`
`),n("span",{class:"token keyword"},"export"),a(),n("span",{class:"token keyword"},"default"),a(),n("span",{class:"token function"},"defineComponent"),n("span",{class:"token punctuation"},"("),n("span",{class:"token punctuation"},"{"),a(`
  `),n("span",{class:"token function"},"setup"),n("span",{class:"token punctuation"},"("),n("span",{class:"token punctuation"},")"),a(),n("span",{class:"token punctuation"},"{"),a(`
    `),n("span",{class:"token keyword"},"return"),a(),n("span",{class:"token punctuation"},"{"),a(`
      `),n("span",{class:"token literal-property property"},"activeKey"),n("span",{class:"token operator"},":"),a(),n("span",{class:"token function"},"ref"),n("span",{class:"token punctuation"},"("),n("span",{class:"token string"},"'1'"),n("span",{class:"token punctuation"},")"),n("span",{class:"token punctuation"},","),a(`
    `),n("span",{class:"token punctuation"},"}"),n("span",{class:"token punctuation"},";"),a(`
  `),n("span",{class:"token punctuation"},"}"),n("span",{class:"token punctuation"},","),a(`
`),n("span",{class:"token punctuation"},"}"),n("span",{class:"token punctuation"},")"),n("span",{class:"token punctuation"},";"),a(`
`)])]),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"</"),a("script")]),n("span",{class:"token punctuation"},">")]),a(`
`)])],-1)])),_:1})}const an=y($,[["render",nn]]),tn=A({setup(){const o=b([{title:"Tab 1",content:"Content of Tab 1",key:"1"},{title:"Tab 2",content:"Content of Tab 2",key:"2"},{title:"Tab 3",content:"Content of Tab 3",key:"3",closable:!1}]),t=b(o.value[0].key),d=b(0),r=()=>{t.value=`newTab${++d.value}`,o.value.push({title:"New Tab",content:"Content of new Tab",key:t.value})},I=c=>{let u=0;o.value.forEach((l,k)=>{l.key===c&&(u=k-1)}),o.value=o.value.filter(l=>l.key!==c),o.value.length&&t.value===c&&(u>=0?t.value=o.value[u].key:t.value=o.value[0].key)};return{panes:o,activeKey:t,onEdit:(c,u)=>{u==="add"?r():I(c)}}}});function sn(o,t,d,r,I,m){const c=p("a-tab-pane"),u=p("a-tabs"),l=p("demo-box");return i(),h(l,{jsfiddle:{us:'Only card type Tabs support adding & closable.\n+Use `:closable="false"` to disable close.',cn:'\u53EA\u6709\u5361\u7247\u6837\u5F0F\u7684\u9875\u7B7E\u652F\u6301\u65B0\u589E\u548C\u5173\u95ED\u9009\u9879\u3002\n\u4F7F\u7528 `:closable="false"` \u7981\u6B62\u5173\u95ED\u3002',docHtml:`<h2 id="zh-CN">zh-CN <a class="header-anchor" href="#zh-CN">
          <span aria-hidden="true" class="anchor">#</span>
        </a></h2>
<p>\u53EA\u6709\u5361\u7247\u6837\u5F0F\u7684\u9875\u7B7E\u652F\u6301\u65B0\u589E\u548C\u5173\u95ED\u9009\u9879\u3002
\u4F7F\u7528 <code>:closable=&quot;false&quot;</code> \u7981\u6B62\u5173\u95ED\u3002</p>
<h2 id="en-US">en-US <a class="header-anchor" href="#en-US">
          <span aria-hidden="true" class="anchor">#</span>
        </a></h2>
<p>Only card type Tabs support adding &amp; closable.
+Use <code>:closable=&quot;false&quot;</code> to disable close.</p>
`,order:8,title:{"zh-CN":"\u65B0\u589E\u548C\u5173\u95ED\u9875\u7B7E","en-US":"Add & close tab"},relativePath:"components/tabs/demo/editable-card.vue",sourceCode:"PHRlbXBsYXRlPgogIDxhLXRhYnMgdi1tb2RlbDphY3RpdmVLZXk9ImFjdGl2ZUtleSIgdHlwZT0iZWRpdGFibGUtY2FyZCIgQGVkaXQ9Im9uRWRpdCI+CiAgICA8YS10YWItcGFuZSB2LWZvcj0icGFuZSBpbiBwYW5lcyIgOmtleT0icGFuZS5rZXkiIDp0YWI9InBhbmUudGl0bGUiIDpjbG9zYWJsZT0icGFuZS5jbG9zYWJsZSI+CiAgICAgIHt7IHBhbmUuY29udGVudCB9fQogICAgPC9hLXRhYi1wYW5lPgogIDwvYS10YWJzPgo8L3RlbXBsYXRlPgo8c2NyaXB0IGxhbmc9InRzIj4KaW1wb3J0IHsgZGVmaW5lQ29tcG9uZW50LCByZWYgfSBmcm9tICd2dWUnOwoKZXhwb3J0IGRlZmF1bHQgZGVmaW5lQ29tcG9uZW50KHsKICBzZXR1cCgpIHsKICAgIGNvbnN0IHBhbmVzID0gcmVmPHsgdGl0bGU6IHN0cmluZzsgY29udGVudDogc3RyaW5nOyBrZXk6IHN0cmluZzsgY2xvc2FibGU/OiBib29sZWFuIH1bXT4oWwogICAgICB7IHRpdGxlOiAnVGFiIDEnLCBjb250ZW50OiAnQ29udGVudCBvZiBUYWIgMScsIGtleTogJzEnIH0sCiAgICAgIHsgdGl0bGU6ICdUYWIgMicsIGNvbnRlbnQ6ICdDb250ZW50IG9mIFRhYiAyJywga2V5OiAnMicgfSwKICAgICAgeyB0aXRsZTogJ1RhYiAzJywgY29udGVudDogJ0NvbnRlbnQgb2YgVGFiIDMnLCBrZXk6ICczJywgY2xvc2FibGU6IGZhbHNlIH0sCiAgICBdKTsKCiAgICBjb25zdCBhY3RpdmVLZXkgPSByZWYocGFuZXMudmFsdWVbMF0ua2V5KTsKCiAgICBjb25zdCBuZXdUYWJJbmRleCA9IHJlZigwKTsKCiAgICBjb25zdCBhZGQgPSAoKSA9PiB7CiAgICAgIGFjdGl2ZUtleS52YWx1ZSA9IGBuZXdUYWIkeysrbmV3VGFiSW5kZXgudmFsdWV9YDsKICAgICAgcGFuZXMudmFsdWUucHVzaCh7IHRpdGxlOiAnTmV3IFRhYicsIGNvbnRlbnQ6ICdDb250ZW50IG9mIG5ldyBUYWInLCBrZXk6IGFjdGl2ZUtleS52YWx1ZSB9KTsKICAgIH07CgogICAgY29uc3QgcmVtb3ZlID0gKHRhcmdldEtleTogc3RyaW5nKSA9PiB7CiAgICAgIGxldCBsYXN0SW5kZXggPSAwOwogICAgICBwYW5lcy52YWx1ZS5mb3JFYWNoKChwYW5lLCBpKSA9PiB7CiAgICAgICAgaWYgKHBhbmUua2V5ID09PSB0YXJnZXRLZXkpIHsKICAgICAgICAgIGxhc3RJbmRleCA9IGkgLSAxOwogICAgICAgIH0KICAgICAgfSk7CiAgICAgIHBhbmVzLnZhbHVlID0gcGFuZXMudmFsdWUuZmlsdGVyKHBhbmUgPT4gcGFuZS5rZXkgIT09IHRhcmdldEtleSk7CiAgICAgIGlmIChwYW5lcy52YWx1ZS5sZW5ndGggJiYgYWN0aXZlS2V5LnZhbHVlID09PSB0YXJnZXRLZXkpIHsKICAgICAgICBpZiAobGFzdEluZGV4ID49IDApIHsKICAgICAgICAgIGFjdGl2ZUtleS52YWx1ZSA9IHBhbmVzLnZhbHVlW2xhc3RJbmRleF0ua2V5OwogICAgICAgIH0gZWxzZSB7CiAgICAgICAgICBhY3RpdmVLZXkudmFsdWUgPSBwYW5lcy52YWx1ZVswXS5rZXk7CiAgICAgICAgfQogICAgICB9CiAgICB9OwoKICAgIGNvbnN0IG9uRWRpdCA9ICh0YXJnZXRLZXk6IHN0cmluZyB8IE1vdXNlRXZlbnQsIGFjdGlvbjogc3RyaW5nKSA9PiB7CiAgICAgIGlmIChhY3Rpb24gPT09ICdhZGQnKSB7CiAgICAgICAgYWRkKCk7CiAgICAgIH0gZWxzZSB7CiAgICAgICAgcmVtb3ZlKHRhcmdldEtleSBhcyBzdHJpbmcpOwogICAgICB9CiAgICB9OwoKICAgIHJldHVybiB7CiAgICAgIHBhbmVzLAogICAgICBhY3RpdmVLZXksCiAgICAgIG9uRWRpdCwKICAgIH07CiAgfSwKfSk7Cjwvc2NyaXB0PgoK",jsSourceCode:"PHRlbXBsYXRlPgogIDxhLXRhYnMgdi1tb2RlbDphY3RpdmVLZXk9ImFjdGl2ZUtleSIgdHlwZT0iZWRpdGFibGUtY2FyZCIgQGVkaXQ9Im9uRWRpdCI+CiAgICA8YS10YWItcGFuZSB2LWZvcj0icGFuZSBpbiBwYW5lcyIgOmtleT0icGFuZS5rZXkiIDp0YWI9InBhbmUudGl0bGUiIDpjbG9zYWJsZT0icGFuZS5jbG9zYWJsZSI+CiAgICAgIHt7IHBhbmUuY29udGVudCB9fQogICAgPC9hLXRhYi1wYW5lPgogIDwvYS10YWJzPgo8L3RlbXBsYXRlPgo8c2NyaXB0PgppbXBvcnQgeyBkZWZpbmVDb21wb25lbnQsIHJlZiB9IGZyb20gJ3Z1ZSc7CmV4cG9ydCBkZWZhdWx0IGRlZmluZUNvbXBvbmVudCh7CiAgc2V0dXAoKSB7CiAgICBjb25zdCBwYW5lcyA9IHJlZihbewogICAgICB0aXRsZTogJ1RhYiAxJywKICAgICAgY29udGVudDogJ0NvbnRlbnQgb2YgVGFiIDEnLAogICAgICBrZXk6ICcxJywKICAgIH0sIHsKICAgICAgdGl0bGU6ICdUYWIgMicsCiAgICAgIGNvbnRlbnQ6ICdDb250ZW50IG9mIFRhYiAyJywKICAgICAga2V5OiAnMicsCiAgICB9LCB7CiAgICAgIHRpdGxlOiAnVGFiIDMnLAogICAgICBjb250ZW50OiAnQ29udGVudCBvZiBUYWIgMycsCiAgICAgIGtleTogJzMnLAogICAgICBjbG9zYWJsZTogZmFsc2UsCiAgICB9XSk7CiAgICBjb25zdCBhY3RpdmVLZXkgPSByZWYocGFuZXMudmFsdWVbMF0ua2V5KTsKICAgIGNvbnN0IG5ld1RhYkluZGV4ID0gcmVmKDApOwogICAgY29uc3QgYWRkID0gKCkgPT4gewogICAgICBhY3RpdmVLZXkudmFsdWUgPSBgbmV3VGFiJHsrK25ld1RhYkluZGV4LnZhbHVlfWA7CiAgICAgIHBhbmVzLnZhbHVlLnB1c2goewogICAgICAgIHRpdGxlOiAnTmV3IFRhYicsCiAgICAgICAgY29udGVudDogJ0NvbnRlbnQgb2YgbmV3IFRhYicsCiAgICAgICAga2V5OiBhY3RpdmVLZXkudmFsdWUsCiAgICAgIH0pOwogICAgfTsKICAgIGNvbnN0IHJlbW92ZSA9IHRhcmdldEtleSA9PiB7CiAgICAgIGxldCBsYXN0SW5kZXggPSAwOwogICAgICBwYW5lcy52YWx1ZS5mb3JFYWNoKChwYW5lLCBpKSA9PiB7CiAgICAgICAgaWYgKHBhbmUua2V5ID09PSB0YXJnZXRLZXkpIHsKICAgICAgICAgIGxhc3RJbmRleCA9IGkgLSAxOwogICAgICAgIH0KICAgICAgfSk7CiAgICAgIHBhbmVzLnZhbHVlID0gcGFuZXMudmFsdWUuZmlsdGVyKHBhbmUgPT4gcGFuZS5rZXkgIT09IHRhcmdldEtleSk7CiAgICAgIGlmIChwYW5lcy52YWx1ZS5sZW5ndGggJiYgYWN0aXZlS2V5LnZhbHVlID09PSB0YXJnZXRLZXkpIHsKICAgICAgICBpZiAobGFzdEluZGV4ID49IDApIHsKICAgICAgICAgIGFjdGl2ZUtleS52YWx1ZSA9IHBhbmVzLnZhbHVlW2xhc3RJbmRleF0ua2V5OwogICAgICAgIH0gZWxzZSB7CiAgICAgICAgICBhY3RpdmVLZXkudmFsdWUgPSBwYW5lcy52YWx1ZVswXS5rZXk7CiAgICAgICAgfQogICAgICB9CiAgICB9OwogICAgY29uc3Qgb25FZGl0ID0gKHRhcmdldEtleSwgYWN0aW9uKSA9PiB7CiAgICAgIGlmIChhY3Rpb24gPT09ICdhZGQnKSB7CiAgICAgICAgYWRkKCk7CiAgICAgIH0gZWxzZSB7CiAgICAgICAgcmVtb3ZlKHRhcmdldEtleSk7CiAgICAgIH0KICAgIH07CiAgICByZXR1cm4gewogICAgICBwYW5lcywKICAgICAgYWN0aXZlS2V5LAogICAgICBvbkVkaXQsCiAgICB9OwogIH0sCn0pOwo8L3NjcmlwdD4="}},{default:s(()=>[e(u,{activeKey:o.activeKey,"onUpdate:activeKey":t[0]||(t[0]=k=>o.activeKey=k),type:"editable-card",onEdit:o.onEdit},{default:s(()=>[(i(!0),v(f,null,Y(o.panes,k=>(i(),h(c,{key:k.key,tab:k.title,closable:k.closable},{default:s(()=>[a(Z(k.content),1)]),_:2},1032,["tab","closable"]))),128))]),_:1},8,["activeKey","onEdit"])]),htmlCode:s(()=>t[1]||(t[1]=[n("pre",{class:"language-vue"},[n("code",null,[n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),a("template")]),n("span",{class:"token punctuation"},">")]),a(`
  `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),a("a-tabs")]),a(),n("span",{class:"token attr-name"},[n("span",{class:"token namespace"},"v-model:"),a("activeKey")]),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),a("activeKey"),n("span",{class:"token punctuation"},'"')]),a(),n("span",{class:"token attr-name"},"type"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),a("editable-card"),n("span",{class:"token punctuation"},'"')]),a(),n("span",{class:"token attr-name"},"@edit"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),a("onEdit"),n("span",{class:"token punctuation"},'"')]),n("span",{class:"token punctuation"},">")]),a(`
    `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),a("a-tab-pane")]),a(),n("span",{class:"token attr-name"},"v-for"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),a("pane in panes"),n("span",{class:"token punctuation"},'"')]),a(),n("span",{class:"token attr-name"},":key"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),a("pane.key"),n("span",{class:"token punctuation"},'"')]),a(),n("span",{class:"token attr-name"},":tab"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),a("pane.title"),n("span",{class:"token punctuation"},'"')]),a(),n("span",{class:"token attr-name"},":closable"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),a("pane.closable"),n("span",{class:"token punctuation"},'"')]),n("span",{class:"token punctuation"},">")]),a(`
      {{ pane.content }}
    `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"</"),a("a-tab-pane")]),n("span",{class:"token punctuation"},">")]),a(`
  `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"</"),a("a-tabs")]),n("span",{class:"token punctuation"},">")]),a(`
`),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"</"),a("template")]),n("span",{class:"token punctuation"},">")]),a(`
`),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),a("script")]),a(),n("span",{class:"token attr-name"},"lang"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),a("ts"),n("span",{class:"token punctuation"},'"')]),n("span",{class:"token punctuation"},">")]),n("span",{class:"token script"},[n("span",{class:"token language-javascript"},[a(`
`),n("span",{class:"token keyword"},"import"),a(),n("span",{class:"token punctuation"},"{"),a(" defineComponent"),n("span",{class:"token punctuation"},","),a(" ref "),n("span",{class:"token punctuation"},"}"),a(),n("span",{class:"token keyword"},"from"),a(),n("span",{class:"token string"},"'vue'"),n("span",{class:"token punctuation"},";"),a(`

`),n("span",{class:"token keyword"},"export"),a(),n("span",{class:"token keyword"},"default"),a(),n("span",{class:"token function"},"defineComponent"),n("span",{class:"token punctuation"},"("),n("span",{class:"token punctuation"},"{"),a(`
  `),n("span",{class:"token function"},"setup"),n("span",{class:"token punctuation"},"("),n("span",{class:"token punctuation"},")"),a(),n("span",{class:"token punctuation"},"{"),a(`
    `),n("span",{class:"token keyword"},"const"),a(" panes "),n("span",{class:"token operator"},"="),a(" ref"),n("span",{class:"token operator"},"<"),n("span",{class:"token punctuation"},"{"),a(),n("span",{class:"token literal-property property"},"title"),n("span",{class:"token operator"},":"),a(" string"),n("span",{class:"token punctuation"},";"),a(" content"),n("span",{class:"token operator"},":"),a(" string"),n("span",{class:"token punctuation"},";"),a(" key"),n("span",{class:"token operator"},":"),a(" string"),n("span",{class:"token punctuation"},";"),a(" closable"),n("span",{class:"token operator"},"?"),n("span",{class:"token operator"},":"),a(" boolean "),n("span",{class:"token punctuation"},"}"),n("span",{class:"token punctuation"},"["),n("span",{class:"token punctuation"},"]"),n("span",{class:"token operator"},">"),n("span",{class:"token punctuation"},"("),n("span",{class:"token punctuation"},"["),a(`
      `),n("span",{class:"token punctuation"},"{"),a(),n("span",{class:"token literal-property property"},"title"),n("span",{class:"token operator"},":"),a(),n("span",{class:"token string"},"'Tab 1'"),n("span",{class:"token punctuation"},","),a(),n("span",{class:"token literal-property property"},"content"),n("span",{class:"token operator"},":"),a(),n("span",{class:"token string"},"'Content of Tab 1'"),n("span",{class:"token punctuation"},","),a(),n("span",{class:"token literal-property property"},"key"),n("span",{class:"token operator"},":"),a(),n("span",{class:"token string"},"'1'"),a(),n("span",{class:"token punctuation"},"}"),n("span",{class:"token punctuation"},","),a(`
      `),n("span",{class:"token punctuation"},"{"),a(),n("span",{class:"token literal-property property"},"title"),n("span",{class:"token operator"},":"),a(),n("span",{class:"token string"},"'Tab 2'"),n("span",{class:"token punctuation"},","),a(),n("span",{class:"token literal-property property"},"content"),n("span",{class:"token operator"},":"),a(),n("span",{class:"token string"},"'Content of Tab 2'"),n("span",{class:"token punctuation"},","),a(),n("span",{class:"token literal-property property"},"key"),n("span",{class:"token operator"},":"),a(),n("span",{class:"token string"},"'2'"),a(),n("span",{class:"token punctuation"},"}"),n("span",{class:"token punctuation"},","),a(`
      `),n("span",{class:"token punctuation"},"{"),a(),n("span",{class:"token literal-property property"},"title"),n("span",{class:"token operator"},":"),a(),n("span",{class:"token string"},"'Tab 3'"),n("span",{class:"token punctuation"},","),a(),n("span",{class:"token literal-property property"},"content"),n("span",{class:"token operator"},":"),a(),n("span",{class:"token string"},"'Content of Tab 3'"),n("span",{class:"token punctuation"},","),a(),n("span",{class:"token literal-property property"},"key"),n("span",{class:"token operator"},":"),a(),n("span",{class:"token string"},"'3'"),n("span",{class:"token punctuation"},","),a(),n("span",{class:"token literal-property property"},"closable"),n("span",{class:"token operator"},":"),a(),n("span",{class:"token boolean"},"false"),a(),n("span",{class:"token punctuation"},"}"),n("span",{class:"token punctuation"},","),a(`
    `),n("span",{class:"token punctuation"},"]"),n("span",{class:"token punctuation"},")"),n("span",{class:"token punctuation"},";"),a(`

    `),n("span",{class:"token keyword"},"const"),a(" activeKey "),n("span",{class:"token operator"},"="),a(),n("span",{class:"token function"},"ref"),n("span",{class:"token punctuation"},"("),a("panes"),n("span",{class:"token punctuation"},"."),a("value"),n("span",{class:"token punctuation"},"["),n("span",{class:"token number"},"0"),n("span",{class:"token punctuation"},"]"),n("span",{class:"token punctuation"},"."),a("key"),n("span",{class:"token punctuation"},")"),n("span",{class:"token punctuation"},";"),a(`

    `),n("span",{class:"token keyword"},"const"),a(" newTabIndex "),n("span",{class:"token operator"},"="),a(),n("span",{class:"token function"},"ref"),n("span",{class:"token punctuation"},"("),n("span",{class:"token number"},"0"),n("span",{class:"token punctuation"},")"),n("span",{class:"token punctuation"},";"),a(`

    `),n("span",{class:"token keyword"},"const"),a(),n("span",{class:"token function-variable function"},"add"),a(),n("span",{class:"token operator"},"="),a(),n("span",{class:"token punctuation"},"("),n("span",{class:"token punctuation"},")"),a(),n("span",{class:"token operator"},"=>"),a(),n("span",{class:"token punctuation"},"{"),a(`
      activeKey`),n("span",{class:"token punctuation"},"."),a("value "),n("span",{class:"token operator"},"="),a(),n("span",{class:"token template-string"},[n("span",{class:"token template-punctuation string"},"`"),n("span",{class:"token string"},"newTab"),n("span",{class:"token interpolation"},[n("span",{class:"token interpolation-punctuation punctuation"},"${"),n("span",{class:"token operator"},"++"),a("newTabIndex"),n("span",{class:"token punctuation"},"."),a("value"),n("span",{class:"token interpolation-punctuation punctuation"},"}")]),n("span",{class:"token template-punctuation string"},"`")]),n("span",{class:"token punctuation"},";"),a(`
      panes`),n("span",{class:"token punctuation"},"."),a("value"),n("span",{class:"token punctuation"},"."),n("span",{class:"token function"},"push"),n("span",{class:"token punctuation"},"("),n("span",{class:"token punctuation"},"{"),a(),n("span",{class:"token literal-property property"},"title"),n("span",{class:"token operator"},":"),a(),n("span",{class:"token string"},"'New Tab'"),n("span",{class:"token punctuation"},","),a(),n("span",{class:"token literal-property property"},"content"),n("span",{class:"token operator"},":"),a(),n("span",{class:"token string"},"'Content of new Tab'"),n("span",{class:"token punctuation"},","),a(),n("span",{class:"token literal-property property"},"key"),n("span",{class:"token operator"},":"),a(" activeKey"),n("span",{class:"token punctuation"},"."),a("value "),n("span",{class:"token punctuation"},"}"),n("span",{class:"token punctuation"},")"),n("span",{class:"token punctuation"},";"),a(`
    `),n("span",{class:"token punctuation"},"}"),n("span",{class:"token punctuation"},";"),a(`

    `),n("span",{class:"token keyword"},"const"),a(),n("span",{class:"token function-variable function"},"remove"),a(),n("span",{class:"token operator"},"="),a(),n("span",{class:"token punctuation"},"("),n("span",{class:"token parameter"},[n("span",{class:"token literal-property property"},"targetKey"),n("span",{class:"token operator"},":"),a(" string")]),n("span",{class:"token punctuation"},")"),a(),n("span",{class:"token operator"},"=>"),a(),n("span",{class:"token punctuation"},"{"),a(`
      `),n("span",{class:"token keyword"},"let"),a(" lastIndex "),n("span",{class:"token operator"},"="),a(),n("span",{class:"token number"},"0"),n("span",{class:"token punctuation"},";"),a(`
      panes`),n("span",{class:"token punctuation"},"."),a("value"),n("span",{class:"token punctuation"},"."),n("span",{class:"token function"},"forEach"),n("span",{class:"token punctuation"},"("),n("span",{class:"token punctuation"},"("),n("span",{class:"token parameter"},[a("pane"),n("span",{class:"token punctuation"},","),a(" i")]),n("span",{class:"token punctuation"},")"),a(),n("span",{class:"token operator"},"=>"),a(),n("span",{class:"token punctuation"},"{"),a(`
        `),n("span",{class:"token keyword"},"if"),a(),n("span",{class:"token punctuation"},"("),a("pane"),n("span",{class:"token punctuation"},"."),a("key "),n("span",{class:"token operator"},"==="),a(" targetKey"),n("span",{class:"token punctuation"},")"),a(),n("span",{class:"token punctuation"},"{"),a(`
          lastIndex `),n("span",{class:"token operator"},"="),a(" i "),n("span",{class:"token operator"},"-"),a(),n("span",{class:"token number"},"1"),n("span",{class:"token punctuation"},";"),a(`
        `),n("span",{class:"token punctuation"},"}"),a(`
      `),n("span",{class:"token punctuation"},"}"),n("span",{class:"token punctuation"},")"),n("span",{class:"token punctuation"},";"),a(`
      panes`),n("span",{class:"token punctuation"},"."),a("value "),n("span",{class:"token operator"},"="),a(" panes"),n("span",{class:"token punctuation"},"."),a("value"),n("span",{class:"token punctuation"},"."),n("span",{class:"token function"},"filter"),n("span",{class:"token punctuation"},"("),n("span",{class:"token parameter"},"pane"),a(),n("span",{class:"token operator"},"=>"),a(" pane"),n("span",{class:"token punctuation"},"."),a("key "),n("span",{class:"token operator"},"!=="),a(" targetKey"),n("span",{class:"token punctuation"},")"),n("span",{class:"token punctuation"},";"),a(`
      `),n("span",{class:"token keyword"},"if"),a(),n("span",{class:"token punctuation"},"("),a("panes"),n("span",{class:"token punctuation"},"."),a("value"),n("span",{class:"token punctuation"},"."),a("length "),n("span",{class:"token operator"},"&&"),a(" activeKey"),n("span",{class:"token punctuation"},"."),a("value "),n("span",{class:"token operator"},"==="),a(" targetKey"),n("span",{class:"token punctuation"},")"),a(),n("span",{class:"token punctuation"},"{"),a(`
        `),n("span",{class:"token keyword"},"if"),a(),n("span",{class:"token punctuation"},"("),a("lastIndex "),n("span",{class:"token operator"},">="),a(),n("span",{class:"token number"},"0"),n("span",{class:"token punctuation"},")"),a(),n("span",{class:"token punctuation"},"{"),a(`
          activeKey`),n("span",{class:"token punctuation"},"."),a("value "),n("span",{class:"token operator"},"="),a(" panes"),n("span",{class:"token punctuation"},"."),a("value"),n("span",{class:"token punctuation"},"["),a("lastIndex"),n("span",{class:"token punctuation"},"]"),n("span",{class:"token punctuation"},"."),a("key"),n("span",{class:"token punctuation"},";"),a(`
        `),n("span",{class:"token punctuation"},"}"),a(),n("span",{class:"token keyword"},"else"),a(),n("span",{class:"token punctuation"},"{"),a(`
          activeKey`),n("span",{class:"token punctuation"},"."),a("value "),n("span",{class:"token operator"},"="),a(" panes"),n("span",{class:"token punctuation"},"."),a("value"),n("span",{class:"token punctuation"},"["),n("span",{class:"token number"},"0"),n("span",{class:"token punctuation"},"]"),n("span",{class:"token punctuation"},"."),a("key"),n("span",{class:"token punctuation"},";"),a(`
        `),n("span",{class:"token punctuation"},"}"),a(`
      `),n("span",{class:"token punctuation"},"}"),a(`
    `),n("span",{class:"token punctuation"},"}"),n("span",{class:"token punctuation"},";"),a(`

    `),n("span",{class:"token keyword"},"const"),a(),n("span",{class:"token function-variable function"},"onEdit"),a(),n("span",{class:"token operator"},"="),a(),n("span",{class:"token punctuation"},"("),n("span",{class:"token parameter"},[n("span",{class:"token literal-property property"},"targetKey"),n("span",{class:"token operator"},":"),a(" string "),n("span",{class:"token operator"},"|"),a(" MouseEvent"),n("span",{class:"token punctuation"},","),a(),n("span",{class:"token literal-property property"},"action"),n("span",{class:"token operator"},":"),a(" string")]),n("span",{class:"token punctuation"},")"),a(),n("span",{class:"token operator"},"=>"),a(),n("span",{class:"token punctuation"},"{"),a(`
      `),n("span",{class:"token keyword"},"if"),a(),n("span",{class:"token punctuation"},"("),a("action "),n("span",{class:"token operator"},"==="),a(),n("span",{class:"token string"},"'add'"),n("span",{class:"token punctuation"},")"),a(),n("span",{class:"token punctuation"},"{"),a(`
        `),n("span",{class:"token function"},"add"),n("span",{class:"token punctuation"},"("),n("span",{class:"token punctuation"},")"),n("span",{class:"token punctuation"},";"),a(`
      `),n("span",{class:"token punctuation"},"}"),a(),n("span",{class:"token keyword"},"else"),a(),n("span",{class:"token punctuation"},"{"),a(`
        `),n("span",{class:"token function"},"remove"),n("span",{class:"token punctuation"},"("),a("targetKey "),n("span",{class:"token keyword"},"as"),a(" string"),n("span",{class:"token punctuation"},")"),n("span",{class:"token punctuation"},";"),a(`
      `),n("span",{class:"token punctuation"},"}"),a(`
    `),n("span",{class:"token punctuation"},"}"),n("span",{class:"token punctuation"},";"),a(`

    `),n("span",{class:"token keyword"},"return"),a(),n("span",{class:"token punctuation"},"{"),a(`
      panes`),n("span",{class:"token punctuation"},","),a(`
      activeKey`),n("span",{class:"token punctuation"},","),a(`
      onEdit`),n("span",{class:"token punctuation"},","),a(`
    `),n("span",{class:"token punctuation"},"}"),n("span",{class:"token punctuation"},";"),a(`
  `),n("span",{class:"token punctuation"},"}"),n("span",{class:"token punctuation"},","),a(`
`),n("span",{class:"token punctuation"},"}"),n("span",{class:"token punctuation"},")"),n("span",{class:"token punctuation"},";"),a(`
`)])]),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"</"),a("script")]),n("span",{class:"token punctuation"},">")]),a(`
`)])],-1)])),jsVersionHtml:s(()=>t[2]||(t[2]=[n("pre",{class:"language-vue"},[n("code",null,[n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),a("template")]),n("span",{class:"token punctuation"},">")]),a(`
  `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),a("a-tabs")]),a(),n("span",{class:"token attr-name"},[n("span",{class:"token namespace"},"v-model:"),a("activeKey")]),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),a("activeKey"),n("span",{class:"token punctuation"},'"')]),a(),n("span",{class:"token attr-name"},"type"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),a("editable-card"),n("span",{class:"token punctuation"},'"')]),a(),n("span",{class:"token attr-name"},"@edit"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),a("onEdit"),n("span",{class:"token punctuation"},'"')]),n("span",{class:"token punctuation"},">")]),a(`
    `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),a("a-tab-pane")]),a(),n("span",{class:"token attr-name"},"v-for"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),a("pane in panes"),n("span",{class:"token punctuation"},'"')]),a(),n("span",{class:"token attr-name"},":key"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),a("pane.key"),n("span",{class:"token punctuation"},'"')]),a(),n("span",{class:"token attr-name"},":tab"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),a("pane.title"),n("span",{class:"token punctuation"},'"')]),a(),n("span",{class:"token attr-name"},":closable"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),a("pane.closable"),n("span",{class:"token punctuation"},'"')]),n("span",{class:"token punctuation"},">")]),a(`
      {{ pane.content }}
    `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"</"),a("a-tab-pane")]),n("span",{class:"token punctuation"},">")]),a(`
  `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"</"),a("a-tabs")]),n("span",{class:"token punctuation"},">")]),a(`
`),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"</"),a("template")]),n("span",{class:"token punctuation"},">")]),a(`
`),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),a("script")]),n("span",{class:"token punctuation"},">")]),n("span",{class:"token script"},[n("span",{class:"token language-javascript"},[a(`
`),n("span",{class:"token keyword"},"import"),a(),n("span",{class:"token punctuation"},"{"),a(" defineComponent"),n("span",{class:"token punctuation"},","),a(" ref "),n("span",{class:"token punctuation"},"}"),a(),n("span",{class:"token keyword"},"from"),a(),n("span",{class:"token string"},"'vue'"),n("span",{class:"token punctuation"},";"),a(`
`),n("span",{class:"token keyword"},"export"),a(),n("span",{class:"token keyword"},"default"),a(),n("span",{class:"token function"},"defineComponent"),n("span",{class:"token punctuation"},"("),n("span",{class:"token punctuation"},"{"),a(`
  `),n("span",{class:"token function"},"setup"),n("span",{class:"token punctuation"},"("),n("span",{class:"token punctuation"},")"),a(),n("span",{class:"token punctuation"},"{"),a(`
    `),n("span",{class:"token keyword"},"const"),a(" panes "),n("span",{class:"token operator"},"="),a(),n("span",{class:"token function"},"ref"),n("span",{class:"token punctuation"},"("),n("span",{class:"token punctuation"},"["),n("span",{class:"token punctuation"},"{"),a(`
      `),n("span",{class:"token literal-property property"},"title"),n("span",{class:"token operator"},":"),a(),n("span",{class:"token string"},"'Tab 1'"),n("span",{class:"token punctuation"},","),a(`
      `),n("span",{class:"token literal-property property"},"content"),n("span",{class:"token operator"},":"),a(),n("span",{class:"token string"},"'Content of Tab 1'"),n("span",{class:"token punctuation"},","),a(`
      `),n("span",{class:"token literal-property property"},"key"),n("span",{class:"token operator"},":"),a(),n("span",{class:"token string"},"'1'"),n("span",{class:"token punctuation"},","),a(`
    `),n("span",{class:"token punctuation"},"}"),n("span",{class:"token punctuation"},","),a(),n("span",{class:"token punctuation"},"{"),a(`
      `),n("span",{class:"token literal-property property"},"title"),n("span",{class:"token operator"},":"),a(),n("span",{class:"token string"},"'Tab 2'"),n("span",{class:"token punctuation"},","),a(`
      `),n("span",{class:"token literal-property property"},"content"),n("span",{class:"token operator"},":"),a(),n("span",{class:"token string"},"'Content of Tab 2'"),n("span",{class:"token punctuation"},","),a(`
      `),n("span",{class:"token literal-property property"},"key"),n("span",{class:"token operator"},":"),a(),n("span",{class:"token string"},"'2'"),n("span",{class:"token punctuation"},","),a(`
    `),n("span",{class:"token punctuation"},"}"),n("span",{class:"token punctuation"},","),a(),n("span",{class:"token punctuation"},"{"),a(`
      `),n("span",{class:"token literal-property property"},"title"),n("span",{class:"token operator"},":"),a(),n("span",{class:"token string"},"'Tab 3'"),n("span",{class:"token punctuation"},","),a(`
      `),n("span",{class:"token literal-property property"},"content"),n("span",{class:"token operator"},":"),a(),n("span",{class:"token string"},"'Content of Tab 3'"),n("span",{class:"token punctuation"},","),a(`
      `),n("span",{class:"token literal-property property"},"key"),n("span",{class:"token operator"},":"),a(),n("span",{class:"token string"},"'3'"),n("span",{class:"token punctuation"},","),a(`
      `),n("span",{class:"token literal-property property"},"closable"),n("span",{class:"token operator"},":"),a(),n("span",{class:"token boolean"},"false"),n("span",{class:"token punctuation"},","),a(`
    `),n("span",{class:"token punctuation"},"}"),n("span",{class:"token punctuation"},"]"),n("span",{class:"token punctuation"},")"),n("span",{class:"token punctuation"},";"),a(`
    `),n("span",{class:"token keyword"},"const"),a(" activeKey "),n("span",{class:"token operator"},"="),a(),n("span",{class:"token function"},"ref"),n("span",{class:"token punctuation"},"("),a("panes"),n("span",{class:"token punctuation"},"."),a("value"),n("span",{class:"token punctuation"},"["),n("span",{class:"token number"},"0"),n("span",{class:"token punctuation"},"]"),n("span",{class:"token punctuation"},"."),a("key"),n("span",{class:"token punctuation"},")"),n("span",{class:"token punctuation"},";"),a(`
    `),n("span",{class:"token keyword"},"const"),a(" newTabIndex "),n("span",{class:"token operator"},"="),a(),n("span",{class:"token function"},"ref"),n("span",{class:"token punctuation"},"("),n("span",{class:"token number"},"0"),n("span",{class:"token punctuation"},")"),n("span",{class:"token punctuation"},";"),a(`
    `),n("span",{class:"token keyword"},"const"),a(),n("span",{class:"token function-variable function"},"add"),a(),n("span",{class:"token operator"},"="),a(),n("span",{class:"token punctuation"},"("),n("span",{class:"token punctuation"},")"),a(),n("span",{class:"token operator"},"=>"),a(),n("span",{class:"token punctuation"},"{"),a(`
      activeKey`),n("span",{class:"token punctuation"},"."),a("value "),n("span",{class:"token operator"},"="),a(),n("span",{class:"token template-string"},[n("span",{class:"token template-punctuation string"},"`"),n("span",{class:"token string"},"newTab"),n("span",{class:"token interpolation"},[n("span",{class:"token interpolation-punctuation punctuation"},"${"),n("span",{class:"token operator"},"++"),a("newTabIndex"),n("span",{class:"token punctuation"},"."),a("value"),n("span",{class:"token interpolation-punctuation punctuation"},"}")]),n("span",{class:"token template-punctuation string"},"`")]),n("span",{class:"token punctuation"},";"),a(`
      panes`),n("span",{class:"token punctuation"},"."),a("value"),n("span",{class:"token punctuation"},"."),n("span",{class:"token function"},"push"),n("span",{class:"token punctuation"},"("),n("span",{class:"token punctuation"},"{"),a(`
        `),n("span",{class:"token literal-property property"},"title"),n("span",{class:"token operator"},":"),a(),n("span",{class:"token string"},"'New Tab'"),n("span",{class:"token punctuation"},","),a(`
        `),n("span",{class:"token literal-property property"},"content"),n("span",{class:"token operator"},":"),a(),n("span",{class:"token string"},"'Content of new Tab'"),n("span",{class:"token punctuation"},","),a(`
        `),n("span",{class:"token literal-property property"},"key"),n("span",{class:"token operator"},":"),a(" activeKey"),n("span",{class:"token punctuation"},"."),a("value"),n("span",{class:"token punctuation"},","),a(`
      `),n("span",{class:"token punctuation"},"}"),n("span",{class:"token punctuation"},")"),n("span",{class:"token punctuation"},";"),a(`
    `),n("span",{class:"token punctuation"},"}"),n("span",{class:"token punctuation"},";"),a(`
    `),n("span",{class:"token keyword"},"const"),a(),n("span",{class:"token function-variable function"},"remove"),a(),n("span",{class:"token operator"},"="),a(),n("span",{class:"token parameter"},"targetKey"),a(),n("span",{class:"token operator"},"=>"),a(),n("span",{class:"token punctuation"},"{"),a(`
      `),n("span",{class:"token keyword"},"let"),a(" lastIndex "),n("span",{class:"token operator"},"="),a(),n("span",{class:"token number"},"0"),n("span",{class:"token punctuation"},";"),a(`
      panes`),n("span",{class:"token punctuation"},"."),a("value"),n("span",{class:"token punctuation"},"."),n("span",{class:"token function"},"forEach"),n("span",{class:"token punctuation"},"("),n("span",{class:"token punctuation"},"("),n("span",{class:"token parameter"},[a("pane"),n("span",{class:"token punctuation"},","),a(" i")]),n("span",{class:"token punctuation"},")"),a(),n("span",{class:"token operator"},"=>"),a(),n("span",{class:"token punctuation"},"{"),a(`
        `),n("span",{class:"token keyword"},"if"),a(),n("span",{class:"token punctuation"},"("),a("pane"),n("span",{class:"token punctuation"},"."),a("key "),n("span",{class:"token operator"},"==="),a(" targetKey"),n("span",{class:"token punctuation"},")"),a(),n("span",{class:"token punctuation"},"{"),a(`
          lastIndex `),n("span",{class:"token operator"},"="),a(" i "),n("span",{class:"token operator"},"-"),a(),n("span",{class:"token number"},"1"),n("span",{class:"token punctuation"},";"),a(`
        `),n("span",{class:"token punctuation"},"}"),a(`
      `),n("span",{class:"token punctuation"},"}"),n("span",{class:"token punctuation"},")"),n("span",{class:"token punctuation"},";"),a(`
      panes`),n("span",{class:"token punctuation"},"."),a("value "),n("span",{class:"token operator"},"="),a(" panes"),n("span",{class:"token punctuation"},"."),a("value"),n("span",{class:"token punctuation"},"."),n("span",{class:"token function"},"filter"),n("span",{class:"token punctuation"},"("),n("span",{class:"token parameter"},"pane"),a(),n("span",{class:"token operator"},"=>"),a(" pane"),n("span",{class:"token punctuation"},"."),a("key "),n("span",{class:"token operator"},"!=="),a(" targetKey"),n("span",{class:"token punctuation"},")"),n("span",{class:"token punctuation"},";"),a(`
      `),n("span",{class:"token keyword"},"if"),a(),n("span",{class:"token punctuation"},"("),a("panes"),n("span",{class:"token punctuation"},"."),a("value"),n("span",{class:"token punctuation"},"."),a("length "),n("span",{class:"token operator"},"&&"),a(" activeKey"),n("span",{class:"token punctuation"},"."),a("value "),n("span",{class:"token operator"},"==="),a(" targetKey"),n("span",{class:"token punctuation"},")"),a(),n("span",{class:"token punctuation"},"{"),a(`
        `),n("span",{class:"token keyword"},"if"),a(),n("span",{class:"token punctuation"},"("),a("lastIndex "),n("span",{class:"token operator"},">="),a(),n("span",{class:"token number"},"0"),n("span",{class:"token punctuation"},")"),a(),n("span",{class:"token punctuation"},"{"),a(`
          activeKey`),n("span",{class:"token punctuation"},"."),a("value "),n("span",{class:"token operator"},"="),a(" panes"),n("span",{class:"token punctuation"},"."),a("value"),n("span",{class:"token punctuation"},"["),a("lastIndex"),n("span",{class:"token punctuation"},"]"),n("span",{class:"token punctuation"},"."),a("key"),n("span",{class:"token punctuation"},";"),a(`
        `),n("span",{class:"token punctuation"},"}"),a(),n("span",{class:"token keyword"},"else"),a(),n("span",{class:"token punctuation"},"{"),a(`
          activeKey`),n("span",{class:"token punctuation"},"."),a("value "),n("span",{class:"token operator"},"="),a(" panes"),n("span",{class:"token punctuation"},"."),a("value"),n("span",{class:"token punctuation"},"["),n("span",{class:"token number"},"0"),n("span",{class:"token punctuation"},"]"),n("span",{class:"token punctuation"},"."),a("key"),n("span",{class:"token punctuation"},";"),a(`
        `),n("span",{class:"token punctuation"},"}"),a(`
      `),n("span",{class:"token punctuation"},"}"),a(`
    `),n("span",{class:"token punctuation"},"}"),n("span",{class:"token punctuation"},";"),a(`
    `),n("span",{class:"token keyword"},"const"),a(),n("span",{class:"token function-variable function"},"onEdit"),a(),n("span",{class:"token operator"},"="),a(),n("span",{class:"token punctuation"},"("),n("span",{class:"token parameter"},[a("targetKey"),n("span",{class:"token punctuation"},","),a(" action")]),n("span",{class:"token punctuation"},")"),a(),n("span",{class:"token operator"},"=>"),a(),n("span",{class:"token punctuation"},"{"),a(`
      `),n("span",{class:"token keyword"},"if"),a(),n("span",{class:"token punctuation"},"("),a("action "),n("span",{class:"token operator"},"==="),a(),n("span",{class:"token string"},"'add'"),n("span",{class:"token punctuation"},")"),a(),n("span",{class:"token punctuation"},"{"),a(`
        `),n("span",{class:"token function"},"add"),n("span",{class:"token punctuation"},"("),n("span",{class:"token punctuation"},")"),n("span",{class:"token punctuation"},";"),a(`
      `),n("span",{class:"token punctuation"},"}"),a(),n("span",{class:"token keyword"},"else"),a(),n("span",{class:"token punctuation"},"{"),a(`
        `),n("span",{class:"token function"},"remove"),n("span",{class:"token punctuation"},"("),a("targetKey"),n("span",{class:"token punctuation"},")"),n("span",{class:"token punctuation"},";"),a(`
      `),n("span",{class:"token punctuation"},"}"),a(`
    `),n("span",{class:"token punctuation"},"}"),n("span",{class:"token punctuation"},";"),a(`
    `),n("span",{class:"token keyword"},"return"),a(),n("span",{class:"token punctuation"},"{"),a(`
      panes`),n("span",{class:"token punctuation"},","),a(`
      activeKey`),n("span",{class:"token punctuation"},","),a(`
      onEdit`),n("span",{class:"token punctuation"},","),a(`
    `),n("span",{class:"token punctuation"},"}"),n("span",{class:"token punctuation"},";"),a(`
  `),n("span",{class:"token punctuation"},"}"),n("span",{class:"token punctuation"},","),a(`
`),n("span",{class:"token punctuation"},"}"),n("span",{class:"token punctuation"},")"),n("span",{class:"token punctuation"},";"),a(`
`)])]),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"</"),a("script")]),n("span",{class:"token punctuation"},">")]),a(`
`)])],-1)])),_:1})}const on=y(tn,[["render",sn]]),en=A({setup(){return{activeKey:b("1")}}});function pn(o,t,d,r,I,m){const c=p("a-tab-pane"),u=p("a-button"),l=p("a-tabs"),k=p("demo-box");return i(),h(k,{jsfiddle:{us:"You can add extra actions to the right of Tabs.",cn:"\u53EF\u4EE5\u5728\u9875\u7B7E\u53F3\u8FB9\u6DFB\u52A0\u9644\u52A0\u64CD\u4F5C\u3002",docHtml:`<h2 id="zh-CN">zh-CN <a class="header-anchor" href="#zh-CN">
          <span aria-hidden="true" class="anchor">#</span>
        </a></h2>
<p>\u53EF\u4EE5\u5728\u9875\u7B7E\u53F3\u8FB9\u6DFB\u52A0\u9644\u52A0\u64CD\u4F5C\u3002</p>
<h2 id="en-US">en-US <a class="header-anchor" href="#en-US">
          <span aria-hidden="true" class="anchor">#</span>
        </a></h2>
<p>You can add extra actions to the right of Tabs.</p>
`,order:4,title:{"zh-CN":"\u9644\u52A0\u5185\u5BB9","en-US":"Extra Content"},relativePath:"components/tabs/demo/extra.vue",sourceCode:"PHRlbXBsYXRlPgogIDxhLXRhYnMgdi1tb2RlbDphY3RpdmVLZXk9ImFjdGl2ZUtleSI+CiAgICA8YS10YWItcGFuZSBrZXk9IjEiIHRhYj0iVGFiIDEiPkNvbnRlbnQgb2YgdGFiIDE8L2EtdGFiLXBhbmU+CiAgICA8YS10YWItcGFuZSBrZXk9IjIiIHRhYj0iVGFiIDIiPkNvbnRlbnQgb2YgdGFiIDI8L2EtdGFiLXBhbmU+CiAgICA8YS10YWItcGFuZSBrZXk9IjMiIHRhYj0iVGFiIDMiPkNvbnRlbnQgb2YgdGFiIDM8L2EtdGFiLXBhbmU+CiAgICA8dGVtcGxhdGUgI2xlZnRFeHRyYT4KICAgICAgPGEtYnV0dG9uIGNsYXNzPSJ0YWJzLWV4dHJhLWRlbW8tYnV0dG9uIj5MZWZ0IEV4dHJhIEFjdGlvbjwvYS1idXR0b24+CiAgICA8L3RlbXBsYXRlPgogICAgPHRlbXBsYXRlICNyaWdodEV4dHJhPgogICAgICA8YS1idXR0b24+UmlnaHQgRXh0cmEgQWN0aW9uPC9hLWJ1dHRvbj4KICAgIDwvdGVtcGxhdGU+CiAgPC9hLXRhYnM+CjwvdGVtcGxhdGU+CjxzY3JpcHQgbGFuZz0idHMiPgppbXBvcnQgeyBkZWZpbmVDb21wb25lbnQsIHJlZiB9IGZyb20gJ3Z1ZSc7CgpleHBvcnQgZGVmYXVsdCBkZWZpbmVDb21wb25lbnQoewogIHNldHVwKCkgewogICAgcmV0dXJuIHsKICAgICAgYWN0aXZlS2V5OiByZWYoJzEnKSwKICAgIH07CiAgfSwKfSk7Cjwvc2NyaXB0Pgo8c3R5bGU+Ci50YWJzLWV4dHJhLWRlbW8tYnV0dG9uIHsKICBtYXJnaW4tcmlnaHQ6IDE2cHg7Cn0KCi5hbnQtcm93LXJ0bCAudGFicy1leHRyYS1kZW1vLWJ1dHRvbiB7CiAgbWFyZ2luLXJpZ2h0OiAwOwogIG1hcmdpbi1sZWZ0OiAxNnB4Owp9Cjwvc3R5bGU+Cg==",jsSourceCode:"PHRlbXBsYXRlPgogIDxhLXRhYnMgdi1tb2RlbDphY3RpdmVLZXk9ImFjdGl2ZUtleSI+CiAgICA8YS10YWItcGFuZSBrZXk9IjEiIHRhYj0iVGFiIDEiPkNvbnRlbnQgb2YgdGFiIDE8L2EtdGFiLXBhbmU+CiAgICA8YS10YWItcGFuZSBrZXk9IjIiIHRhYj0iVGFiIDIiPkNvbnRlbnQgb2YgdGFiIDI8L2EtdGFiLXBhbmU+CiAgICA8YS10YWItcGFuZSBrZXk9IjMiIHRhYj0iVGFiIDMiPkNvbnRlbnQgb2YgdGFiIDM8L2EtdGFiLXBhbmU+CiAgICA8dGVtcGxhdGUgI2xlZnRFeHRyYT4KICAgICAgPGEtYnV0dG9uIGNsYXNzPSJ0YWJzLWV4dHJhLWRlbW8tYnV0dG9uIj5MZWZ0IEV4dHJhIEFjdGlvbjwvYS1idXR0b24+CiAgICA8L3RlbXBsYXRlPgogICAgPHRlbXBsYXRlICNyaWdodEV4dHJhPgogICAgICA8YS1idXR0b24+UmlnaHQgRXh0cmEgQWN0aW9uPC9hLWJ1dHRvbj4KICAgIDwvdGVtcGxhdGU+CiAgPC9hLXRhYnM+CjwvdGVtcGxhdGU+CjxzY3JpcHQ+CmltcG9ydCB7IGRlZmluZUNvbXBvbmVudCwgcmVmIH0gZnJvbSAndnVlJzsKZXhwb3J0IGRlZmF1bHQgZGVmaW5lQ29tcG9uZW50KHsKICBzZXR1cCgpIHsKICAgIHJldHVybiB7CiAgICAgIGFjdGl2ZUtleTogcmVmKCcxJyksCiAgICB9OwogIH0sCn0pOwo8L3NjcmlwdD4KPHN0eWxlPgoudGFicy1leHRyYS1kZW1vLWJ1dHRvbiB7CiAgbWFyZ2luLXJpZ2h0OiAxNnB4Owp9CgouYW50LXJvdy1ydGwgLnRhYnMtZXh0cmEtZGVtby1idXR0b24gewogIG1hcmdpbi1yaWdodDogMDsKICBtYXJnaW4tbGVmdDogMTZweDsKfQo8L3N0eWxlPg=="}},{default:s(()=>[e(l,{activeKey:o.activeKey,"onUpdate:activeKey":t[0]||(t[0]=g=>o.activeKey=g)},{leftExtra:s(()=>[e(u,{class:"tabs-extra-demo-button"},{default:s(()=>t[4]||(t[4]=[a("Left Extra Action")])),_:1,__:[4]})]),rightExtra:s(()=>[e(u,null,{default:s(()=>t[5]||(t[5]=[a("Right Extra Action")])),_:1,__:[5]})]),default:s(()=>[e(c,{key:"1",tab:"Tab 1"},{default:s(()=>t[1]||(t[1]=[a("Content of tab 1")])),_:1,__:[1]}),e(c,{key:"2",tab:"Tab 2"},{default:s(()=>t[2]||(t[2]=[a("Content of tab 2")])),_:1,__:[2]}),e(c,{key:"3",tab:"Tab 3"},{default:s(()=>t[3]||(t[3]=[a("Content of tab 3")])),_:1,__:[3]})]),_:1},8,["activeKey"])]),htmlCode:s(()=>t[6]||(t[6]=[n("pre",{class:"language-vue"},[n("code",null,[n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),a("template")]),n("span",{class:"token punctuation"},">")]),a(`
  `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),a("a-tabs")]),a(),n("span",{class:"token attr-name"},[n("span",{class:"token namespace"},"v-model:"),a("activeKey")]),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),a("activeKey"),n("span",{class:"token punctuation"},'"')]),n("span",{class:"token punctuation"},">")]),a(`
    `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),a("a-tab-pane")]),a(),n("span",{class:"token attr-name"},"key"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),a("1"),n("span",{class:"token punctuation"},'"')]),a(),n("span",{class:"token attr-name"},"tab"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),a("Tab 1"),n("span",{class:"token punctuation"},'"')]),n("span",{class:"token punctuation"},">")]),a("Content of tab 1"),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"</"),a("a-tab-pane")]),n("span",{class:"token punctuation"},">")]),a(`
    `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),a("a-tab-pane")]),a(),n("span",{class:"token attr-name"},"key"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),a("2"),n("span",{class:"token punctuation"},'"')]),a(),n("span",{class:"token attr-name"},"tab"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),a("Tab 2"),n("span",{class:"token punctuation"},'"')]),n("span",{class:"token punctuation"},">")]),a("Content of tab 2"),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"</"),a("a-tab-pane")]),n("span",{class:"token punctuation"},">")]),a(`
    `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),a("a-tab-pane")]),a(),n("span",{class:"token attr-name"},"key"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),a("3"),n("span",{class:"token punctuation"},'"')]),a(),n("span",{class:"token attr-name"},"tab"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),a("Tab 3"),n("span",{class:"token punctuation"},'"')]),n("span",{class:"token punctuation"},">")]),a("Content of tab 3"),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"</"),a("a-tab-pane")]),n("span",{class:"token punctuation"},">")]),a(`
    `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),a("template")]),a(),n("span",{class:"token attr-name"},"#leftExtra"),n("span",{class:"token punctuation"},">")]),a(`
      `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),a("a-button")]),a(),n("span",{class:"token attr-name"},"class"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),a("tabs-extra-demo-button"),n("span",{class:"token punctuation"},'"')]),n("span",{class:"token punctuation"},">")]),a("Left Extra Action"),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"</"),a("a-button")]),n("span",{class:"token punctuation"},">")]),a(`
    `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"</"),a("template")]),n("span",{class:"token punctuation"},">")]),a(`
    `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),a("template")]),a(),n("span",{class:"token attr-name"},"#rightExtra"),n("span",{class:"token punctuation"},">")]),a(`
      `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),a("a-button")]),n("span",{class:"token punctuation"},">")]),a("Right Extra Action"),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"</"),a("a-button")]),n("span",{class:"token punctuation"},">")]),a(`
    `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"</"),a("template")]),n("span",{class:"token punctuation"},">")]),a(`
  `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"</"),a("a-tabs")]),n("span",{class:"token punctuation"},">")]),a(`
`),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"</"),a("template")]),n("span",{class:"token punctuation"},">")]),a(`
`),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),a("script")]),a(),n("span",{class:"token attr-name"},"lang"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),a("ts"),n("span",{class:"token punctuation"},'"')]),n("span",{class:"token punctuation"},">")]),n("span",{class:"token script"},[n("span",{class:"token language-javascript"},[a(`
`),n("span",{class:"token keyword"},"import"),a(),n("span",{class:"token punctuation"},"{"),a(" defineComponent"),n("span",{class:"token punctuation"},","),a(" ref "),n("span",{class:"token punctuation"},"}"),a(),n("span",{class:"token keyword"},"from"),a(),n("span",{class:"token string"},"'vue'"),n("span",{class:"token punctuation"},";"),a(`

`),n("span",{class:"token keyword"},"export"),a(),n("span",{class:"token keyword"},"default"),a(),n("span",{class:"token function"},"defineComponent"),n("span",{class:"token punctuation"},"("),n("span",{class:"token punctuation"},"{"),a(`
  `),n("span",{class:"token function"},"setup"),n("span",{class:"token punctuation"},"("),n("span",{class:"token punctuation"},")"),a(),n("span",{class:"token punctuation"},"{"),a(`
    `),n("span",{class:"token keyword"},"return"),a(),n("span",{class:"token punctuation"},"{"),a(`
      `),n("span",{class:"token literal-property property"},"activeKey"),n("span",{class:"token operator"},":"),a(),n("span",{class:"token function"},"ref"),n("span",{class:"token punctuation"},"("),n("span",{class:"token string"},"'1'"),n("span",{class:"token punctuation"},")"),n("span",{class:"token punctuation"},","),a(`
    `),n("span",{class:"token punctuation"},"}"),n("span",{class:"token punctuation"},";"),a(`
  `),n("span",{class:"token punctuation"},"}"),n("span",{class:"token punctuation"},","),a(`
`),n("span",{class:"token punctuation"},"}"),n("span",{class:"token punctuation"},")"),n("span",{class:"token punctuation"},";"),a(`
`)])]),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"</"),a("script")]),n("span",{class:"token punctuation"},">")]),a(`
`),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),a("style")]),n("span",{class:"token punctuation"},">")]),n("span",{class:"token style"},[n("span",{class:"token language-css"},[a(`
`),n("span",{class:"token selector"},".tabs-extra-demo-button"),a(),n("span",{class:"token punctuation"},"{"),a(`
  `),n("span",{class:"token property"},"margin-right"),n("span",{class:"token punctuation"},":"),a(" 16px"),n("span",{class:"token punctuation"},";"),a(`
`),n("span",{class:"token punctuation"},"}"),a(`

`),n("span",{class:"token selector"},".ant-row-rtl .tabs-extra-demo-button"),a(),n("span",{class:"token punctuation"},"{"),a(`
  `),n("span",{class:"token property"},"margin-right"),n("span",{class:"token punctuation"},":"),a(" 0"),n("span",{class:"token punctuation"},";"),a(`
  `),n("span",{class:"token property"},"margin-left"),n("span",{class:"token punctuation"},":"),a(" 16px"),n("span",{class:"token punctuation"},";"),a(`
`),n("span",{class:"token punctuation"},"}"),a(`
`)])]),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"</"),a("style")]),n("span",{class:"token punctuation"},">")]),a(`
`)])],-1)])),jsVersionHtml:s(()=>t[7]||(t[7]=[n("pre",{class:"language-vue"},[n("code",null,[n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),a("template")]),n("span",{class:"token punctuation"},">")]),a(`
  `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),a("a-tabs")]),a(),n("span",{class:"token attr-name"},[n("span",{class:"token namespace"},"v-model:"),a("activeKey")]),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),a("activeKey"),n("span",{class:"token punctuation"},'"')]),n("span",{class:"token punctuation"},">")]),a(`
    `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),a("a-tab-pane")]),a(),n("span",{class:"token attr-name"},"key"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),a("1"),n("span",{class:"token punctuation"},'"')]),a(),n("span",{class:"token attr-name"},"tab"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),a("Tab 1"),n("span",{class:"token punctuation"},'"')]),n("span",{class:"token punctuation"},">")]),a("Content of tab 1"),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"</"),a("a-tab-pane")]),n("span",{class:"token punctuation"},">")]),a(`
    `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),a("a-tab-pane")]),a(),n("span",{class:"token attr-name"},"key"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),a("2"),n("span",{class:"token punctuation"},'"')]),a(),n("span",{class:"token attr-name"},"tab"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),a("Tab 2"),n("span",{class:"token punctuation"},'"')]),n("span",{class:"token punctuation"},">")]),a("Content of tab 2"),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"</"),a("a-tab-pane")]),n("span",{class:"token punctuation"},">")]),a(`
    `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),a("a-tab-pane")]),a(),n("span",{class:"token attr-name"},"key"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),a("3"),n("span",{class:"token punctuation"},'"')]),a(),n("span",{class:"token attr-name"},"tab"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),a("Tab 3"),n("span",{class:"token punctuation"},'"')]),n("span",{class:"token punctuation"},">")]),a("Content of tab 3"),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"</"),a("a-tab-pane")]),n("span",{class:"token punctuation"},">")]),a(`
    `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),a("template")]),a(),n("span",{class:"token attr-name"},"#leftExtra"),n("span",{class:"token punctuation"},">")]),a(`
      `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),a("a-button")]),a(),n("span",{class:"token attr-name"},"class"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),a("tabs-extra-demo-button"),n("span",{class:"token punctuation"},'"')]),n("span",{class:"token punctuation"},">")]),a("Left Extra Action"),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"</"),a("a-button")]),n("span",{class:"token punctuation"},">")]),a(`
    `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"</"),a("template")]),n("span",{class:"token punctuation"},">")]),a(`
    `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),a("template")]),a(),n("span",{class:"token attr-name"},"#rightExtra"),n("span",{class:"token punctuation"},">")]),a(`
      `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),a("a-button")]),n("span",{class:"token punctuation"},">")]),a("Right Extra Action"),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"</"),a("a-button")]),n("span",{class:"token punctuation"},">")]),a(`
    `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"</"),a("template")]),n("span",{class:"token punctuation"},">")]),a(`
  `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"</"),a("a-tabs")]),n("span",{class:"token punctuation"},">")]),a(`
`),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"</"),a("template")]),n("span",{class:"token punctuation"},">")]),a(`
`),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),a("script")]),n("span",{class:"token punctuation"},">")]),n("span",{class:"token script"},[n("span",{class:"token language-javascript"},[a(`
`),n("span",{class:"token keyword"},"import"),a(),n("span",{class:"token punctuation"},"{"),a(" defineComponent"),n("span",{class:"token punctuation"},","),a(" ref "),n("span",{class:"token punctuation"},"}"),a(),n("span",{class:"token keyword"},"from"),a(),n("span",{class:"token string"},"'vue'"),n("span",{class:"token punctuation"},";"),a(`
`),n("span",{class:"token keyword"},"export"),a(),n("span",{class:"token keyword"},"default"),a(),n("span",{class:"token function"},"defineComponent"),n("span",{class:"token punctuation"},"("),n("span",{class:"token punctuation"},"{"),a(`
  `),n("span",{class:"token function"},"setup"),n("span",{class:"token punctuation"},"("),n("span",{class:"token punctuation"},")"),a(),n("span",{class:"token punctuation"},"{"),a(`
    `),n("span",{class:"token keyword"},"return"),a(),n("span",{class:"token punctuation"},"{"),a(`
      `),n("span",{class:"token literal-property property"},"activeKey"),n("span",{class:"token operator"},":"),a(),n("span",{class:"token function"},"ref"),n("span",{class:"token punctuation"},"("),n("span",{class:"token string"},"'1'"),n("span",{class:"token punctuation"},")"),n("span",{class:"token punctuation"},","),a(`
    `),n("span",{class:"token punctuation"},"}"),n("span",{class:"token punctuation"},";"),a(`
  `),n("span",{class:"token punctuation"},"}"),n("span",{class:"token punctuation"},","),a(`
`),n("span",{class:"token punctuation"},"}"),n("span",{class:"token punctuation"},")"),n("span",{class:"token punctuation"},";"),a(`
`)])]),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"</"),a("script")]),n("span",{class:"token punctuation"},">")]),a(`
`),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),a("style")]),n("span",{class:"token punctuation"},">")]),n("span",{class:"token style"},[n("span",{class:"token language-css"},[a(`
`),n("span",{class:"token selector"},".tabs-extra-demo-button"),a(),n("span",{class:"token punctuation"},"{"),a(`
  `),n("span",{class:"token property"},"margin-right"),n("span",{class:"token punctuation"},":"),a(" 16px"),n("span",{class:"token punctuation"},";"),a(`
`),n("span",{class:"token punctuation"},"}"),a(`

`),n("span",{class:"token selector"},".ant-row-rtl .tabs-extra-demo-button"),a(),n("span",{class:"token punctuation"},"{"),a(`
  `),n("span",{class:"token property"},"margin-right"),n("span",{class:"token punctuation"},":"),a(" 0"),n("span",{class:"token punctuation"},";"),a(`
  `),n("span",{class:"token property"},"margin-left"),n("span",{class:"token punctuation"},":"),a(" 16px"),n("span",{class:"token punctuation"},";"),a(`
`),n("span",{class:"token punctuation"},"}"),a(`
`)])]),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"</"),a("style")]),n("span",{class:"token punctuation"},">")]),a(`
`)])],-1)])),_:1})}const cn=y(en,[["render",pn]]),ln=A({components:{AppleOutlined:V,AndroidOutlined:H},setup(){return{activeKey:b("1")}}});function un(o,t,d,r,I,m){const c=p("apple-outlined"),u=p("a-tab-pane"),l=p("android-outlined"),k=p("a-tabs"),g=p("demo-box");return i(),h(g,{jsfiddle:{us:"The Tab with Icon.",cn:"\u6709\u56FE\u6807\u7684\u6807\u7B7E\u3002",docHtml:`<h2 id="zh-CN">zh-CN <a class="header-anchor" href="#zh-CN">
          <span aria-hidden="true" class="anchor">#</span>
        </a></h2>
<p>\u6709\u56FE\u6807\u7684\u6807\u7B7E\u3002</p>
<h2 id="en-US">en-US <a class="header-anchor" href="#en-US">
          <span aria-hidden="true" class="anchor">#</span>
        </a></h2>
<p>The Tab with Icon.</p>
`,order:2,title:{"zh-CN":"\u56FE\u6807","en-US":"Icon"},relativePath:"components/tabs/demo/icon.vue",sourceCode:"PHRlbXBsYXRlPgogIDxhLXRhYnMgdi1tb2RlbDphY3RpdmVLZXk9ImFjdGl2ZUtleSI+CiAgICA8YS10YWItcGFuZSBrZXk9IjEiPgogICAgICA8dGVtcGxhdGUgI3RhYj4KICAgICAgICA8c3Bhbj4KICAgICAgICAgIDxhcHBsZS1vdXRsaW5lZCAvPgogICAgICAgICAgVGFiIDEKICAgICAgICA8L3NwYW4+CiAgICAgIDwvdGVtcGxhdGU+CiAgICAgIFRhYiAxCiAgICA8L2EtdGFiLXBhbmU+CiAgICA8YS10YWItcGFuZSBrZXk9IjIiPgogICAgICA8dGVtcGxhdGUgI3RhYj4KICAgICAgICA8c3Bhbj4KICAgICAgICAgIDxhbmRyb2lkLW91dGxpbmVkIC8+CiAgICAgICAgICBUYWIgMgogICAgICAgIDwvc3Bhbj4KICAgICAgPC90ZW1wbGF0ZT4KICAgICAgVGFiIDIKICAgIDwvYS10YWItcGFuZT4KICA8L2EtdGFicz4KPC90ZW1wbGF0ZT4KPHNjcmlwdCBsYW5nPSJ0cyI+CmltcG9ydCB7IEFwcGxlT3V0bGluZWQsIEFuZHJvaWRPdXRsaW5lZCB9IGZyb20gJ0BhbnQtZGVzaWduL2ljb25zLXZ1ZSc7CmltcG9ydCB7IGRlZmluZUNvbXBvbmVudCwgcmVmIH0gZnJvbSAndnVlJzsKZXhwb3J0IGRlZmF1bHQgZGVmaW5lQ29tcG9uZW50KHsKICBjb21wb25lbnRzOiB7CiAgICBBcHBsZU91dGxpbmVkLAogICAgQW5kcm9pZE91dGxpbmVkLAogIH0sCiAgc2V0dXAoKSB7CiAgICByZXR1cm4gewogICAgICBhY3RpdmVLZXk6IHJlZignMScpLAogICAgfTsKICB9LAp9KTsKPC9zY3JpcHQ+Cgo=",jsSourceCode:"PHRlbXBsYXRlPgogIDxhLXRhYnMgdi1tb2RlbDphY3RpdmVLZXk9ImFjdGl2ZUtleSI+CiAgICA8YS10YWItcGFuZSBrZXk9IjEiPgogICAgICA8dGVtcGxhdGUgI3RhYj4KICAgICAgICA8c3Bhbj4KICAgICAgICAgIDxhcHBsZS1vdXRsaW5lZCAvPgogICAgICAgICAgVGFiIDEKICAgICAgICA8L3NwYW4+CiAgICAgIDwvdGVtcGxhdGU+CiAgICAgIFRhYiAxCiAgICA8L2EtdGFiLXBhbmU+CiAgICA8YS10YWItcGFuZSBrZXk9IjIiPgogICAgICA8dGVtcGxhdGUgI3RhYj4KICAgICAgICA8c3Bhbj4KICAgICAgICAgIDxhbmRyb2lkLW91dGxpbmVkIC8+CiAgICAgICAgICBUYWIgMgogICAgICAgIDwvc3Bhbj4KICAgICAgPC90ZW1wbGF0ZT4KICAgICAgVGFiIDIKICAgIDwvYS10YWItcGFuZT4KICA8L2EtdGFicz4KPC90ZW1wbGF0ZT4KPHNjcmlwdD4KaW1wb3J0IHsgQXBwbGVPdXRsaW5lZCwgQW5kcm9pZE91dGxpbmVkIH0gZnJvbSAnQGFudC1kZXNpZ24vaWNvbnMtdnVlJzsKaW1wb3J0IHsgZGVmaW5lQ29tcG9uZW50LCByZWYgfSBmcm9tICd2dWUnOwpleHBvcnQgZGVmYXVsdCBkZWZpbmVDb21wb25lbnQoewogIGNvbXBvbmVudHM6IHsKICAgIEFwcGxlT3V0bGluZWQsCiAgICBBbmRyb2lkT3V0bGluZWQsCiAgfSwKICBzZXR1cCgpIHsKICAgIHJldHVybiB7CiAgICAgIGFjdGl2ZUtleTogcmVmKCcxJyksCiAgICB9OwogIH0sCn0pOwo8L3NjcmlwdD4="}},{default:s(()=>[e(k,{activeKey:o.activeKey,"onUpdate:activeKey":t[0]||(t[0]=C=>o.activeKey=C)},{default:s(()=>[e(u,{key:"1"},{tab:s(()=>[n("span",null,[e(c),t[1]||(t[1]=a(" Tab 1 "))])]),default:s(()=>[t[2]||(t[2]=a(" Tab 1 "))]),_:1,__:[2]}),e(u,{key:"2"},{tab:s(()=>[n("span",null,[e(l),t[3]||(t[3]=a(" Tab 2 "))])]),default:s(()=>[t[4]||(t[4]=a(" Tab 2 "))]),_:1,__:[4]})]),_:1},8,["activeKey"])]),htmlCode:s(()=>t[5]||(t[5]=[n("pre",{class:"language-vue"},[n("code",null,[n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),a("template")]),n("span",{class:"token punctuation"},">")]),a(`
  `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),a("a-tabs")]),a(),n("span",{class:"token attr-name"},[n("span",{class:"token namespace"},"v-model:"),a("activeKey")]),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),a("activeKey"),n("span",{class:"token punctuation"},'"')]),n("span",{class:"token punctuation"},">")]),a(`
    `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),a("a-tab-pane")]),a(),n("span",{class:"token attr-name"},"key"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),a("1"),n("span",{class:"token punctuation"},'"')]),n("span",{class:"token punctuation"},">")]),a(`
      `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),a("template")]),a(),n("span",{class:"token attr-name"},"#tab"),n("span",{class:"token punctuation"},">")]),a(`
        `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),a("span")]),n("span",{class:"token punctuation"},">")]),a(`
          `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),a("apple-outlined")]),a(),n("span",{class:"token punctuation"},"/>")]),a(`
          Tab 1
        `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"</"),a("span")]),n("span",{class:"token punctuation"},">")]),a(`
      `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"</"),a("template")]),n("span",{class:"token punctuation"},">")]),a(`
      Tab 1
    `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"</"),a("a-tab-pane")]),n("span",{class:"token punctuation"},">")]),a(`
    `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),a("a-tab-pane")]),a(),n("span",{class:"token attr-name"},"key"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),a("2"),n("span",{class:"token punctuation"},'"')]),n("span",{class:"token punctuation"},">")]),a(`
      `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),a("template")]),a(),n("span",{class:"token attr-name"},"#tab"),n("span",{class:"token punctuation"},">")]),a(`
        `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),a("span")]),n("span",{class:"token punctuation"},">")]),a(`
          `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),a("android-outlined")]),a(),n("span",{class:"token punctuation"},"/>")]),a(`
          Tab 2
        `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"</"),a("span")]),n("span",{class:"token punctuation"},">")]),a(`
      `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"</"),a("template")]),n("span",{class:"token punctuation"},">")]),a(`
      Tab 2
    `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"</"),a("a-tab-pane")]),n("span",{class:"token punctuation"},">")]),a(`
  `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"</"),a("a-tabs")]),n("span",{class:"token punctuation"},">")]),a(`
`),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"</"),a("template")]),n("span",{class:"token punctuation"},">")]),a(`
`),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),a("script")]),a(),n("span",{class:"token attr-name"},"lang"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),a("ts"),n("span",{class:"token punctuation"},'"')]),n("span",{class:"token punctuation"},">")]),n("span",{class:"token script"},[n("span",{class:"token language-javascript"},[a(`
`),n("span",{class:"token keyword"},"import"),a(),n("span",{class:"token punctuation"},"{"),a(" AppleOutlined"),n("span",{class:"token punctuation"},","),a(" AndroidOutlined "),n("span",{class:"token punctuation"},"}"),a(),n("span",{class:"token keyword"},"from"),a(),n("span",{class:"token string"},"'@ant-design/icons-vue'"),n("span",{class:"token punctuation"},";"),a(`
`),n("span",{class:"token keyword"},"import"),a(),n("span",{class:"token punctuation"},"{"),a(" defineComponent"),n("span",{class:"token punctuation"},","),a(" ref "),n("span",{class:"token punctuation"},"}"),a(),n("span",{class:"token keyword"},"from"),a(),n("span",{class:"token string"},"'vue'"),n("span",{class:"token punctuation"},";"),a(`
`),n("span",{class:"token keyword"},"export"),a(),n("span",{class:"token keyword"},"default"),a(),n("span",{class:"token function"},"defineComponent"),n("span",{class:"token punctuation"},"("),n("span",{class:"token punctuation"},"{"),a(`
  `),n("span",{class:"token literal-property property"},"components"),n("span",{class:"token operator"},":"),a(),n("span",{class:"token punctuation"},"{"),a(`
    AppleOutlined`),n("span",{class:"token punctuation"},","),a(`
    AndroidOutlined`),n("span",{class:"token punctuation"},","),a(`
  `),n("span",{class:"token punctuation"},"}"),n("span",{class:"token punctuation"},","),a(`
  `),n("span",{class:"token function"},"setup"),n("span",{class:"token punctuation"},"("),n("span",{class:"token punctuation"},")"),a(),n("span",{class:"token punctuation"},"{"),a(`
    `),n("span",{class:"token keyword"},"return"),a(),n("span",{class:"token punctuation"},"{"),a(`
      `),n("span",{class:"token literal-property property"},"activeKey"),n("span",{class:"token operator"},":"),a(),n("span",{class:"token function"},"ref"),n("span",{class:"token punctuation"},"("),n("span",{class:"token string"},"'1'"),n("span",{class:"token punctuation"},")"),n("span",{class:"token punctuation"},","),a(`
    `),n("span",{class:"token punctuation"},"}"),n("span",{class:"token punctuation"},";"),a(`
  `),n("span",{class:"token punctuation"},"}"),n("span",{class:"token punctuation"},","),a(`
`),n("span",{class:"token punctuation"},"}"),n("span",{class:"token punctuation"},")"),n("span",{class:"token punctuation"},";"),a(`
`)])]),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"</"),a("script")]),n("span",{class:"token punctuation"},">")]),a(`
`)])],-1)])),jsVersionHtml:s(()=>t[6]||(t[6]=[n("pre",{class:"language-vue"},[n("code",null,[n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),a("template")]),n("span",{class:"token punctuation"},">")]),a(`
  `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),a("a-tabs")]),a(),n("span",{class:"token attr-name"},[n("span",{class:"token namespace"},"v-model:"),a("activeKey")]),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),a("activeKey"),n("span",{class:"token punctuation"},'"')]),n("span",{class:"token punctuation"},">")]),a(`
    `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),a("a-tab-pane")]),a(),n("span",{class:"token attr-name"},"key"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),a("1"),n("span",{class:"token punctuation"},'"')]),n("span",{class:"token punctuation"},">")]),a(`
      `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),a("template")]),a(),n("span",{class:"token attr-name"},"#tab"),n("span",{class:"token punctuation"},">")]),a(`
        `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),a("span")]),n("span",{class:"token punctuation"},">")]),a(`
          `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),a("apple-outlined")]),a(),n("span",{class:"token punctuation"},"/>")]),a(`
          Tab 1
        `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"</"),a("span")]),n("span",{class:"token punctuation"},">")]),a(`
      `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"</"),a("template")]),n("span",{class:"token punctuation"},">")]),a(`
      Tab 1
    `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"</"),a("a-tab-pane")]),n("span",{class:"token punctuation"},">")]),a(`
    `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),a("a-tab-pane")]),a(),n("span",{class:"token attr-name"},"key"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),a("2"),n("span",{class:"token punctuation"},'"')]),n("span",{class:"token punctuation"},">")]),a(`
      `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),a("template")]),a(),n("span",{class:"token attr-name"},"#tab"),n("span",{class:"token punctuation"},">")]),a(`
        `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),a("span")]),n("span",{class:"token punctuation"},">")]),a(`
          `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),a("android-outlined")]),a(),n("span",{class:"token punctuation"},"/>")]),a(`
          Tab 2
        `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"</"),a("span")]),n("span",{class:"token punctuation"},">")]),a(`
      `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"</"),a("template")]),n("span",{class:"token punctuation"},">")]),a(`
      Tab 2
    `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"</"),a("a-tab-pane")]),n("span",{class:"token punctuation"},">")]),a(`
  `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"</"),a("a-tabs")]),n("span",{class:"token punctuation"},">")]),a(`
`),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"</"),a("template")]),n("span",{class:"token punctuation"},">")]),a(`
`),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),a("script")]),n("span",{class:"token punctuation"},">")]),n("span",{class:"token script"},[n("span",{class:"token language-javascript"},[a(`
`),n("span",{class:"token keyword"},"import"),a(),n("span",{class:"token punctuation"},"{"),a(" AppleOutlined"),n("span",{class:"token punctuation"},","),a(" AndroidOutlined "),n("span",{class:"token punctuation"},"}"),a(),n("span",{class:"token keyword"},"from"),a(),n("span",{class:"token string"},"'@ant-design/icons-vue'"),n("span",{class:"token punctuation"},";"),a(`
`),n("span",{class:"token keyword"},"import"),a(),n("span",{class:"token punctuation"},"{"),a(" defineComponent"),n("span",{class:"token punctuation"},","),a(" ref "),n("span",{class:"token punctuation"},"}"),a(),n("span",{class:"token keyword"},"from"),a(),n("span",{class:"token string"},"'vue'"),n("span",{class:"token punctuation"},";"),a(`
`),n("span",{class:"token keyword"},"export"),a(),n("span",{class:"token keyword"},"default"),a(),n("span",{class:"token function"},"defineComponent"),n("span",{class:"token punctuation"},"("),n("span",{class:"token punctuation"},"{"),a(`
  `),n("span",{class:"token literal-property property"},"components"),n("span",{class:"token operator"},":"),a(),n("span",{class:"token punctuation"},"{"),a(`
    AppleOutlined`),n("span",{class:"token punctuation"},","),a(`
    AndroidOutlined`),n("span",{class:"token punctuation"},","),a(`
  `),n("span",{class:"token punctuation"},"}"),n("span",{class:"token punctuation"},","),a(`
  `),n("span",{class:"token function"},"setup"),n("span",{class:"token punctuation"},"("),n("span",{class:"token punctuation"},")"),a(),n("span",{class:"token punctuation"},"{"),a(`
    `),n("span",{class:"token keyword"},"return"),a(),n("span",{class:"token punctuation"},"{"),a(`
      `),n("span",{class:"token literal-property property"},"activeKey"),n("span",{class:"token operator"},":"),a(),n("span",{class:"token function"},"ref"),n("span",{class:"token punctuation"},"("),n("span",{class:"token string"},"'1'"),n("span",{class:"token punctuation"},")"),n("span",{class:"token punctuation"},","),a(`
    `),n("span",{class:"token punctuation"},"}"),n("span",{class:"token punctuation"},";"),a(`
  `),n("span",{class:"token punctuation"},"}"),n("span",{class:"token punctuation"},","),a(`
`),n("span",{class:"token punctuation"},"}"),n("span",{class:"token punctuation"},")"),n("span",{class:"token punctuation"},";"),a(`
`)])]),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"</"),a("script")]),n("span",{class:"token punctuation"},">")]),a(`
`)])],-1)])),_:1})}const kn=y(ln,[["render",un]]),rn=A({setup(){const o=b("top"),t=b("1");return{tabPosition:o,activeKey:t}}});function dn(o,t,d,r,I,m){const c=p("a-radio-button"),u=p("a-radio-group"),l=p("a-tab-pane"),k=p("a-tabs"),g=p("demo-box");return i(),h(g,{jsfiddle:{us:"Tab's position: left, right, top or bottom.  Will auto switch to `top` in mobile.",cn:'\u6709\u56DB\u4E2A\u4F4D\u7F6E\uFF0C`tabPosition="left|right|top|bottom"`\u3002\u5728\u79FB\u52A8\u7AEF\u4E0B\uFF0C`bottom|right` \u4F1A\u81EA\u52A8\u5207\u6362\u6210 `top`\u3002',docHtml:`<h2 id="zh-CN">zh-CN <a class="header-anchor" href="#zh-CN">
          <span aria-hidden="true" class="anchor">#</span>
        </a></h2>
<p>\u6709\u56DB\u4E2A\u4F4D\u7F6E\uFF0C<code>tabPosition=&quot;left|right|top|bottom&quot;</code>\u3002\u5728\u79FB\u52A8\u7AEF\u4E0B\uFF0C<code>bottom|right</code> \u4F1A\u81EA\u52A8\u5207\u6362\u6210 <code>top</code>\u3002</p>
<h2 id="en-US">en-US <a class="header-anchor" href="#en-US">
          <span aria-hidden="true" class="anchor">#</span>
        </a></h2>
<p>Tab's position: left, right, top or bottom.  Will auto switch to <code>top</code> in mobile.</p>
`,order:6,title:{"zh-CN":"\u4F4D\u7F6E","en-US":"Position"},relativePath:"components/tabs/demo/position.vue",sourceCode:"PHRlbXBsYXRlPgogIDxhLXJhZGlvLWdyb3VwIHYtbW9kZWw6dmFsdWU9InRhYlBvc2l0aW9uIiBzdHlsZT0ibWFyZ2luOiA4cHgiPgogICAgPGEtcmFkaW8tYnV0dG9uIHZhbHVlPSJ0b3AiPnRvcDwvYS1yYWRpby1idXR0b24+CiAgICA8YS1yYWRpby1idXR0b24gdmFsdWU9ImJvdHRvbSI+Ym90dG9tPC9hLXJhZGlvLWJ1dHRvbj4KICAgIDxhLXJhZGlvLWJ1dHRvbiB2YWx1ZT0ibGVmdCI+bGVmdDwvYS1yYWRpby1idXR0b24+CiAgICA8YS1yYWRpby1idXR0b24gdmFsdWU9InJpZ2h0Ij5yaWdodDwvYS1yYWRpby1idXR0b24+CiAgPC9hLXJhZGlvLWdyb3VwPgogIDxhLXRhYnMgdi1tb2RlbDphY3RpdmVLZXk9ImFjdGl2ZUtleSIgOnRhYi1wb3NpdGlvbj0idGFiUG9zaXRpb24iIGFuaW1hdGVkPgogICAgPGEtdGFiLXBhbmUga2V5PSIxIiB0YWI9IlRhYiAxIj5Db250ZW50IG9mIFRhYiAxPC9hLXRhYi1wYW5lPgogICAgPGEtdGFiLXBhbmUga2V5PSIyIiB0YWI9IlRhYiAyIj5Db250ZW50IG9mIFRhYiAyPC9hLXRhYi1wYW5lPgogICAgPGEtdGFiLXBhbmUga2V5PSIzIiB0YWI9IlRhYiAzIj5Db250ZW50IG9mIFRhYiAzPC9hLXRhYi1wYW5lPgogIDwvYS10YWJzPgo8L3RlbXBsYXRlPgo8c2NyaXB0IGxhbmc9InRzIj4KaW1wb3J0IHsgZGVmaW5lQ29tcG9uZW50LCByZWYgfSBmcm9tICd2dWUnOwppbXBvcnQgeyBUYWJzUHJvcHMgfSBmcm9tICcuLic7CgpleHBvcnQgZGVmYXVsdCBkZWZpbmVDb21wb25lbnQoewogIHNldHVwKCkgewogICAgY29uc3QgdGFiUG9zaXRpb24gPSByZWY8VGFic1Byb3BzWyd0YWJQb3NpdGlvbiddPigndG9wJyk7CiAgICBjb25zdCBhY3RpdmVLZXkgPSByZWYoJzEnKTsKCiAgICByZXR1cm4gewogICAgICB0YWJQb3NpdGlvbiwKICAgICAgYWN0aXZlS2V5LAogICAgfTsKICB9LAp9KTsKPC9zY3JpcHQ+Cgo=",jsSourceCode:"PHRlbXBsYXRlPgogIDxhLXJhZGlvLWdyb3VwIHYtbW9kZWw6dmFsdWU9InRhYlBvc2l0aW9uIiBzdHlsZT0ibWFyZ2luOiA4cHgiPgogICAgPGEtcmFkaW8tYnV0dG9uIHZhbHVlPSJ0b3AiPnRvcDwvYS1yYWRpby1idXR0b24+CiAgICA8YS1yYWRpby1idXR0b24gdmFsdWU9ImJvdHRvbSI+Ym90dG9tPC9hLXJhZGlvLWJ1dHRvbj4KICAgIDxhLXJhZGlvLWJ1dHRvbiB2YWx1ZT0ibGVmdCI+bGVmdDwvYS1yYWRpby1idXR0b24+CiAgICA8YS1yYWRpby1idXR0b24gdmFsdWU9InJpZ2h0Ij5yaWdodDwvYS1yYWRpby1idXR0b24+CiAgPC9hLXJhZGlvLWdyb3VwPgogIDxhLXRhYnMgdi1tb2RlbDphY3RpdmVLZXk9ImFjdGl2ZUtleSIgOnRhYi1wb3NpdGlvbj0idGFiUG9zaXRpb24iIGFuaW1hdGVkPgogICAgPGEtdGFiLXBhbmUga2V5PSIxIiB0YWI9IlRhYiAxIj5Db250ZW50IG9mIFRhYiAxPC9hLXRhYi1wYW5lPgogICAgPGEtdGFiLXBhbmUga2V5PSIyIiB0YWI9IlRhYiAyIj5Db250ZW50IG9mIFRhYiAyPC9hLXRhYi1wYW5lPgogICAgPGEtdGFiLXBhbmUga2V5PSIzIiB0YWI9IlRhYiAzIj5Db250ZW50IG9mIFRhYiAzPC9hLXRhYi1wYW5lPgogIDwvYS10YWJzPgo8L3RlbXBsYXRlPgo8c2NyaXB0PgppbXBvcnQgeyBkZWZpbmVDb21wb25lbnQsIHJlZiB9IGZyb20gJ3Z1ZSc7CmV4cG9ydCBkZWZhdWx0IGRlZmluZUNvbXBvbmVudCh7CiAgc2V0dXAoKSB7CiAgICBjb25zdCB0YWJQb3NpdGlvbiA9IHJlZigndG9wJyk7CiAgICBjb25zdCBhY3RpdmVLZXkgPSByZWYoJzEnKTsKICAgIHJldHVybiB7CiAgICAgIHRhYlBvc2l0aW9uLAogICAgICBhY3RpdmVLZXksCiAgICB9OwogIH0sCn0pOwo8L3NjcmlwdD4="}},{default:s(()=>[e(u,{value:o.tabPosition,"onUpdate:value":t[0]||(t[0]=C=>o.tabPosition=C),style:{margin:"8px"}},{default:s(()=>[e(c,{value:"top"},{default:s(()=>t[2]||(t[2]=[a("top")])),_:1,__:[2]}),e(c,{value:"bottom"},{default:s(()=>t[3]||(t[3]=[a("bottom")])),_:1,__:[3]}),e(c,{value:"left"},{default:s(()=>t[4]||(t[4]=[a("left")])),_:1,__:[4]}),e(c,{value:"right"},{default:s(()=>t[5]||(t[5]=[a("right")])),_:1,__:[5]})]),_:1},8,["value"]),e(k,{activeKey:o.activeKey,"onUpdate:activeKey":t[1]||(t[1]=C=>o.activeKey=C),"tab-position":o.tabPosition,animated:""},{default:s(()=>[e(l,{key:"1",tab:"Tab 1"},{default:s(()=>t[6]||(t[6]=[a("Content of Tab 1")])),_:1,__:[6]}),e(l,{key:"2",tab:"Tab 2"},{default:s(()=>t[7]||(t[7]=[a("Content of Tab 2")])),_:1,__:[7]}),e(l,{key:"3",tab:"Tab 3"},{default:s(()=>t[8]||(t[8]=[a("Content of Tab 3")])),_:1,__:[8]})]),_:1},8,["activeKey","tab-position"])]),htmlCode:s(()=>t[9]||(t[9]=[n("pre",{class:"language-vue"},[n("code",null,[n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),a("template")]),n("span",{class:"token punctuation"},">")]),a(`
  `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),a("a-radio-group")]),a(),n("span",{class:"token attr-name"},[n("span",{class:"token namespace"},"v-model:"),a("value")]),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),a("tabPosition"),n("span",{class:"token punctuation"},'"')]),a(),n("span",{class:"token special-attr"},[n("span",{class:"token attr-name"},"style"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),n("span",{class:"token value css language-css"},[n("span",{class:"token property"},"margin"),n("span",{class:"token punctuation"},":"),a(" 8px")]),n("span",{class:"token punctuation"},'"')])]),n("span",{class:"token punctuation"},">")]),a(`
    `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),a("a-radio-button")]),a(),n("span",{class:"token attr-name"},"value"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),a("top"),n("span",{class:"token punctuation"},'"')]),n("span",{class:"token punctuation"},">")]),a("top"),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"</"),a("a-radio-button")]),n("span",{class:"token punctuation"},">")]),a(`
    `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),a("a-radio-button")]),a(),n("span",{class:"token attr-name"},"value"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),a("bottom"),n("span",{class:"token punctuation"},'"')]),n("span",{class:"token punctuation"},">")]),a("bottom"),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"</"),a("a-radio-button")]),n("span",{class:"token punctuation"},">")]),a(`
    `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),a("a-radio-button")]),a(),n("span",{class:"token attr-name"},"value"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),a("left"),n("span",{class:"token punctuation"},'"')]),n("span",{class:"token punctuation"},">")]),a("left"),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"</"),a("a-radio-button")]),n("span",{class:"token punctuation"},">")]),a(`
    `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),a("a-radio-button")]),a(),n("span",{class:"token attr-name"},"value"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),a("right"),n("span",{class:"token punctuation"},'"')]),n("span",{class:"token punctuation"},">")]),a("right"),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"</"),a("a-radio-button")]),n("span",{class:"token punctuation"},">")]),a(`
  `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"</"),a("a-radio-group")]),n("span",{class:"token punctuation"},">")]),a(`
  `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),a("a-tabs")]),a(),n("span",{class:"token attr-name"},[n("span",{class:"token namespace"},"v-model:"),a("activeKey")]),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),a("activeKey"),n("span",{class:"token punctuation"},'"')]),a(),n("span",{class:"token attr-name"},":tab-position"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),a("tabPosition"),n("span",{class:"token punctuation"},'"')]),a(),n("span",{class:"token attr-name"},"animated"),n("span",{class:"token punctuation"},">")]),a(`
    `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),a("a-tab-pane")]),a(),n("span",{class:"token attr-name"},"key"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),a("1"),n("span",{class:"token punctuation"},'"')]),a(),n("span",{class:"token attr-name"},"tab"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),a("Tab 1"),n("span",{class:"token punctuation"},'"')]),n("span",{class:"token punctuation"},">")]),a("Content of Tab 1"),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"</"),a("a-tab-pane")]),n("span",{class:"token punctuation"},">")]),a(`
    `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),a("a-tab-pane")]),a(),n("span",{class:"token attr-name"},"key"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),a("2"),n("span",{class:"token punctuation"},'"')]),a(),n("span",{class:"token attr-name"},"tab"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),a("Tab 2"),n("span",{class:"token punctuation"},'"')]),n("span",{class:"token punctuation"},">")]),a("Content of Tab 2"),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"</"),a("a-tab-pane")]),n("span",{class:"token punctuation"},">")]),a(`
    `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),a("a-tab-pane")]),a(),n("span",{class:"token attr-name"},"key"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),a("3"),n("span",{class:"token punctuation"},'"')]),a(),n("span",{class:"token attr-name"},"tab"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),a("Tab 3"),n("span",{class:"token punctuation"},'"')]),n("span",{class:"token punctuation"},">")]),a("Content of Tab 3"),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"</"),a("a-tab-pane")]),n("span",{class:"token punctuation"},">")]),a(`
  `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"</"),a("a-tabs")]),n("span",{class:"token punctuation"},">")]),a(`
`),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"</"),a("template")]),n("span",{class:"token punctuation"},">")]),a(`
`),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),a("script")]),a(),n("span",{class:"token attr-name"},"lang"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),a("ts"),n("span",{class:"token punctuation"},'"')]),n("span",{class:"token punctuation"},">")]),n("span",{class:"token script"},[n("span",{class:"token language-javascript"},[a(`
`),n("span",{class:"token keyword"},"import"),a(),n("span",{class:"token punctuation"},"{"),a(" defineComponent"),n("span",{class:"token punctuation"},","),a(" ref "),n("span",{class:"token punctuation"},"}"),a(),n("span",{class:"token keyword"},"from"),a(),n("span",{class:"token string"},"'vue'"),n("span",{class:"token punctuation"},";"),a(`
`),n("span",{class:"token keyword"},"import"),a(),n("span",{class:"token punctuation"},"{"),a(" TabsProps "),n("span",{class:"token punctuation"},"}"),a(),n("span",{class:"token keyword"},"from"),a(),n("span",{class:"token string"},"'..'"),n("span",{class:"token punctuation"},";"),a(`

`),n("span",{class:"token keyword"},"export"),a(),n("span",{class:"token keyword"},"default"),a(),n("span",{class:"token function"},"defineComponent"),n("span",{class:"token punctuation"},"("),n("span",{class:"token punctuation"},"{"),a(`
  `),n("span",{class:"token function"},"setup"),n("span",{class:"token punctuation"},"("),n("span",{class:"token punctuation"},")"),a(),n("span",{class:"token punctuation"},"{"),a(`
    `),n("span",{class:"token keyword"},"const"),a(" tabPosition "),n("span",{class:"token operator"},"="),a(" ref"),n("span",{class:"token operator"},"<"),a("TabsProps"),n("span",{class:"token punctuation"},"["),n("span",{class:"token string"},"'tabPosition'"),n("span",{class:"token punctuation"},"]"),n("span",{class:"token operator"},">"),n("span",{class:"token punctuation"},"("),n("span",{class:"token string"},"'top'"),n("span",{class:"token punctuation"},")"),n("span",{class:"token punctuation"},";"),a(`
    `),n("span",{class:"token keyword"},"const"),a(" activeKey "),n("span",{class:"token operator"},"="),a(),n("span",{class:"token function"},"ref"),n("span",{class:"token punctuation"},"("),n("span",{class:"token string"},"'1'"),n("span",{class:"token punctuation"},")"),n("span",{class:"token punctuation"},";"),a(`

    `),n("span",{class:"token keyword"},"return"),a(),n("span",{class:"token punctuation"},"{"),a(`
      tabPosition`),n("span",{class:"token punctuation"},","),a(`
      activeKey`),n("span",{class:"token punctuation"},","),a(`
    `),n("span",{class:"token punctuation"},"}"),n("span",{class:"token punctuation"},";"),a(`
  `),n("span",{class:"token punctuation"},"}"),n("span",{class:"token punctuation"},","),a(`
`),n("span",{class:"token punctuation"},"}"),n("span",{class:"token punctuation"},")"),n("span",{class:"token punctuation"},";"),a(`
`)])]),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"</"),a("script")]),n("span",{class:"token punctuation"},">")]),a(`
`)])],-1)])),jsVersionHtml:s(()=>t[10]||(t[10]=[n("pre",{class:"language-vue"},[n("code",null,[n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),a("template")]),n("span",{class:"token punctuation"},">")]),a(`
  `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),a("a-radio-group")]),a(),n("span",{class:"token attr-name"},[n("span",{class:"token namespace"},"v-model:"),a("value")]),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),a("tabPosition"),n("span",{class:"token punctuation"},'"')]),a(),n("span",{class:"token special-attr"},[n("span",{class:"token attr-name"},"style"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),n("span",{class:"token value css language-css"},[n("span",{class:"token property"},"margin"),n("span",{class:"token punctuation"},":"),a(" 8px")]),n("span",{class:"token punctuation"},'"')])]),n("span",{class:"token punctuation"},">")]),a(`
    `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),a("a-radio-button")]),a(),n("span",{class:"token attr-name"},"value"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),a("top"),n("span",{class:"token punctuation"},'"')]),n("span",{class:"token punctuation"},">")]),a("top"),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"</"),a("a-radio-button")]),n("span",{class:"token punctuation"},">")]),a(`
    `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),a("a-radio-button")]),a(),n("span",{class:"token attr-name"},"value"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),a("bottom"),n("span",{class:"token punctuation"},'"')]),n("span",{class:"token punctuation"},">")]),a("bottom"),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"</"),a("a-radio-button")]),n("span",{class:"token punctuation"},">")]),a(`
    `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),a("a-radio-button")]),a(),n("span",{class:"token attr-name"},"value"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),a("left"),n("span",{class:"token punctuation"},'"')]),n("span",{class:"token punctuation"},">")]),a("left"),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"</"),a("a-radio-button")]),n("span",{class:"token punctuation"},">")]),a(`
    `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),a("a-radio-button")]),a(),n("span",{class:"token attr-name"},"value"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),a("right"),n("span",{class:"token punctuation"},'"')]),n("span",{class:"token punctuation"},">")]),a("right"),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"</"),a("a-radio-button")]),n("span",{class:"token punctuation"},">")]),a(`
  `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"</"),a("a-radio-group")]),n("span",{class:"token punctuation"},">")]),a(`
  `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),a("a-tabs")]),a(),n("span",{class:"token attr-name"},[n("span",{class:"token namespace"},"v-model:"),a("activeKey")]),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),a("activeKey"),n("span",{class:"token punctuation"},'"')]),a(),n("span",{class:"token attr-name"},":tab-position"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),a("tabPosition"),n("span",{class:"token punctuation"},'"')]),a(),n("span",{class:"token attr-name"},"animated"),n("span",{class:"token punctuation"},">")]),a(`
    `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),a("a-tab-pane")]),a(),n("span",{class:"token attr-name"},"key"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),a("1"),n("span",{class:"token punctuation"},'"')]),a(),n("span",{class:"token attr-name"},"tab"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),a("Tab 1"),n("span",{class:"token punctuation"},'"')]),n("span",{class:"token punctuation"},">")]),a("Content of Tab 1"),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"</"),a("a-tab-pane")]),n("span",{class:"token punctuation"},">")]),a(`
    `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),a("a-tab-pane")]),a(),n("span",{class:"token attr-name"},"key"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),a("2"),n("span",{class:"token punctuation"},'"')]),a(),n("span",{class:"token attr-name"},"tab"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),a("Tab 2"),n("span",{class:"token punctuation"},'"')]),n("span",{class:"token punctuation"},">")]),a("Content of Tab 2"),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"</"),a("a-tab-pane")]),n("span",{class:"token punctuation"},">")]),a(`
    `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),a("a-tab-pane")]),a(),n("span",{class:"token attr-name"},"key"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),a("3"),n("span",{class:"token punctuation"},'"')]),a(),n("span",{class:"token attr-name"},"tab"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),a("Tab 3"),n("span",{class:"token punctuation"},'"')]),n("span",{class:"token punctuation"},">")]),a("Content of Tab 3"),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"</"),a("a-tab-pane")]),n("span",{class:"token punctuation"},">")]),a(`
  `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"</"),a("a-tabs")]),n("span",{class:"token punctuation"},">")]),a(`
`),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"</"),a("template")]),n("span",{class:"token punctuation"},">")]),a(`
`),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),a("script")]),n("span",{class:"token punctuation"},">")]),n("span",{class:"token script"},[n("span",{class:"token language-javascript"},[a(`
`),n("span",{class:"token keyword"},"import"),a(),n("span",{class:"token punctuation"},"{"),a(" defineComponent"),n("span",{class:"token punctuation"},","),a(" ref "),n("span",{class:"token punctuation"},"}"),a(),n("span",{class:"token keyword"},"from"),a(),n("span",{class:"token string"},"'vue'"),n("span",{class:"token punctuation"},";"),a(`
`),n("span",{class:"token keyword"},"export"),a(),n("span",{class:"token keyword"},"default"),a(),n("span",{class:"token function"},"defineComponent"),n("span",{class:"token punctuation"},"("),n("span",{class:"token punctuation"},"{"),a(`
  `),n("span",{class:"token function"},"setup"),n("span",{class:"token punctuation"},"("),n("span",{class:"token punctuation"},")"),a(),n("span",{class:"token punctuation"},"{"),a(`
    `),n("span",{class:"token keyword"},"const"),a(" tabPosition "),n("span",{class:"token operator"},"="),a(),n("span",{class:"token function"},"ref"),n("span",{class:"token punctuation"},"("),n("span",{class:"token string"},"'top'"),n("span",{class:"token punctuation"},")"),n("span",{class:"token punctuation"},";"),a(`
    `),n("span",{class:"token keyword"},"const"),a(" activeKey "),n("span",{class:"token operator"},"="),a(),n("span",{class:"token function"},"ref"),n("span",{class:"token punctuation"},"("),n("span",{class:"token string"},"'1'"),n("span",{class:"token punctuation"},")"),n("span",{class:"token punctuation"},";"),a(`
    `),n("span",{class:"token keyword"},"return"),a(),n("span",{class:"token punctuation"},"{"),a(`
      tabPosition`),n("span",{class:"token punctuation"},","),a(`
      activeKey`),n("span",{class:"token punctuation"},","),a(`
    `),n("span",{class:"token punctuation"},"}"),n("span",{class:"token punctuation"},";"),a(`
  `),n("span",{class:"token punctuation"},"}"),n("span",{class:"token punctuation"},","),a(`
`),n("span",{class:"token punctuation"},"}"),n("span",{class:"token punctuation"},")"),n("span",{class:"token punctuation"},";"),a(`
`)])]),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"</"),a("script")]),n("span",{class:"token punctuation"},">")]),a(`
`)])],-1)])),_:1})}const gn=y(rn,[["render",dn]]),bn=A({setup(){const o=b("small"),t=b("1");return{size:o,activeKey:t}}});function In(o,t,d,r,I,m){const c=p("a-radio-button"),u=p("a-radio-group"),l=p("a-tab-pane"),k=p("a-tabs"),g=p("demo-box");return i(),h(g,{jsfiddle:{us:"Large size tabs are usally used in page header, and small size could be used in Modal.",cn:"\u5927\u53F7\u9875\u7B7E\u7528\u5728\u9875\u5934\u533A\u57DF\uFF0C\u5C0F\u53F7\u7528\u5728\u5F39\u51FA\u6846\u7B49\u8F83\u72ED\u7A84\u7684\u5BB9\u5668\u5185\u3002",docHtml:`<h2 id="zh-CN">zh-CN <a class="header-anchor" href="#zh-CN">
          <span aria-hidden="true" class="anchor">#</span>
        </a></h2>
<p>\u5927\u53F7\u9875\u7B7E\u7528\u5728\u9875\u5934\u533A\u57DF\uFF0C\u5C0F\u53F7\u7528\u5728\u5F39\u51FA\u6846\u7B49\u8F83\u72ED\u7A84\u7684\u5BB9\u5668\u5185\u3002</p>
<h2 id="en-US">en-US <a class="header-anchor" href="#en-US">
          <span aria-hidden="true" class="anchor">#</span>
        </a></h2>
<p>Large size tabs are usally used in page header, and small size could be used in Modal.</p>
`,order:5,title:{"zh-CN":"\u5927\u5C0F","en-US":"Size"},relativePath:"components/tabs/demo/size.vue",sourceCode:"PHRlbXBsYXRlPgogIDxkaXY+CiAgICA8YS1yYWRpby1ncm91cCB2LW1vZGVsOnZhbHVlPSJzaXplIiBzdHlsZT0ibWFyZ2luLWJvdHRvbTogMTZweCI+CiAgICAgIDxhLXJhZGlvLWJ1dHRvbiB2YWx1ZT0ic21hbGwiPlNtYWxsPC9hLXJhZGlvLWJ1dHRvbj4KICAgICAgPGEtcmFkaW8tYnV0dG9uIHZhbHVlPSJkZWZhdWx0Ij5EZWZhdWx0PC9hLXJhZGlvLWJ1dHRvbj4KICAgICAgPGEtcmFkaW8tYnV0dG9uIHZhbHVlPSJsYXJnZSI+TGFyZ2U8L2EtcmFkaW8tYnV0dG9uPgogICAgPC9hLXJhZGlvLWdyb3VwPgogICAgPGEtdGFicyB2LW1vZGVsOmFjdGl2ZUtleT0iYWN0aXZlS2V5IiA6c2l6ZT0ic2l6ZSI+CiAgICAgIDxhLXRhYi1wYW5lIGtleT0iMSIgdGFiPSJUYWIgMSI+Q29udGVudCBvZiB0YWIgMTwvYS10YWItcGFuZT4KICAgICAgPGEtdGFiLXBhbmUga2V5PSIyIiB0YWI9IlRhYiAyIj5Db250ZW50IG9mIHRhYiAyPC9hLXRhYi1wYW5lPgogICAgICA8YS10YWItcGFuZSBrZXk9IjMiIHRhYj0iVGFiIDMiPkNvbnRlbnQgb2YgdGFiIDM8L2EtdGFiLXBhbmU+CiAgICA8L2EtdGFicz4KICA8L2Rpdj4KPC90ZW1wbGF0ZT4KPHNjcmlwdCBsYW5nPSJ0cyI+CmltcG9ydCB7IGRlZmluZUNvbXBvbmVudCwgcmVmIH0gZnJvbSAndnVlJzsKaW1wb3J0IHR5cGUgeyBUYWJzUHJvcHMgfSBmcm9tICdhbnQtZGVzaWduLXZ1ZSc7CgpleHBvcnQgZGVmYXVsdCBkZWZpbmVDb21wb25lbnQoewogIHNldHVwKCkgewogICAgY29uc3Qgc2l6ZSA9IHJlZjxUYWJzUHJvcHNbJ3NpemUnXT4oJ3NtYWxsJyk7CiAgICBjb25zdCBhY3RpdmVLZXkgPSByZWYoJzEnKTsKICAgIHJldHVybiB7CiAgICAgIHNpemUsCiAgICAgIGFjdGl2ZUtleSwKICAgIH07CiAgfSwKfSk7Cjwvc2NyaXB0PgoK",jsSourceCode:"PHRlbXBsYXRlPgogIDxkaXY+CiAgICA8YS1yYWRpby1ncm91cCB2LW1vZGVsOnZhbHVlPSJzaXplIiBzdHlsZT0ibWFyZ2luLWJvdHRvbTogMTZweCI+CiAgICAgIDxhLXJhZGlvLWJ1dHRvbiB2YWx1ZT0ic21hbGwiPlNtYWxsPC9hLXJhZGlvLWJ1dHRvbj4KICAgICAgPGEtcmFkaW8tYnV0dG9uIHZhbHVlPSJkZWZhdWx0Ij5EZWZhdWx0PC9hLXJhZGlvLWJ1dHRvbj4KICAgICAgPGEtcmFkaW8tYnV0dG9uIHZhbHVlPSJsYXJnZSI+TGFyZ2U8L2EtcmFkaW8tYnV0dG9uPgogICAgPC9hLXJhZGlvLWdyb3VwPgogICAgPGEtdGFicyB2LW1vZGVsOmFjdGl2ZUtleT0iYWN0aXZlS2V5IiA6c2l6ZT0ic2l6ZSI+CiAgICAgIDxhLXRhYi1wYW5lIGtleT0iMSIgdGFiPSJUYWIgMSI+Q29udGVudCBvZiB0YWIgMTwvYS10YWItcGFuZT4KICAgICAgPGEtdGFiLXBhbmUga2V5PSIyIiB0YWI9IlRhYiAyIj5Db250ZW50IG9mIHRhYiAyPC9hLXRhYi1wYW5lPgogICAgICA8YS10YWItcGFuZSBrZXk9IjMiIHRhYj0iVGFiIDMiPkNvbnRlbnQgb2YgdGFiIDM8L2EtdGFiLXBhbmU+CiAgICA8L2EtdGFicz4KICA8L2Rpdj4KPC90ZW1wbGF0ZT4KPHNjcmlwdD4KaW1wb3J0IHsgZGVmaW5lQ29tcG9uZW50LCByZWYgfSBmcm9tICd2dWUnOwpleHBvcnQgZGVmYXVsdCBkZWZpbmVDb21wb25lbnQoewogIHNldHVwKCkgewogICAgY29uc3Qgc2l6ZSA9IHJlZignc21hbGwnKTsKICAgIGNvbnN0IGFjdGl2ZUtleSA9IHJlZignMScpOwogICAgcmV0dXJuIHsKICAgICAgc2l6ZSwKICAgICAgYWN0aXZlS2V5LAogICAgfTsKICB9LAp9KTsKPC9zY3JpcHQ+"}},{default:s(()=>[n("div",null,[e(u,{value:o.size,"onUpdate:value":t[0]||(t[0]=C=>o.size=C),style:{"margin-bottom":"16px"}},{default:s(()=>[e(c,{value:"small"},{default:s(()=>t[2]||(t[2]=[a("Small")])),_:1,__:[2]}),e(c,{value:"default"},{default:s(()=>t[3]||(t[3]=[a("Default")])),_:1,__:[3]}),e(c,{value:"large"},{default:s(()=>t[4]||(t[4]=[a("Large")])),_:1,__:[4]})]),_:1},8,["value"]),e(k,{activeKey:o.activeKey,"onUpdate:activeKey":t[1]||(t[1]=C=>o.activeKey=C),size:o.size},{default:s(()=>[e(l,{key:"1",tab:"Tab 1"},{default:s(()=>t[5]||(t[5]=[a("Content of tab 1")])),_:1,__:[5]}),e(l,{key:"2",tab:"Tab 2"},{default:s(()=>t[6]||(t[6]=[a("Content of tab 2")])),_:1,__:[6]}),e(l,{key:"3",tab:"Tab 3"},{default:s(()=>t[7]||(t[7]=[a("Content of tab 3")])),_:1,__:[7]})]),_:1},8,["activeKey","size"])])]),htmlCode:s(()=>t[8]||(t[8]=[n("pre",{class:"language-vue"},[n("code",null,[n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),a("template")]),n("span",{class:"token punctuation"},">")]),a(`
  `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),a("div")]),n("span",{class:"token punctuation"},">")]),a(`
    `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),a("a-radio-group")]),a(),n("span",{class:"token attr-name"},[n("span",{class:"token namespace"},"v-model:"),a("value")]),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),a("size"),n("span",{class:"token punctuation"},'"')]),a(),n("span",{class:"token special-attr"},[n("span",{class:"token attr-name"},"style"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),n("span",{class:"token value css language-css"},[n("span",{class:"token property"},"margin-bottom"),n("span",{class:"token punctuation"},":"),a(" 16px")]),n("span",{class:"token punctuation"},'"')])]),n("span",{class:"token punctuation"},">")]),a(`
      `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),a("a-radio-button")]),a(),n("span",{class:"token attr-name"},"value"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),a("small"),n("span",{class:"token punctuation"},'"')]),n("span",{class:"token punctuation"},">")]),a("Small"),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"</"),a("a-radio-button")]),n("span",{class:"token punctuation"},">")]),a(`
      `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),a("a-radio-button")]),a(),n("span",{class:"token attr-name"},"value"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),a("default"),n("span",{class:"token punctuation"},'"')]),n("span",{class:"token punctuation"},">")]),a("Default"),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"</"),a("a-radio-button")]),n("span",{class:"token punctuation"},">")]),a(`
      `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),a("a-radio-button")]),a(),n("span",{class:"token attr-name"},"value"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),a("large"),n("span",{class:"token punctuation"},'"')]),n("span",{class:"token punctuation"},">")]),a("Large"),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"</"),a("a-radio-button")]),n("span",{class:"token punctuation"},">")]),a(`
    `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"</"),a("a-radio-group")]),n("span",{class:"token punctuation"},">")]),a(`
    `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),a("a-tabs")]),a(),n("span",{class:"token attr-name"},[n("span",{class:"token namespace"},"v-model:"),a("activeKey")]),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),a("activeKey"),n("span",{class:"token punctuation"},'"')]),a(),n("span",{class:"token attr-name"},":size"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),a("size"),n("span",{class:"token punctuation"},'"')]),n("span",{class:"token punctuation"},">")]),a(`
      `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),a("a-tab-pane")]),a(),n("span",{class:"token attr-name"},"key"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),a("1"),n("span",{class:"token punctuation"},'"')]),a(),n("span",{class:"token attr-name"},"tab"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),a("Tab 1"),n("span",{class:"token punctuation"},'"')]),n("span",{class:"token punctuation"},">")]),a("Content of tab 1"),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"</"),a("a-tab-pane")]),n("span",{class:"token punctuation"},">")]),a(`
      `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),a("a-tab-pane")]),a(),n("span",{class:"token attr-name"},"key"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),a("2"),n("span",{class:"token punctuation"},'"')]),a(),n("span",{class:"token attr-name"},"tab"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),a("Tab 2"),n("span",{class:"token punctuation"},'"')]),n("span",{class:"token punctuation"},">")]),a("Content of tab 2"),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"</"),a("a-tab-pane")]),n("span",{class:"token punctuation"},">")]),a(`
      `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),a("a-tab-pane")]),a(),n("span",{class:"token attr-name"},"key"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),a("3"),n("span",{class:"token punctuation"},'"')]),a(),n("span",{class:"token attr-name"},"tab"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),a("Tab 3"),n("span",{class:"token punctuation"},'"')]),n("span",{class:"token punctuation"},">")]),a("Content of tab 3"),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"</"),a("a-tab-pane")]),n("span",{class:"token punctuation"},">")]),a(`
    `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"</"),a("a-tabs")]),n("span",{class:"token punctuation"},">")]),a(`
  `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"</"),a("div")]),n("span",{class:"token punctuation"},">")]),a(`
`),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"</"),a("template")]),n("span",{class:"token punctuation"},">")]),a(`
`),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),a("script")]),a(),n("span",{class:"token attr-name"},"lang"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),a("ts"),n("span",{class:"token punctuation"},'"')]),n("span",{class:"token punctuation"},">")]),n("span",{class:"token script"},[n("span",{class:"token language-javascript"},[a(`
`),n("span",{class:"token keyword"},"import"),a(),n("span",{class:"token punctuation"},"{"),a(" defineComponent"),n("span",{class:"token punctuation"},","),a(" ref "),n("span",{class:"token punctuation"},"}"),a(),n("span",{class:"token keyword"},"from"),a(),n("span",{class:"token string"},"'vue'"),n("span",{class:"token punctuation"},";"),a(`
`),n("span",{class:"token keyword"},"import"),a(" type "),n("span",{class:"token punctuation"},"{"),a(" TabsProps "),n("span",{class:"token punctuation"},"}"),a(),n("span",{class:"token keyword"},"from"),a(),n("span",{class:"token string"},"'ant-design-vue'"),n("span",{class:"token punctuation"},";"),a(`

`),n("span",{class:"token keyword"},"export"),a(),n("span",{class:"token keyword"},"default"),a(),n("span",{class:"token function"},"defineComponent"),n("span",{class:"token punctuation"},"("),n("span",{class:"token punctuation"},"{"),a(`
  `),n("span",{class:"token function"},"setup"),n("span",{class:"token punctuation"},"("),n("span",{class:"token punctuation"},")"),a(),n("span",{class:"token punctuation"},"{"),a(`
    `),n("span",{class:"token keyword"},"const"),a(" size "),n("span",{class:"token operator"},"="),a(" ref"),n("span",{class:"token operator"},"<"),a("TabsProps"),n("span",{class:"token punctuation"},"["),n("span",{class:"token string"},"'size'"),n("span",{class:"token punctuation"},"]"),n("span",{class:"token operator"},">"),n("span",{class:"token punctuation"},"("),n("span",{class:"token string"},"'small'"),n("span",{class:"token punctuation"},")"),n("span",{class:"token punctuation"},";"),a(`
    `),n("span",{class:"token keyword"},"const"),a(" activeKey "),n("span",{class:"token operator"},"="),a(),n("span",{class:"token function"},"ref"),n("span",{class:"token punctuation"},"("),n("span",{class:"token string"},"'1'"),n("span",{class:"token punctuation"},")"),n("span",{class:"token punctuation"},";"),a(`
    `),n("span",{class:"token keyword"},"return"),a(),n("span",{class:"token punctuation"},"{"),a(`
      size`),n("span",{class:"token punctuation"},","),a(`
      activeKey`),n("span",{class:"token punctuation"},","),a(`
    `),n("span",{class:"token punctuation"},"}"),n("span",{class:"token punctuation"},";"),a(`
  `),n("span",{class:"token punctuation"},"}"),n("span",{class:"token punctuation"},","),a(`
`),n("span",{class:"token punctuation"},"}"),n("span",{class:"token punctuation"},")"),n("span",{class:"token punctuation"},";"),a(`
`)])]),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"</"),a("script")]),n("span",{class:"token punctuation"},">")]),a(`
`)])],-1)])),jsVersionHtml:s(()=>t[9]||(t[9]=[n("pre",{class:"language-vue"},[n("code",null,[n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),a("template")]),n("span",{class:"token punctuation"},">")]),a(`
  `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),a("div")]),n("span",{class:"token punctuation"},">")]),a(`
    `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),a("a-radio-group")]),a(),n("span",{class:"token attr-name"},[n("span",{class:"token namespace"},"v-model:"),a("value")]),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),a("size"),n("span",{class:"token punctuation"},'"')]),a(),n("span",{class:"token special-attr"},[n("span",{class:"token attr-name"},"style"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),n("span",{class:"token value css language-css"},[n("span",{class:"token property"},"margin-bottom"),n("span",{class:"token punctuation"},":"),a(" 16px")]),n("span",{class:"token punctuation"},'"')])]),n("span",{class:"token punctuation"},">")]),a(`
      `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),a("a-radio-button")]),a(),n("span",{class:"token attr-name"},"value"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),a("small"),n("span",{class:"token punctuation"},'"')]),n("span",{class:"token punctuation"},">")]),a("Small"),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"</"),a("a-radio-button")]),n("span",{class:"token punctuation"},">")]),a(`
      `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),a("a-radio-button")]),a(),n("span",{class:"token attr-name"},"value"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),a("default"),n("span",{class:"token punctuation"},'"')]),n("span",{class:"token punctuation"},">")]),a("Default"),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"</"),a("a-radio-button")]),n("span",{class:"token punctuation"},">")]),a(`
      `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),a("a-radio-button")]),a(),n("span",{class:"token attr-name"},"value"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),a("large"),n("span",{class:"token punctuation"},'"')]),n("span",{class:"token punctuation"},">")]),a("Large"),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"</"),a("a-radio-button")]),n("span",{class:"token punctuation"},">")]),a(`
    `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"</"),a("a-radio-group")]),n("span",{class:"token punctuation"},">")]),a(`
    `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),a("a-tabs")]),a(),n("span",{class:"token attr-name"},[n("span",{class:"token namespace"},"v-model:"),a("activeKey")]),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),a("activeKey"),n("span",{class:"token punctuation"},'"')]),a(),n("span",{class:"token attr-name"},":size"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),a("size"),n("span",{class:"token punctuation"},'"')]),n("span",{class:"token punctuation"},">")]),a(`
      `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),a("a-tab-pane")]),a(),n("span",{class:"token attr-name"},"key"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),a("1"),n("span",{class:"token punctuation"},'"')]),a(),n("span",{class:"token attr-name"},"tab"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),a("Tab 1"),n("span",{class:"token punctuation"},'"')]),n("span",{class:"token punctuation"},">")]),a("Content of tab 1"),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"</"),a("a-tab-pane")]),n("span",{class:"token punctuation"},">")]),a(`
      `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),a("a-tab-pane")]),a(),n("span",{class:"token attr-name"},"key"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),a("2"),n("span",{class:"token punctuation"},'"')]),a(),n("span",{class:"token attr-name"},"tab"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),a("Tab 2"),n("span",{class:"token punctuation"},'"')]),n("span",{class:"token punctuation"},">")]),a("Content of tab 2"),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"</"),a("a-tab-pane")]),n("span",{class:"token punctuation"},">")]),a(`
      `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),a("a-tab-pane")]),a(),n("span",{class:"token attr-name"},"key"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),a("3"),n("span",{class:"token punctuation"},'"')]),a(),n("span",{class:"token attr-name"},"tab"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),a("Tab 3"),n("span",{class:"token punctuation"},'"')]),n("span",{class:"token punctuation"},">")]),a("Content of tab 3"),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"</"),a("a-tab-pane")]),n("span",{class:"token punctuation"},">")]),a(`
    `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"</"),a("a-tabs")]),n("span",{class:"token punctuation"},">")]),a(`
  `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"</"),a("div")]),n("span",{class:"token punctuation"},">")]),a(`
`),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"</"),a("template")]),n("span",{class:"token punctuation"},">")]),a(`
`),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),a("script")]),n("span",{class:"token punctuation"},">")]),n("span",{class:"token script"},[n("span",{class:"token language-javascript"},[a(`
`),n("span",{class:"token keyword"},"import"),a(),n("span",{class:"token punctuation"},"{"),a(" defineComponent"),n("span",{class:"token punctuation"},","),a(" ref "),n("span",{class:"token punctuation"},"}"),a(),n("span",{class:"token keyword"},"from"),a(),n("span",{class:"token string"},"'vue'"),n("span",{class:"token punctuation"},";"),a(`
`),n("span",{class:"token keyword"},"export"),a(),n("span",{class:"token keyword"},"default"),a(),n("span",{class:"token function"},"defineComponent"),n("span",{class:"token punctuation"},"("),n("span",{class:"token punctuation"},"{"),a(`
  `),n("span",{class:"token function"},"setup"),n("span",{class:"token punctuation"},"("),n("span",{class:"token punctuation"},")"),a(),n("span",{class:"token punctuation"},"{"),a(`
    `),n("span",{class:"token keyword"},"const"),a(" size "),n("span",{class:"token operator"},"="),a(),n("span",{class:"token function"},"ref"),n("span",{class:"token punctuation"},"("),n("span",{class:"token string"},"'small'"),n("span",{class:"token punctuation"},")"),n("span",{class:"token punctuation"},";"),a(`
    `),n("span",{class:"token keyword"},"const"),a(" activeKey "),n("span",{class:"token operator"},"="),a(),n("span",{class:"token function"},"ref"),n("span",{class:"token punctuation"},"("),n("span",{class:"token string"},"'1'"),n("span",{class:"token punctuation"},")"),n("span",{class:"token punctuation"},";"),a(`
    `),n("span",{class:"token keyword"},"return"),a(),n("span",{class:"token punctuation"},"{"),a(`
      size`),n("span",{class:"token punctuation"},","),a(`
      activeKey`),n("span",{class:"token punctuation"},","),a(`
    `),n("span",{class:"token punctuation"},"}"),n("span",{class:"token punctuation"},";"),a(`
  `),n("span",{class:"token punctuation"},"}"),n("span",{class:"token punctuation"},","),a(`
`),n("span",{class:"token punctuation"},"}"),n("span",{class:"token punctuation"},")"),n("span",{class:"token punctuation"},";"),a(`
`)])]),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"</"),a("script")]),n("span",{class:"token punctuation"},">")]),a(`
`)])],-1)])),_:1})}const Cn=y(bn,[["render",In]]),mn=A({setup(){const o=b("top"),t=b(1);return{mode:o,callback:r=>{console.log(r)},activeKey:t}}});function hn(o,t,d,r,I,m){const c=p("a-radio-button"),u=p("a-radio-group"),l=p("a-tab-pane"),k=p("a-tabs"),g=p("demo-box");return i(),h(g,{jsfiddle:{us:"In order to fit in more tabs, they can slide left and right (or up and down).",cn:"\u53EF\u4EE5\u5DE6\u53F3\u3001\u4E0A\u4E0B\u6ED1\u52A8\uFF0C\u5BB9\u7EB3\u66F4\u591A\u6807\u7B7E\u3002",docHtml:`<h2 id="zh-CN">zh-CN <a class="header-anchor" href="#zh-CN">
          <span aria-hidden="true" class="anchor">#</span>
        </a></h2>
<p>\u53EF\u4EE5\u5DE6\u53F3\u3001\u4E0A\u4E0B\u6ED1\u52A8\uFF0C\u5BB9\u7EB3\u66F4\u591A\u6807\u7B7E\u3002</p>
<h2 id="en-US">en-US <a class="header-anchor" href="#en-US">
          <span aria-hidden="true" class="anchor">#</span>
        </a></h2>
<p>In order to fit in more tabs, they can slide left and right (or up and down).</p>
`,order:3,title:{"zh-CN":"\u6ED1\u52A8","en-US":"Slide"},relativePath:"components/tabs/demo/slide.vue",sourceCode:"PHRlbXBsYXRlPgogIDxkaXY+CiAgICA8YS1yYWRpby1ncm91cCB2LW1vZGVsOnZhbHVlPSJtb2RlIiA6c3R5bGU9InsgbWFyZ2luQm90dG9tOiAnOHB4JyB9Ij4KICAgICAgPGEtcmFkaW8tYnV0dG9uIHZhbHVlPSJ0b3AiPkhvcml6b250YWw8L2EtcmFkaW8tYnV0dG9uPgogICAgICA8YS1yYWRpby1idXR0b24gdmFsdWU9ImxlZnQiPlZlcnRpY2FsPC9hLXJhZGlvLWJ1dHRvbj4KICAgIDwvYS1yYWRpby1ncm91cD4KICAgIDxhLXRhYnMKICAgICAgdi1tb2RlbDphY3RpdmVLZXk9ImFjdGl2ZUtleSIKICAgICAgOnRhYi1wb3NpdGlvbj0ibW9kZSIKICAgICAgOnN0eWxlPSJ7IGhlaWdodDogJzIwMHB4JyB9IgogICAgICBAdGFiU2Nyb2xsPSJjYWxsYmFjayIKICAgID4KICAgICAgPGEtdGFiLXBhbmUgdi1mb3I9ImkgaW4gMzAiIDprZXk9ImkiIDp0YWI9ImBUYWItJHtpfWAiPkNvbnRlbnQgb2YgdGFiIHt7IGkgfX08L2EtdGFiLXBhbmU+CiAgICA8L2EtdGFicz4KICA8L2Rpdj4KPC90ZW1wbGF0ZT4KPHNjcmlwdCBsYW5nPSJ0cyI+CmltcG9ydCB7IGRlZmluZUNvbXBvbmVudCwgcmVmIH0gZnJvbSAndnVlJzsKaW1wb3J0IHR5cGUgeyBUYWJzUHJvcHMgfSBmcm9tICdhbnQtZGVzaWduLXZ1ZSc7CgpleHBvcnQgZGVmYXVsdCBkZWZpbmVDb21wb25lbnQoewogIHNldHVwKCkgewogICAgY29uc3QgbW9kZSA9IHJlZjxUYWJzUHJvcHNbJ3RhYlBvc2l0aW9uJ10+KCd0b3AnKTsKICAgIGNvbnN0IGFjdGl2ZUtleSA9IHJlZigxKTsKICAgIGNvbnN0IGNhbGxiYWNrOiBUYWJzUHJvcHNbJ29uVGFiU2Nyb2xsJ10gPSB2YWwgPT4gewogICAgICBjb25zb2xlLmxvZyh2YWwpOwogICAgfTsKICAgIHJldHVybiB7CiAgICAgIG1vZGUsCiAgICAgIGNhbGxiYWNrLAogICAgICBhY3RpdmVLZXksCiAgICB9OwogIH0sCn0pOwo8L3NjcmlwdD4KCg==",jsSourceCode:"PHRlbXBsYXRlPgogIDxkaXY+CiAgICA8YS1yYWRpby1ncm91cCB2LW1vZGVsOnZhbHVlPSJtb2RlIiA6c3R5bGU9InsgbWFyZ2luQm90dG9tOiAnOHB4JyB9Ij4KICAgICAgPGEtcmFkaW8tYnV0dG9uIHZhbHVlPSJ0b3AiPkhvcml6b250YWw8L2EtcmFkaW8tYnV0dG9uPgogICAgICA8YS1yYWRpby1idXR0b24gdmFsdWU9ImxlZnQiPlZlcnRpY2FsPC9hLXJhZGlvLWJ1dHRvbj4KICAgIDwvYS1yYWRpby1ncm91cD4KICAgIDxhLXRhYnMKICAgICAgdi1tb2RlbDphY3RpdmVLZXk9ImFjdGl2ZUtleSIKICAgICAgOnRhYi1wb3NpdGlvbj0ibW9kZSIKICAgICAgOnN0eWxlPSJ7IGhlaWdodDogJzIwMHB4JyB9IgogICAgICBAdGFiU2Nyb2xsPSJjYWxsYmFjayIKICAgID4KICAgICAgPGEtdGFiLXBhbmUgdi1mb3I9ImkgaW4gMzAiIDprZXk9ImkiIDp0YWI9ImBUYWItJHtpfWAiPkNvbnRlbnQgb2YgdGFiIHt7IGkgfX08L2EtdGFiLXBhbmU+CiAgICA8L2EtdGFicz4KICA8L2Rpdj4KPC90ZW1wbGF0ZT4KPHNjcmlwdD4KaW1wb3J0IHsgZGVmaW5lQ29tcG9uZW50LCByZWYgfSBmcm9tICd2dWUnOwpleHBvcnQgZGVmYXVsdCBkZWZpbmVDb21wb25lbnQoewogIHNldHVwKCkgewogICAgY29uc3QgbW9kZSA9IHJlZigndG9wJyk7CiAgICBjb25zdCBhY3RpdmVLZXkgPSByZWYoMSk7CiAgICBjb25zdCBjYWxsYmFjayA9IHZhbCA9PiB7CiAgICAgIGNvbnNvbGUubG9nKHZhbCk7CiAgICB9OwogICAgcmV0dXJuIHsKICAgICAgbW9kZSwKICAgICAgY2FsbGJhY2ssCiAgICAgIGFjdGl2ZUtleSwKICAgIH07CiAgfSwKfSk7Cjwvc2NyaXB0Pg=="}},{default:s(()=>[n("div",null,[e(u,{value:o.mode,"onUpdate:value":t[0]||(t[0]=C=>o.mode=C),style:{marginBottom:"8px"}},{default:s(()=>[e(c,{value:"top"},{default:s(()=>t[2]||(t[2]=[a("Horizontal")])),_:1,__:[2]}),e(c,{value:"left"},{default:s(()=>t[3]||(t[3]=[a("Vertical")])),_:1,__:[3]})]),_:1},8,["value"]),e(k,{activeKey:o.activeKey,"onUpdate:activeKey":t[1]||(t[1]=C=>o.activeKey=C),"tab-position":o.mode,style:{height:"200px"},onTabScroll:o.callback},{default:s(()=>[(i(),v(f,null,Y(30,C=>e(l,{key:C,tab:`Tab-${C}`},{default:s(()=>[a("Content of tab "+Z(C),1)]),_:2},1032,["tab"])),64))]),_:1},8,["activeKey","tab-position","onTabScroll"])])]),htmlCode:s(()=>t[4]||(t[4]=[n("pre",{class:"language-vue"},[n("code",null,[n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),a("template")]),n("span",{class:"token punctuation"},">")]),a(`
  `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),a("div")]),n("span",{class:"token punctuation"},">")]),a(`
    `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),a("a-radio-group")]),a(),n("span",{class:"token attr-name"},[n("span",{class:"token namespace"},"v-model:"),a("value")]),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),a("mode"),n("span",{class:"token punctuation"},'"')]),a(),n("span",{class:"token attr-name"},":style"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),a("{ marginBottom: '8px' }"),n("span",{class:"token punctuation"},'"')]),n("span",{class:"token punctuation"},">")]),a(`
      `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),a("a-radio-button")]),a(),n("span",{class:"token attr-name"},"value"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),a("top"),n("span",{class:"token punctuation"},'"')]),n("span",{class:"token punctuation"},">")]),a("Horizontal"),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"</"),a("a-radio-button")]),n("span",{class:"token punctuation"},">")]),a(`
      `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),a("a-radio-button")]),a(),n("span",{class:"token attr-name"},"value"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),a("left"),n("span",{class:"token punctuation"},'"')]),n("span",{class:"token punctuation"},">")]),a("Vertical"),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"</"),a("a-radio-button")]),n("span",{class:"token punctuation"},">")]),a(`
    `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"</"),a("a-radio-group")]),n("span",{class:"token punctuation"},">")]),a(`
    `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),a("a-tabs")]),a(`
      `),n("span",{class:"token attr-name"},[n("span",{class:"token namespace"},"v-model:"),a("activeKey")]),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),a("activeKey"),n("span",{class:"token punctuation"},'"')]),a(`
      `),n("span",{class:"token attr-name"},":tab-position"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),a("mode"),n("span",{class:"token punctuation"},'"')]),a(`
      `),n("span",{class:"token attr-name"},":style"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),a("{ height: '200px' }"),n("span",{class:"token punctuation"},'"')]),a(`
      `),n("span",{class:"token attr-name"},"@tabScroll"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),a("callback"),n("span",{class:"token punctuation"},'"')]),a(`
    `),n("span",{class:"token punctuation"},">")]),a(`
      `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),a("a-tab-pane")]),a(),n("span",{class:"token attr-name"},"v-for"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),a("i in 30"),n("span",{class:"token punctuation"},'"')]),a(),n("span",{class:"token attr-name"},":key"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),a("i"),n("span",{class:"token punctuation"},'"')]),a(),n("span",{class:"token attr-name"},":tab"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),a("`Tab-${i}`"),n("span",{class:"token punctuation"},'"')]),n("span",{class:"token punctuation"},">")]),a("Content of tab {{ i }}"),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"</"),a("a-tab-pane")]),n("span",{class:"token punctuation"},">")]),a(`
    `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"</"),a("a-tabs")]),n("span",{class:"token punctuation"},">")]),a(`
  `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"</"),a("div")]),n("span",{class:"token punctuation"},">")]),a(`
`),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"</"),a("template")]),n("span",{class:"token punctuation"},">")]),a(`
`),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),a("script")]),a(),n("span",{class:"token attr-name"},"lang"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),a("ts"),n("span",{class:"token punctuation"},'"')]),n("span",{class:"token punctuation"},">")]),n("span",{class:"token script"},[n("span",{class:"token language-javascript"},[a(`
`),n("span",{class:"token keyword"},"import"),a(),n("span",{class:"token punctuation"},"{"),a(" defineComponent"),n("span",{class:"token punctuation"},","),a(" ref "),n("span",{class:"token punctuation"},"}"),a(),n("span",{class:"token keyword"},"from"),a(),n("span",{class:"token string"},"'vue'"),n("span",{class:"token punctuation"},";"),a(`
`),n("span",{class:"token keyword"},"import"),a(" type "),n("span",{class:"token punctuation"},"{"),a(" TabsProps "),n("span",{class:"token punctuation"},"}"),a(),n("span",{class:"token keyword"},"from"),a(),n("span",{class:"token string"},"'ant-design-vue'"),n("span",{class:"token punctuation"},";"),a(`

`),n("span",{class:"token keyword"},"export"),a(),n("span",{class:"token keyword"},"default"),a(),n("span",{class:"token function"},"defineComponent"),n("span",{class:"token punctuation"},"("),n("span",{class:"token punctuation"},"{"),a(`
  `),n("span",{class:"token function"},"setup"),n("span",{class:"token punctuation"},"("),n("span",{class:"token punctuation"},")"),a(),n("span",{class:"token punctuation"},"{"),a(`
    `),n("span",{class:"token keyword"},"const"),a(" mode "),n("span",{class:"token operator"},"="),a(" ref"),n("span",{class:"token operator"},"<"),a("TabsProps"),n("span",{class:"token punctuation"},"["),n("span",{class:"token string"},"'tabPosition'"),n("span",{class:"token punctuation"},"]"),n("span",{class:"token operator"},">"),n("span",{class:"token punctuation"},"("),n("span",{class:"token string"},"'top'"),n("span",{class:"token punctuation"},")"),n("span",{class:"token punctuation"},";"),a(`
    `),n("span",{class:"token keyword"},"const"),a(" activeKey "),n("span",{class:"token operator"},"="),a(),n("span",{class:"token function"},"ref"),n("span",{class:"token punctuation"},"("),n("span",{class:"token number"},"1"),n("span",{class:"token punctuation"},")"),n("span",{class:"token punctuation"},";"),a(`
    `),n("span",{class:"token keyword"},"const"),a(),n("span",{class:"token literal-property property"},"callback"),n("span",{class:"token operator"},":"),a(" TabsProps"),n("span",{class:"token punctuation"},"["),n("span",{class:"token string"},"'onTabScroll'"),n("span",{class:"token punctuation"},"]"),a(),n("span",{class:"token operator"},"="),a(),n("span",{class:"token parameter"},"val"),a(),n("span",{class:"token operator"},"=>"),a(),n("span",{class:"token punctuation"},"{"),a(`
      console`),n("span",{class:"token punctuation"},"."),n("span",{class:"token function"},"log"),n("span",{class:"token punctuation"},"("),a("val"),n("span",{class:"token punctuation"},")"),n("span",{class:"token punctuation"},";"),a(`
    `),n("span",{class:"token punctuation"},"}"),n("span",{class:"token punctuation"},";"),a(`
    `),n("span",{class:"token keyword"},"return"),a(),n("span",{class:"token punctuation"},"{"),a(`
      mode`),n("span",{class:"token punctuation"},","),a(`
      callback`),n("span",{class:"token punctuation"},","),a(`
      activeKey`),n("span",{class:"token punctuation"},","),a(`
    `),n("span",{class:"token punctuation"},"}"),n("span",{class:"token punctuation"},";"),a(`
  `),n("span",{class:"token punctuation"},"}"),n("span",{class:"token punctuation"},","),a(`
`),n("span",{class:"token punctuation"},"}"),n("span",{class:"token punctuation"},")"),n("span",{class:"token punctuation"},";"),a(`
`)])]),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"</"),a("script")]),n("span",{class:"token punctuation"},">")]),a(`
`)])],-1)])),jsVersionHtml:s(()=>t[5]||(t[5]=[n("pre",{class:"language-vue"},[n("code",null,[n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),a("template")]),n("span",{class:"token punctuation"},">")]),a(`
  `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),a("div")]),n("span",{class:"token punctuation"},">")]),a(`
    `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),a("a-radio-group")]),a(),n("span",{class:"token attr-name"},[n("span",{class:"token namespace"},"v-model:"),a("value")]),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),a("mode"),n("span",{class:"token punctuation"},'"')]),a(),n("span",{class:"token attr-name"},":style"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),a("{ marginBottom: '8px' }"),n("span",{class:"token punctuation"},'"')]),n("span",{class:"token punctuation"},">")]),a(`
      `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),a("a-radio-button")]),a(),n("span",{class:"token attr-name"},"value"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),a("top"),n("span",{class:"token punctuation"},'"')]),n("span",{class:"token punctuation"},">")]),a("Horizontal"),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"</"),a("a-radio-button")]),n("span",{class:"token punctuation"},">")]),a(`
      `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),a("a-radio-button")]),a(),n("span",{class:"token attr-name"},"value"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),a("left"),n("span",{class:"token punctuation"},'"')]),n("span",{class:"token punctuation"},">")]),a("Vertical"),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"</"),a("a-radio-button")]),n("span",{class:"token punctuation"},">")]),a(`
    `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"</"),a("a-radio-group")]),n("span",{class:"token punctuation"},">")]),a(`
    `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),a("a-tabs")]),a(`
      `),n("span",{class:"token attr-name"},[n("span",{class:"token namespace"},"v-model:"),a("activeKey")]),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),a("activeKey"),n("span",{class:"token punctuation"},'"')]),a(`
      `),n("span",{class:"token attr-name"},":tab-position"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),a("mode"),n("span",{class:"token punctuation"},'"')]),a(`
      `),n("span",{class:"token attr-name"},":style"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),a("{ height: '200px' }"),n("span",{class:"token punctuation"},'"')]),a(`
      `),n("span",{class:"token attr-name"},"@tabScroll"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),a("callback"),n("span",{class:"token punctuation"},'"')]),a(`
    `),n("span",{class:"token punctuation"},">")]),a(`
      `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),a("a-tab-pane")]),a(),n("span",{class:"token attr-name"},"v-for"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),a("i in 30"),n("span",{class:"token punctuation"},'"')]),a(),n("span",{class:"token attr-name"},":key"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),a("i"),n("span",{class:"token punctuation"},'"')]),a(),n("span",{class:"token attr-name"},":tab"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),a("`Tab-${i}`"),n("span",{class:"token punctuation"},'"')]),n("span",{class:"token punctuation"},">")]),a("Content of tab {{ i }}"),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"</"),a("a-tab-pane")]),n("span",{class:"token punctuation"},">")]),a(`
    `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"</"),a("a-tabs")]),n("span",{class:"token punctuation"},">")]),a(`
  `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"</"),a("div")]),n("span",{class:"token punctuation"},">")]),a(`
`),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"</"),a("template")]),n("span",{class:"token punctuation"},">")]),a(`
`),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),a("script")]),n("span",{class:"token punctuation"},">")]),n("span",{class:"token script"},[n("span",{class:"token language-javascript"},[a(`
`),n("span",{class:"token keyword"},"import"),a(),n("span",{class:"token punctuation"},"{"),a(" defineComponent"),n("span",{class:"token punctuation"},","),a(" ref "),n("span",{class:"token punctuation"},"}"),a(),n("span",{class:"token keyword"},"from"),a(),n("span",{class:"token string"},"'vue'"),n("span",{class:"token punctuation"},";"),a(`
`),n("span",{class:"token keyword"},"export"),a(),n("span",{class:"token keyword"},"default"),a(),n("span",{class:"token function"},"defineComponent"),n("span",{class:"token punctuation"},"("),n("span",{class:"token punctuation"},"{"),a(`
  `),n("span",{class:"token function"},"setup"),n("span",{class:"token punctuation"},"("),n("span",{class:"token punctuation"},")"),a(),n("span",{class:"token punctuation"},"{"),a(`
    `),n("span",{class:"token keyword"},"const"),a(" mode "),n("span",{class:"token operator"},"="),a(),n("span",{class:"token function"},"ref"),n("span",{class:"token punctuation"},"("),n("span",{class:"token string"},"'top'"),n("span",{class:"token punctuation"},")"),n("span",{class:"token punctuation"},";"),a(`
    `),n("span",{class:"token keyword"},"const"),a(" activeKey "),n("span",{class:"token operator"},"="),a(),n("span",{class:"token function"},"ref"),n("span",{class:"token punctuation"},"("),n("span",{class:"token number"},"1"),n("span",{class:"token punctuation"},")"),n("span",{class:"token punctuation"},";"),a(`
    `),n("span",{class:"token keyword"},"const"),a(),n("span",{class:"token function-variable function"},"callback"),a(),n("span",{class:"token operator"},"="),a(),n("span",{class:"token parameter"},"val"),a(),n("span",{class:"token operator"},"=>"),a(),n("span",{class:"token punctuation"},"{"),a(`
      console`),n("span",{class:"token punctuation"},"."),n("span",{class:"token function"},"log"),n("span",{class:"token punctuation"},"("),a("val"),n("span",{class:"token punctuation"},")"),n("span",{class:"token punctuation"},";"),a(`
    `),n("span",{class:"token punctuation"},"}"),n("span",{class:"token punctuation"},";"),a(`
    `),n("span",{class:"token keyword"},"return"),a(),n("span",{class:"token punctuation"},"{"),a(`
      mode`),n("span",{class:"token punctuation"},","),a(`
      callback`),n("span",{class:"token punctuation"},","),a(`
      activeKey`),n("span",{class:"token punctuation"},","),a(`
    `),n("span",{class:"token punctuation"},"}"),n("span",{class:"token punctuation"},";"),a(`
  `),n("span",{class:"token punctuation"},"}"),n("span",{class:"token punctuation"},","),a(`
`),n("span",{class:"token punctuation"},"}"),n("span",{class:"token punctuation"},")"),n("span",{class:"token punctuation"},";"),a(`
`)])]),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"</"),a("script")]),n("span",{class:"token punctuation"},">")]),a(`
`)])],-1)])),_:1})}const yn=y(mn,[["render",hn]]),An=A({setup(){return{activeKey:b("1")}}});function vn(o,t,d,r,I,m){const c=p("a-tab-pane"),u=p("a-tabs"),l=p("demo-box");return i(),h(l,{jsfiddle:{us:"Customized bar of tab.",cn:"\u81EA\u5B9A\u4E49\u9875\u7B7E\u5934",docHtml:`<h2 id="zh-CN">zh-CN <a class="header-anchor" href="#zh-CN">
          <span aria-hidden="true" class="anchor">#</span>
        </a></h2>
<p>\u81EA\u5B9A\u4E49\u9875\u7B7E\u5934</p>
<h2 id="en-US">en-US <a class="header-anchor" href="#en-US">
          <span aria-hidden="true" class="anchor">#</span>
        </a></h2>
<p>Customized bar of tab.</p>
`,order:11,title:{"zh-CN":"\u81EA\u5B9A\u4E49\u9875\u7B7E\u5934","en-US":"Customized"},relativePath:"components/tabs/demo/custom-tab-bar.vue",sourceCode:"PHRlbXBsYXRlPgogIDxkaXY+CiAgICA8YS10YWJzIHYtbW9kZWw6YWN0aXZlS2V5PSJhY3RpdmVLZXkiPgogICAgICA8YS10YWItcGFuZSBrZXk9IjEiIHRhYj0iVGFiIDEiIHN0eWxlPSJoZWlnaHQ6IDIwMHB4Ij5Db250ZW50IG9mIFRhYiBQYW5lIDE8L2EtdGFiLXBhbmU+CiAgICAgIDxhLXRhYi1wYW5lIGtleT0iMiIgdGFiPSJUYWIgMiIgZm9yY2UtcmVuZGVyPkNvbnRlbnQgb2YgVGFiIFBhbmUgMjwvYS10YWItcGFuZT4KICAgICAgPGEtdGFiLXBhbmUga2V5PSIzIiB0YWI9IlRhYiAzIj5Db250ZW50IG9mIFRhYiBQYW5lIDM8L2EtdGFiLXBhbmU+CiAgICAgIDx0ZW1wbGF0ZSAjcmVuZGVyVGFiQmFyPSJ7IERlZmF1bHRUYWJCYXIsIC4uLnByb3BzIH0iPgogICAgICAgIDxjb21wb25lbnQgOmlzPSJEZWZhdWx0VGFiQmFyIiB2LWJpbmQ9InByb3BzIiA6c3R5bGU9Insgb3BhY2l0eTogMC41IH0iIC8+CiAgICAgIDwvdGVtcGxhdGU+CiAgICA8L2EtdGFicz4KICA8L2Rpdj4KPC90ZW1wbGF0ZT4KPHNjcmlwdCBsYW5nPSJ0cyI+CmltcG9ydCB7IGRlZmluZUNvbXBvbmVudCwgcmVmIH0gZnJvbSAndnVlJzsKCmV4cG9ydCBkZWZhdWx0IGRlZmluZUNvbXBvbmVudCh7CiAgc2V0dXAoKSB7CiAgICByZXR1cm4gewogICAgICBhY3RpdmVLZXk6IHJlZignMScpLAogICAgfTsKICB9LAp9KTsKPC9zY3JpcHQ+Cgo=",jsSourceCode:"PHRlbXBsYXRlPgogIDxkaXY+CiAgICA8YS10YWJzIHYtbW9kZWw6YWN0aXZlS2V5PSJhY3RpdmVLZXkiPgogICAgICA8YS10YWItcGFuZSBrZXk9IjEiIHRhYj0iVGFiIDEiIHN0eWxlPSJoZWlnaHQ6IDIwMHB4Ij5Db250ZW50IG9mIFRhYiBQYW5lIDE8L2EtdGFiLXBhbmU+CiAgICAgIDxhLXRhYi1wYW5lIGtleT0iMiIgdGFiPSJUYWIgMiIgZm9yY2UtcmVuZGVyPkNvbnRlbnQgb2YgVGFiIFBhbmUgMjwvYS10YWItcGFuZT4KICAgICAgPGEtdGFiLXBhbmUga2V5PSIzIiB0YWI9IlRhYiAzIj5Db250ZW50IG9mIFRhYiBQYW5lIDM8L2EtdGFiLXBhbmU+CiAgICAgIDx0ZW1wbGF0ZSAjcmVuZGVyVGFiQmFyPSJ7IERlZmF1bHRUYWJCYXIsIC4uLnByb3BzIH0iPgogICAgICAgIDxjb21wb25lbnQgOmlzPSJEZWZhdWx0VGFiQmFyIiB2LWJpbmQ9InByb3BzIiA6c3R5bGU9Insgb3BhY2l0eTogMC41IH0iIC8+CiAgICAgIDwvdGVtcGxhdGU+CiAgICA8L2EtdGFicz4KICA8L2Rpdj4KPC90ZW1wbGF0ZT4KPHNjcmlwdD4KaW1wb3J0IHsgZGVmaW5lQ29tcG9uZW50LCByZWYgfSBmcm9tICd2dWUnOwpleHBvcnQgZGVmYXVsdCBkZWZpbmVDb21wb25lbnQoewogIHNldHVwKCkgewogICAgcmV0dXJuIHsKICAgICAgYWN0aXZlS2V5OiByZWYoJzEnKSwKICAgIH07CiAgfSwKfSk7Cjwvc2NyaXB0Pg=="}},{default:s(()=>[n("div",null,[e(u,{activeKey:o.activeKey,"onUpdate:activeKey":t[0]||(t[0]=k=>o.activeKey=k)},{renderTabBar:s(({DefaultTabBar:k,...g})=>[(i(),h(K(k),S(g,{style:{opacity:.5}}),null,16))]),default:s(()=>[e(c,{key:"1",tab:"Tab 1",style:{height:"200px"}},{default:s(()=>t[1]||(t[1]=[a("Content of Tab Pane 1")])),_:1,__:[1]}),e(c,{key:"2",tab:"Tab 2","force-render":""},{default:s(()=>t[2]||(t[2]=[a("Content of Tab Pane 2")])),_:1,__:[2]}),e(c,{key:"3",tab:"Tab 3"},{default:s(()=>t[3]||(t[3]=[a("Content of Tab Pane 3")])),_:1,__:[3]})]),_:1},8,["activeKey"])])]),htmlCode:s(()=>t[4]||(t[4]=[n("pre",{class:"language-vue"},[n("code",null,[n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),a("template")]),n("span",{class:"token punctuation"},">")]),a(`
  `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),a("div")]),n("span",{class:"token punctuation"},">")]),a(`
    `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),a("a-tabs")]),a(),n("span",{class:"token attr-name"},[n("span",{class:"token namespace"},"v-model:"),a("activeKey")]),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),a("activeKey"),n("span",{class:"token punctuation"},'"')]),n("span",{class:"token punctuation"},">")]),a(`
      `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),a("a-tab-pane")]),a(),n("span",{class:"token attr-name"},"key"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),a("1"),n("span",{class:"token punctuation"},'"')]),a(),n("span",{class:"token attr-name"},"tab"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),a("Tab 1"),n("span",{class:"token punctuation"},'"')]),a(),n("span",{class:"token special-attr"},[n("span",{class:"token attr-name"},"style"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),n("span",{class:"token value css language-css"},[n("span",{class:"token property"},"height"),n("span",{class:"token punctuation"},":"),a(" 200px")]),n("span",{class:"token punctuation"},'"')])]),n("span",{class:"token punctuation"},">")]),a("Content of Tab Pane 1"),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"</"),a("a-tab-pane")]),n("span",{class:"token punctuation"},">")]),a(`
      `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),a("a-tab-pane")]),a(),n("span",{class:"token attr-name"},"key"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),a("2"),n("span",{class:"token punctuation"},'"')]),a(),n("span",{class:"token attr-name"},"tab"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),a("Tab 2"),n("span",{class:"token punctuation"},'"')]),a(),n("span",{class:"token attr-name"},"force-render"),n("span",{class:"token punctuation"},">")]),a("Content of Tab Pane 2"),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"</"),a("a-tab-pane")]),n("span",{class:"token punctuation"},">")]),a(`
      `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),a("a-tab-pane")]),a(),n("span",{class:"token attr-name"},"key"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),a("3"),n("span",{class:"token punctuation"},'"')]),a(),n("span",{class:"token attr-name"},"tab"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),a("Tab 3"),n("span",{class:"token punctuation"},'"')]),n("span",{class:"token punctuation"},">")]),a("Content of Tab Pane 3"),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"</"),a("a-tab-pane")]),n("span",{class:"token punctuation"},">")]),a(`
      `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),a("template")]),a(),n("span",{class:"token attr-name"},"#renderTabBar"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),a("{ DefaultTabBar, ...props }"),n("span",{class:"token punctuation"},'"')]),n("span",{class:"token punctuation"},">")]),a(`
        `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),a("component")]),a(),n("span",{class:"token attr-name"},":is"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),a("DefaultTabBar"),n("span",{class:"token punctuation"},'"')]),a(),n("span",{class:"token attr-name"},"v-bind"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),a("props"),n("span",{class:"token punctuation"},'"')]),a(),n("span",{class:"token attr-name"},":style"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),a("{ opacity: 0.5 }"),n("span",{class:"token punctuation"},'"')]),a(),n("span",{class:"token punctuation"},"/>")]),a(`
      `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"</"),a("template")]),n("span",{class:"token punctuation"},">")]),a(`
    `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"</"),a("a-tabs")]),n("span",{class:"token punctuation"},">")]),a(`
  `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"</"),a("div")]),n("span",{class:"token punctuation"},">")]),a(`
`),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"</"),a("template")]),n("span",{class:"token punctuation"},">")]),a(`
`),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),a("script")]),a(),n("span",{class:"token attr-name"},"lang"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),a("ts"),n("span",{class:"token punctuation"},'"')]),n("span",{class:"token punctuation"},">")]),n("span",{class:"token script"},[n("span",{class:"token language-javascript"},[a(`
`),n("span",{class:"token keyword"},"import"),a(),n("span",{class:"token punctuation"},"{"),a(" defineComponent"),n("span",{class:"token punctuation"},","),a(" ref "),n("span",{class:"token punctuation"},"}"),a(),n("span",{class:"token keyword"},"from"),a(),n("span",{class:"token string"},"'vue'"),n("span",{class:"token punctuation"},";"),a(`

`),n("span",{class:"token keyword"},"export"),a(),n("span",{class:"token keyword"},"default"),a(),n("span",{class:"token function"},"defineComponent"),n("span",{class:"token punctuation"},"("),n("span",{class:"token punctuation"},"{"),a(`
  `),n("span",{class:"token function"},"setup"),n("span",{class:"token punctuation"},"("),n("span",{class:"token punctuation"},")"),a(),n("span",{class:"token punctuation"},"{"),a(`
    `),n("span",{class:"token keyword"},"return"),a(),n("span",{class:"token punctuation"},"{"),a(`
      `),n("span",{class:"token literal-property property"},"activeKey"),n("span",{class:"token operator"},":"),a(),n("span",{class:"token function"},"ref"),n("span",{class:"token punctuation"},"("),n("span",{class:"token string"},"'1'"),n("span",{class:"token punctuation"},")"),n("span",{class:"token punctuation"},","),a(`
    `),n("span",{class:"token punctuation"},"}"),n("span",{class:"token punctuation"},";"),a(`
  `),n("span",{class:"token punctuation"},"}"),n("span",{class:"token punctuation"},","),a(`
`),n("span",{class:"token punctuation"},"}"),n("span",{class:"token punctuation"},")"),n("span",{class:"token punctuation"},";"),a(`
`)])]),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"</"),a("script")]),n("span",{class:"token punctuation"},">")]),a(`
`)])],-1)])),jsVersionHtml:s(()=>t[5]||(t[5]=[n("pre",{class:"language-vue"},[n("code",null,[n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),a("template")]),n("span",{class:"token punctuation"},">")]),a(`
  `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),a("div")]),n("span",{class:"token punctuation"},">")]),a(`
    `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),a("a-tabs")]),a(),n("span",{class:"token attr-name"},[n("span",{class:"token namespace"},"v-model:"),a("activeKey")]),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),a("activeKey"),n("span",{class:"token punctuation"},'"')]),n("span",{class:"token punctuation"},">")]),a(`
      `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),a("a-tab-pane")]),a(),n("span",{class:"token attr-name"},"key"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),a("1"),n("span",{class:"token punctuation"},'"')]),a(),n("span",{class:"token attr-name"},"tab"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),a("Tab 1"),n("span",{class:"token punctuation"},'"')]),a(),n("span",{class:"token special-attr"},[n("span",{class:"token attr-name"},"style"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),n("span",{class:"token value css language-css"},[n("span",{class:"token property"},"height"),n("span",{class:"token punctuation"},":"),a(" 200px")]),n("span",{class:"token punctuation"},'"')])]),n("span",{class:"token punctuation"},">")]),a("Content of Tab Pane 1"),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"</"),a("a-tab-pane")]),n("span",{class:"token punctuation"},">")]),a(`
      `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),a("a-tab-pane")]),a(),n("span",{class:"token attr-name"},"key"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),a("2"),n("span",{class:"token punctuation"},'"')]),a(),n("span",{class:"token attr-name"},"tab"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),a("Tab 2"),n("span",{class:"token punctuation"},'"')]),a(),n("span",{class:"token attr-name"},"force-render"),n("span",{class:"token punctuation"},">")]),a("Content of Tab Pane 2"),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"</"),a("a-tab-pane")]),n("span",{class:"token punctuation"},">")]),a(`
      `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),a("a-tab-pane")]),a(),n("span",{class:"token attr-name"},"key"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),a("3"),n("span",{class:"token punctuation"},'"')]),a(),n("span",{class:"token attr-name"},"tab"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),a("Tab 3"),n("span",{class:"token punctuation"},'"')]),n("span",{class:"token punctuation"},">")]),a("Content of Tab Pane 3"),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"</"),a("a-tab-pane")]),n("span",{class:"token punctuation"},">")]),a(`
      `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),a("template")]),a(),n("span",{class:"token attr-name"},"#renderTabBar"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),a("{ DefaultTabBar, ...props }"),n("span",{class:"token punctuation"},'"')]),n("span",{class:"token punctuation"},">")]),a(`
        `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),a("component")]),a(),n("span",{class:"token attr-name"},":is"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),a("DefaultTabBar"),n("span",{class:"token punctuation"},'"')]),a(),n("span",{class:"token attr-name"},"v-bind"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),a("props"),n("span",{class:"token punctuation"},'"')]),a(),n("span",{class:"token attr-name"},":style"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),a("{ opacity: 0.5 }"),n("span",{class:"token punctuation"},'"')]),a(),n("span",{class:"token punctuation"},"/>")]),a(`
      `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"</"),a("template")]),n("span",{class:"token punctuation"},">")]),a(`
    `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"</"),a("a-tabs")]),n("span",{class:"token punctuation"},">")]),a(`
  `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"</"),a("div")]),n("span",{class:"token punctuation"},">")]),a(`
`),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"</"),a("template")]),n("span",{class:"token punctuation"},">")]),a(`
`),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),a("script")]),n("span",{class:"token punctuation"},">")]),n("span",{class:"token script"},[n("span",{class:"token language-javascript"},[a(`
`),n("span",{class:"token keyword"},"import"),a(),n("span",{class:"token punctuation"},"{"),a(" defineComponent"),n("span",{class:"token punctuation"},","),a(" ref "),n("span",{class:"token punctuation"},"}"),a(),n("span",{class:"token keyword"},"from"),a(),n("span",{class:"token string"},"'vue'"),n("span",{class:"token punctuation"},";"),a(`
`),n("span",{class:"token keyword"},"export"),a(),n("span",{class:"token keyword"},"default"),a(),n("span",{class:"token function"},"defineComponent"),n("span",{class:"token punctuation"},"("),n("span",{class:"token punctuation"},"{"),a(`
  `),n("span",{class:"token function"},"setup"),n("span",{class:"token punctuation"},"("),n("span",{class:"token punctuation"},")"),a(),n("span",{class:"token punctuation"},"{"),a(`
    `),n("span",{class:"token keyword"},"return"),a(),n("span",{class:"token punctuation"},"{"),a(`
      `),n("span",{class:"token literal-property property"},"activeKey"),n("span",{class:"token operator"},":"),a(),n("span",{class:"token function"},"ref"),n("span",{class:"token punctuation"},"("),n("span",{class:"token string"},"'1'"),n("span",{class:"token punctuation"},")"),n("span",{class:"token punctuation"},","),a(`
    `),n("span",{class:"token punctuation"},"}"),n("span",{class:"token punctuation"},";"),a(`
  `),n("span",{class:"token punctuation"},"}"),n("span",{class:"token punctuation"},","),a(`
`),n("span",{class:"token punctuation"},"}"),n("span",{class:"token punctuation"},")"),n("span",{class:"token punctuation"},";"),a(`
`)])]),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"</"),a("script")]),n("span",{class:"token punctuation"},">")]),a(`
`)])],-1)])),_:1})}const Yn=y(An,[["render",vn]]),Zn=A({setup(){return{activeKey:b("1")}}});function fn(o,t,d,r,I,m){const c=p("a-tab-pane"),u=p("a-tabs"),l=p("demo-box");return i(),h(l,{jsfiddle:{us:"Centered tabs.",cn:"\u6807\u7B7E\u5C45\u4E2D\u5C55\u793A\u3002",docHtml:`<h2 id="zh-CN">zh-CN <a class="header-anchor" href="#zh-CN">
          <span aria-hidden="true" class="anchor">#</span>
        </a></h2>
<p>\u6807\u7B7E\u5C45\u4E2D\u5C55\u793A\u3002</p>
<h2 id="en-US">en-US <a class="header-anchor" href="#en-US">
          <span aria-hidden="true" class="anchor">#</span>
        </a></h2>
<p>Centered tabs.</p>
`,order:2,title:{"zh-CN":"\u5C45\u4E2D","en-US":"Centered"},relativePath:"components/tabs/demo/centered.vue",sourceCode:"PHRlbXBsYXRlPgogIDxhLXRhYnMgdi1tb2RlbDphY3RpdmVLZXk9ImFjdGl2ZUtleSIgY2VudGVyZWQ+CiAgICA8YS10YWItcGFuZSBrZXk9IjEiIHRhYj0iVGFiIDEiPkNvbnRlbnQgb2YgVGFiIFBhbmUgMTwvYS10YWItcGFuZT4KICAgIDxhLXRhYi1wYW5lIGtleT0iMiIgdGFiPSJUYWIgMiIgZm9yY2UtcmVuZGVyPkNvbnRlbnQgb2YgVGFiIFBhbmUgMjwvYS10YWItcGFuZT4KICAgIDxhLXRhYi1wYW5lIGtleT0iMyIgdGFiPSJUYWIgMyI+Q29udGVudCBvZiBUYWIgUGFuZSAzPC9hLXRhYi1wYW5lPgogIDwvYS10YWJzPgo8L3RlbXBsYXRlPgo8c2NyaXB0IGxhbmc9InRzIj4KaW1wb3J0IHsgZGVmaW5lQ29tcG9uZW50LCByZWYgfSBmcm9tICd2dWUnOwoKZXhwb3J0IGRlZmF1bHQgZGVmaW5lQ29tcG9uZW50KHsKICBzZXR1cCgpIHsKICAgIHJldHVybiB7CiAgICAgIGFjdGl2ZUtleTogcmVmKCcxJyksCiAgICB9OwogIH0sCn0pOwo8L3NjcmlwdD4KCg==",jsSourceCode:"PHRlbXBsYXRlPgogIDxhLXRhYnMgdi1tb2RlbDphY3RpdmVLZXk9ImFjdGl2ZUtleSIgY2VudGVyZWQ+CiAgICA8YS10YWItcGFuZSBrZXk9IjEiIHRhYj0iVGFiIDEiPkNvbnRlbnQgb2YgVGFiIFBhbmUgMTwvYS10YWItcGFuZT4KICAgIDxhLXRhYi1wYW5lIGtleT0iMiIgdGFiPSJUYWIgMiIgZm9yY2UtcmVuZGVyPkNvbnRlbnQgb2YgVGFiIFBhbmUgMjwvYS10YWItcGFuZT4KICAgIDxhLXRhYi1wYW5lIGtleT0iMyIgdGFiPSJUYWIgMyI+Q29udGVudCBvZiBUYWIgUGFuZSAzPC9hLXRhYi1wYW5lPgogIDwvYS10YWJzPgo8L3RlbXBsYXRlPgo8c2NyaXB0PgppbXBvcnQgeyBkZWZpbmVDb21wb25lbnQsIHJlZiB9IGZyb20gJ3Z1ZSc7CmV4cG9ydCBkZWZhdWx0IGRlZmluZUNvbXBvbmVudCh7CiAgc2V0dXAoKSB7CiAgICByZXR1cm4gewogICAgICBhY3RpdmVLZXk6IHJlZignMScpLAogICAgfTsKICB9LAp9KTsKPC9zY3JpcHQ+"}},{default:s(()=>[e(u,{activeKey:o.activeKey,"onUpdate:activeKey":t[0]||(t[0]=k=>o.activeKey=k),centered:""},{default:s(()=>[e(c,{key:"1",tab:"Tab 1"},{default:s(()=>t[1]||(t[1]=[a("Content of Tab Pane 1")])),_:1,__:[1]}),e(c,{key:"2",tab:"Tab 2","force-render":""},{default:s(()=>t[2]||(t[2]=[a("Content of Tab Pane 2")])),_:1,__:[2]}),e(c,{key:"3",tab:"Tab 3"},{default:s(()=>t[3]||(t[3]=[a("Content of Tab Pane 3")])),_:1,__:[3]})]),_:1},8,["activeKey"])]),htmlCode:s(()=>t[4]||(t[4]=[n("pre",{class:"language-vue"},[n("code",null,[n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),a("template")]),n("span",{class:"token punctuation"},">")]),a(`
  `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),a("a-tabs")]),a(),n("span",{class:"token attr-name"},[n("span",{class:"token namespace"},"v-model:"),a("activeKey")]),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),a("activeKey"),n("span",{class:"token punctuation"},'"')]),a(),n("span",{class:"token attr-name"},"centered"),n("span",{class:"token punctuation"},">")]),a(`
    `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),a("a-tab-pane")]),a(),n("span",{class:"token attr-name"},"key"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),a("1"),n("span",{class:"token punctuation"},'"')]),a(),n("span",{class:"token attr-name"},"tab"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),a("Tab 1"),n("span",{class:"token punctuation"},'"')]),n("span",{class:"token punctuation"},">")]),a("Content of Tab Pane 1"),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"</"),a("a-tab-pane")]),n("span",{class:"token punctuation"},">")]),a(`
    `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),a("a-tab-pane")]),a(),n("span",{class:"token attr-name"},"key"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),a("2"),n("span",{class:"token punctuation"},'"')]),a(),n("span",{class:"token attr-name"},"tab"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),a("Tab 2"),n("span",{class:"token punctuation"},'"')]),a(),n("span",{class:"token attr-name"},"force-render"),n("span",{class:"token punctuation"},">")]),a("Content of Tab Pane 2"),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"</"),a("a-tab-pane")]),n("span",{class:"token punctuation"},">")]),a(`
    `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),a("a-tab-pane")]),a(),n("span",{class:"token attr-name"},"key"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),a("3"),n("span",{class:"token punctuation"},'"')]),a(),n("span",{class:"token attr-name"},"tab"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),a("Tab 3"),n("span",{class:"token punctuation"},'"')]),n("span",{class:"token punctuation"},">")]),a("Content of Tab Pane 3"),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"</"),a("a-tab-pane")]),n("span",{class:"token punctuation"},">")]),a(`
  `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"</"),a("a-tabs")]),n("span",{class:"token punctuation"},">")]),a(`
`),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"</"),a("template")]),n("span",{class:"token punctuation"},">")]),a(`
`),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),a("script")]),a(),n("span",{class:"token attr-name"},"lang"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),a("ts"),n("span",{class:"token punctuation"},'"')]),n("span",{class:"token punctuation"},">")]),n("span",{class:"token script"},[n("span",{class:"token language-javascript"},[a(`
`),n("span",{class:"token keyword"},"import"),a(),n("span",{class:"token punctuation"},"{"),a(" defineComponent"),n("span",{class:"token punctuation"},","),a(" ref "),n("span",{class:"token punctuation"},"}"),a(),n("span",{class:"token keyword"},"from"),a(),n("span",{class:"token string"},"'vue'"),n("span",{class:"token punctuation"},";"),a(`

`),n("span",{class:"token keyword"},"export"),a(),n("span",{class:"token keyword"},"default"),a(),n("span",{class:"token function"},"defineComponent"),n("span",{class:"token punctuation"},"("),n("span",{class:"token punctuation"},"{"),a(`
  `),n("span",{class:"token function"},"setup"),n("span",{class:"token punctuation"},"("),n("span",{class:"token punctuation"},")"),a(),n("span",{class:"token punctuation"},"{"),a(`
    `),n("span",{class:"token keyword"},"return"),a(),n("span",{class:"token punctuation"},"{"),a(`
      `),n("span",{class:"token literal-property property"},"activeKey"),n("span",{class:"token operator"},":"),a(),n("span",{class:"token function"},"ref"),n("span",{class:"token punctuation"},"("),n("span",{class:"token string"},"'1'"),n("span",{class:"token punctuation"},")"),n("span",{class:"token punctuation"},","),a(`
    `),n("span",{class:"token punctuation"},"}"),n("span",{class:"token punctuation"},";"),a(`
  `),n("span",{class:"token punctuation"},"}"),n("span",{class:"token punctuation"},","),a(`
`),n("span",{class:"token punctuation"},"}"),n("span",{class:"token punctuation"},")"),n("span",{class:"token punctuation"},";"),a(`
`)])]),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"</"),a("script")]),n("span",{class:"token punctuation"},">")]),a(`
`)])],-1)])),jsVersionHtml:s(()=>t[5]||(t[5]=[n("pre",{class:"language-vue"},[n("code",null,[n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),a("template")]),n("span",{class:"token punctuation"},">")]),a(`
  `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),a("a-tabs")]),a(),n("span",{class:"token attr-name"},[n("span",{class:"token namespace"},"v-model:"),a("activeKey")]),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),a("activeKey"),n("span",{class:"token punctuation"},'"')]),a(),n("span",{class:"token attr-name"},"centered"),n("span",{class:"token punctuation"},">")]),a(`
    `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),a("a-tab-pane")]),a(),n("span",{class:"token attr-name"},"key"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),a("1"),n("span",{class:"token punctuation"},'"')]),a(),n("span",{class:"token attr-name"},"tab"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),a("Tab 1"),n("span",{class:"token punctuation"},'"')]),n("span",{class:"token punctuation"},">")]),a("Content of Tab Pane 1"),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"</"),a("a-tab-pane")]),n("span",{class:"token punctuation"},">")]),a(`
    `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),a("a-tab-pane")]),a(),n("span",{class:"token attr-name"},"key"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),a("2"),n("span",{class:"token punctuation"},'"')]),a(),n("span",{class:"token attr-name"},"tab"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),a("Tab 2"),n("span",{class:"token punctuation"},'"')]),a(),n("span",{class:"token attr-name"},"force-render"),n("span",{class:"token punctuation"},">")]),a("Content of Tab Pane 2"),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"</"),a("a-tab-pane")]),n("span",{class:"token punctuation"},">")]),a(`
    `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),a("a-tab-pane")]),a(),n("span",{class:"token attr-name"},"key"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),a("3"),n("span",{class:"token punctuation"},'"')]),a(),n("span",{class:"token attr-name"},"tab"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),a("Tab 3"),n("span",{class:"token punctuation"},'"')]),n("span",{class:"token punctuation"},">")]),a("Content of Tab Pane 3"),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"</"),a("a-tab-pane")]),n("span",{class:"token punctuation"},">")]),a(`
  `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"</"),a("a-tabs")]),n("span",{class:"token punctuation"},">")]),a(`
`),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"</"),a("template")]),n("span",{class:"token punctuation"},">")]),a(`
`),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),a("script")]),n("span",{class:"token punctuation"},">")]),n("span",{class:"token script"},[n("span",{class:"token language-javascript"},[a(`
`),n("span",{class:"token keyword"},"import"),a(),n("span",{class:"token punctuation"},"{"),a(" defineComponent"),n("span",{class:"token punctuation"},","),a(" ref "),n("span",{class:"token punctuation"},"}"),a(),n("span",{class:"token keyword"},"from"),a(),n("span",{class:"token string"},"'vue'"),n("span",{class:"token punctuation"},";"),a(`
`),n("span",{class:"token keyword"},"export"),a(),n("span",{class:"token keyword"},"default"),a(),n("span",{class:"token function"},"defineComponent"),n("span",{class:"token punctuation"},"("),n("span",{class:"token punctuation"},"{"),a(`
  `),n("span",{class:"token function"},"setup"),n("span",{class:"token punctuation"},"("),n("span",{class:"token punctuation"},")"),a(),n("span",{class:"token punctuation"},"{"),a(`
    `),n("span",{class:"token keyword"},"return"),a(),n("span",{class:"token punctuation"},"{"),a(`
      `),n("span",{class:"token literal-property property"},"activeKey"),n("span",{class:"token operator"},":"),a(),n("span",{class:"token function"},"ref"),n("span",{class:"token punctuation"},"("),n("span",{class:"token string"},"'1'"),n("span",{class:"token punctuation"},")"),n("span",{class:"token punctuation"},","),a(`
    `),n("span",{class:"token punctuation"},"}"),n("span",{class:"token punctuation"},";"),a(`
  `),n("span",{class:"token punctuation"},"}"),n("span",{class:"token punctuation"},","),a(`
`),n("span",{class:"token punctuation"},"}"),n("span",{class:"token punctuation"},")"),n("span",{class:"token punctuation"},";"),a(`
`)])]),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"</"),a("script")]),n("span",{class:"token punctuation"},">")]),a(`
`)])],-1)])),_:1})}const Gn=y(Zn,[["render",fn]]),Wn={pageData:{title:"Tabs",description:"",frontmatter:{category:"Components",subtitle:"\u6807\u7B7E\u9875",type:"\u6570\u636E\u5C55\u793A",title:"Tabs",cover:"https://gw.alipayobjects.com/zos/antfincdn/lkI2hNEDr2V/Tabs.svg"},headers:[{level:2,title:"\u4F55\u65F6\u4F7F\u7528",slug:"\u4F55\u65F6\u4F7F\u7528",content:"\u63D0\u4F9B\u5E73\u7EA7\u7684\u533A\u57DF\u5C06\u5927\u5757\u5185\u5BB9\u8FDB\u884C\u6536\u7EB3\u548C\u5C55\u73B0\uFF0C\u4FDD\u6301\u754C\u9762\u6574\u6D01\u3002"},{level:2,title:"API",slug:"API",content:"Tabs"},{level:3,title:"Tabs",slug:"Tabs",content:""},{level:3,title:"Tabs \u63D2\u69FD",slug:"Tabs-\u63D2\u69FD",content:""},{level:3,title:"Tabs \u4E8B\u4EF6",slug:"Tabs-\u4E8B\u4EF6",content:""},{level:3,title:"Tabs.TabPane",slug:"Tabs-TabPane",content:""},{level:3,title:"Tabs.TabPane \u63D2\u69FD",slug:"Tabs-TabPane-\u63D2\u69FD",content:""}],relativePath:"components/tabs/index.zh-CN.md",content:`
\u9009\u9879\u5361\u5207\u6362\u7EC4\u4EF6\u3002

## \u4F55\u65F6\u4F7F\u7528

\u63D0\u4F9B\u5E73\u7EA7\u7684\u533A\u57DF\u5C06\u5927\u5757\u5185\u5BB9\u8FDB\u884C\u6536\u7EB3\u548C\u5C55\u73B0\uFF0C\u4FDD\u6301\u754C\u9762\u6574\u6D01\u3002

Ant Design \u4F9D\u6B21\u63D0\u4F9B\u4E86\u4E09\u7EA7\u9009\u9879\u5361\uFF0C\u5206\u522B\u7528\u4E8E\u4E0D\u540C\u7684\u573A\u666F\u3002

- \u5361\u7247\u5F0F\u7684\u9875\u7B7E\uFF0C\u63D0\u4F9B\u53EF\u5173\u95ED\u7684\u6837\u5F0F\uFF0C\u5E38\u7528\u4E8E\u5BB9\u5668\u9876\u90E8\u3002
- \u6807\u51C6\u7EBF\u6761\u5F0F\u9875\u7B7E\uFF0C\u7528\u4E8E\u5BB9\u5668\u5185\u90E8\u7684\u4E3B\u529F\u80FD\u5207\u6362\uFF0C\u8FD9\u662F\u6700\u5E38\u7528\u7684 Tabs\u3002
- [RadioButton](/ant-design/components/radio-cn/) \u53EF\u4F5C\u4E3A\u66F4\u6B21\u7EA7\u7684\u9875\u7B7E\u6765\u4F7F\u7528\u3002

## API

### Tabs

| \u53C2\u6570 | \u8BF4\u660E | \u7C7B\u578B | \u9ED8\u8BA4\u503C | \u7248\u672C |  |
| --- | --- | --- | --- | --- | --- |
| activeKey(v-model) | \u5F53\u524D\u6FC0\u6D3B tab \u9762\u677F\u7684 key | string | \u65E0 |  |  |
| animated | \u662F\u5426\u4F7F\u7528\u52A8\u753B\u5207\u6362 Tabs\uFF0C\u5728 tabPosition=\`&quot;top&quot;\` \\| \`&quot;bottom&quot;\` \u65F6\u6709\u6548 | boolean \\| {inkBar:boolean, tabPane:boolean} | true, \u5F53 type=&quot;card&quot; \u65F6\u4E3A false |  |
| centered | \u6807\u7B7E\u5C45\u4E2D\u5C55\u793A | boolean | false | 3.0 |  |
| destroyInactiveTabPane | \u88AB\u9690\u85CF\u65F6\u662F\u5426\u9500\u6BC1 DOM \u7ED3\u6784 | boolean | false |  |  |
| hideAdd | \u662F\u5426\u9690\u85CF\u52A0\u53F7\u56FE\u6807\uFF0C\u5728 \`type=&quot;editable-card&quot;\` \u65F6\u6709\u6548 | boolean | false |  |  |
| size | \u5927\u5C0F\uFF0C\u63D0\u4F9B \`large\` \`default\` \u548C \`small\` \u4E09\u79CD\u5927\u5C0F | string | \`default\` |  |  |
| tabBarGutter | tabs \u4E4B\u95F4\u7684\u95F4\u9699 | number | \u65E0 |  |  |
| tabBarStyle | tab bar \u7684\u6837\u5F0F\u5BF9\u8C61 | object | - |  |  |
| tabPosition | \u9875\u7B7E\u4F4D\u7F6E\uFF0C\u53EF\u9009\u503C\u6709 \`top\` \`right\` \`bottom\` \`left\` | string | \`top\` |  |  |
| type | \u9875\u7B7E\u7684\u57FA\u672C\u6837\u5F0F\uFF0C\u53EF\u9009 \`line\`\u3001\`card\` \`editable-card\` \u7C7B\u578B | string | \`line\` |  |  |

### Tabs \u63D2\u69FD

| \u63D2\u69FD\u540D\u79F0     | \u8BF4\u660E                            | \u53C2\u6570              |     |
| ------------ | ------------------------------- | ----------------- | --- |
| addIcon      | \u81EA\u5B9A\u4E49\u6DFB\u52A0\u6309\u94AE                  | -                 | -   |
| leftExtra    | tab bar \u4E0A\u5DE6\u4FA7\u989D\u5916\u7684\u5143\u7D20        | -                 | -   |
| moreIcon     | \u81EA\u5B9A\u4E49\u6298\u53E0 icon                 | -                 | -   |
| renderTabBar | \u66FF\u6362 TabBar\uFF0C\u7528\u4E8E\u4E8C\u6B21\u5C01\u88C5\u6807\u7B7E\u5934 | { DefaultTabBar } |     |
| rightExtra   | tab bar \u4E0A\u53F3\u4FA7\u989D\u5916\u7684\u5143\u7D20        | -                 | -   |

### Tabs \u4E8B\u4EF6

| \u4E8B\u4EF6\u540D\u79F0 | \u8BF4\u660E | \u56DE\u8C03\u53C2\u6570 |
| --- | --- | --- |
| change | \u5207\u6362\u9762\u677F\u7684\u56DE\u8C03 | Function(activeKey) {} |
| edit | \u65B0\u589E\u548C\u5220\u9664\u9875\u7B7E\u7684\u56DE\u8C03\uFF0C\u5728 \`type=&quot;editable-card&quot;\` \u65F6\u6709\u6548 | (targetKey, action): void |
| tabClick | tab \u88AB\u70B9\u51FB\u7684\u56DE\u8C03 | Function |
| tabScroll | \u6EDA\u52A8 TabBar \u65F6\u89E6\u53D1 | { direction: &#39;left&#39; \\| &#39;right&#39; \\| &#39;top&#39; \\| &#39;bottom&#39; } |

### Tabs.TabPane

| \u53C2\u6570        | \u8BF4\u660E                      | \u7C7B\u578B         | \u9ED8\u8BA4\u503C |
| ----------- | ------------------------- | ------------ | ------ |
| forceRender | \u88AB\u9690\u85CF\u65F6\u662F\u5426\u6E32\u67D3 DOM \u7ED3\u6784 | boolean      | false  |
| key         | \u5BF9\u5E94 activeKey            | string       | \u65E0     |
| tab         | \u9009\u9879\u5361\u5934\u663E\u793A\u6587\u5B57          | string\\|slot | \u65E0     |

### Tabs.TabPane \u63D2\u69FD

| \u63D2\u69FD\u540D\u79F0  | \u8BF4\u660E                                            | \u53C2\u6570 |
| --------- | ----------------------------------------------- | ---- |
| closeIcon | \u81EA\u5B9A\u4E49\u5173\u95ED\u56FE\u6807\uFF0C\`\u5728 type=&quot;editable-card&quot;\`\u65F6\u6709\u6548 | -    |
| tab       | \u9009\u9879\u5361\u5934\u663E\u793A\u6587\u5B57                                | -    |
`,html:`<p>\u9009\u9879\u5361\u5207\u6362\u7EC4\u4EF6\u3002</p>
<h2 id="\u4F55\u65F6\u4F7F\u7528">\u4F55\u65F6\u4F7F\u7528 <a class="header-anchor" href="#\u4F55\u65F6\u4F7F\u7528">
          <span aria-hidden="true" class="anchor">#</span>
        </a></h2>
<p>\u63D0\u4F9B\u5E73\u7EA7\u7684\u533A\u57DF\u5C06\u5927\u5757\u5185\u5BB9\u8FDB\u884C\u6536\u7EB3\u548C\u5C55\u73B0\uFF0C\u4FDD\u6301\u754C\u9762\u6574\u6D01\u3002</p>
<p>Ant Design \u4F9D\u6B21\u63D0\u4F9B\u4E86\u4E09\u7EA7\u9009\u9879\u5361\uFF0C\u5206\u522B\u7528\u4E8E\u4E0D\u540C\u7684\u573A\u666F\u3002</p>
<ul>
<li>\u5361\u7247\u5F0F\u7684\u9875\u7B7E\uFF0C\u63D0\u4F9B\u53EF\u5173\u95ED\u7684\u6837\u5F0F\uFF0C\u5E38\u7528\u4E8E\u5BB9\u5668\u9876\u90E8\u3002</li>
<li>\u6807\u51C6\u7EBF\u6761\u5F0F\u9875\u7B7E\uFF0C\u7528\u4E8E\u5BB9\u5668\u5185\u90E8\u7684\u4E3B\u529F\u80FD\u5207\u6362\uFF0C\u8FD9\u662F\u6700\u5E38\u7528\u7684 Tabs\u3002</li>
<li><a href="/ant-design/components/radio-cn/">RadioButton</a> \u53EF\u4F5C\u4E3A\u66F4\u6B21\u7EA7\u7684\u9875\u7B7E\u6765\u4F7F\u7528\u3002</li>
</ul>
<h2 id="API">API <a class="header-anchor" href="#API">
          <span aria-hidden="true" class="anchor">#</span>
        </a></h2>
<h3 id="Tabs">Tabs <a class="header-anchor" href="#Tabs">
          <span aria-hidden="true" class="anchor">#</span>
        </a></h3>
<table>
<thead>
<tr>
<th>\u53C2\u6570</th>
<th>\u8BF4\u660E</th>
<th>\u7C7B\u578B</th>
<th>\u9ED8\u8BA4\u503C</th>
<th>\u7248\u672C</th>
<th></th>
</tr>
</thead>
<tbody>
<tr>
<td>activeKey(v-model)</td>
<td>\u5F53\u524D\u6FC0\u6D3B tab \u9762\u677F\u7684 key</td>
<td>string</td>
<td>\u65E0</td>
<td></td>
<td></td>
</tr>
<tr>
<td>animated</td>
<td>\u662F\u5426\u4F7F\u7528\u52A8\u753B\u5207\u6362 Tabs\uFF0C\u5728 tabPosition=<code>&quot;top&quot;</code> | <code>&quot;bottom&quot;</code> \u65F6\u6709\u6548</td>
<td>boolean | {inkBar:boolean, tabPane:boolean}</td>
<td>true, \u5F53 type=&quot;card&quot; \u65F6\u4E3A false</td>
<td></td>
<td></td>
</tr>
<tr>
<td>centered</td>
<td>\u6807\u7B7E\u5C45\u4E2D\u5C55\u793A</td>
<td>boolean</td>
<td>false</td>
<td>3.0</td>
<td></td>
</tr>
<tr>
<td>destroyInactiveTabPane</td>
<td>\u88AB\u9690\u85CF\u65F6\u662F\u5426\u9500\u6BC1 DOM \u7ED3\u6784</td>
<td>boolean</td>
<td>false</td>
<td></td>
<td></td>
</tr>
<tr>
<td>hideAdd</td>
<td>\u662F\u5426\u9690\u85CF\u52A0\u53F7\u56FE\u6807\uFF0C\u5728 <code>type=&quot;editable-card&quot;</code> \u65F6\u6709\u6548</td>
<td>boolean</td>
<td>false</td>
<td></td>
<td></td>
</tr>
<tr>
<td>size</td>
<td>\u5927\u5C0F\uFF0C\u63D0\u4F9B <code>large</code> <code>default</code> \u548C <code>small</code> \u4E09\u79CD\u5927\u5C0F</td>
<td>string</td>
<td><code>default</code></td>
<td></td>
<td></td>
</tr>
<tr>
<td>tabBarGutter</td>
<td>tabs \u4E4B\u95F4\u7684\u95F4\u9699</td>
<td>number</td>
<td>\u65E0</td>
<td></td>
<td></td>
</tr>
<tr>
<td>tabBarStyle</td>
<td>tab bar \u7684\u6837\u5F0F\u5BF9\u8C61</td>
<td>object</td>
<td>-</td>
<td></td>
<td></td>
</tr>
<tr>
<td>tabPosition</td>
<td>\u9875\u7B7E\u4F4D\u7F6E\uFF0C\u53EF\u9009\u503C\u6709 <code>top</code> <code>right</code> <code>bottom</code> <code>left</code></td>
<td>string</td>
<td><code>top</code></td>
<td></td>
<td></td>
</tr>
<tr>
<td>type</td>
<td>\u9875\u7B7E\u7684\u57FA\u672C\u6837\u5F0F\uFF0C\u53EF\u9009 <code>line</code>\u3001<code>card</code> <code>editable-card</code> \u7C7B\u578B</td>
<td>string</td>
<td><code>line</code></td>
<td></td>
<td></td>
</tr>
</tbody>
</table>
<h3 id="Tabs-\u63D2\u69FD">Tabs \u63D2\u69FD <a class="header-anchor" href="#Tabs-\u63D2\u69FD">
          <span aria-hidden="true" class="anchor">#</span>
        </a></h3>
<table>
<thead>
<tr>
<th>\u63D2\u69FD\u540D\u79F0</th>
<th>\u8BF4\u660E</th>
<th>\u53C2\u6570</th>
<th></th>
</tr>
</thead>
<tbody>
<tr>
<td>addIcon</td>
<td>\u81EA\u5B9A\u4E49\u6DFB\u52A0\u6309\u94AE</td>
<td>-</td>
<td>-</td>
</tr>
<tr>
<td>leftExtra</td>
<td>tab bar \u4E0A\u5DE6\u4FA7\u989D\u5916\u7684\u5143\u7D20</td>
<td>-</td>
<td>-</td>
</tr>
<tr>
<td>moreIcon</td>
<td>\u81EA\u5B9A\u4E49\u6298\u53E0 icon</td>
<td>-</td>
<td>-</td>
</tr>
<tr>
<td>renderTabBar</td>
<td>\u66FF\u6362 TabBar\uFF0C\u7528\u4E8E\u4E8C\u6B21\u5C01\u88C5\u6807\u7B7E\u5934</td>
<td>{ DefaultTabBar }</td>
<td></td>
</tr>
<tr>
<td>rightExtra</td>
<td>tab bar \u4E0A\u53F3\u4FA7\u989D\u5916\u7684\u5143\u7D20</td>
<td>-</td>
<td>-</td>
</tr>
</tbody>
</table>
<h3 id="Tabs-\u4E8B\u4EF6">Tabs \u4E8B\u4EF6 <a class="header-anchor" href="#Tabs-\u4E8B\u4EF6">
          <span aria-hidden="true" class="anchor">#</span>
        </a></h3>
<table>
<thead>
<tr>
<th>\u4E8B\u4EF6\u540D\u79F0</th>
<th>\u8BF4\u660E</th>
<th>\u56DE\u8C03\u53C2\u6570</th>
</tr>
</thead>
<tbody>
<tr>
<td>change</td>
<td>\u5207\u6362\u9762\u677F\u7684\u56DE\u8C03</td>
<td>Function(activeKey) {}</td>
</tr>
<tr>
<td>edit</td>
<td>\u65B0\u589E\u548C\u5220\u9664\u9875\u7B7E\u7684\u56DE\u8C03\uFF0C\u5728 <code>type=&quot;editable-card&quot;</code> \u65F6\u6709\u6548</td>
<td>(targetKey, action): void</td>
</tr>
<tr>
<td>tabClick</td>
<td>tab \u88AB\u70B9\u51FB\u7684\u56DE\u8C03</td>
<td>Function</td>
</tr>
<tr>
<td>tabScroll</td>
<td>\u6EDA\u52A8 TabBar \u65F6\u89E6\u53D1</td>
<td>{ direction: 'left' | 'right' | 'top' | 'bottom' }</td>
</tr>
</tbody>
</table>
<h3 id="Tabs-TabPane">Tabs.TabPane <a class="header-anchor" href="#Tabs-TabPane">
          <span aria-hidden="true" class="anchor">#</span>
        </a></h3>
<table>
<thead>
<tr>
<th>\u53C2\u6570</th>
<th>\u8BF4\u660E</th>
<th>\u7C7B\u578B</th>
<th>\u9ED8\u8BA4\u503C</th>
</tr>
</thead>
<tbody>
<tr>
<td>forceRender</td>
<td>\u88AB\u9690\u85CF\u65F6\u662F\u5426\u6E32\u67D3 DOM \u7ED3\u6784</td>
<td>boolean</td>
<td>false</td>
</tr>
<tr>
<td>key</td>
<td>\u5BF9\u5E94 activeKey</td>
<td>string</td>
<td>\u65E0</td>
</tr>
<tr>
<td>tab</td>
<td>\u9009\u9879\u5361\u5934\u663E\u793A\u6587\u5B57</td>
<td>string|slot</td>
<td>\u65E0</td>
</tr>
</tbody>
</table>
<h3 id="Tabs-TabPane-\u63D2\u69FD">Tabs.TabPane \u63D2\u69FD <a class="header-anchor" href="#Tabs-TabPane-\u63D2\u69FD">
          <span aria-hidden="true" class="anchor">#</span>
        </a></h3>
<table>
<thead>
<tr>
<th>\u63D2\u69FD\u540D\u79F0</th>
<th>\u8BF4\u660E</th>
<th>\u53C2\u6570</th>
</tr>
</thead>
<tbody>
<tr>
<td>closeIcon</td>
<td>\u81EA\u5B9A\u4E49\u5173\u95ED\u56FE\u6807\uFF0C<code>\u5728 type=&quot;editable-card&quot;</code>\u65F6\u6709\u6548</td>
<td>-</td>
</tr>
<tr>
<td>tab</td>
<td>\u9009\u9879\u5361\u5934\u663E\u793A\u6587\u5B57</td>
<td>-</td>
</tr>
</tbody>
</table>
`,lastUpdated:1748060301374}},Bn={class:"markdown"};function wn(o,t,d,r,I,m){return i(),v("article",Bn,t[0]||(t[0]=[G('<p>\u9009\u9879\u5361\u5207\u6362\u7EC4\u4EF6\u3002</p><h2 id="\u4F55\u65F6\u4F7F\u7528">\u4F55\u65F6\u4F7F\u7528 <a class="header-anchor" href="#\u4F55\u65F6\u4F7F\u7528"><span aria-hidden="true" class="anchor">#</span></a></h2><p>\u63D0\u4F9B\u5E73\u7EA7\u7684\u533A\u57DF\u5C06\u5927\u5757\u5185\u5BB9\u8FDB\u884C\u6536\u7EB3\u548C\u5C55\u73B0\uFF0C\u4FDD\u6301\u754C\u9762\u6574\u6D01\u3002</p><p>Ant Design \u4F9D\u6B21\u63D0\u4F9B\u4E86\u4E09\u7EA7\u9009\u9879\u5361\uFF0C\u5206\u522B\u7528\u4E8E\u4E0D\u540C\u7684\u573A\u666F\u3002</p><ul><li>\u5361\u7247\u5F0F\u7684\u9875\u7B7E\uFF0C\u63D0\u4F9B\u53EF\u5173\u95ED\u7684\u6837\u5F0F\uFF0C\u5E38\u7528\u4E8E\u5BB9\u5668\u9876\u90E8\u3002</li><li>\u6807\u51C6\u7EBF\u6761\u5F0F\u9875\u7B7E\uFF0C\u7528\u4E8E\u5BB9\u5668\u5185\u90E8\u7684\u4E3B\u529F\u80FD\u5207\u6362\uFF0C\u8FD9\u662F\u6700\u5E38\u7528\u7684 Tabs\u3002</li><li><a href="/ant-design/components/radio-cn/">RadioButton</a> \u53EF\u4F5C\u4E3A\u66F4\u6B21\u7EA7\u7684\u9875\u7B7E\u6765\u4F7F\u7528\u3002</li></ul><h2 id="API">API <a class="header-anchor" href="#API"><span aria-hidden="true" class="anchor">#</span></a></h2><h3 id="Tabs">Tabs <a class="header-anchor" href="#Tabs"><span aria-hidden="true" class="anchor">#</span></a></h3><table><thead><tr><th>\u53C2\u6570</th><th>\u8BF4\u660E</th><th>\u7C7B\u578B</th><th>\u9ED8\u8BA4\u503C</th><th>\u7248\u672C</th><th></th></tr></thead><tbody><tr><td>activeKey(v-model)</td><td>\u5F53\u524D\u6FC0\u6D3B tab \u9762\u677F\u7684 key</td><td>string</td><td>\u65E0</td><td></td><td></td></tr><tr><td>animated</td><td>\u662F\u5426\u4F7F\u7528\u52A8\u753B\u5207\u6362 Tabs\uFF0C\u5728 tabPosition=<code>&quot;top&quot;</code> | <code>&quot;bottom&quot;</code> \u65F6\u6709\u6548</td><td>boolean | {inkBar:boolean, tabPane:boolean}</td><td>true, \u5F53 type=&quot;card&quot; \u65F6\u4E3A false</td><td></td><td></td></tr><tr><td>centered</td><td>\u6807\u7B7E\u5C45\u4E2D\u5C55\u793A</td><td>boolean</td><td>false</td><td>3.0</td><td></td></tr><tr><td>destroyInactiveTabPane</td><td>\u88AB\u9690\u85CF\u65F6\u662F\u5426\u9500\u6BC1 DOM \u7ED3\u6784</td><td>boolean</td><td>false</td><td></td><td></td></tr><tr><td>hideAdd</td><td>\u662F\u5426\u9690\u85CF\u52A0\u53F7\u56FE\u6807\uFF0C\u5728 <code>type=&quot;editable-card&quot;</code> \u65F6\u6709\u6548</td><td>boolean</td><td>false</td><td></td><td></td></tr><tr><td>size</td><td>\u5927\u5C0F\uFF0C\u63D0\u4F9B <code>large</code> <code>default</code> \u548C <code>small</code> \u4E09\u79CD\u5927\u5C0F</td><td>string</td><td><code>default</code></td><td></td><td></td></tr><tr><td>tabBarGutter</td><td>tabs \u4E4B\u95F4\u7684\u95F4\u9699</td><td>number</td><td>\u65E0</td><td></td><td></td></tr><tr><td>tabBarStyle</td><td>tab bar \u7684\u6837\u5F0F\u5BF9\u8C61</td><td>object</td><td>-</td><td></td><td></td></tr><tr><td>tabPosition</td><td>\u9875\u7B7E\u4F4D\u7F6E\uFF0C\u53EF\u9009\u503C\u6709 <code>top</code> <code>right</code> <code>bottom</code> <code>left</code></td><td>string</td><td><code>top</code></td><td></td><td></td></tr><tr><td>type</td><td>\u9875\u7B7E\u7684\u57FA\u672C\u6837\u5F0F\uFF0C\u53EF\u9009 <code>line</code>\u3001<code>card</code> <code>editable-card</code> \u7C7B\u578B</td><td>string</td><td><code>line</code></td><td></td><td></td></tr></tbody></table><h3 id="Tabs-\u63D2\u69FD">Tabs \u63D2\u69FD <a class="header-anchor" href="#Tabs-\u63D2\u69FD"><span aria-hidden="true" class="anchor">#</span></a></h3><table><thead><tr><th>\u63D2\u69FD\u540D\u79F0</th><th>\u8BF4\u660E</th><th>\u53C2\u6570</th><th></th></tr></thead><tbody><tr><td>addIcon</td><td>\u81EA\u5B9A\u4E49\u6DFB\u52A0\u6309\u94AE</td><td>-</td><td>-</td></tr><tr><td>leftExtra</td><td>tab bar \u4E0A\u5DE6\u4FA7\u989D\u5916\u7684\u5143\u7D20</td><td>-</td><td>-</td></tr><tr><td>moreIcon</td><td>\u81EA\u5B9A\u4E49\u6298\u53E0 icon</td><td>-</td><td>-</td></tr><tr><td>renderTabBar</td><td>\u66FF\u6362 TabBar\uFF0C\u7528\u4E8E\u4E8C\u6B21\u5C01\u88C5\u6807\u7B7E\u5934</td><td>{ DefaultTabBar }</td><td></td></tr><tr><td>rightExtra</td><td>tab bar \u4E0A\u53F3\u4FA7\u989D\u5916\u7684\u5143\u7D20</td><td>-</td><td>-</td></tr></tbody></table><h3 id="Tabs-\u4E8B\u4EF6">Tabs \u4E8B\u4EF6 <a class="header-anchor" href="#Tabs-\u4E8B\u4EF6"><span aria-hidden="true" class="anchor">#</span></a></h3><table><thead><tr><th>\u4E8B\u4EF6\u540D\u79F0</th><th>\u8BF4\u660E</th><th>\u56DE\u8C03\u53C2\u6570</th></tr></thead><tbody><tr><td>change</td><td>\u5207\u6362\u9762\u677F\u7684\u56DE\u8C03</td><td>Function(activeKey) {}</td></tr><tr><td>edit</td><td>\u65B0\u589E\u548C\u5220\u9664\u9875\u7B7E\u7684\u56DE\u8C03\uFF0C\u5728 <code>type=&quot;editable-card&quot;</code> \u65F6\u6709\u6548</td><td>(targetKey, action): void</td></tr><tr><td>tabClick</td><td>tab \u88AB\u70B9\u51FB\u7684\u56DE\u8C03</td><td>Function</td></tr><tr><td>tabScroll</td><td>\u6EDA\u52A8 TabBar \u65F6\u89E6\u53D1</td><td>{ direction: &#39;left&#39; | &#39;right&#39; | &#39;top&#39; | &#39;bottom&#39; }</td></tr></tbody></table><h3 id="Tabs-TabPane">Tabs.TabPane <a class="header-anchor" href="#Tabs-TabPane"><span aria-hidden="true" class="anchor">#</span></a></h3><table><thead><tr><th>\u53C2\u6570</th><th>\u8BF4\u660E</th><th>\u7C7B\u578B</th><th>\u9ED8\u8BA4\u503C</th></tr></thead><tbody><tr><td>forceRender</td><td>\u88AB\u9690\u85CF\u65F6\u662F\u5426\u6E32\u67D3 DOM \u7ED3\u6784</td><td>boolean</td><td>false</td></tr><tr><td>key</td><td>\u5BF9\u5E94 activeKey</td><td>string</td><td>\u65E0</td></tr><tr><td>tab</td><td>\u9009\u9879\u5361\u5934\u663E\u793A\u6587\u5B57</td><td>string|slot</td><td>\u65E0</td></tr></tbody></table><h3 id="Tabs-TabPane-\u63D2\u69FD">Tabs.TabPane \u63D2\u69FD <a class="header-anchor" href="#Tabs-TabPane-\u63D2\u69FD"><span aria-hidden="true" class="anchor">#</span></a></h3><table><thead><tr><th>\u63D2\u69FD\u540D\u79F0</th><th>\u8BF4\u660E</th><th>\u53C2\u6570</th></tr></thead><tbody><tr><td>closeIcon</td><td>\u81EA\u5B9A\u4E49\u5173\u95ED\u56FE\u6807\uFF0C<code>\u5728 type=&quot;editable-card&quot;</code>\u65F6\u6709\u6548</td><td>-</td></tr><tr><td>tab</td><td>\u9009\u9879\u5361\u5934\u663E\u793A\u6587\u5B57</td><td>-</td></tr></tbody></table>',16)]))}const Fn=y(Wn,[["render",wn]]),Tn={pageData:{title:"Tabs",description:"",frontmatter:{category:"Components",type:"Data Display",title:"Tabs",cover:"https://gw.alipayobjects.com/zos/antfincdn/lkI2hNEDr2V/Tabs.svg"},headers:[{level:3,title:"When To Use",slug:"When-To-Use",content:"Ant Design has 3 types of Tabs for different situations."},{level:2,title:"API",slug:"API",content:"Tabs"},{level:3,title:"Tabs",slug:"Tabs",content:""},{level:3,title:"Tabs Slots",slug:"Tabs-Slots",content:""},{level:3,title:"Tabs Events",slug:"Tabs-Events",content:""},{level:3,title:"Tabs.TabPane",slug:"Tabs-TabPane",content:""},{level:3,title:"Tabs.TabPane Slots",slug:"Tabs-TabPane-Slots",content:""}],relativePath:"components/tabs/index.en-US.md",content:`
Tabs make it easy to switch between different views.

### When To Use

Ant Design has 3 types of Tabs for different situations.

- Card Tabs: for managing too many closeable views.
- Normal Tabs: for functional aspects of a page.
- [RadioButton](/ant-design/components/radio/): for secondary tabs.

## API

### Tabs

| Property | Description | Type | Default | Version |
| --- | --- | --- | --- | --- |
| activeKey(v-model) | Current TabPane&#39;s key | string | - |  |
| animated | Whether to change tabs with animation. Only works while tabPosition=\`&quot;top&quot;\` \\| \`&quot;bottom&quot;\` | boolean \\| {inkBar:boolean, tabPane:boolean} | \`true\`, \`false\` when \`type=&quot;card&quot;\` |  |
| destroyInactiveTabPane | Whether destroy inactive TabPane when change tab | boolean | false |  |
| hideAdd | Hide plus icon or not. Only works while \`type=&quot;editable-card&quot;\` | boolean | \`false\` | } |
| size | preset tab bar size | \`large\` \\| \`default\` \\| \`small\` | \`default\` |  |
| tabBarGutter | The gap between tabs | number | - |  |
| tabBarStyle | Tab bar style object | object | - |  |
| tabPosition | Position of tabs | \`top\` \\| \`right\` \\| \`bottom\` \\| \`left\` | \`top\` |  |
| type | Basic style of tabs | \`line\` \\| \`card\` \\| \`editable-card\` | \`line\` |  |

### Tabs Slots

| Slot Name    | Description                    | Type              |     |
| ------------ | ------------------------------ | ----------------- | --- |
| addIcon      | Customize add icon             | -                 | -   |
| leftExtra    | Extra content in tab bar left  | -                 | -   |
| moreIcon     | The custom icon of ellipsis    | -                 | -   |
| renderTabBar | Replace the TabBar             | { DefaultTabBar } |     |
| rightExtra   | Extra content in tab bar right | -                 | -   |

### Tabs Events

| Events Name | Description | Arguments |
| --- | --- | --- |
| change | Callback executed when active tab is changed | Function(activeKey) {} |
| edit | Callback executed when tab is added or removed. Only works while \`type=&quot;editable-card&quot;\` | (targetKey, action): void |
| nextClick | Callback executed when next button is clicked | Function |
| prevClick | Callback executed when prev button is clicked | Function |
| tabClick | Callback executed when tab is clicked | Function |

### Tabs.TabPane

| Property | Description | Type | Default |
| --- | --- | --- | --- |
| forceRender | Forced render of content in tabs, not lazy render after clicking on tabs | boolean | false |
| key | TabPane&#39;s key | string | - |
| tab | Show text in TabPane&#39;s head | string\\|slot | - |

### Tabs.TabPane Slots

| \u63D2\u69FD\u540D\u79F0  | \u8BF4\u660E                                            | \u53C2\u6570 |
| --------- | ----------------------------------------------- | ---- |
| closeIcon | \u81EA\u5B9A\u4E49\u5173\u95ED\u56FE\u6807\uFF0C\`\u5728 type=&quot;editable-card&quot;\`\u65F6\u6709\u6548 | -    |
| tab       | Show text in TabPane&#39;s head                     | -    |
`,html:`<p>Tabs make it easy to switch between different views.</p>
<h3 id="When-To-Use">When To Use <a class="header-anchor" href="#When-To-Use">
          <span aria-hidden="true" class="anchor">#</span>
        </a></h3>
<p>Ant Design has 3 types of Tabs for different situations.</p>
<ul>
<li>Card Tabs: for managing too many closeable views.</li>
<li>Normal Tabs: for functional aspects of a page.</li>
<li><a href="/ant-design/components/radio/">RadioButton</a>: for secondary tabs.</li>
</ul>
<h2 id="API">API <a class="header-anchor" href="#API">
          <span aria-hidden="true" class="anchor">#</span>
        </a></h2>
<h3 id="Tabs">Tabs <a class="header-anchor" href="#Tabs">
          <span aria-hidden="true" class="anchor">#</span>
        </a></h3>
<table>
<thead>
<tr>
<th>Property</th>
<th>Description</th>
<th>Type</th>
<th>Default</th>
<th>Version</th>
</tr>
</thead>
<tbody>
<tr>
<td>activeKey(v-model)</td>
<td>Current TabPane's key</td>
<td>string</td>
<td>-</td>
<td></td>
</tr>
<tr>
<td>animated</td>
<td>Whether to change tabs with animation. Only works while tabPosition=<code>&quot;top&quot;</code> | <code>&quot;bottom&quot;</code></td>
<td>boolean | {inkBar:boolean, tabPane:boolean}</td>
<td><code>true</code>, <code>false</code> when <code>type=&quot;card&quot;</code></td>
<td></td>
</tr>
<tr>
<td>destroyInactiveTabPane</td>
<td>Whether destroy inactive TabPane when change tab</td>
<td>boolean</td>
<td>false</td>
<td></td>
</tr>
<tr>
<td>hideAdd</td>
<td>Hide plus icon or not. Only works while <code>type=&quot;editable-card&quot;</code></td>
<td>boolean</td>
<td><code>false</code></td>
<td>}</td>
</tr>
<tr>
<td>size</td>
<td>preset tab bar size</td>
<td><code>large</code> | <code>default</code> | <code>small</code></td>
<td><code>default</code></td>
<td></td>
</tr>
<tr>
<td>tabBarGutter</td>
<td>The gap between tabs</td>
<td>number</td>
<td>-</td>
<td></td>
</tr>
<tr>
<td>tabBarStyle</td>
<td>Tab bar style object</td>
<td>object</td>
<td>-</td>
<td></td>
</tr>
<tr>
<td>tabPosition</td>
<td>Position of tabs</td>
<td><code>top</code> | <code>right</code> | <code>bottom</code> | <code>left</code></td>
<td><code>top</code></td>
<td></td>
</tr>
<tr>
<td>type</td>
<td>Basic style of tabs</td>
<td><code>line</code> | <code>card</code> | <code>editable-card</code></td>
<td><code>line</code></td>
<td></td>
</tr>
</tbody>
</table>
<h3 id="Tabs-Slots">Tabs Slots <a class="header-anchor" href="#Tabs-Slots">
          <span aria-hidden="true" class="anchor">#</span>
        </a></h3>
<table>
<thead>
<tr>
<th>Slot Name</th>
<th>Description</th>
<th>Type</th>
<th></th>
</tr>
</thead>
<tbody>
<tr>
<td>addIcon</td>
<td>Customize add icon</td>
<td>-</td>
<td>-</td>
</tr>
<tr>
<td>leftExtra</td>
<td>Extra content in tab bar left</td>
<td>-</td>
<td>-</td>
</tr>
<tr>
<td>moreIcon</td>
<td>The custom icon of ellipsis</td>
<td>-</td>
<td>-</td>
</tr>
<tr>
<td>renderTabBar</td>
<td>Replace the TabBar</td>
<td>{ DefaultTabBar }</td>
<td></td>
</tr>
<tr>
<td>rightExtra</td>
<td>Extra content in tab bar right</td>
<td>-</td>
<td>-</td>
</tr>
</tbody>
</table>
<h3 id="Tabs-Events">Tabs Events <a class="header-anchor" href="#Tabs-Events">
          <span aria-hidden="true" class="anchor">#</span>
        </a></h3>
<table>
<thead>
<tr>
<th>Events Name</th>
<th>Description</th>
<th>Arguments</th>
</tr>
</thead>
<tbody>
<tr>
<td>change</td>
<td>Callback executed when active tab is changed</td>
<td>Function(activeKey) {}</td>
</tr>
<tr>
<td>edit</td>
<td>Callback executed when tab is added or removed. Only works while <code>type=&quot;editable-card&quot;</code></td>
<td>(targetKey, action): void</td>
</tr>
<tr>
<td>nextClick</td>
<td>Callback executed when next button is clicked</td>
<td>Function</td>
</tr>
<tr>
<td>prevClick</td>
<td>Callback executed when prev button is clicked</td>
<td>Function</td>
</tr>
<tr>
<td>tabClick</td>
<td>Callback executed when tab is clicked</td>
<td>Function</td>
</tr>
</tbody>
</table>
<h3 id="Tabs-TabPane">Tabs.TabPane <a class="header-anchor" href="#Tabs-TabPane">
          <span aria-hidden="true" class="anchor">#</span>
        </a></h3>
<table>
<thead>
<tr>
<th>Property</th>
<th>Description</th>
<th>Type</th>
<th>Default</th>
</tr>
</thead>
<tbody>
<tr>
<td>forceRender</td>
<td>Forced render of content in tabs, not lazy render after clicking on tabs</td>
<td>boolean</td>
<td>false</td>
</tr>
<tr>
<td>key</td>
<td>TabPane's key</td>
<td>string</td>
<td>-</td>
</tr>
<tr>
<td>tab</td>
<td>Show text in TabPane's head</td>
<td>string|slot</td>
<td>-</td>
</tr>
</tbody>
</table>
<h3 id="Tabs-TabPane-Slots">Tabs.TabPane Slots <a class="header-anchor" href="#Tabs-TabPane-Slots">
          <span aria-hidden="true" class="anchor">#</span>
        </a></h3>
<table>
<thead>
<tr>
<th>\u63D2\u69FD\u540D\u79F0</th>
<th>\u8BF4\u660E</th>
<th>\u53C2\u6570</th>
</tr>
</thead>
<tbody>
<tr>
<td>closeIcon</td>
<td>\u81EA\u5B9A\u4E49\u5173\u95ED\u56FE\u6807\uFF0C<code>\u5728 type=&quot;editable-card&quot;</code>\u65F6\u6709\u6548</td>
<td>-</td>
</tr>
<tr>
<td>tab</td>
<td>Show text in TabPane's head</td>
<td>-</td>
</tr>
</tbody>
</table>
`,lastUpdated:1748060301373}},Rn={class:"markdown"};function Pn(o,t,d,r,I,m){return i(),v("article",Rn,t[0]||(t[0]=[G('<p>Tabs make it easy to switch between different views.</p><h3 id="When-To-Use">When To Use <a class="header-anchor" href="#When-To-Use"><span aria-hidden="true" class="anchor">#</span></a></h3><p>Ant Design has 3 types of Tabs for different situations.</p><ul><li>Card Tabs: for managing too many closeable views.</li><li>Normal Tabs: for functional aspects of a page.</li><li><a href="/ant-design/components/radio/">RadioButton</a>: for secondary tabs.</li></ul><h2 id="API">API <a class="header-anchor" href="#API"><span aria-hidden="true" class="anchor">#</span></a></h2><h3 id="Tabs">Tabs <a class="header-anchor" href="#Tabs"><span aria-hidden="true" class="anchor">#</span></a></h3><table><thead><tr><th>Property</th><th>Description</th><th>Type</th><th>Default</th><th>Version</th></tr></thead><tbody><tr><td>activeKey(v-model)</td><td>Current TabPane&#39;s key</td><td>string</td><td>-</td><td></td></tr><tr><td>animated</td><td>Whether to change tabs with animation. Only works while tabPosition=<code>&quot;top&quot;</code> | <code>&quot;bottom&quot;</code></td><td>boolean | {inkBar:boolean, tabPane:boolean}</td><td><code>true</code>, <code>false</code> when <code>type=&quot;card&quot;</code></td><td></td></tr><tr><td>destroyInactiveTabPane</td><td>Whether destroy inactive TabPane when change tab</td><td>boolean</td><td>false</td><td></td></tr><tr><td>hideAdd</td><td>Hide plus icon or not. Only works while <code>type=&quot;editable-card&quot;</code></td><td>boolean</td><td><code>false</code></td><td>}</td></tr><tr><td>size</td><td>preset tab bar size</td><td><code>large</code> | <code>default</code> | <code>small</code></td><td><code>default</code></td><td></td></tr><tr><td>tabBarGutter</td><td>The gap between tabs</td><td>number</td><td>-</td><td></td></tr><tr><td>tabBarStyle</td><td>Tab bar style object</td><td>object</td><td>-</td><td></td></tr><tr><td>tabPosition</td><td>Position of tabs</td><td><code>top</code> | <code>right</code> | <code>bottom</code> | <code>left</code></td><td><code>top</code></td><td></td></tr><tr><td>type</td><td>Basic style of tabs</td><td><code>line</code> | <code>card</code> | <code>editable-card</code></td><td><code>line</code></td><td></td></tr></tbody></table><h3 id="Tabs-Slots">Tabs Slots <a class="header-anchor" href="#Tabs-Slots"><span aria-hidden="true" class="anchor">#</span></a></h3><table><thead><tr><th>Slot Name</th><th>Description</th><th>Type</th><th></th></tr></thead><tbody><tr><td>addIcon</td><td>Customize add icon</td><td>-</td><td>-</td></tr><tr><td>leftExtra</td><td>Extra content in tab bar left</td><td>-</td><td>-</td></tr><tr><td>moreIcon</td><td>The custom icon of ellipsis</td><td>-</td><td>-</td></tr><tr><td>renderTabBar</td><td>Replace the TabBar</td><td>{ DefaultTabBar }</td><td></td></tr><tr><td>rightExtra</td><td>Extra content in tab bar right</td><td>-</td><td>-</td></tr></tbody></table><h3 id="Tabs-Events">Tabs Events <a class="header-anchor" href="#Tabs-Events"><span aria-hidden="true" class="anchor">#</span></a></h3><table><thead><tr><th>Events Name</th><th>Description</th><th>Arguments</th></tr></thead><tbody><tr><td>change</td><td>Callback executed when active tab is changed</td><td>Function(activeKey) {}</td></tr><tr><td>edit</td><td>Callback executed when tab is added or removed. Only works while <code>type=&quot;editable-card&quot;</code></td><td>(targetKey, action): void</td></tr><tr><td>nextClick</td><td>Callback executed when next button is clicked</td><td>Function</td></tr><tr><td>prevClick</td><td>Callback executed when prev button is clicked</td><td>Function</td></tr><tr><td>tabClick</td><td>Callback executed when tab is clicked</td><td>Function</td></tr></tbody></table><h3 id="Tabs-TabPane">Tabs.TabPane <a class="header-anchor" href="#Tabs-TabPane"><span aria-hidden="true" class="anchor">#</span></a></h3><table><thead><tr><th>Property</th><th>Description</th><th>Type</th><th>Default</th></tr></thead><tbody><tr><td>forceRender</td><td>Forced render of content in tabs, not lazy render after clicking on tabs</td><td>boolean</td><td>false</td></tr><tr><td>key</td><td>TabPane&#39;s key</td><td>string</td><td>-</td></tr><tr><td>tab</td><td>Show text in TabPane&#39;s head</td><td>string|slot</td><td>-</td></tr></tbody></table><h3 id="Tabs-TabPane-Slots">Tabs.TabPane Slots <a class="header-anchor" href="#Tabs-TabPane-Slots"><span aria-hidden="true" class="anchor">#</span></a></h3><table><thead><tr><th>\u63D2\u69FD\u540D\u79F0</th><th>\u8BF4\u660E</th><th>\u53C2\u6570</th></tr></thead><tbody><tr><td>closeIcon</td><td>\u81EA\u5B9A\u4E49\u5173\u95ED\u56FE\u6807\uFF0C<code>\u5728 type=&quot;editable-card&quot;</code>\u65F6\u6709\u6548</td><td>-</td></tr><tr><td>tab</td><td>Show text in TabPane&#39;s head</td><td>-</td></tr></tbody></table>',15)]))}const Xn=y(Tn,[["render",Pn]]),Kn=A({category:"Components",subtitle:"\u6807\u7B7E\u9875",type:"Data Display",title:"Tabs",CN:Fn,US:Xn,components:{Centered:Gn,Basic:J,Card:q,CardTop:E,CustomAddTrigger:O,Disabled:an,EditableCard:on,Extra:cn,Icon:kn,Position:gn,Size:Cn,Slide:yn,CustomTabBar:Yn}});function Sn(o,t,d,r,I,m){const c=p("Basic"),u=p("Disabled"),l=p("Centered"),k=p("Icon"),g=p("Slide"),C=p("Extra"),W=p("Size"),B=p("Position"),w=p("Card"),F=p("EditableCard"),T=p("CardTop"),R=p("CustomAddTrigger"),P=p("CustomTabBar"),X=p("demo-sort");return i(),h(X,{cols:1},{default:s(()=>[e(c),e(u),e(l),e(k),e(g),e(C),e(W),e(B),e(w),e(F),e(T),e(R),e(P)]),_:1})}const Ln=y(Kn,[["render",Sn]]);export{Ln as default};