import{d as I,C as B,_ as d,l as g,w as o,j as e,k,f as s,b as n,e as a,P as W,r as f,a as C,h as x,F as S,q as w}from"./index.3fe853a6.js";import{N as X}from"./NotificationOutlined.40f5adfc.js";import{M as q}from"./MinusOutlined.aa94c9ae.js";const z=I({components:{ClockCircleOutlined:B}});function J(l,t,c,p,i,h){const u=e("a-avatar"),r=e("a-badge"),b=e("clock-circle-outlined"),m=e("demo-box");return k(),g(m,{jsfiddle:{us:"Simplest Usage. Badge will be hidden when `count` is `0`, but we can use `showZero` to show it.",cn:"\u7B80\u5355\u7684\u5FBD\u7AE0\u5C55\u793A\uFF0C\u5F53 `count` \u4E3A `0` \u65F6\uFF0C\u9ED8\u8BA4\u4E0D\u663E\u793A\uFF0C\u4F46\u662F\u53EF\u4EE5\u4F7F\u7528 `showZero` \u4FEE\u6539\u4E3A\u663E\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>\u7B80\u5355\u7684\u5FBD\u7AE0\u5C55\u793A\uFF0C\u5F53 <code>count</code> \u4E3A <code>0</code> \u65F6\uFF0C\u9ED8\u8BA4\u4E0D\u663E\u793A\uFF0C\u4F46\u662F\u53EF\u4EE5\u4F7F\u7528 <code>showZero</code> \u4FEE\u6539\u4E3A\u663E\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>Simplest Usage. Badge will be hidden when <code>count</code> is <code>0</code>, but we can use <code>showZero</code> to show it.</p>
`,order:0,title:{"zh-CN":"\u57FA\u672C","en-US":"Basic"},relativePath:"components/badge/demo/basic.vue",sourceCode:"PHRlbXBsYXRlPgogIDxhLWJhZGdlIGNvdW50PSI1Ij4KICAgIDxhLWF2YXRhciBzaGFwZT0ic3F1YXJlIiBzaXplPSJsYXJnZSIgLz4KICA8L2EtYmFkZ2U+CiAgPGEtYmFkZ2UgY291bnQ9IjAiIHNob3ctemVybz4KICAgIDxhLWF2YXRhciBzaGFwZT0ic3F1YXJlIiBzaXplPSJsYXJnZSIgLz4KICA8L2EtYmFkZ2U+CiAgPGEtYmFkZ2U+CiAgICA8dGVtcGxhdGUgI2NvdW50PgogICAgICA8Y2xvY2stY2lyY2xlLW91dGxpbmVkIHN0eWxlPSJjb2xvcjogI2Y1MjIyZCIgLz4KICAgIDwvdGVtcGxhdGU+CiAgICA8YS1hdmF0YXIgc2hhcGU9InNxdWFyZSIgc2l6ZT0ibGFyZ2UiIC8+CiAgPC9hLWJhZGdlPgo8L3RlbXBsYXRlPgo8c2NyaXB0IGxhbmc9InRzIj4KaW1wb3J0IHsgZGVmaW5lQ29tcG9uZW50IH0gZnJvbSAndnVlJzsKaW1wb3J0IHsgQ2xvY2tDaXJjbGVPdXRsaW5lZCB9IGZyb20gJ0BhbnQtZGVzaWduL2ljb25zLXZ1ZSc7CmV4cG9ydCBkZWZhdWx0IGRlZmluZUNvbXBvbmVudCh7CiAgY29tcG9uZW50czogewogICAgQ2xvY2tDaXJjbGVPdXRsaW5lZCwKICB9LAp9KTsKPC9zY3JpcHQ+Cgo=",jsSourceCode:"PHRlbXBsYXRlPgogIDxhLWJhZGdlIGNvdW50PSI1Ij4KICAgIDxhLWF2YXRhciBzaGFwZT0ic3F1YXJlIiBzaXplPSJsYXJnZSIgLz4KICA8L2EtYmFkZ2U+CiAgPGEtYmFkZ2UgY291bnQ9IjAiIHNob3ctemVybz4KICAgIDxhLWF2YXRhciBzaGFwZT0ic3F1YXJlIiBzaXplPSJsYXJnZSIgLz4KICA8L2EtYmFkZ2U+CiAgPGEtYmFkZ2U+CiAgICA8dGVtcGxhdGUgI2NvdW50PgogICAgICA8Y2xvY2stY2lyY2xlLW91dGxpbmVkIHN0eWxlPSJjb2xvcjogI2Y1MjIyZCIgLz4KICAgIDwvdGVtcGxhdGU+CiAgICA8YS1hdmF0YXIgc2hhcGU9InNxdWFyZSIgc2l6ZT0ibGFyZ2UiIC8+CiAgPC9hLWJhZGdlPgo8L3RlbXBsYXRlPgo8c2NyaXB0PgppbXBvcnQgeyBkZWZpbmVDb21wb25lbnQgfSBmcm9tICd2dWUnOwppbXBvcnQgeyBDbG9ja0NpcmNsZU91dGxpbmVkIH0gZnJvbSAnQGFudC1kZXNpZ24vaWNvbnMtdnVlJzsKZXhwb3J0IGRlZmF1bHQgZGVmaW5lQ29tcG9uZW50KHsKICBjb21wb25lbnRzOiB7CiAgICBDbG9ja0NpcmNsZU91dGxpbmVkLAogIH0sCn0pOwo8L3NjcmlwdD4="}},{default:o(()=>[s(r,{count:"5"},{default:o(()=>[s(u,{shape:"square",size:"large"})]),_:1}),s(r,{count:"0","show-zero":""},{default:o(()=>[s(u,{shape:"square",size:"large"})]),_:1}),s(r,null,{count:o(()=>[s(b,{style:{color:"#f5222d"}})]),default:o(()=>[s(u,{shape:"square",size:"large"})]),_:1})]),htmlCode:o(()=>t[0]||(t[0]=[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-badge")]),a(),n("span",{class:"token attr-name"},"count"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),a("5"),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-avatar")]),a(),n("span",{class:"token attr-name"},"shape"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),a("square"),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("large"),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-badge")]),n("span",{class:"token punctuation"},">")]),a(`
  `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),a("a-badge")]),a(),n("span",{class:"token attr-name"},"count"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),a("0"),n("span",{class:"token punctuation"},'"')]),a(),n("span",{class:"token attr-name"},"show-zero"),n("span",{class:"token punctuation"},">")]),a(`
    `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),a("a-avatar")]),a(),n("span",{class:"token attr-name"},"shape"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),a("square"),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("large"),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-badge")]),n("span",{class:"token punctuation"},">")]),a(`
  `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),a("a-badge")]),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"},"#count"),n("span",{class:"token punctuation"},">")]),a(`
      `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),a("clock-circle-outlined")]),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"},"color"),n("span",{class:"token punctuation"},":"),a(" #f5222d")]),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-avatar")]),a(),n("span",{class:"token attr-name"},"shape"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),a("square"),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("large"),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-badge")]),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(),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(" ClockCircleOutlined "),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"},"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(`
    ClockCircleOutlined`),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:o(()=>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-badge")]),a(),n("span",{class:"token attr-name"},"count"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),a("5"),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-avatar")]),a(),n("span",{class:"token attr-name"},"shape"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),a("square"),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("large"),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-badge")]),n("span",{class:"token punctuation"},">")]),a(`
  `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),a("a-badge")]),a(),n("span",{class:"token attr-name"},"count"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),a("0"),n("span",{class:"token punctuation"},'"')]),a(),n("span",{class:"token attr-name"},"show-zero"),n("span",{class:"token punctuation"},">")]),a(`
    `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),a("a-avatar")]),a(),n("span",{class:"token attr-name"},"shape"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),a("square"),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("large"),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-badge")]),n("span",{class:"token punctuation"},">")]),a(`
  `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),a("a-badge")]),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"},"#count"),n("span",{class:"token punctuation"},">")]),a(`
      `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),a("clock-circle-outlined")]),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"},"color"),n("span",{class:"token punctuation"},":"),a(" #f5222d")]),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-avatar")]),a(),n("span",{class:"token attr-name"},"shape"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),a("square"),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("large"),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-badge")]),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(),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(" ClockCircleOutlined "),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"},"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(`
    ClockCircleOutlined`),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 N=d(z,[["render",J]]),R={};function H(l,t){const c=e("a-badge"),p=e("demo-box");return k(),g(p,{jsfiddle:{us:"Used in standalone when children is empty.",cn:`\u4E0D\u5305\u88F9\u4EFB\u4F55\u5143\u7D20\u5373\u662F\u72EC\u7ACB\u4F7F\u7528\uFF0C\u53EF\u81EA\u5B9A\u6837\u5F0F\u5C55\u73B0\u3002
\u5728\u53F3\u4E0A\u89D2\u7684 badge \u5219\u9650\u5B9A\u4E3A\u7EA2\u8272\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>\u4E0D\u5305\u88F9\u4EFB\u4F55\u5143\u7D20\u5373\u662F\u72EC\u7ACB\u4F7F\u7528\uFF0C\u53EF\u81EA\u5B9A\u6837\u5F0F\u5C55\u73B0\u3002
\u5728\u53F3\u4E0A\u89D2\u7684 badge \u5219\u9650\u5B9A\u4E3A\u7EA2\u8272\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>Used in standalone when children is empty.</p>
`,order:1,title:{"zh-CN":"\u72EC\u7ACB\u4F7F\u7528","en-US":"Standalone"},relativePath:"components/badge/demo/no-wrapper.vue",sourceCode:"PHRlbXBsYXRlPgogIDxhLWJhZGdlIGNvdW50PSIyNSIgLz4KICA8YS1iYWRnZQogICAgY291bnQ9IjQiCiAgICA6bnVtYmVyLXN0eWxlPSJ7CiAgICAgIGJhY2tncm91bmRDb2xvcjogJyNmZmYnLAogICAgICBjb2xvcjogJyM5OTknLAogICAgICBib3hTaGFkb3c6ICcwIDAgMCAxcHggI2Q5ZDlkOSBpbnNldCcsCiAgICB9IgogIC8+CiAgPGEtYmFkZ2UgY291bnQ9IjEwOSIgOm51bWJlci1zdHlsZT0ieyBiYWNrZ3JvdW5kQ29sb3I6ICcjNTJjNDFhJyB9IiAvPgo8L3RlbXBsYXRlPgoKCg==",jsSourceCode:"PHRlbXBsYXRlPgogIDxhLWJhZGdlIGNvdW50PSIyNSIgLz4KICA8YS1iYWRnZQogICAgY291bnQ9IjQiCiAgICA6bnVtYmVyLXN0eWxlPSJ7CiAgICAgIGJhY2tncm91bmRDb2xvcjogJyNmZmYnLAogICAgICBjb2xvcjogJyM5OTknLAogICAgICBib3hTaGFkb3c6ICcwIDAgMCAxcHggI2Q5ZDlkOSBpbnNldCcsCiAgICB9IgogIC8+CiAgPGEtYmFkZ2UgY291bnQ9IjEwOSIgOm51bWJlci1zdHlsZT0ieyBiYWNrZ3JvdW5kQ29sb3I6ICcjNTJjNDFhJyB9IiAvPgo8L3RlbXBsYXRlPg=="}},{default:o(()=>[s(c,{count:"25"}),s(c,{count:"4","number-style":{backgroundColor:"#fff",color:"#999",boxShadow:"0 0 0 1px #d9d9d9 inset"}}),s(c,{count:"109","number-style":{backgroundColor:"#52c41a"}})]),htmlCode:o(()=>t[0]||(t[0]=[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-badge")]),a(),n("span",{class:"token attr-name"},"count"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),a("25"),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-badge")]),a(`
    `),n("span",{class:"token attr-name"},"count"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),a("4"),n("span",{class:"token punctuation"},'"')]),a(`
    `),n("span",{class:"token attr-name"},":number-style"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),a(`{
      backgroundColor: '#fff',
      color: '#999',
      boxShadow: '0 0 0 1px #d9d9d9 inset',
    }`),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-badge")]),a(),n("span",{class:"token attr-name"},"count"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),a("109"),n("span",{class:"token punctuation"},'"')]),a(),n("span",{class:"token attr-name"},":number-style"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),a("{ backgroundColor: '#52c41a' }"),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(`
`)])],-1)])),jsVersionHtml:o(()=>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-badge")]),a(),n("span",{class:"token attr-name"},"count"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),a("25"),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-badge")]),a(`
    `),n("span",{class:"token attr-name"},"count"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),a("4"),n("span",{class:"token punctuation"},'"')]),a(`
    `),n("span",{class:"token attr-name"},":number-style"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),a(`{
      backgroundColor: '#fff',
      color: '#999',
      boxShadow: '0 0 0 1px #d9d9d9 inset',
    }`),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-badge")]),a(),n("span",{class:"token attr-name"},"count"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),a("109"),n("span",{class:"token punctuation"},'"')]),a(),n("span",{class:"token attr-name"},":number-style"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),a("{ backgroundColor: '#52c41a' }"),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(`
`)])],-1)])),_:1})}const F=d(R,[["render",H]]),V=I({components:{NotificationOutlined:X}});function L(l,t,c,p,i,h){const u=e("notification-outlined"),r=e("a-badge"),b=e("demo-box");return k(),g(b,{jsfiddle:{us:`This will simply display a red badge, without a specific count.
If count equals 0, it won't display the dot.`,cn:"\u6CA1\u6709\u5177\u4F53\u7684\u6570\u5B57\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>\u6CA1\u6709\u5177\u4F53\u7684\u6570\u5B57\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>This will simply display a red badge, without a specific count.
If count equals 0, it won't display the dot.</p>
`,order:3,title:{"zh-CN":"\u8BA8\u5ACC\u7684\u5C0F\u7EA2\u70B9","en-US":"Red badge"},relativePath:"components/badge/demo/dot.vue",sourceCode:"PHRlbXBsYXRlPgogIDxhLWJhZGdlIGRvdD4KICAgIDxub3RpZmljYXRpb24tb3V0bGluZWQgc3R5bGU9ImZvbnQtc2l6ZTogMTZweCIgLz4KICA8L2EtYmFkZ2U+CiAgPGEtYmFkZ2UgZG90PgogICAgPGEgaHJlZj0iIyI+TGluayBzb21ldGhpbmc8L2E+CiAgPC9hLWJhZGdlPgo8L3RlbXBsYXRlPgo8c2NyaXB0IGxhbmc9InRzIj4KaW1wb3J0IHsgZGVmaW5lQ29tcG9uZW50IH0gZnJvbSAndnVlJzsKaW1wb3J0IHsgTm90aWZpY2F0aW9uT3V0bGluZWQgfSBmcm9tICdAYW50LWRlc2lnbi9pY29ucy12dWUnOwpleHBvcnQgZGVmYXVsdCBkZWZpbmVDb21wb25lbnQoewogIGNvbXBvbmVudHM6IHsKICAgIE5vdGlmaWNhdGlvbk91dGxpbmVkLAogIH0sCn0pOwo8L3NjcmlwdD4KCg==",jsSourceCode:"PHRlbXBsYXRlPgogIDxhLWJhZGdlIGRvdD4KICAgIDxub3RpZmljYXRpb24tb3V0bGluZWQgc3R5bGU9ImZvbnQtc2l6ZTogMTZweCIgLz4KICA8L2EtYmFkZ2U+CiAgPGEtYmFkZ2UgZG90PgogICAgPGEgaHJlZj0iIyI+TGluayBzb21ldGhpbmc8L2E+CiAgPC9hLWJhZGdlPgo8L3RlbXBsYXRlPgo8c2NyaXB0PgppbXBvcnQgeyBkZWZpbmVDb21wb25lbnQgfSBmcm9tICd2dWUnOwppbXBvcnQgeyBOb3RpZmljYXRpb25PdXRsaW5lZCB9IGZyb20gJ0BhbnQtZGVzaWduL2ljb25zLXZ1ZSc7CmV4cG9ydCBkZWZhdWx0IGRlZmluZUNvbXBvbmVudCh7CiAgY29tcG9uZW50czogewogICAgTm90aWZpY2F0aW9uT3V0bGluZWQsCiAgfSwKfSk7Cjwvc2NyaXB0Pg=="}},{default:o(()=>[s(r,{dot:""},{default:o(()=>[s(u,{style:{"font-size":"16px"}})]),_:1}),s(r,{dot:""},{default:o(()=>t[0]||(t[0]=[n("a",{href:"#"},"Link something",-1)])),_:1,__:[0]})]),htmlCode:o(()=>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-badge")]),a(),n("span",{class:"token attr-name"},"dot"),n("span",{class:"token punctuation"},">")]),a(`
    `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),a("notification-outlined")]),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"},"font-size"),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("a-badge")]),n("span",{class:"token punctuation"},">")]),a(`
  `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),a("a-badge")]),a(),n("span",{class:"token attr-name"},"dot"),n("span",{class:"token punctuation"},">")]),a(`
    `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),a("a")]),a(),n("span",{class:"token attr-name"},"href"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),a("#"),n("span",{class:"token punctuation"},'"')]),n("span",{class:"token punctuation"},">")]),a("Link something"),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"</"),a("a")]),n("span",{class:"token punctuation"},">")]),a(`
  `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"</"),a("a-badge")]),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(),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(" NotificationOutlined "),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"},"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(`
    NotificationOutlined`),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:o(()=>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-badge")]),a(),n("span",{class:"token attr-name"},"dot"),n("span",{class:"token punctuation"},">")]),a(`
    `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),a("notification-outlined")]),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"},"font-size"),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("a-badge")]),n("span",{class:"token punctuation"},">")]),a(`
  `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),a("a-badge")]),a(),n("span",{class:"token attr-name"},"dot"),n("span",{class:"token punctuation"},">")]),a(`
    `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),a("a")]),a(),n("span",{class:"token attr-name"},"href"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),a("#"),n("span",{class:"token punctuation"},'"')]),n("span",{class:"token punctuation"},">")]),a("Link something"),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"</"),a("a")]),n("span",{class:"token punctuation"},">")]),a(`
  `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"</"),a("a-badge")]),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(),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(" NotificationOutlined "),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"},"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(`
    NotificationOutlined`),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=d(V,[["render",L]]),U=I({components:{MinusOutlined:q,PlusOutlined:W},setup(){const l=f(5),t=()=>{l.value>=1&&l.value--},c=()=>{l.value++};return{count:l,show:f(!0),decline:t,increase:c}}});function _(l,t,c,p,i,h){const u=e("a-avatar"),r=e("a-badge"),b=e("minus-outlined"),m=e("a-button"),v=e("plus-outlined"),Z=e("a-button-group"),y=e("a-divider"),G=e("a-switch"),A=e("demo-box");return k(),g(A,{jsfiddle:{us:"The count will be animated as it changes.",cn:"\u5C55\u793A\u52A8\u6001\u53D8\u5316\u7684\u6548\u679C\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>\u5C55\u793A\u52A8\u6001\u53D8\u5316\u7684\u6548\u679C\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 count will be animated as it changes.</p>
`,order:5,title:{"zh-CN":"\u52A8\u6001","en-US":"Dynamic"},relativePath:"components/badge/demo/change.vue",sourceCode:"PHRlbXBsYXRlPgogIDxkaXY+CiAgICA8YS1iYWRnZSA6Y291bnQ9ImNvdW50Ij4KICAgICAgPGEtYXZhdGFyIHNoYXBlPSJzcXVhcmUiIHNpemU9ImxhcmdlIiAvPgogICAgPC9hLWJhZGdlPgogICAgPGEtYnV0dG9uLWdyb3VwPgogICAgICA8YS1idXR0b24gQGNsaWNrPSJkZWNsaW5lIj4KICAgICAgICA8bWludXMtb3V0bGluZWQgLz4KICAgICAgPC9hLWJ1dHRvbj4KICAgICAgPGEtYnV0dG9uIEBjbGljaz0iaW5jcmVhc2UiPgogICAgICAgIDxwbHVzLW91dGxpbmVkIC8+CiAgICAgIDwvYS1idXR0b24+CiAgICA8L2EtYnV0dG9uLWdyb3VwPgogIDwvZGl2PgogIDxhLWRpdmlkZXIgLz4KICA8YS1iYWRnZSA6ZG90PSJzaG93Ij4KICAgIDxhLWF2YXRhciBzaGFwZT0ic3F1YXJlIiBzaXplPSJsYXJnZSIgLz4KICA8L2EtYmFkZ2U+CiAgPGEtc3dpdGNoIHYtbW9kZWw6Y2hlY2tlZD0ic2hvdyIgLz4KPC90ZW1wbGF0ZT4KPHNjcmlwdCBsYW5nPSJ0cyI+CmltcG9ydCB7IGRlZmluZUNvbXBvbmVudCwgcmVmIH0gZnJvbSAndnVlJzsKaW1wb3J0IHsgTWludXNPdXRsaW5lZCwgUGx1c091dGxpbmVkIH0gZnJvbSAnQGFudC1kZXNpZ24vaWNvbnMtdnVlJzsKZXhwb3J0IGRlZmF1bHQgZGVmaW5lQ29tcG9uZW50KHsKICBjb21wb25lbnRzOiB7CiAgICBNaW51c091dGxpbmVkLAogICAgUGx1c091dGxpbmVkLAogIH0sCiAgc2V0dXAoKSB7CiAgICBjb25zdCBjb3VudCA9IHJlZjxudW1iZXI+KDUpOwogICAgY29uc3QgZGVjbGluZSA9ICgpID0+IHsKICAgICAgaWYgKGNvdW50LnZhbHVlID49IDEpIHsKICAgICAgICBjb3VudC52YWx1ZS0tOwogICAgICB9CiAgICB9OwoKICAgIGNvbnN0IGluY3JlYXNlID0gKCkgPT4gewogICAgICBjb3VudC52YWx1ZSsrOwogICAgfTsKICAgIHJldHVybiB7CiAgICAgIGNvdW50LAogICAgICBzaG93OiByZWY8Ym9vbGVhbj4odHJ1ZSksCiAgICAgIGRlY2xpbmUsCiAgICAgIGluY3JlYXNlLAogICAgfTsKICB9LAp9KTsKPC9zY3JpcHQ+Cgo=",jsSourceCode:"PHRlbXBsYXRlPgogIDxkaXY+CiAgICA8YS1iYWRnZSA6Y291bnQ9ImNvdW50Ij4KICAgICAgPGEtYXZhdGFyIHNoYXBlPSJzcXVhcmUiIHNpemU9ImxhcmdlIiAvPgogICAgPC9hLWJhZGdlPgogICAgPGEtYnV0dG9uLWdyb3VwPgogICAgICA8YS1idXR0b24gQGNsaWNrPSJkZWNsaW5lIj4KICAgICAgICA8bWludXMtb3V0bGluZWQgLz4KICAgICAgPC9hLWJ1dHRvbj4KICAgICAgPGEtYnV0dG9uIEBjbGljaz0iaW5jcmVhc2UiPgogICAgICAgIDxwbHVzLW91dGxpbmVkIC8+CiAgICAgIDwvYS1idXR0b24+CiAgICA8L2EtYnV0dG9uLWdyb3VwPgogIDwvZGl2PgogIDxhLWRpdmlkZXIgLz4KICA8YS1iYWRnZSA6ZG90PSJzaG93Ij4KICAgIDxhLWF2YXRhciBzaGFwZT0ic3F1YXJlIiBzaXplPSJsYXJnZSIgLz4KICA8L2EtYmFkZ2U+CiAgPGEtc3dpdGNoIHYtbW9kZWw6Y2hlY2tlZD0ic2hvdyIgLz4KPC90ZW1wbGF0ZT4KPHNjcmlwdD4KaW1wb3J0IHsgZGVmaW5lQ29tcG9uZW50LCByZWYgfSBmcm9tICd2dWUnOwppbXBvcnQgeyBNaW51c091dGxpbmVkLCBQbHVzT3V0bGluZWQgfSBmcm9tICdAYW50LWRlc2lnbi9pY29ucy12dWUnOwpleHBvcnQgZGVmYXVsdCBkZWZpbmVDb21wb25lbnQoewogIGNvbXBvbmVudHM6IHsKICAgIE1pbnVzT3V0bGluZWQsCiAgICBQbHVzT3V0bGluZWQsCiAgfSwKICBzZXR1cCgpIHsKICAgIGNvbnN0IGNvdW50ID0gcmVmKDUpOwogICAgY29uc3QgZGVjbGluZSA9ICgpID0+IHsKICAgICAgaWYgKGNvdW50LnZhbHVlID49IDEpIHsKICAgICAgICBjb3VudC52YWx1ZS0tOwogICAgICB9CiAgICB9OwogICAgY29uc3QgaW5jcmVhc2UgPSAoKSA9PiB7CiAgICAgIGNvdW50LnZhbHVlKys7CiAgICB9OwogICAgcmV0dXJuIHsKICAgICAgY291bnQsCiAgICAgIHNob3c6IHJlZih0cnVlKSwKICAgICAgZGVjbGluZSwKICAgICAgaW5jcmVhc2UsCiAgICB9OwogIH0sCn0pOwo8L3NjcmlwdD4="}},{default:o(()=>[n("div",null,[s(r,{count:l.count},{default:o(()=>[s(u,{shape:"square",size:"large"})]),_:1},8,["count"]),s(Z,null,{default:o(()=>[s(m,{onClick:l.decline},{default:o(()=>[s(b)]),_:1},8,["onClick"]),s(m,{onClick:l.increase},{default:o(()=>[s(v)]),_:1},8,["onClick"])]),_:1})]),s(y),s(r,{dot:l.show},{default:o(()=>[s(u,{shape:"square",size:"large"})]),_:1},8,["dot"]),s(G,{checked:l.show,"onUpdate:checked":t[0]||(t[0]=Y=>l.show=Y)},null,8,["checked"])]),htmlCode:o(()=>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("div")]),n("span",{class:"token punctuation"},">")]),a(`
    `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),a("a-badge")]),a(),n("span",{class:"token attr-name"},":count"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),a("count"),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-avatar")]),a(),n("span",{class:"token attr-name"},"shape"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),a("square"),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("large"),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-badge")]),n("span",{class:"token punctuation"},">")]),a(`
    `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),a("a-button-group")]),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("decline"),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("minus-outlined")]),a(),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(`
      `),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("increase"),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("plus-outlined")]),a(),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(`
    `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"</"),a("a-button-group")]),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-divider")]),a(),n("span",{class:"token punctuation"},"/>")]),a(`
  `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),a("a-badge")]),a(),n("span",{class:"token attr-name"},":dot"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),a("show"),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-avatar")]),a(),n("span",{class:"token attr-name"},"shape"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),a("square"),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("large"),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-badge")]),n("span",{class:"token punctuation"},">")]),a(`
  `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),a("a-switch")]),a(),n("span",{class:"token attr-name"},[n("span",{class:"token namespace"},"v-model:"),a("checked")]),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),a("show"),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("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(" MinusOutlined"),n("span",{class:"token punctuation"},","),a(" PlusOutlined "),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"},"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(`
    MinusOutlined`),n("span",{class:"token punctuation"},","),a(`
    PlusOutlined`),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"},"const"),a(" count "),n("span",{class:"token operator"},"="),a(" ref"),n("span",{class:"token operator"},"<"),a("number"),n("span",{class:"token operator"},">"),n("span",{class:"token punctuation"},"("),n("span",{class:"token number"},"5"),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"},"decline"),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(`
      `),n("span",{class:"token keyword"},"if"),a(),n("span",{class:"token punctuation"},"("),a("count"),n("span",{class:"token punctuation"},"."),a("value "),n("span",{class:"token operator"},">="),a(),n("span",{class:"token number"},"1"),n("span",{class:"token punctuation"},")"),a(),n("span",{class:"token punctuation"},"{"),a(`
        count`),n("span",{class:"token punctuation"},"."),a("value"),n("span",{class:"token operator"},"--"),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"},"increase"),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(`
      count`),n("span",{class:"token punctuation"},"."),a("value"),n("span",{class:"token operator"},"++"),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(`
      count`),n("span",{class:"token punctuation"},","),a(`
      `),n("span",{class:"token literal-property property"},"show"),n("span",{class:"token operator"},":"),a(" ref"),n("span",{class:"token operator"},"<"),a("boolean"),n("span",{class:"token operator"},">"),n("span",{class:"token punctuation"},"("),n("span",{class:"token boolean"},"true"),n("span",{class:"token punctuation"},")"),n("span",{class:"token punctuation"},","),a(`
      decline`),n("span",{class:"token punctuation"},","),a(`
      increase`),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:o(()=>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("a-badge")]),a(),n("span",{class:"token attr-name"},":count"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),a("count"),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-avatar")]),a(),n("span",{class:"token attr-name"},"shape"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),a("square"),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("large"),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-badge")]),n("span",{class:"token punctuation"},">")]),a(`
    `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),a("a-button-group")]),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("decline"),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("minus-outlined")]),a(),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(`
      `),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("increase"),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("plus-outlined")]),a(),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(`
    `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"</"),a("a-button-group")]),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-divider")]),a(),n("span",{class:"token punctuation"},"/>")]),a(`
  `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),a("a-badge")]),a(),n("span",{class:"token attr-name"},":dot"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),a("show"),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-avatar")]),a(),n("span",{class:"token attr-name"},"shape"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),a("square"),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("large"),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-badge")]),n("span",{class:"token punctuation"},">")]),a(`
  `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),a("a-switch")]),a(),n("span",{class:"token attr-name"},[n("span",{class:"token namespace"},"v-model:"),a("checked")]),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),a("show"),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("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"},"import"),a(),n("span",{class:"token punctuation"},"{"),a(" MinusOutlined"),n("span",{class:"token punctuation"},","),a(" PlusOutlined "),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"},"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(`
    MinusOutlined`),n("span",{class:"token punctuation"},","),a(`
    PlusOutlined`),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"},"const"),a(" count "),n("span",{class:"token operator"},"="),a(),n("span",{class:"token function"},"ref"),n("span",{class:"token punctuation"},"("),n("span",{class:"token number"},"5"),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"},"decline"),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(`
      `),n("span",{class:"token keyword"},"if"),a(),n("span",{class:"token punctuation"},"("),a("count"),n("span",{class:"token punctuation"},"."),a("value "),n("span",{class:"token operator"},">="),a(),n("span",{class:"token number"},"1"),n("span",{class:"token punctuation"},")"),a(),n("span",{class:"token punctuation"},"{"),a(`
        count`),n("span",{class:"token punctuation"},"."),a("value"),n("span",{class:"token operator"},"--"),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"},"increase"),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(`
      count`),n("span",{class:"token punctuation"},"."),a("value"),n("span",{class:"token operator"},"++"),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(`
      count`),n("span",{class:"token punctuation"},","),a(`
      `),n("span",{class:"token literal-property property"},"show"),n("span",{class:"token operator"},":"),a(),n("span",{class:"token function"},"ref"),n("span",{class:"token punctuation"},"("),n("span",{class:"token boolean"},"true"),n("span",{class:"token punctuation"},")"),n("span",{class:"token punctuation"},","),a(`
      decline`),n("span",{class:"token punctuation"},","),a(`
      increase`),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 D=d(U,[["render",_]]),E={};function K(l,t){const c=e("a-avatar"),p=e("a-badge"),i=e("demo-box");return k(),g(i,{jsfiddle:{us:"`${overflowCount}+` is displayed when count is larger than `overflowCount`. The default value of `overflowCount` is `99`.",cn:"\u8D85\u8FC7 `overflowCount` \u7684\u4F1A\u663E\u793A\u4E3A `${overflowCount}+`\uFF0C\u9ED8\u8BA4\u7684 `overflowCount` \u4E3A `99`\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>\u8D85\u8FC7 <code>overflowCount</code> \u7684\u4F1A\u663E\u793A\u4E3A <code>\${overflowCount}+</code>\uFF0C\u9ED8\u8BA4\u7684 <code>overflowCount</code> \u4E3A <code>99</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><code>\${overflowCount}+</code> is displayed when count is larger than <code>overflowCount</code>. The default value of <code>overflowCount</code> is <code>99</code>.</p>
`,order:2,title:{"zh-CN":"\u5C01\u9876\u6570\u5B57","en-US":"Overflow Count"},relativePath:"components/badge/demo/overflow.vue",sourceCode:"PHRlbXBsYXRlPgogIDxhLWJhZGdlIDpjb3VudD0iOTkiPgogICAgPGEtYXZhdGFyIHNoYXBlPSJzcXVhcmUiIHNpemU9ImxhcmdlIiAvPgogIDwvYS1iYWRnZT4KICA8YS1iYWRnZSA6Y291bnQ9IjEwMCI+CiAgICA8YS1hdmF0YXIgc2hhcGU9InNxdWFyZSIgc2l6ZT0ibGFyZ2UiIC8+CiAgPC9hLWJhZGdlPgogIDxhLWJhZGdlIDpjb3VudD0iOTkiIDpvdmVyZmxvdy1jb3VudD0iMTAiPgogICAgPGEtYXZhdGFyIHNoYXBlPSJzcXVhcmUiIHNpemU9ImxhcmdlIiAvPgogIDwvYS1iYWRnZT4KICA8YS1iYWRnZSA6Y291bnQ9IjEwMDAiIDpvdmVyZmxvdy1jb3VudD0iOTk5Ij4KICAgIDxhLWF2YXRhciBzaGFwZT0ic3F1YXJlIiBzaXplPSJsYXJnZSIgLz4KICA8L2EtYmFkZ2U+CjwvdGVtcGxhdGU+CgoK",jsSourceCode:"PHRlbXBsYXRlPgogIDxhLWJhZGdlIDpjb3VudD0iOTkiPgogICAgPGEtYXZhdGFyIHNoYXBlPSJzcXVhcmUiIHNpemU9ImxhcmdlIiAvPgogIDwvYS1iYWRnZT4KICA8YS1iYWRnZSA6Y291bnQ9IjEwMCI+CiAgICA8YS1hdmF0YXIgc2hhcGU9InNxdWFyZSIgc2l6ZT0ibGFyZ2UiIC8+CiAgPC9hLWJhZGdlPgogIDxhLWJhZGdlIDpjb3VudD0iOTkiIDpvdmVyZmxvdy1jb3VudD0iMTAiPgogICAgPGEtYXZhdGFyIHNoYXBlPSJzcXVhcmUiIHNpemU9ImxhcmdlIiAvPgogIDwvYS1iYWRnZT4KICA8YS1iYWRnZSA6Y291bnQ9IjEwMDAiIDpvdmVyZmxvdy1jb3VudD0iOTk5Ij4KICAgIDxhLWF2YXRhciBzaGFwZT0ic3F1YXJlIiBzaXplPSJsYXJnZSIgLz4KICA8L2EtYmFkZ2U+CjwvdGVtcGxhdGU+"}},{default:o(()=>[s(p,{count:99},{default:o(()=>[s(c,{shape:"square",size:"large"})]),_:1}),s(p,{count:100},{default:o(()=>[s(c,{shape:"square",size:"large"})]),_:1}),s(p,{count:99,"overflow-count":10},{default:o(()=>[s(c,{shape:"square",size:"large"})]),_:1}),s(p,{count:1e3,"overflow-count":999},{default:o(()=>[s(c,{shape:"square",size:"large"})]),_:1})]),htmlCode:o(()=>t[0]||(t[0]=[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-badge")]),a(),n("span",{class:"token attr-name"},":count"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),a("99"),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-avatar")]),a(),n("span",{class:"token attr-name"},"shape"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),a("square"),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("large"),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-badge")]),n("span",{class:"token punctuation"},">")]),a(`
  `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),a("a-badge")]),a(),n("span",{class:"token attr-name"},":count"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),a("100"),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-avatar")]),a(),n("span",{class:"token attr-name"},"shape"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),a("square"),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("large"),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-badge")]),n("span",{class:"token punctuation"},">")]),a(`
  `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),a("a-badge")]),a(),n("span",{class:"token attr-name"},":count"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),a("99"),n("span",{class:"token punctuation"},'"')]),a(),n("span",{class:"token attr-name"},":overflow-count"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),a("10"),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-avatar")]),a(),n("span",{class:"token attr-name"},"shape"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),a("square"),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("large"),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-badge")]),n("span",{class:"token punctuation"},">")]),a(`
  `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),a("a-badge")]),a(),n("span",{class:"token attr-name"},":count"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),a("1000"),n("span",{class:"token punctuation"},'"')]),a(),n("span",{class:"token attr-name"},":overflow-count"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),a("999"),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-avatar")]),a(),n("span",{class:"token attr-name"},"shape"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),a("square"),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("large"),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-badge")]),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(`
`)])],-1)])),jsVersionHtml:o(()=>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-badge")]),a(),n("span",{class:"token attr-name"},":count"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),a("99"),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-avatar")]),a(),n("span",{class:"token attr-name"},"shape"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),a("square"),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("large"),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-badge")]),n("span",{class:"token punctuation"},">")]),a(`
  `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),a("a-badge")]),a(),n("span",{class:"token attr-name"},":count"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),a("100"),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-avatar")]),a(),n("span",{class:"token attr-name"},"shape"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),a("square"),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("large"),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-badge")]),n("span",{class:"token punctuation"},">")]),a(`
  `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),a("a-badge")]),a(),n("span",{class:"token attr-name"},":count"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),a("99"),n("span",{class:"token punctuation"},'"')]),a(),n("span",{class:"token attr-name"},":overflow-count"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),a("10"),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-avatar")]),a(),n("span",{class:"token attr-name"},"shape"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),a("square"),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("large"),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-badge")]),n("span",{class:"token punctuation"},">")]),a(`
  `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),a("a-badge")]),a(),n("span",{class:"token attr-name"},":count"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),a("1000"),n("span",{class:"token punctuation"},'"')]),a(),n("span",{class:"token attr-name"},":overflow-count"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),a("999"),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-avatar")]),a(),n("span",{class:"token attr-name"},"shape"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),a("square"),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("large"),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-badge")]),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(`
`)])],-1)])),_:1})}const T=d(E,[["render",K]]),Q={};function M(l,t){const c=e("a-badge"),p=e("demo-box");return k(),g(p,{jsfiddle:{us:"Standalone badge with status.",cn:"\u7528\u4E8E\u8868\u793A\u72B6\u6001\u7684\u5C0F\u5706\u70B9\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\u8868\u793A\u72B6\u6001\u7684\u5C0F\u5706\u70B9\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>Standalone badge with status.</p>
`,order:4,title:{"zh-CN":"\u72B6\u6001\u70B9","en-US":"Status"},relativePath:"components/badge/demo/status.vue",sourceCode:"PHRlbXBsYXRlPgogIDxhLWJhZGdlIHN0YXR1cz0ic3VjY2VzcyIgLz4KICA8YS1iYWRnZSBzdGF0dXM9ImVycm9yIiAvPgogIDxhLWJhZGdlIHN0YXR1cz0iZGVmYXVsdCIgLz4KICA8YS1iYWRnZSBzdGF0dXM9InByb2Nlc3NpbmciIC8+CiAgPGEtYmFkZ2Ugc3RhdHVzPSJ3YXJuaW5nIiAvPgogIDxiciAvPgogIDxhLWJhZGdlIHN0YXR1cz0ic3VjY2VzcyIgdGV4dD0iU3VjY2VzcyIgLz4KICA8YnIgLz4KICA8YS1iYWRnZSBzdGF0dXM9ImVycm9yIiB0ZXh0PSJFcnJvciIgLz4KICA8YnIgLz4KICA8YS1iYWRnZSBzdGF0dXM9ImRlZmF1bHQiIHRleHQ9IkRlZmF1bHQiIC8+CiAgPGJyIC8+CiAgPGEtYmFkZ2Ugc3RhdHVzPSJwcm9jZXNzaW5nIiB0ZXh0PSJQcm9jZXNzaW5nIiAvPgogIDxiciAvPgogIDxhLWJhZGdlIHN0YXR1cz0id2FybmluZyIgdGV4dD0id2FybmluZyIgLz4KPC90ZW1wbGF0ZT4KCgo=",jsSourceCode:"PHRlbXBsYXRlPgogIDxhLWJhZGdlIHN0YXR1cz0ic3VjY2VzcyIgLz4KICA8YS1iYWRnZSBzdGF0dXM9ImVycm9yIiAvPgogIDxhLWJhZGdlIHN0YXR1cz0iZGVmYXVsdCIgLz4KICA8YS1iYWRnZSBzdGF0dXM9InByb2Nlc3NpbmciIC8+CiAgPGEtYmFkZ2Ugc3RhdHVzPSJ3YXJuaW5nIiAvPgogIDxiciAvPgogIDxhLWJhZGdlIHN0YXR1cz0ic3VjY2VzcyIgdGV4dD0iU3VjY2VzcyIgLz4KICA8YnIgLz4KICA8YS1iYWRnZSBzdGF0dXM9ImVycm9yIiB0ZXh0PSJFcnJvciIgLz4KICA8YnIgLz4KICA8YS1iYWRnZSBzdGF0dXM9ImRlZmF1bHQiIHRleHQ9IkRlZmF1bHQiIC8+CiAgPGJyIC8+CiAgPGEtYmFkZ2Ugc3RhdHVzPSJwcm9jZXNzaW5nIiB0ZXh0PSJQcm9jZXNzaW5nIiAvPgogIDxiciAvPgogIDxhLWJhZGdlIHN0YXR1cz0id2FybmluZyIgdGV4dD0id2FybmluZyIgLz4KPC90ZW1wbGF0ZT4="}},{default:o(()=>[s(c,{status:"success"}),s(c,{status:"error"}),s(c,{status:"default"}),s(c,{status:"processing"}),s(c,{status:"warning"}),t[0]||(t[0]=n("br",null,null,-1)),s(c,{status:"success",text:"Success"}),t[1]||(t[1]=n("br",null,null,-1)),s(c,{status:"error",text:"Error"}),t[2]||(t[2]=n("br",null,null,-1)),s(c,{status:"default",text:"Default"}),t[3]||(t[3]=n("br",null,null,-1)),s(c,{status:"processing",text:"Processing"}),t[4]||(t[4]=n("br",null,null,-1)),s(c,{status:"warning",text:"warning"})]),htmlCode:o(()=>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-badge")]),a(),n("span",{class:"token attr-name"},"status"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),a("success"),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-badge")]),a(),n("span",{class:"token attr-name"},"status"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),a("error"),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-badge")]),a(),n("span",{class:"token attr-name"},"status"),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"},'"')]),a(),n("span",{class:"token punctuation"},"/>")]),a(`
  `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),a("a-badge")]),a(),n("span",{class:"token attr-name"},"status"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),a("processing"),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-badge")]),a(),n("span",{class:"token attr-name"},"status"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),a("warning"),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("br")]),a(),n("span",{class:"token punctuation"},"/>")]),a(`
  `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),a("a-badge")]),a(),n("span",{class:"token attr-name"},"status"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),a("success"),n("span",{class:"token punctuation"},'"')]),a(),n("span",{class:"token attr-name"},"text"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),a("Success"),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("br")]),a(),n("span",{class:"token punctuation"},"/>")]),a(`
  `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),a("a-badge")]),a(),n("span",{class:"token attr-name"},"status"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),a("error"),n("span",{class:"token punctuation"},'"')]),a(),n("span",{class:"token attr-name"},"text"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),a("Error"),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("br")]),a(),n("span",{class:"token punctuation"},"/>")]),a(`
  `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),a("a-badge")]),a(),n("span",{class:"token attr-name"},"status"),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"},'"')]),a(),n("span",{class:"token attr-name"},"text"),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"},'"')]),a(),n("span",{class:"token punctuation"},"/>")]),a(`
  `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),a("br")]),a(),n("span",{class:"token punctuation"},"/>")]),a(`
  `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),a("a-badge")]),a(),n("span",{class:"token attr-name"},"status"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),a("processing"),n("span",{class:"token punctuation"},'"')]),a(),n("span",{class:"token attr-name"},"text"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),a("Processing"),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("br")]),a(),n("span",{class:"token punctuation"},"/>")]),a(`
  `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),a("a-badge")]),a(),n("span",{class:"token attr-name"},"status"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),a("warning"),n("span",{class:"token punctuation"},'"')]),a(),n("span",{class:"token attr-name"},"text"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),a("warning"),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(`
`)])],-1)])),jsVersionHtml:o(()=>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-badge")]),a(),n("span",{class:"token attr-name"},"status"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),a("success"),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-badge")]),a(),n("span",{class:"token attr-name"},"status"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),a("error"),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-badge")]),a(),n("span",{class:"token attr-name"},"status"),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"},'"')]),a(),n("span",{class:"token punctuation"},"/>")]),a(`
  `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),a("a-badge")]),a(),n("span",{class:"token attr-name"},"status"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),a("processing"),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-badge")]),a(),n("span",{class:"token attr-name"},"status"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),a("warning"),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("br")]),a(),n("span",{class:"token punctuation"},"/>")]),a(`
  `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),a("a-badge")]),a(),n("span",{class:"token attr-name"},"status"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),a("success"),n("span",{class:"token punctuation"},'"')]),a(),n("span",{class:"token attr-name"},"text"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),a("Success"),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("br")]),a(),n("span",{class:"token punctuation"},"/>")]),a(`
  `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),a("a-badge")]),a(),n("span",{class:"token attr-name"},"status"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),a("error"),n("span",{class:"token punctuation"},'"')]),a(),n("span",{class:"token attr-name"},"text"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),a("Error"),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("br")]),a(),n("span",{class:"token punctuation"},"/>")]),a(`
  `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),a("a-badge")]),a(),n("span",{class:"token attr-name"},"status"),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"},'"')]),a(),n("span",{class:"token attr-name"},"text"),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"},'"')]),a(),n("span",{class:"token punctuation"},"/>")]),a(`
  `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),a("br")]),a(),n("span",{class:"token punctuation"},"/>")]),a(`
  `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),a("a-badge")]),a(),n("span",{class:"token attr-name"},"status"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),a("processing"),n("span",{class:"token punctuation"},'"')]),a(),n("span",{class:"token attr-name"},"text"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),a("Processing"),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("br")]),a(),n("span",{class:"token punctuation"},"/>")]),a(`
  `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),a("a-badge")]),a(),n("span",{class:"token attr-name"},"status"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),a("warning"),n("span",{class:"token punctuation"},'"')]),a(),n("span",{class:"token attr-name"},"text"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),a("warning"),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(`
`)])],-1)])),_:1})}const O=d(Q,[["render",M]]),$={};function nn(l,t){const c=e("a-avatar"),p=e("a-badge"),i=e("demo-box");return k(),g(i,{jsfiddle:{us:"The badge will display `title` when hovered over, instead of `count`.",cn:"\u8BBE\u7F6E\u9F20\u6807\u653E\u5728\u72B6\u6001\u70B9\u4E0A\u65F6\u663E\u793A\u7684\u6587\u5B57",docHtml:`<h2 id="zh-CN">zh-CN <a class="header-anchor" href="#zh-CN">
          <span aria-hidden="true" class="anchor">#</span>
        </a></h2>
<p>\u8BBE\u7F6E\u9F20\u6807\u653E\u5728\u72B6\u6001\u70B9\u4E0A\u65F6\u663E\u793A\u7684\u6587\u5B57</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 badge will display <code>title</code> when hovered over, instead of <code>count</code>.</p>
`,order:6,title:{"zh-CN":"\u81EA\u5B9A\u4E49\u6807\u9898","en-US":"Title"},relativePath:"components/badge/demo/title.vue",sourceCode:"PHRlbXBsYXRlPgogIDxhLWJhZGdlIDpjb3VudD0iNSIgdGl0bGU9IkN1c3RvbSBob3ZlciB0ZXh0Ij4KICAgIDxhLWF2YXRhciBzaGFwZT0ic3F1YXJlIiBzaXplPSJsYXJnZSIgLz4KICA8L2EtYmFkZ2U+CjwvdGVtcGxhdGU+CgoK",jsSourceCode:"PHRlbXBsYXRlPgogIDxhLWJhZGdlIDpjb3VudD0iNSIgdGl0bGU9IkN1c3RvbSBob3ZlciB0ZXh0Ij4KICAgIDxhLWF2YXRhciBzaGFwZT0ic3F1YXJlIiBzaXplPSJsYXJnZSIgLz4KICA8L2EtYmFkZ2U+CjwvdGVtcGxhdGU+"}},{default:o(()=>[s(p,{count:5,title:"Custom hover text"},{default:o(()=>[s(c,{shape:"square",size:"large"})]),_:1})]),htmlCode:o(()=>t[0]||(t[0]=[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-badge")]),a(),n("span",{class:"token attr-name"},":count"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),a("5"),n("span",{class:"token punctuation"},'"')]),a(),n("span",{class:"token attr-name"},"title"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),a("Custom hover text"),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-avatar")]),a(),n("span",{class:"token attr-name"},"shape"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),a("square"),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("large"),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-badge")]),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(`
`)])],-1)])),jsVersionHtml:o(()=>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-badge")]),a(),n("span",{class:"token attr-name"},":count"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),a("5"),n("span",{class:"token punctuation"},'"')]),a(),n("span",{class:"token attr-name"},"title"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),a("Custom hover text"),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-avatar")]),a(),n("span",{class:"token attr-name"},"shape"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),a("square"),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("large"),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-badge")]),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(`
`)])],-1)])),_:1})}const an=d($,[["render",nn]]),tn=["pink","red","yellow","orange","cyan","green","blue","purple","geekblue","magenta","volcano","gold","lime"],sn=I({setup(){return{colors:tn}}});function on(l,t,c,p,i,h){const u=e("a-badge"),r=e("a-divider"),b=e("demo-box");return k(),g(b,{jsfiddle:{us:"New feature after 3.16.0. We preset a series of colorful Badge styles for use in different situations. You can also set it to a hex color string for custom color.",cn:"1.5.0 \u540E\u65B0\u589E\u3002\u6211\u4EEC\u6DFB\u52A0\u4E86\u591A\u79CD\u9884\u8BBE\u8272\u5F69\u7684\u5FBD\u6807\u6837\u5F0F\uFF0C\u7528\u4F5C\u4E0D\u540C\u573A\u666F\u4F7F\u7528\u3002\u5982\u679C\u9884\u8BBE\u503C\u4E0D\u80FD\u6EE1\u8DB3\u4F60\u7684\u9700\u6C42\uFF0C\u53EF\u4EE5\u8BBE\u7F6E\u4E3A\u5177\u4F53\u7684\u8272\u503C\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>1.5.0 \u540E\u65B0\u589E\u3002\u6211\u4EEC\u6DFB\u52A0\u4E86\u591A\u79CD\u9884\u8BBE\u8272\u5F69\u7684\u5FBD\u6807\u6837\u5F0F\uFF0C\u7528\u4F5C\u4E0D\u540C\u573A\u666F\u4F7F\u7528\u3002\u5982\u679C\u9884\u8BBE\u503C\u4E0D\u80FD\u6EE1\u8DB3\u4F60\u7684\u9700\u6C42\uFF0C\u53EF\u4EE5\u8BBE\u7F6E\u4E3A\u5177\u4F53\u7684\u8272\u503C\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>New feature after 3.16.0. We preset a series of colorful Badge styles for use in different situations. You can also set it to a hex color string for custom color.</p>
`,order:7,title:{"zh-CN":"\u591A\u5F69\u5FBD\u6807","en-US":"Colorful Badge"},relativePath:"components/badge/demo/colors.vue",sourceCode:"PHRlbXBsYXRlPgogIDxoNCBzdHlsZT0ibWFyZ2luLWJvdHRvbTogMTZweCI+UHJlc2V0czo8L2g0PgogIDxkaXY+CiAgICA8ZGl2IHYtZm9yPSJjb2xvciBpbiBjb2xvcnMiIDprZXk9ImNvbG9yIj4KICAgICAgPGEtYmFkZ2UgOmNvbG9yPSJjb2xvciIgOnRleHQ9ImNvbG9yIiAvPgogICAgPC9kaXY+CiAgPC9kaXY+CiAgPGEtZGl2aWRlciBvcmllbnRhdGlvbj0ibGVmdCI+Q3VzdG9tPC9hLWRpdmlkZXI+CiAgPGEtYmFkZ2UgY29sb3I9IiNmNTAiIHRleHQ9IiNmNTAiIC8+CiAgPGJyIC8+CiAgPGEtYmFkZ2UgY29sb3I9IiMyZGI3ZjUiIHRleHQ9IiMyZGI3ZjUiIC8+CiAgPGJyIC8+CiAgPGEtYmFkZ2UgY29sb3I9IiM4N2QwNjgiIHRleHQ9IiM4N2QwNjgiIC8+CiAgPGJyIC8+CiAgPGEtYmFkZ2UgY29sb3I9IiMxMDhlZTkiIHRleHQ9IiMxMDhlZTkiIC8+CjwvdGVtcGxhdGU+CjxzY3JpcHQgbGFuZz0idHMiPgppbXBvcnQgeyBkZWZpbmVDb21wb25lbnQgfSBmcm9tICd2dWUnOwoKY29uc3QgY29sb3JzID0gWwogICdwaW5rJywKICAncmVkJywKICAneWVsbG93JywKICAnb3JhbmdlJywKICAnY3lhbicsCiAgJ2dyZWVuJywKICAnYmx1ZScsCiAgJ3B1cnBsZScsCiAgJ2dlZWtibHVlJywKICAnbWFnZW50YScsCiAgJ3ZvbGNhbm8nLAogICdnb2xkJywKICAnbGltZScsCl07CmV4cG9ydCBkZWZhdWx0IGRlZmluZUNvbXBvbmVudCh7CiAgc2V0dXAoKSB7CiAgICByZXR1cm4gewogICAgICBjb2xvcnMsCiAgICB9OwogIH0sCn0pOwo8L3NjcmlwdD4KCg==",jsSourceCode:"PHRlbXBsYXRlPgogIDxoNCBzdHlsZT0ibWFyZ2luLWJvdHRvbTogMTZweCI+UHJlc2V0czo8L2g0PgogIDxkaXY+CiAgICA8ZGl2IHYtZm9yPSJjb2xvciBpbiBjb2xvcnMiIDprZXk9ImNvbG9yIj4KICAgICAgPGEtYmFkZ2UgOmNvbG9yPSJjb2xvciIgOnRleHQ9ImNvbG9yIiAvPgogICAgPC9kaXY+CiAgPC9kaXY+CiAgPGEtZGl2aWRlciBvcmllbnRhdGlvbj0ibGVmdCI+Q3VzdG9tPC9hLWRpdmlkZXI+CiAgPGEtYmFkZ2UgY29sb3I9IiNmNTAiIHRleHQ9IiNmNTAiIC8+CiAgPGJyIC8+CiAgPGEtYmFkZ2UgY29sb3I9IiMyZGI3ZjUiIHRleHQ9IiMyZGI3ZjUiIC8+CiAgPGJyIC8+CiAgPGEtYmFkZ2UgY29sb3I9IiM4N2QwNjgiIHRleHQ9IiM4N2QwNjgiIC8+CiAgPGJyIC8+CiAgPGEtYmFkZ2UgY29sb3I9IiMxMDhlZTkiIHRleHQ9IiMxMDhlZTkiIC8+CjwvdGVtcGxhdGU+CjxzY3JpcHQ+CmltcG9ydCB7IGRlZmluZUNvbXBvbmVudCB9IGZyb20gJ3Z1ZSc7CmNvbnN0IGNvbG9ycyA9IFsncGluaycsICdyZWQnLCAneWVsbG93JywgJ29yYW5nZScsICdjeWFuJywgJ2dyZWVuJywgJ2JsdWUnLCAncHVycGxlJywgJ2dlZWtibHVlJywgJ21hZ2VudGEnLCAndm9sY2FubycsICdnb2xkJywgJ2xpbWUnXTsKZXhwb3J0IGRlZmF1bHQgZGVmaW5lQ29tcG9uZW50KHsKICBzZXR1cCgpIHsKICAgIHJldHVybiB7CiAgICAgIGNvbG9ycywKICAgIH07CiAgfSwKfSk7Cjwvc2NyaXB0Pg=="}},{default:o(()=>[t[1]||(t[1]=n("h4",{style:{"margin-bottom":"16px"}},"Presets:",-1)),n("div",null,[(k(!0),C(S,null,x(l.colors,m=>(k(),C("div",{key:m},[s(u,{color:m,text:m},null,8,["color","text"])]))),128))]),s(r,{orientation:"left"},{default:o(()=>t[0]||(t[0]=[a("Custom")])),_:1,__:[0]}),s(u,{color:"#f50",text:"#f50"}),t[2]||(t[2]=n("br",null,null,-1)),s(u,{color:"#2db7f5",text:"#2db7f5"}),t[3]||(t[3]=n("br",null,null,-1)),s(u,{color:"#87d068",text:"#87d068"}),t[4]||(t[4]=n("br",null,null,-1)),s(u,{color:"#108ee9",text:"#108ee9"})]),htmlCode:o(()=>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("h4")]),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("Presets:"),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"</"),a("h4")]),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"},"v-for"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),a("color in colors"),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("color"),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-badge")]),a(),n("span",{class:"token attr-name"},":color"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),a("color"),n("span",{class:"token punctuation"},'"')]),a(),n("span",{class:"token attr-name"},":text"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),a("color"),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("div")]),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-divider")]),a(),n("span",{class:"token attr-name"},"orientation"),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("Custom"),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"</"),a("a-divider")]),n("span",{class:"token punctuation"},">")]),a(`
  `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),a("a-badge")]),a(),n("span",{class:"token attr-name"},"color"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),a("#f50"),n("span",{class:"token punctuation"},'"')]),a(),n("span",{class:"token attr-name"},"text"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),a("#f50"),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("br")]),a(),n("span",{class:"token punctuation"},"/>")]),a(`
  `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),a("a-badge")]),a(),n("span",{class:"token attr-name"},"color"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),a("#2db7f5"),n("span",{class:"token punctuation"},'"')]),a(),n("span",{class:"token attr-name"},"text"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),a("#2db7f5"),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("br")]),a(),n("span",{class:"token punctuation"},"/>")]),a(`
  `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),a("a-badge")]),a(),n("span",{class:"token attr-name"},"color"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),a("#87d068"),n("span",{class:"token punctuation"},'"')]),a(),n("span",{class:"token attr-name"},"text"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),a("#87d068"),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("br")]),a(),n("span",{class:"token punctuation"},"/>")]),a(`
  `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),a("a-badge")]),a(),n("span",{class:"token attr-name"},"color"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),a("#108ee9"),n("span",{class:"token punctuation"},'"')]),a(),n("span",{class:"token attr-name"},"text"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),a("#108ee9"),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("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(),n("span",{class:"token keyword"},"from"),a(),n("span",{class:"token string"},"'vue'"),n("span",{class:"token punctuation"},";"),a(`

`),n("span",{class:"token keyword"},"const"),a(" colors "),n("span",{class:"token operator"},"="),a(),n("span",{class:"token punctuation"},"["),a(`
  `),n("span",{class:"token string"},"'pink'"),n("span",{class:"token punctuation"},","),a(`
  `),n("span",{class:"token string"},"'red'"),n("span",{class:"token punctuation"},","),a(`
  `),n("span",{class:"token string"},"'yellow'"),n("span",{class:"token punctuation"},","),a(`
  `),n("span",{class:"token string"},"'orange'"),n("span",{class:"token punctuation"},","),a(`
  `),n("span",{class:"token string"},"'cyan'"),n("span",{class:"token punctuation"},","),a(`
  `),n("span",{class:"token string"},"'green'"),n("span",{class:"token punctuation"},","),a(`
  `),n("span",{class:"token string"},"'blue'"),n("span",{class:"token punctuation"},","),a(`
  `),n("span",{class:"token string"},"'purple'"),n("span",{class:"token punctuation"},","),a(`
  `),n("span",{class:"token string"},"'geekblue'"),n("span",{class:"token punctuation"},","),a(`
  `),n("span",{class:"token string"},"'magenta'"),n("span",{class:"token punctuation"},","),a(`
  `),n("span",{class:"token string"},"'volcano'"),n("span",{class:"token punctuation"},","),a(`
  `),n("span",{class:"token string"},"'gold'"),n("span",{class:"token punctuation"},","),a(`
  `),n("span",{class:"token string"},"'lime'"),n("span",{class:"token punctuation"},","),a(`
`),n("span",{class:"token punctuation"},"]"),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(`
      colors`),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:o(()=>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("h4")]),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("Presets:"),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"</"),a("h4")]),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"},"v-for"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),a("color in colors"),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("color"),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-badge")]),a(),n("span",{class:"token attr-name"},":color"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),a("color"),n("span",{class:"token punctuation"},'"')]),a(),n("span",{class:"token attr-name"},":text"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),a("color"),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("div")]),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-divider")]),a(),n("span",{class:"token attr-name"},"orientation"),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("Custom"),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"</"),a("a-divider")]),n("span",{class:"token punctuation"},">")]),a(`
  `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),a("a-badge")]),a(),n("span",{class:"token attr-name"},"color"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),a("#f50"),n("span",{class:"token punctuation"},'"')]),a(),n("span",{class:"token attr-name"},"text"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),a("#f50"),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("br")]),a(),n("span",{class:"token punctuation"},"/>")]),a(`
  `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),a("a-badge")]),a(),n("span",{class:"token attr-name"},"color"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),a("#2db7f5"),n("span",{class:"token punctuation"},'"')]),a(),n("span",{class:"token attr-name"},"text"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),a("#2db7f5"),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("br")]),a(),n("span",{class:"token punctuation"},"/>")]),a(`
  `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),a("a-badge")]),a(),n("span",{class:"token attr-name"},"color"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),a("#87d068"),n("span",{class:"token punctuation"},'"')]),a(),n("span",{class:"token attr-name"},"text"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),a("#87d068"),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("br")]),a(),n("span",{class:"token punctuation"},"/>")]),a(`
  `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),a("a-badge")]),a(),n("span",{class:"token attr-name"},"color"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),a("#108ee9"),n("span",{class:"token punctuation"},'"')]),a(),n("span",{class:"token attr-name"},"text"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),a("#108ee9"),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("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(),n("span",{class:"token keyword"},"from"),a(),n("span",{class:"token string"},"'vue'"),n("span",{class:"token punctuation"},";"),a(`
`),n("span",{class:"token keyword"},"const"),a(" colors "),n("span",{class:"token operator"},"="),a(),n("span",{class:"token punctuation"},"["),n("span",{class:"token string"},"'pink'"),n("span",{class:"token punctuation"},","),a(),n("span",{class:"token string"},"'red'"),n("span",{class:"token punctuation"},","),a(),n("span",{class:"token string"},"'yellow'"),n("span",{class:"token punctuation"},","),a(),n("span",{class:"token string"},"'orange'"),n("span",{class:"token punctuation"},","),a(),n("span",{class:"token string"},"'cyan'"),n("span",{class:"token punctuation"},","),a(),n("span",{class:"token string"},"'green'"),n("span",{class:"token punctuation"},","),a(),n("span",{class:"token string"},"'blue'"),n("span",{class:"token punctuation"},","),a(),n("span",{class:"token string"},"'purple'"),n("span",{class:"token punctuation"},","),a(),n("span",{class:"token string"},"'geekblue'"),n("span",{class:"token punctuation"},","),a(),n("span",{class:"token string"},"'magenta'"),n("span",{class:"token punctuation"},","),a(),n("span",{class:"token string"},"'volcano'"),n("span",{class:"token punctuation"},","),a(),n("span",{class:"token string"},"'gold'"),n("span",{class:"token punctuation"},","),a(),n("span",{class:"token string"},"'lime'"),n("span",{class:"token punctuation"},"]"),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(`
      colors`),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 en=d(sn,[["render",on]]),cn={},pn={href:"#"};function ln(l,t){const c=e("a-avatar"),p=e("a-badge"),i=e("demo-box");return k(),g(i,{jsfiddle:{us:"The badge can be wrapped with `a` tag to make it linkable.",cn:"\u7528 a \u6807\u7B7E\u8FDB\u884C\u5305\u88F9\u5373\u53EF\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 a \u6807\u7B7E\u8FDB\u884C\u5305\u88F9\u5373\u53EF\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 badge can be wrapped with <code>a</code> tag to make it linkable.</p>
`,order:8,title:{"zh-CN":"\u53EF\u70B9\u51FB","en-US":"Clickable"},relativePath:"components/badge/demo/link.vue",sourceCode:"PHRlbXBsYXRlPgogIDxhIGhyZWY9IiMiPgogICAgPGEtYmFkZ2UgY291bnQ9IjUiPgogICAgICA8YS1hdmF0YXIgc2hhcGU9InNxdWFyZSIgc2l6ZT0ibGFyZ2UiIC8+CiAgICA8L2EtYmFkZ2U+CiAgPC9hPgo8L3RlbXBsYXRlPgoKCg==",jsSourceCode:"PHRlbXBsYXRlPgogIDxhIGhyZWY9IiMiPgogICAgPGEtYmFkZ2UgY291bnQ9IjUiPgogICAgICA8YS1hdmF0YXIgc2hhcGU9InNxdWFyZSIgc2l6ZT0ibGFyZ2UiIC8+CiAgICA8L2EtYmFkZ2U+CiAgPC9hPgo8L3RlbXBsYXRlPg=="}},{default:o(()=>[n("a",pn,[s(p,{count:"5"},{default:o(()=>[s(c,{shape:"square",size:"large"})]),_:1})])]),htmlCode:o(()=>t[0]||(t[0]=[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")]),a(),n("span",{class:"token attr-name"},"href"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),a("#"),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-badge")]),a(),n("span",{class:"token attr-name"},"count"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),a("5"),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-avatar")]),a(),n("span",{class:"token attr-name"},"shape"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),a("square"),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("large"),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-badge")]),n("span",{class:"token punctuation"},">")]),a(`
  `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"</"),a("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(`
`)])],-1)])),jsVersionHtml:o(()=>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")]),a(),n("span",{class:"token attr-name"},"href"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),a("#"),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-badge")]),a(),n("span",{class:"token attr-name"},"count"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),a("5"),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-avatar")]),a(),n("span",{class:"token attr-name"},"shape"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),a("square"),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("large"),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-badge")]),n("span",{class:"token punctuation"},">")]),a(`
  `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"</"),a("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(`
`)])],-1)])),_:1})}const un=d(cn,[["render",ln]]),kn={};function rn(l,t){const c=e("a-card"),p=e("a-badge-ribbon"),i=e("demo-box");return k(),g(i,{jsfiddle:{us:"Use ribbon badge.",cn:"\u4F7F\u7528\u7F0E\u5E26\u578B\u7684\u5FBD\u6807\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>\u4F7F\u7528\u7F0E\u5E26\u578B\u7684\u5FBD\u6807\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>Use ribbon badge.</p>
`,order:9,title:{"zh-CN":"\u7F0E\u5E26","en-US":"Ribbon"},relativePath:"components/badge/demo/ribbon.vue",sourceCode:"PHRlbXBsYXRlPgogIDxhLWJhZGdlLXJpYmJvbiB0ZXh0PSJIaXBwaWVzIj4KICAgIDxhLWNhcmQgdGl0bGU9IlB1c2hlcyBvcGVuIHRoZSB3aW5kb3ciIHNpemU9InNtYWxsIj5hbmQgcmFpc2VzIHRoZSBzcHlnbGFzcy48L2EtY2FyZD4KICA8L2EtYmFkZ2UtcmliYm9uPgogIDxhLWJhZGdlLXJpYmJvbiB0ZXh0PSJIaXBwaWVzIiBjb2xvcj0icGluayI+CiAgICA8YS1jYXJkIHRpdGxlPSJQdXNoZXMgb3BlbiB0aGUgd2luZG93IiBzaXplPSJzbWFsbCI+YW5kIHJhaXNlcyB0aGUgc3B5Z2xhc3MuPC9hLWNhcmQ+CiAgPC9hLWJhZGdlLXJpYmJvbj4KICA8YS1iYWRnZS1yaWJib24gdGV4dD0iSGlwcGllcyIgY29sb3I9InJlZCI+CiAgICA8YS1jYXJkIHRpdGxlPSJQdXNoZXMgb3BlbiB0aGUgd2luZG93IiBzaXplPSJzbWFsbCI+YW5kIHJhaXNlcyB0aGUgc3B5Z2xhc3MuPC9hLWNhcmQ+CiAgPC9hLWJhZGdlLXJpYmJvbj4KICA8YS1iYWRnZS1yaWJib24gdGV4dD0iSGlwcGllcyIgY29sb3I9ImN5YW4iPgogICAgPGEtY2FyZCB0aXRsZT0iUHVzaGVzIG9wZW4gdGhlIHdpbmRvdyIgc2l6ZT0ic21hbGwiPmFuZCByYWlzZXMgdGhlIHNweWdsYXNzLjwvYS1jYXJkPgogIDwvYS1iYWRnZS1yaWJib24+CiAgPGEtYmFkZ2UtcmliYm9uIHRleHQ9IkhpcHBpZXMiIGNvbG9yPSJncmVlbiI+CiAgICA8YS1jYXJkIHRpdGxlPSJQdXNoZXMgb3BlbiB0aGUgd2luZG93IiBzaXplPSJzbWFsbCI+YW5kIHJhaXNlcyB0aGUgc3B5Z2xhc3MuPC9hLWNhcmQ+CiAgPC9hLWJhZGdlLXJpYmJvbj4KICA8YS1iYWRnZS1yaWJib24gdGV4dD0iSGlwcGllcyIgY29sb3I9InB1cnBsZSI+CiAgICA8YS1jYXJkIHRpdGxlPSJQdXNoZXMgb3BlbiB0aGUgd2luZG93IiBzaXplPSJzbWFsbCI+YW5kIHJhaXNlcyB0aGUgc3B5Z2xhc3MuPC9hLWNhcmQ+CiAgPC9hLWJhZGdlLXJpYmJvbj4KICA8YS1iYWRnZS1yaWJib24gdGV4dD0iSGlwcGllcyIgY29sb3I9InZvbGNhbm8iPgogICAgPGEtY2FyZCB0aXRsZT0iUHVzaGVzIG9wZW4gdGhlIHdpbmRvdyIgc2l6ZT0ic21hbGwiPmFuZCByYWlzZXMgdGhlIHNweWdsYXNzLjwvYS1jYXJkPgogIDwvYS1iYWRnZS1yaWJib24+CiAgPGEtYmFkZ2UtcmliYm9uIHRleHQ9IkhpcHBpZXMiIGNvbG9yPSJtYWdlbnRhIj4KICAgIDxhLWNhcmQgdGl0bGU9IlB1c2hlcyBvcGVuIHRoZSB3aW5kb3ciIHNpemU9InNtYWxsIj5hbmQgcmFpc2VzIHRoZSBzcHlnbGFzcy48L2EtY2FyZD4KICA8L2EtYmFkZ2UtcmliYm9uPgo8L3RlbXBsYXRlPgoKCg==",jsSourceCode:"PHRlbXBsYXRlPgogIDxhLWJhZGdlLXJpYmJvbiB0ZXh0PSJIaXBwaWVzIj4KICAgIDxhLWNhcmQgdGl0bGU9IlB1c2hlcyBvcGVuIHRoZSB3aW5kb3ciIHNpemU9InNtYWxsIj5hbmQgcmFpc2VzIHRoZSBzcHlnbGFzcy48L2EtY2FyZD4KICA8L2EtYmFkZ2UtcmliYm9uPgogIDxhLWJhZGdlLXJpYmJvbiB0ZXh0PSJIaXBwaWVzIiBjb2xvcj0icGluayI+CiAgICA8YS1jYXJkIHRpdGxlPSJQdXNoZXMgb3BlbiB0aGUgd2luZG93IiBzaXplPSJzbWFsbCI+YW5kIHJhaXNlcyB0aGUgc3B5Z2xhc3MuPC9hLWNhcmQ+CiAgPC9hLWJhZGdlLXJpYmJvbj4KICA8YS1iYWRnZS1yaWJib24gdGV4dD0iSGlwcGllcyIgY29sb3I9InJlZCI+CiAgICA8YS1jYXJkIHRpdGxlPSJQdXNoZXMgb3BlbiB0aGUgd2luZG93IiBzaXplPSJzbWFsbCI+YW5kIHJhaXNlcyB0aGUgc3B5Z2xhc3MuPC9hLWNhcmQ+CiAgPC9hLWJhZGdlLXJpYmJvbj4KICA8YS1iYWRnZS1yaWJib24gdGV4dD0iSGlwcGllcyIgY29sb3I9ImN5YW4iPgogICAgPGEtY2FyZCB0aXRsZT0iUHVzaGVzIG9wZW4gdGhlIHdpbmRvdyIgc2l6ZT0ic21hbGwiPmFuZCByYWlzZXMgdGhlIHNweWdsYXNzLjwvYS1jYXJkPgogIDwvYS1iYWRnZS1yaWJib24+CiAgPGEtYmFkZ2UtcmliYm9uIHRleHQ9IkhpcHBpZXMiIGNvbG9yPSJncmVlbiI+CiAgICA8YS1jYXJkIHRpdGxlPSJQdXNoZXMgb3BlbiB0aGUgd2luZG93IiBzaXplPSJzbWFsbCI+YW5kIHJhaXNlcyB0aGUgc3B5Z2xhc3MuPC9hLWNhcmQ+CiAgPC9hLWJhZGdlLXJpYmJvbj4KICA8YS1iYWRnZS1yaWJib24gdGV4dD0iSGlwcGllcyIgY29sb3I9InB1cnBsZSI+CiAgICA8YS1jYXJkIHRpdGxlPSJQdXNoZXMgb3BlbiB0aGUgd2luZG93IiBzaXplPSJzbWFsbCI+YW5kIHJhaXNlcyB0aGUgc3B5Z2xhc3MuPC9hLWNhcmQ+CiAgPC9hLWJhZGdlLXJpYmJvbj4KICA8YS1iYWRnZS1yaWJib24gdGV4dD0iSGlwcGllcyIgY29sb3I9InZvbGNhbm8iPgogICAgPGEtY2FyZCB0aXRsZT0iUHVzaGVzIG9wZW4gdGhlIHdpbmRvdyIgc2l6ZT0ic21hbGwiPmFuZCByYWlzZXMgdGhlIHNweWdsYXNzLjwvYS1jYXJkPgogIDwvYS1iYWRnZS1yaWJib24+CiAgPGEtYmFkZ2UtcmliYm9uIHRleHQ9IkhpcHBpZXMiIGNvbG9yPSJtYWdlbnRhIj4KICAgIDxhLWNhcmQgdGl0bGU9IlB1c2hlcyBvcGVuIHRoZSB3aW5kb3ciIHNpemU9InNtYWxsIj5hbmQgcmFpc2VzIHRoZSBzcHlnbGFzcy48L2EtY2FyZD4KICA8L2EtYmFkZ2UtcmliYm9uPgo8L3RlbXBsYXRlPg=="}},{default:o(()=>[s(p,{text:"Hippies"},{default:o(()=>[s(c,{title:"Pushes open the window",size:"small"},{default:o(()=>t[0]||(t[0]=[a("and raises the spyglass.")])),_:1,__:[0]})]),_:1}),s(p,{text:"Hippies",color:"pink"},{default:o(()=>[s(c,{title:"Pushes open the window",size:"small"},{default:o(()=>t[1]||(t[1]=[a("and raises the spyglass.")])),_:1,__:[1]})]),_:1}),s(p,{text:"Hippies",color:"red"},{default:o(()=>[s(c,{title:"Pushes open the window",size:"small"},{default:o(()=>t[2]||(t[2]=[a("and raises the spyglass.")])),_:1,__:[2]})]),_:1}),s(p,{text:"Hippies",color:"cyan"},{default:o(()=>[s(c,{title:"Pushes open the window",size:"small"},{default:o(()=>t[3]||(t[3]=[a("and raises the spyglass.")])),_:1,__:[3]})]),_:1}),s(p,{text:"Hippies",color:"green"},{default:o(()=>[s(c,{title:"Pushes open the window",size:"small"},{default:o(()=>t[4]||(t[4]=[a("and raises the spyglass.")])),_:1,__:[4]})]),_:1}),s(p,{text:"Hippies",color:"purple"},{default:o(()=>[s(c,{title:"Pushes open the window",size:"small"},{default:o(()=>t[5]||(t[5]=[a("and raises the spyglass.")])),_:1,__:[5]})]),_:1}),s(p,{text:"Hippies",color:"volcano"},{default:o(()=>[s(c,{title:"Pushes open the window",size:"small"},{default:o(()=>t[6]||(t[6]=[a("and raises the spyglass.")])),_:1,__:[6]})]),_:1}),s(p,{text:"Hippies",color:"magenta"},{default:o(()=>[s(c,{title:"Pushes open the window",size:"small"},{default:o(()=>t[7]||(t[7]=[a("and raises the spyglass.")])),_:1,__:[7]})]),_:1})]),htmlCode:o(()=>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("a-badge-ribbon")]),a(),n("span",{class:"token attr-name"},"text"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),a("Hippies"),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-card")]),a(),n("span",{class:"token attr-name"},"title"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),a("Pushes open the window"),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("small"),n("span",{class:"token punctuation"},'"')]),n("span",{class:"token punctuation"},">")]),a("and raises the spyglass."),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"</"),a("a-card")]),n("span",{class:"token punctuation"},">")]),a(`
  `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"</"),a("a-badge-ribbon")]),n("span",{class:"token punctuation"},">")]),a(`
  `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),a("a-badge-ribbon")]),a(),n("span",{class:"token attr-name"},"text"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),a("Hippies"),n("span",{class:"token punctuation"},'"')]),a(),n("span",{class:"token attr-name"},"color"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),a("pink"),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-card")]),a(),n("span",{class:"token attr-name"},"title"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),a("Pushes open the window"),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("small"),n("span",{class:"token punctuation"},'"')]),n("span",{class:"token punctuation"},">")]),a("and raises the spyglass."),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"</"),a("a-card")]),n("span",{class:"token punctuation"},">")]),a(`
  `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"</"),a("a-badge-ribbon")]),n("span",{class:"token punctuation"},">")]),a(`
  `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),a("a-badge-ribbon")]),a(),n("span",{class:"token attr-name"},"text"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),a("Hippies"),n("span",{class:"token punctuation"},'"')]),a(),n("span",{class:"token attr-name"},"color"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),a("red"),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-card")]),a(),n("span",{class:"token attr-name"},"title"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),a("Pushes open the window"),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("small"),n("span",{class:"token punctuation"},'"')]),n("span",{class:"token punctuation"},">")]),a("and raises the spyglass."),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"</"),a("a-card")]),n("span",{class:"token punctuation"},">")]),a(`
  `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"</"),a("a-badge-ribbon")]),n("span",{class:"token punctuation"},">")]),a(`
  `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),a("a-badge-ribbon")]),a(),n("span",{class:"token attr-name"},"text"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),a("Hippies"),n("span",{class:"token punctuation"},'"')]),a(),n("span",{class:"token attr-name"},"color"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),a("cyan"),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-card")]),a(),n("span",{class:"token attr-name"},"title"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),a("Pushes open the window"),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("small"),n("span",{class:"token punctuation"},'"')]),n("span",{class:"token punctuation"},">")]),a("and raises the spyglass."),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"</"),a("a-card")]),n("span",{class:"token punctuation"},">")]),a(`
  `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"</"),a("a-badge-ribbon")]),n("span",{class:"token punctuation"},">")]),a(`
  `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),a("a-badge-ribbon")]),a(),n("span",{class:"token attr-name"},"text"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),a("Hippies"),n("span",{class:"token punctuation"},'"')]),a(),n("span",{class:"token attr-name"},"color"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),a("green"),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-card")]),a(),n("span",{class:"token attr-name"},"title"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),a("Pushes open the window"),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("small"),n("span",{class:"token punctuation"},'"')]),n("span",{class:"token punctuation"},">")]),a("and raises the spyglass."),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"</"),a("a-card")]),n("span",{class:"token punctuation"},">")]),a(`
  `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"</"),a("a-badge-ribbon")]),n("span",{class:"token punctuation"},">")]),a(`
  `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),a("a-badge-ribbon")]),a(),n("span",{class:"token attr-name"},"text"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),a("Hippies"),n("span",{class:"token punctuation"},'"')]),a(),n("span",{class:"token attr-name"},"color"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),a("purple"),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-card")]),a(),n("span",{class:"token attr-name"},"title"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),a("Pushes open the window"),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("small"),n("span",{class:"token punctuation"},'"')]),n("span",{class:"token punctuation"},">")]),a("and raises the spyglass."),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"</"),a("a-card")]),n("span",{class:"token punctuation"},">")]),a(`
  `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"</"),a("a-badge-ribbon")]),n("span",{class:"token punctuation"},">")]),a(`
  `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),a("a-badge-ribbon")]),a(),n("span",{class:"token attr-name"},"text"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),a("Hippies"),n("span",{class:"token punctuation"},'"')]),a(),n("span",{class:"token attr-name"},"color"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),a("volcano"),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-card")]),a(),n("span",{class:"token attr-name"},"title"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),a("Pushes open the window"),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("small"),n("span",{class:"token punctuation"},'"')]),n("span",{class:"token punctuation"},">")]),a("and raises the spyglass."),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"</"),a("a-card")]),n("span",{class:"token punctuation"},">")]),a(`
  `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"</"),a("a-badge-ribbon")]),n("span",{class:"token punctuation"},">")]),a(`
  `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),a("a-badge-ribbon")]),a(),n("span",{class:"token attr-name"},"text"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),a("Hippies"),n("span",{class:"token punctuation"},'"')]),a(),n("span",{class:"token attr-name"},"color"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),a("magenta"),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-card")]),a(),n("span",{class:"token attr-name"},"title"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),a("Pushes open the window"),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("small"),n("span",{class:"token punctuation"},'"')]),n("span",{class:"token punctuation"},">")]),a("and raises the spyglass."),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"</"),a("a-card")]),n("span",{class:"token punctuation"},">")]),a(`
  `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"</"),a("a-badge-ribbon")]),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(`
`)])],-1)])),jsVersionHtml:o(()=>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-badge-ribbon")]),a(),n("span",{class:"token attr-name"},"text"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),a("Hippies"),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-card")]),a(),n("span",{class:"token attr-name"},"title"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),a("Pushes open the window"),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("small"),n("span",{class:"token punctuation"},'"')]),n("span",{class:"token punctuation"},">")]),a("and raises the spyglass."),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"</"),a("a-card")]),n("span",{class:"token punctuation"},">")]),a(`
  `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"</"),a("a-badge-ribbon")]),n("span",{class:"token punctuation"},">")]),a(`
  `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),a("a-badge-ribbon")]),a(),n("span",{class:"token attr-name"},"text"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),a("Hippies"),n("span",{class:"token punctuation"},'"')]),a(),n("span",{class:"token attr-name"},"color"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),a("pink"),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-card")]),a(),n("span",{class:"token attr-name"},"title"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),a("Pushes open the window"),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("small"),n("span",{class:"token punctuation"},'"')]),n("span",{class:"token punctuation"},">")]),a("and raises the spyglass."),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"</"),a("a-card")]),n("span",{class:"token punctuation"},">")]),a(`
  `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"</"),a("a-badge-ribbon")]),n("span",{class:"token punctuation"},">")]),a(`
  `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),a("a-badge-ribbon")]),a(),n("span",{class:"token attr-name"},"text"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),a("Hippies"),n("span",{class:"token punctuation"},'"')]),a(),n("span",{class:"token attr-name"},"color"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),a("red"),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-card")]),a(),n("span",{class:"token attr-name"},"title"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),a("Pushes open the window"),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("small"),n("span",{class:"token punctuation"},'"')]),n("span",{class:"token punctuation"},">")]),a("and raises the spyglass."),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"</"),a("a-card")]),n("span",{class:"token punctuation"},">")]),a(`
  `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"</"),a("a-badge-ribbon")]),n("span",{class:"token punctuation"},">")]),a(`
  `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),a("a-badge-ribbon")]),a(),n("span",{class:"token attr-name"},"text"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),a("Hippies"),n("span",{class:"token punctuation"},'"')]),a(),n("span",{class:"token attr-name"},"color"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),a("cyan"),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-card")]),a(),n("span",{class:"token attr-name"},"title"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),a("Pushes open the window"),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("small"),n("span",{class:"token punctuation"},'"')]),n("span",{class:"token punctuation"},">")]),a("and raises the spyglass."),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"</"),a("a-card")]),n("span",{class:"token punctuation"},">")]),a(`
  `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"</"),a("a-badge-ribbon")]),n("span",{class:"token punctuation"},">")]),a(`
  `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),a("a-badge-ribbon")]),a(),n("span",{class:"token attr-name"},"text"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),a("Hippies"),n("span",{class:"token punctuation"},'"')]),a(),n("span",{class:"token attr-name"},"color"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),a("green"),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-card")]),a(),n("span",{class:"token attr-name"},"title"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),a("Pushes open the window"),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("small"),n("span",{class:"token punctuation"},'"')]),n("span",{class:"token punctuation"},">")]),a("and raises the spyglass."),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"</"),a("a-card")]),n("span",{class:"token punctuation"},">")]),a(`
  `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"</"),a("a-badge-ribbon")]),n("span",{class:"token punctuation"},">")]),a(`
  `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),a("a-badge-ribbon")]),a(),n("span",{class:"token attr-name"},"text"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),a("Hippies"),n("span",{class:"token punctuation"},'"')]),a(),n("span",{class:"token attr-name"},"color"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),a("purple"),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-card")]),a(),n("span",{class:"token attr-name"},"title"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),a("Pushes open the window"),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("small"),n("span",{class:"token punctuation"},'"')]),n("span",{class:"token punctuation"},">")]),a("and raises the spyglass."),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"</"),a("a-card")]),n("span",{class:"token punctuation"},">")]),a(`
  `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"</"),a("a-badge-ribbon")]),n("span",{class:"token punctuation"},">")]),a(`
  `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),a("a-badge-ribbon")]),a(),n("span",{class:"token attr-name"},"text"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),a("Hippies"),n("span",{class:"token punctuation"},'"')]),a(),n("span",{class:"token attr-name"},"color"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),a("volcano"),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-card")]),a(),n("span",{class:"token attr-name"},"title"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),a("Pushes open the window"),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("small"),n("span",{class:"token punctuation"},'"')]),n("span",{class:"token punctuation"},">")]),a("and raises the spyglass."),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"</"),a("a-card")]),n("span",{class:"token punctuation"},">")]),a(`
  `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"</"),a("a-badge-ribbon")]),n("span",{class:"token punctuation"},">")]),a(`
  `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),a("a-badge-ribbon")]),a(),n("span",{class:"token attr-name"},"text"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),a("Hippies"),n("span",{class:"token punctuation"},'"')]),a(),n("span",{class:"token attr-name"},"color"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),a("magenta"),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-card")]),a(),n("span",{class:"token attr-name"},"title"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),a("Pushes open the window"),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("small"),n("span",{class:"token punctuation"},'"')]),n("span",{class:"token punctuation"},">")]),a("and raises the spyglass."),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"</"),a("a-card")]),n("span",{class:"token punctuation"},">")]),a(`
  `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"</"),a("a-badge-ribbon")]),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(`
`)])],-1)])),_:1})}const dn=d(kn,[["render",rn]]),gn={pageData:{title:"Badge",description:"",frontmatter:{category:"Components",type:"\u6570\u636E\u5C55\u793A",title:"Badge",subtitle:"\u5FBD\u6807\u6570",cover:"https://gw.alipayobjects.com/zos/antfincdn/6%26GF9WHwvY/Badge.svg"},headers:[{level:2,title:"\u4F55\u65F6\u4F7F\u7528",slug:"\u4F55\u65F6\u4F7F\u7528",content:"\u4E00\u822C\u51FA\u73B0\u5728\u901A\u77E5\u56FE\u6807\u6216\u5934\u50CF\u7684\u53F3\u4E0A\u89D2\uFF0C\u7528\u4E8E\u663E\u793A\u9700\u8981\u5904\u7406\u7684\u6D88\u606F\u6761\u6570\uFF0C\u901A\u8FC7\u9192\u76EE\u89C6\u89C9\u5F62\u5F0F\u5438\u5F15\u7528\u6237\u5904\u7406\u3002"},{level:2,title:"API",slug:"API",content:`<a-badge :count="5" />
`},{level:3,title:"Badge",slug:"Badge",content:""},{level:3,title:"Badge.Ribbon (2.0.1+)",slug:"Badge-Ribbon-2-0-1",content:""}],relativePath:"components/badge/index.zh-CN.md",content:`
\u56FE\u6807\u53F3\u4E0A\u89D2\u7684\u5706\u5F62\u5FBD\u6807\u6570\u5B57\u3002

## \u4F55\u65F6\u4F7F\u7528

\u4E00\u822C\u51FA\u73B0\u5728\u901A\u77E5\u56FE\u6807\u6216\u5934\u50CF\u7684\u53F3\u4E0A\u89D2\uFF0C\u7528\u4E8E\u663E\u793A\u9700\u8981\u5904\u7406\u7684\u6D88\u606F\u6761\u6570\uFF0C\u901A\u8FC7\u9192\u76EE\u89C6\u89C9\u5F62\u5F0F\u5438\u5F15\u7528\u6237\u5904\u7406\u3002

## API

\`\`\`html
&lt;a-badge :count=&quot;5&quot;&gt;
  &lt;a href=&quot;#&quot; class=&quot;head-example&quot; /&gt;
&lt;/a-badge&gt;
\`\`\`

\`\`\`html
&lt;a-badge :count=&quot;5&quot; /&gt;
\`\`\`

### Badge

| \u53C2\u6570 | \u8BF4\u660E | \u7C7B\u578B | \u9ED8\u8BA4\u503C | \u7248\u672C |
| --- | --- | --- | --- | --- |
| color | \u81EA\u5B9A\u4E49\u5C0F\u5706\u70B9\u7684\u989C\u8272 | string | - | 1.5.0 |
| count | \u5C55\u793A\u7684\u6570\u5B57\uFF0C\u5927\u4E8E overflowCount \u65F6\u663E\u793A\u4E3A \`\${overflowCount}+\`\uFF0C\u4E3A 0 \u65F6\u9690\u85CF | number \\| string \\| slot |  |  |
| dot | \u4E0D\u5C55\u793A\u6570\u5B57\uFF0C\u53EA\u6709\u4E00\u4E2A\u5C0F\u7EA2\u70B9 | boolean | false |  |
| numberStyle | \u8BBE\u7F6E\u72B6\u6001\u70B9\u7684\u6837\u5F0F | object | &#39;&#39; |  |
| offset | \u8BBE\u7F6E\u72B6\u6001\u70B9\u7684\u4F4D\u7F6E\u504F\u79FB\uFF0C\u683C\u5F0F\u4E3A [x, y] | [number\\|string, number\\|string] | - |  |
| overflowCount | \u5C55\u793A\u5C01\u9876\u7684\u6570\u5B57\u503C | number | 99 |  |
| showZero | \u5F53\u6570\u503C\u4E3A 0 \u65F6\uFF0C\u662F\u5426\u5C55\u793A Badge | boolean | false |  |
| status | \u8BBE\u7F6E Badge \u4E3A\u72B6\u6001\u70B9 | Enum{ &#39;success&#39;, &#39;processing, &#39;default&#39;, &#39;error&#39;, &#39;warning&#39; } | &#39;&#39; |  |
| text | \u5728\u8BBE\u7F6E\u4E86 \`status\` \u7684\u524D\u63D0\u4E0B\u6709\u6548\uFF0C\u8BBE\u7F6E\u72B6\u6001\u70B9\u7684\u6587\u672C | string | &#39;&#39; |  |
| title | \u8BBE\u7F6E\u9F20\u6807\u653E\u5728\u72B6\u6001\u70B9\u4E0A\u65F6\u663E\u793A\u7684\u6587\u5B57 | string | \`count\` |  |

### Badge.Ribbon (2.0.1+)

| \u53C2\u6570 | \u8BF4\u660E | \u7C7B\u578B | \u9ED8\u8BA4\u503C | \u7248\u672C |
| --- | --- | --- | --- | --- |
| color | \u81EA\u5B9A\u4E49\u7F0E\u5E26\u7684\u989C\u8272 | string | - |  |
| placement | \u7F0E\u5E26\u7684\u4F4D\u7F6E\uFF0C\`start\` \u548C \`end\` \u968F\u6587\u5B57\u65B9\u5411\uFF08RTL \u6216 LTR\uFF09\u53D8\u52A8 | \`start\` \\| \`end\` | \`end\` |  |
| text | \u7F0E\u5E26\u4E2D\u586B\u5165\u7684\u5185\u5BB9 | string \\| VNode \\| slot | - |  |
`,html:`<p>\u56FE\u6807\u53F3\u4E0A\u89D2\u7684\u5706\u5F62\u5FBD\u6807\u6570\u5B57\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>\u4E00\u822C\u51FA\u73B0\u5728\u901A\u77E5\u56FE\u6807\u6216\u5934\u50CF\u7684\u53F3\u4E0A\u89D2\uFF0C\u7528\u4E8E\u663E\u793A\u9700\u8981\u5904\u7406\u7684\u6D88\u606F\u6761\u6570\uFF0C\u901A\u8FC7\u9192\u76EE\u89C6\u89C9\u5F62\u5F0F\u5438\u5F15\u7528\u6237\u5904\u7406\u3002</p>
<h2 id="API">API <a class="header-anchor" href="#API">
          <span aria-hidden="true" class="anchor">#</span>
        </a></h2>
<pre class="language-html" v-pre><code><span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>a-badge</span> <span class="token attr-name">:count</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">"</span>5<span class="token punctuation">"</span></span><span class="token punctuation">></span></span>
  <span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>a</span> <span class="token attr-name">href</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">"</span>#<span class="token punctuation">"</span></span> <span class="token attr-name">class</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">"</span>head-example<span class="token punctuation">"</span></span> <span class="token punctuation">/></span></span>
<span class="token tag"><span class="token tag"><span class="token punctuation">&lt;/</span>a-badge</span><span class="token punctuation">></span></span>
</code></pre>
<pre class="language-html" v-pre><code><span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>a-badge</span> <span class="token attr-name">:count</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">"</span>5<span class="token punctuation">"</span></span> <span class="token punctuation">/></span></span>
</code></pre>
<h3 id="Badge">Badge <a class="header-anchor" href="#Badge">
          <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>
</tr>
</thead>
<tbody>
<tr>
<td>color</td>
<td>\u81EA\u5B9A\u4E49\u5C0F\u5706\u70B9\u7684\u989C\u8272</td>
<td>string</td>
<td>-</td>
<td>1.5.0</td>
</tr>
<tr>
<td>count</td>
<td>\u5C55\u793A\u7684\u6570\u5B57\uFF0C\u5927\u4E8E overflowCount \u65F6\u663E\u793A\u4E3A <code>\${overflowCount}+</code>\uFF0C\u4E3A 0 \u65F6\u9690\u85CF</td>
<td>number | string | slot</td>
<td></td>
<td></td>
</tr>
<tr>
<td>dot</td>
<td>\u4E0D\u5C55\u793A\u6570\u5B57\uFF0C\u53EA\u6709\u4E00\u4E2A\u5C0F\u7EA2\u70B9</td>
<td>boolean</td>
<td>false</td>
<td></td>
</tr>
<tr>
<td>numberStyle</td>
<td>\u8BBE\u7F6E\u72B6\u6001\u70B9\u7684\u6837\u5F0F</td>
<td>object</td>
<td>''</td>
<td></td>
</tr>
<tr>
<td>offset</td>
<td>\u8BBE\u7F6E\u72B6\u6001\u70B9\u7684\u4F4D\u7F6E\u504F\u79FB\uFF0C\u683C\u5F0F\u4E3A [x, y]</td>
<td>[number|string, number|string]</td>
<td>-</td>
<td></td>
</tr>
<tr>
<td>overflowCount</td>
<td>\u5C55\u793A\u5C01\u9876\u7684\u6570\u5B57\u503C</td>
<td>number</td>
<td>99</td>
<td></td>
</tr>
<tr>
<td>showZero</td>
<td>\u5F53\u6570\u503C\u4E3A 0 \u65F6\uFF0C\u662F\u5426\u5C55\u793A Badge</td>
<td>boolean</td>
<td>false</td>
<td></td>
</tr>
<tr>
<td>status</td>
<td>\u8BBE\u7F6E Badge \u4E3A\u72B6\u6001\u70B9</td>
<td>Enum{ 'success', 'processing, 'default', 'error', 'warning' }</td>
<td>''</td>
<td></td>
</tr>
<tr>
<td>text</td>
<td>\u5728\u8BBE\u7F6E\u4E86 <code>status</code> \u7684\u524D\u63D0\u4E0B\u6709\u6548\uFF0C\u8BBE\u7F6E\u72B6\u6001\u70B9\u7684\u6587\u672C</td>
<td>string</td>
<td>''</td>
<td></td>
</tr>
<tr>
<td>title</td>
<td>\u8BBE\u7F6E\u9F20\u6807\u653E\u5728\u72B6\u6001\u70B9\u4E0A\u65F6\u663E\u793A\u7684\u6587\u5B57</td>
<td>string</td>
<td><code>count</code></td>
<td></td>
</tr>
</tbody>
</table>
<h3 id="Badge-Ribbon-2-0-1">Badge.Ribbon (2.0.1+) <a class="header-anchor" href="#Badge-Ribbon-2-0-1">
          <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>
</tr>
</thead>
<tbody>
<tr>
<td>color</td>
<td>\u81EA\u5B9A\u4E49\u7F0E\u5E26\u7684\u989C\u8272</td>
<td>string</td>
<td>-</td>
<td></td>
</tr>
<tr>
<td>placement</td>
<td>\u7F0E\u5E26\u7684\u4F4D\u7F6E\uFF0C<code>start</code> \u548C <code>end</code> \u968F\u6587\u5B57\u65B9\u5411\uFF08RTL \u6216 LTR\uFF09\u53D8\u52A8</td>
<td><code>start</code> | <code>end</code></td>
<td><code>end</code></td>
<td></td>
</tr>
<tr>
<td>text</td>
<td>\u7F0E\u5E26\u4E2D\u586B\u5165\u7684\u5185\u5BB9</td>
<td>string | VNode | slot</td>
<td>-</td>
<td></td>
</tr>
</tbody>
</table>
`,lastUpdated:1748060300539}},mn={class:"markdown"};function bn(l,t,c,p,i,h){return k(),C("article",mn,t[0]||(t[0]=[w(`<p>\u56FE\u6807\u53F3\u4E0A\u89D2\u7684\u5706\u5F62\u5FBD\u6807\u6570\u5B57\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>\u4E00\u822C\u51FA\u73B0\u5728\u901A\u77E5\u56FE\u6807\u6216\u5934\u50CF\u7684\u53F3\u4E0A\u89D2\uFF0C\u7528\u4E8E\u663E\u793A\u9700\u8981\u5904\u7406\u7684\u6D88\u606F\u6761\u6570\uFF0C\u901A\u8FC7\u9192\u76EE\u89C6\u89C9\u5F62\u5F0F\u5438\u5F15\u7528\u6237\u5904\u7406\u3002</p><h2 id="API">API <a class="header-anchor" href="#API"><span aria-hidden="true" class="anchor">#</span></a></h2><pre class="language-html"><code><span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>a-badge</span> <span class="token attr-name">:count</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">&quot;</span>5<span class="token punctuation">&quot;</span></span><span class="token punctuation">&gt;</span></span>
  <span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>a</span> <span class="token attr-name">href</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">&quot;</span>#<span class="token punctuation">&quot;</span></span> <span class="token attr-name">class</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">&quot;</span>head-example<span class="token punctuation">&quot;</span></span> <span class="token punctuation">/&gt;</span></span>
<span class="token tag"><span class="token tag"><span class="token punctuation">&lt;/</span>a-badge</span><span class="token punctuation">&gt;</span></span>
</code></pre><pre class="language-html"><code><span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>a-badge</span> <span class="token attr-name">:count</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">&quot;</span>5<span class="token punctuation">&quot;</span></span> <span class="token punctuation">/&gt;</span></span>
</code></pre><h3 id="Badge">Badge <a class="header-anchor" href="#Badge"><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></tr></thead><tbody><tr><td>color</td><td>\u81EA\u5B9A\u4E49\u5C0F\u5706\u70B9\u7684\u989C\u8272</td><td>string</td><td>-</td><td>1.5.0</td></tr><tr><td>count</td><td>\u5C55\u793A\u7684\u6570\u5B57\uFF0C\u5927\u4E8E overflowCount \u65F6\u663E\u793A\u4E3A <code>\${overflowCount}+</code>\uFF0C\u4E3A 0 \u65F6\u9690\u85CF</td><td>number | string | slot</td><td></td><td></td></tr><tr><td>dot</td><td>\u4E0D\u5C55\u793A\u6570\u5B57\uFF0C\u53EA\u6709\u4E00\u4E2A\u5C0F\u7EA2\u70B9</td><td>boolean</td><td>false</td><td></td></tr><tr><td>numberStyle</td><td>\u8BBE\u7F6E\u72B6\u6001\u70B9\u7684\u6837\u5F0F</td><td>object</td><td>&#39;&#39;</td><td></td></tr><tr><td>offset</td><td>\u8BBE\u7F6E\u72B6\u6001\u70B9\u7684\u4F4D\u7F6E\u504F\u79FB\uFF0C\u683C\u5F0F\u4E3A [x, y]</td><td>[number|string, number|string]</td><td>-</td><td></td></tr><tr><td>overflowCount</td><td>\u5C55\u793A\u5C01\u9876\u7684\u6570\u5B57\u503C</td><td>number</td><td>99</td><td></td></tr><tr><td>showZero</td><td>\u5F53\u6570\u503C\u4E3A 0 \u65F6\uFF0C\u662F\u5426\u5C55\u793A Badge</td><td>boolean</td><td>false</td><td></td></tr><tr><td>status</td><td>\u8BBE\u7F6E Badge \u4E3A\u72B6\u6001\u70B9</td><td>Enum{ &#39;success&#39;, &#39;processing, &#39;default&#39;, &#39;error&#39;, &#39;warning&#39; }</td><td>&#39;&#39;</td><td></td></tr><tr><td>text</td><td>\u5728\u8BBE\u7F6E\u4E86 <code>status</code> \u7684\u524D\u63D0\u4E0B\u6709\u6548\uFF0C\u8BBE\u7F6E\u72B6\u6001\u70B9\u7684\u6587\u672C</td><td>string</td><td>&#39;&#39;</td><td></td></tr><tr><td>title</td><td>\u8BBE\u7F6E\u9F20\u6807\u653E\u5728\u72B6\u6001\u70B9\u4E0A\u65F6\u663E\u793A\u7684\u6587\u5B57</td><td>string</td><td><code>count</code></td><td></td></tr></tbody></table><h3 id="Badge-Ribbon-2-0-1">Badge.Ribbon (2.0.1+) <a class="header-anchor" href="#Badge-Ribbon-2-0-1"><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></tr></thead><tbody><tr><td>color</td><td>\u81EA\u5B9A\u4E49\u7F0E\u5E26\u7684\u989C\u8272</td><td>string</td><td>-</td><td></td></tr><tr><td>placement</td><td>\u7F0E\u5E26\u7684\u4F4D\u7F6E\uFF0C<code>start</code> \u548C <code>end</code> \u968F\u6587\u5B57\u65B9\u5411\uFF08RTL \u6216 LTR\uFF09\u53D8\u52A8</td><td><code>start</code> | <code>end</code></td><td><code>end</code></td><td></td></tr><tr><td>text</td><td>\u7F0E\u5E26\u4E2D\u586B\u5165\u7684\u5185\u5BB9</td><td>string | VNode | slot</td><td>-</td><td></td></tr></tbody></table>`,10)]))}const hn=d(gn,[["render",bn]]),In={pageData:{title:"Badge",description:"",frontmatter:{category:"Components",type:"Data Display",title:"Badge",cover:"https://gw.alipayobjects.com/zos/antfincdn/6%26GF9WHwvY/Badge.svg"},headers:[{level:2,title:"When To Use",slug:"When-To-Use",content:"Badge normally appears in proximity to notifications or user avatars with eye-catching appeal, typically displaying unread messages count."},{level:2,title:"API",slug:"API",content:`<a-badge :count="5" />
`},{level:3,title:"Badge",slug:"Badge",content:""},{level:3,title:"Badge.Ribbon (2.0.1+)",slug:"Badge-Ribbon-2-0-1",content:""}],relativePath:"components/badge/index.en_US.md",content:"\nSmall numerical value or status descriptor for UI elements.\n\n## When To Use\n\nBadge normally appears in proximity to notifications or user avatars with eye-catching appeal, typically displaying unread messages count.\n\n## API\n\n```html\n&lt;a-badge :count=&quot;5&quot;&gt;\n  &lt;a href=&quot;#&quot; class=&quot;head-example&quot; /&gt;\n&lt;/a-badge&gt;\n```\n\n```html\n&lt;a-badge :count=&quot;5&quot; /&gt;\n```\n\n### Badge\n\n| Property | Description | Type | Default | Version |\n| --- | --- | --- | --- | --- |\n| color | Customize Badge dot color | string | - | 1.5.0 |\n| count | Number to show in badge | number\\|string \\| slot |  |  |\n| dot | Whether to display a red dot instead of `count` | boolean | `false` |  |\n| offset | set offset of the badge dot, like [x, y] | [number\\|string, number\\|string] | - |  |\n| overflowCount | Max count to show | number | 99 |  |\n| showZero | Whether to show badge when `count` is zero | boolean | `false` |  |\n| status | Set Badge as a status dot | `success` \\| `processing` \\| `default` \\| `error` \\| `warning` | `&#39;&#39;` |  |\n| text | If `status` is set, `text` sets the display text of the status `dot` | string | `&#39;&#39;` |  |\n| numberStyle | sets the display style of the status `dot` | object | &#39;&#39; |  |\n| title | Text to show when hovering over the badge | string | `count` |  |\n\n### Badge.Ribbon (2.0.1+)\n\n| Property | Description | Type | Default | Version |\n| --- | --- | --- | --- | --- |\n| color | Customize Ribbon color | string | - |  |\n| placement | The placement of the Ribbon, `start` and `end` follow text direction (RTL or LTR) | `start` \\| `end` | `end` |  |\n| text | Content inside the Ribbon | string \\| VNode \\| slot | - |  |\n",html:`<p>Small numerical value or status descriptor for UI elements.</p>
<h2 id="When-To-Use">When To Use <a class="header-anchor" href="#When-To-Use">
          <span aria-hidden="true" class="anchor">#</span>
        </a></h2>
<p>Badge normally appears in proximity to notifications or user avatars with eye-catching appeal, typically displaying unread messages count.</p>
<h2 id="API">API <a class="header-anchor" href="#API">
          <span aria-hidden="true" class="anchor">#</span>
        </a></h2>
<pre class="language-html" v-pre><code><span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>a-badge</span> <span class="token attr-name">:count</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">"</span>5<span class="token punctuation">"</span></span><span class="token punctuation">></span></span>
  <span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>a</span> <span class="token attr-name">href</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">"</span>#<span class="token punctuation">"</span></span> <span class="token attr-name">class</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">"</span>head-example<span class="token punctuation">"</span></span> <span class="token punctuation">/></span></span>
<span class="token tag"><span class="token tag"><span class="token punctuation">&lt;/</span>a-badge</span><span class="token punctuation">></span></span>
</code></pre>
<pre class="language-html" v-pre><code><span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>a-badge</span> <span class="token attr-name">:count</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">"</span>5<span class="token punctuation">"</span></span> <span class="token punctuation">/></span></span>
</code></pre>
<h3 id="Badge">Badge <a class="header-anchor" href="#Badge">
          <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>color</td>
<td>Customize Badge dot color</td>
<td>string</td>
<td>-</td>
<td>1.5.0</td>
</tr>
<tr>
<td>count</td>
<td>Number to show in badge</td>
<td>number|string | slot</td>
<td></td>
<td></td>
</tr>
<tr>
<td>dot</td>
<td>Whether to display a red dot instead of <code>count</code></td>
<td>boolean</td>
<td><code>false</code></td>
<td></td>
</tr>
<tr>
<td>offset</td>
<td>set offset of the badge dot, like [x, y]</td>
<td>[number|string, number|string]</td>
<td>-</td>
<td></td>
</tr>
<tr>
<td>overflowCount</td>
<td>Max count to show</td>
<td>number</td>
<td>99</td>
<td></td>
</tr>
<tr>
<td>showZero</td>
<td>Whether to show badge when <code>count</code> is zero</td>
<td>boolean</td>
<td><code>false</code></td>
<td></td>
</tr>
<tr>
<td>status</td>
<td>Set Badge as a status dot</td>
<td><code>success</code> | <code>processing</code> | <code>default</code> | <code>error</code> | <code>warning</code></td>
<td><code>''</code></td>
<td></td>
</tr>
<tr>
<td>text</td>
<td>If <code>status</code> is set, <code>text</code> sets the display text of the status <code>dot</code></td>
<td>string</td>
<td><code>''</code></td>
<td></td>
</tr>
<tr>
<td>numberStyle</td>
<td>sets the display style of the status <code>dot</code></td>
<td>object</td>
<td>''</td>
<td></td>
</tr>
<tr>
<td>title</td>
<td>Text to show when hovering over the badge</td>
<td>string</td>
<td><code>count</code></td>
<td></td>
</tr>
</tbody>
</table>
<h3 id="Badge-Ribbon-2-0-1">Badge.Ribbon (2.0.1+) <a class="header-anchor" href="#Badge-Ribbon-2-0-1">
          <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>color</td>
<td>Customize Ribbon color</td>
<td>string</td>
<td>-</td>
<td></td>
</tr>
<tr>
<td>placement</td>
<td>The placement of the Ribbon, <code>start</code> and <code>end</code> follow text direction (RTL or LTR)</td>
<td><code>start</code> | <code>end</code></td>
<td><code>end</code></td>
<td></td>
</tr>
<tr>
<td>text</td>
<td>Content inside the Ribbon</td>
<td>string | VNode | slot</td>
<td>-</td>
<td></td>
</tr>
</tbody>
</table>
`,lastUpdated:1748060300539}},Cn={class:"markdown"};function vn(l,t,c,p,i,h){return k(),C("article",Cn,t[0]||(t[0]=[w(`<p>Small numerical value or status descriptor for UI elements.</p><h2 id="When-To-Use">When To Use <a class="header-anchor" href="#When-To-Use"><span aria-hidden="true" class="anchor">#</span></a></h2><p>Badge normally appears in proximity to notifications or user avatars with eye-catching appeal, typically displaying unread messages count.</p><h2 id="API">API <a class="header-anchor" href="#API"><span aria-hidden="true" class="anchor">#</span></a></h2><pre class="language-html"><code><span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>a-badge</span> <span class="token attr-name">:count</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">&quot;</span>5<span class="token punctuation">&quot;</span></span><span class="token punctuation">&gt;</span></span>
  <span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>a</span> <span class="token attr-name">href</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">&quot;</span>#<span class="token punctuation">&quot;</span></span> <span class="token attr-name">class</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">&quot;</span>head-example<span class="token punctuation">&quot;</span></span> <span class="token punctuation">/&gt;</span></span>
<span class="token tag"><span class="token tag"><span class="token punctuation">&lt;/</span>a-badge</span><span class="token punctuation">&gt;</span></span>
</code></pre><pre class="language-html"><code><span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>a-badge</span> <span class="token attr-name">:count</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">&quot;</span>5<span class="token punctuation">&quot;</span></span> <span class="token punctuation">/&gt;</span></span>
</code></pre><h3 id="Badge">Badge <a class="header-anchor" href="#Badge"><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>color</td><td>Customize Badge dot color</td><td>string</td><td>-</td><td>1.5.0</td></tr><tr><td>count</td><td>Number to show in badge</td><td>number|string | slot</td><td></td><td></td></tr><tr><td>dot</td><td>Whether to display a red dot instead of <code>count</code></td><td>boolean</td><td><code>false</code></td><td></td></tr><tr><td>offset</td><td>set offset of the badge dot, like [x, y]</td><td>[number|string, number|string]</td><td>-</td><td></td></tr><tr><td>overflowCount</td><td>Max count to show</td><td>number</td><td>99</td><td></td></tr><tr><td>showZero</td><td>Whether to show badge when <code>count</code> is zero</td><td>boolean</td><td><code>false</code></td><td></td></tr><tr><td>status</td><td>Set Badge as a status dot</td><td><code>success</code> | <code>processing</code> | <code>default</code> | <code>error</code> | <code>warning</code></td><td><code>&#39;&#39;</code></td><td></td></tr><tr><td>text</td><td>If <code>status</code> is set, <code>text</code> sets the display text of the status <code>dot</code></td><td>string</td><td><code>&#39;&#39;</code></td><td></td></tr><tr><td>numberStyle</td><td>sets the display style of the status <code>dot</code></td><td>object</td><td>&#39;&#39;</td><td></td></tr><tr><td>title</td><td>Text to show when hovering over the badge</td><td>string</td><td><code>count</code></td><td></td></tr></tbody></table><h3 id="Badge-Ribbon-2-0-1">Badge.Ribbon (2.0.1+) <a class="header-anchor" href="#Badge-Ribbon-2-0-1"><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>color</td><td>Customize Ribbon color</td><td>string</td><td>-</td><td></td></tr><tr><td>placement</td><td>The placement of the Ribbon, <code>start</code> and <code>end</code> follow text direction (RTL or LTR)</td><td><code>start</code> | <code>end</code></td><td><code>end</code></td><td></td></tr><tr><td>text</td><td>Content inside the Ribbon</td><td>string | VNode | slot</td><td>-</td><td></td></tr></tbody></table>`,10)]))}const Zn=d(In,[["render",vn]]),yn=I({CN:hn,US:Zn,components:{Basic:N,NoWapper:F,Overflow:T,Dot:j,Status:O,Change:D,Title:an,Colors:en,Link:un,Ribbon:dn}});function Gn(l,t,c,p,i,h){const u=e("Basic"),r=e("NoWapper"),b=e("Overflow"),m=e("Dot"),v=e("Status"),Z=e("Change"),y=e("Title"),G=e("Colors"),A=e("Ribbon"),Y=e("Link"),P=e("demo-sort");return k(),g(P,null,{default:o(()=>[s(u),s(r),s(b),s(m),s(v),s(Z),s(y),s(G),s(A),s(Y)]),_:1})}const wn=d(yn,[["render",Gn]]);export{wn as default};