import{d as v,r as I,y as S,_ as b,j as l,k as r,l as C,w as o,f as c,e as t,b as n,ba as V,a as h,h as y,t as W,F as Z,ai as Y,J as B,n as G,bb as J,c as P,q as H}from"./index.3fe853a6.js";const z=v({setup(){const s=I("@afc163");return S(s,()=>{console.log("value",s)}),{value:s,onSelect:i=>{console.log("select",i)}}}});function F(s,a,i,d,g,m){const e=l("a-mentions-option"),u=l("a-mentions"),k=l("demo-box");return r(),C(k,{jsfiddle:{us:"Basic usage.",cn:"\u57FA\u672C\u7528\u6CD5",docHtml:`<h2 id="zh-CN">zh-CN <a class="header-anchor" href="#zh-CN">
          <span aria-hidden="true" class="anchor">#</span>
        </a></h2>
<p>\u57FA\u672C\u7528\u6CD5</p>
<h2 id="en-US">en-US <a class="header-anchor" href="#en-US">
          <span aria-hidden="true" class="anchor">#</span>
        </a></h2>
<p>Basic usage.</p>
`,order:0,title:{"zh-CN":"\u57FA\u672C\u7528\u6CD5","en-US":"Basic usage"},relativePath:"components/mentions/demo/basic.vue",sourceCode:"PHRlbXBsYXRlPgogIDxhLW1lbnRpb25zIHYtbW9kZWw6dmFsdWU9InZhbHVlIiBhdXRvZm9jdXMgQHNlbGVjdD0ib25TZWxlY3QiPgogICAgPGEtbWVudGlvbnMtb3B0aW9uIHZhbHVlPSJhZmMxNjMiPmFmYzE2MzwvYS1tZW50aW9ucy1vcHRpb24+CiAgICA8YS1tZW50aW9ucy1vcHRpb24gdmFsdWU9InpvbWJpZUoiPnpvbWJpZUo8L2EtbWVudGlvbnMtb3B0aW9uPgogICAgPGEtbWVudGlvbnMtb3B0aW9uIHZhbHVlPSJ5ZXNtZWNrIj55ZXNtZWNrPC9hLW1lbnRpb25zLW9wdGlvbj4KICA8L2EtbWVudGlvbnM+CjwvdGVtcGxhdGU+CjxzY3JpcHQgbGFuZz0idHMiPgppbXBvcnQgeyBkZWZpbmVDb21wb25lbnQsIHJlZiwgd2F0Y2ggfSBmcm9tICd2dWUnOwpleHBvcnQgZGVmYXVsdCBkZWZpbmVDb21wb25lbnQoewogIHNldHVwKCkgewogICAgY29uc3QgdmFsdWUgPSByZWY8c3RyaW5nPignQGFmYzE2MycpOwogICAgd2F0Y2godmFsdWUsICgpID0+IHsKICAgICAgY29uc29sZS5sb2coJ3ZhbHVlJywgdmFsdWUpOwogICAgfSk7CiAgICBjb25zdCBvblNlbGVjdCA9IChvcHRpb246IHsgdmFsdWU6IHN0cmluZyB9KSA9PiB7CiAgICAgIGNvbnNvbGUubG9nKCdzZWxlY3QnLCBvcHRpb24pOwogICAgfTsKCiAgICByZXR1cm4gewogICAgICB2YWx1ZSwKICAgICAgb25TZWxlY3QsCiAgICB9OwogIH0sCn0pOwo8L3NjcmlwdD4KCg==",jsSourceCode:"PHRlbXBsYXRlPgogIDxhLW1lbnRpb25zIHYtbW9kZWw6dmFsdWU9InZhbHVlIiBhdXRvZm9jdXMgQHNlbGVjdD0ib25TZWxlY3QiPgogICAgPGEtbWVudGlvbnMtb3B0aW9uIHZhbHVlPSJhZmMxNjMiPmFmYzE2MzwvYS1tZW50aW9ucy1vcHRpb24+CiAgICA8YS1tZW50aW9ucy1vcHRpb24gdmFsdWU9InpvbWJpZUoiPnpvbWJpZUo8L2EtbWVudGlvbnMtb3B0aW9uPgogICAgPGEtbWVudGlvbnMtb3B0aW9uIHZhbHVlPSJ5ZXNtZWNrIj55ZXNtZWNrPC9hLW1lbnRpb25zLW9wdGlvbj4KICA8L2EtbWVudGlvbnM+CjwvdGVtcGxhdGU+CjxzY3JpcHQ+CmltcG9ydCB7IGRlZmluZUNvbXBvbmVudCwgcmVmLCB3YXRjaCB9IGZyb20gJ3Z1ZSc7CmV4cG9ydCBkZWZhdWx0IGRlZmluZUNvbXBvbmVudCh7CiAgc2V0dXAoKSB7CiAgICBjb25zdCB2YWx1ZSA9IHJlZignQGFmYzE2MycpOwogICAgd2F0Y2godmFsdWUsICgpID0+IHsKICAgICAgY29uc29sZS5sb2coJ3ZhbHVlJywgdmFsdWUpOwogICAgfSk7CiAgICBjb25zdCBvblNlbGVjdCA9IG9wdGlvbiA9PiB7CiAgICAgIGNvbnNvbGUubG9nKCdzZWxlY3QnLCBvcHRpb24pOwogICAgfTsKICAgIHJldHVybiB7CiAgICAgIHZhbHVlLAogICAgICBvblNlbGVjdCwKICAgIH07CiAgfSwKfSk7Cjwvc2NyaXB0Pg=="}},{default:o(()=>[c(u,{value:s.value,"onUpdate:value":a[0]||(a[0]=p=>s.value=p),autofocus:"",onSelect:s.onSelect},{default:o(()=>[c(e,{value:"afc163"},{default:o(()=>a[1]||(a[1]=[t("afc163")])),_:1,__:[1]}),c(e,{value:"zombieJ"},{default:o(()=>a[2]||(a[2]=[t("zombieJ")])),_:1,__:[2]}),c(e,{value:"yesmeck"},{default:o(()=>a[3]||(a[3]=[t("yesmeck")])),_:1,__:[3]})]),_:1},8,["value","onSelect"])]),htmlCode:o(()=>a[4]||(a[4]=[n("pre",{class:"language-vue"},[n("code",null,[n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),t("template")]),n("span",{class:"token punctuation"},">")]),t(`
  `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),t("a-mentions")]),t(),n("span",{class:"token attr-name"},[n("span",{class:"token namespace"},"v-model:"),t("value")]),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),t("value"),n("span",{class:"token punctuation"},'"')]),t(),n("span",{class:"token attr-name"},"autofocus"),t(),n("span",{class:"token attr-name"},"@select"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),t("onSelect"),n("span",{class:"token punctuation"},'"')]),n("span",{class:"token punctuation"},">")]),t(`
    `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),t("a-mentions-option")]),t(),n("span",{class:"token attr-name"},"value"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),t("afc163"),n("span",{class:"token punctuation"},'"')]),n("span",{class:"token punctuation"},">")]),t("afc163"),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"</"),t("a-mentions-option")]),n("span",{class:"token punctuation"},">")]),t(`
    `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),t("a-mentions-option")]),t(),n("span",{class:"token attr-name"},"value"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),t("zombieJ"),n("span",{class:"token punctuation"},'"')]),n("span",{class:"token punctuation"},">")]),t("zombieJ"),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"</"),t("a-mentions-option")]),n("span",{class:"token punctuation"},">")]),t(`
    `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),t("a-mentions-option")]),t(),n("span",{class:"token attr-name"},"value"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),t("yesmeck"),n("span",{class:"token punctuation"},'"')]),n("span",{class:"token punctuation"},">")]),t("yesmeck"),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"</"),t("a-mentions-option")]),n("span",{class:"token punctuation"},">")]),t(`
  `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"</"),t("a-mentions")]),n("span",{class:"token punctuation"},">")]),t(`
`),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"</"),t("template")]),n("span",{class:"token punctuation"},">")]),t(`
`),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),t("script")]),t(),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"},'"'),t("ts"),n("span",{class:"token punctuation"},'"')]),n("span",{class:"token punctuation"},">")]),n("span",{class:"token script"},[n("span",{class:"token language-javascript"},[t(`
`),n("span",{class:"token keyword"},"import"),t(),n("span",{class:"token punctuation"},"{"),t(" defineComponent"),n("span",{class:"token punctuation"},","),t(" ref"),n("span",{class:"token punctuation"},","),t(" watch "),n("span",{class:"token punctuation"},"}"),t(),n("span",{class:"token keyword"},"from"),t(),n("span",{class:"token string"},"'vue'"),n("span",{class:"token punctuation"},";"),t(`
`),n("span",{class:"token keyword"},"export"),t(),n("span",{class:"token keyword"},"default"),t(),n("span",{class:"token function"},"defineComponent"),n("span",{class:"token punctuation"},"("),n("span",{class:"token punctuation"},"{"),t(`
  `),n("span",{class:"token function"},"setup"),n("span",{class:"token punctuation"},"("),n("span",{class:"token punctuation"},")"),t(),n("span",{class:"token punctuation"},"{"),t(`
    `),n("span",{class:"token keyword"},"const"),t(" value "),n("span",{class:"token operator"},"="),t(" ref"),n("span",{class:"token operator"},"<"),t("string"),n("span",{class:"token operator"},">"),n("span",{class:"token punctuation"},"("),n("span",{class:"token string"},"'@afc163'"),n("span",{class:"token punctuation"},")"),n("span",{class:"token punctuation"},";"),t(`
    `),n("span",{class:"token function"},"watch"),n("span",{class:"token punctuation"},"("),t("value"),n("span",{class:"token punctuation"},","),t(),n("span",{class:"token punctuation"},"("),n("span",{class:"token punctuation"},")"),t(),n("span",{class:"token operator"},"=>"),t(),n("span",{class:"token punctuation"},"{"),t(`
      console`),n("span",{class:"token punctuation"},"."),n("span",{class:"token function"},"log"),n("span",{class:"token punctuation"},"("),n("span",{class:"token string"},"'value'"),n("span",{class:"token punctuation"},","),t(" value"),n("span",{class:"token punctuation"},")"),n("span",{class:"token punctuation"},";"),t(`
    `),n("span",{class:"token punctuation"},"}"),n("span",{class:"token punctuation"},")"),n("span",{class:"token punctuation"},";"),t(`
    `),n("span",{class:"token keyword"},"const"),t(),n("span",{class:"token function-variable function"},"onSelect"),t(),n("span",{class:"token operator"},"="),t(),n("span",{class:"token punctuation"},"("),n("span",{class:"token parameter"},[n("span",{class:"token literal-property property"},"option"),n("span",{class:"token operator"},":"),t(),n("span",{class:"token punctuation"},"{"),t(),n("span",{class:"token literal-property property"},"value"),n("span",{class:"token operator"},":"),t(" string "),n("span",{class:"token punctuation"},"}")]),n("span",{class:"token punctuation"},")"),t(),n("span",{class:"token operator"},"=>"),t(),n("span",{class:"token punctuation"},"{"),t(`
      console`),n("span",{class:"token punctuation"},"."),n("span",{class:"token function"},"log"),n("span",{class:"token punctuation"},"("),n("span",{class:"token string"},"'select'"),n("span",{class:"token punctuation"},","),t(" option"),n("span",{class:"token punctuation"},")"),n("span",{class:"token punctuation"},";"),t(`
    `),n("span",{class:"token punctuation"},"}"),n("span",{class:"token punctuation"},";"),t(`

    `),n("span",{class:"token keyword"},"return"),t(),n("span",{class:"token punctuation"},"{"),t(`
      value`),n("span",{class:"token punctuation"},","),t(`
      onSelect`),n("span",{class:"token punctuation"},","),t(`
    `),n("span",{class:"token punctuation"},"}"),n("span",{class:"token punctuation"},";"),t(`
  `),n("span",{class:"token punctuation"},"}"),n("span",{class:"token punctuation"},","),t(`
`),n("span",{class:"token punctuation"},"}"),n("span",{class:"token punctuation"},")"),n("span",{class:"token punctuation"},";"),t(`
`)])]),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"</"),t("script")]),n("span",{class:"token punctuation"},">")]),t(`
`)])],-1)])),jsVersionHtml:o(()=>a[5]||(a[5]=[n("pre",{class:"language-vue"},[n("code",null,[n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),t("template")]),n("span",{class:"token punctuation"},">")]),t(`
  `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),t("a-mentions")]),t(),n("span",{class:"token attr-name"},[n("span",{class:"token namespace"},"v-model:"),t("value")]),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),t("value"),n("span",{class:"token punctuation"},'"')]),t(),n("span",{class:"token attr-name"},"autofocus"),t(),n("span",{class:"token attr-name"},"@select"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),t("onSelect"),n("span",{class:"token punctuation"},'"')]),n("span",{class:"token punctuation"},">")]),t(`
    `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),t("a-mentions-option")]),t(),n("span",{class:"token attr-name"},"value"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),t("afc163"),n("span",{class:"token punctuation"},'"')]),n("span",{class:"token punctuation"},">")]),t("afc163"),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"</"),t("a-mentions-option")]),n("span",{class:"token punctuation"},">")]),t(`
    `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),t("a-mentions-option")]),t(),n("span",{class:"token attr-name"},"value"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),t("zombieJ"),n("span",{class:"token punctuation"},'"')]),n("span",{class:"token punctuation"},">")]),t("zombieJ"),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"</"),t("a-mentions-option")]),n("span",{class:"token punctuation"},">")]),t(`
    `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),t("a-mentions-option")]),t(),n("span",{class:"token attr-name"},"value"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),t("yesmeck"),n("span",{class:"token punctuation"},'"')]),n("span",{class:"token punctuation"},">")]),t("yesmeck"),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"</"),t("a-mentions-option")]),n("span",{class:"token punctuation"},">")]),t(`
  `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"</"),t("a-mentions")]),n("span",{class:"token punctuation"},">")]),t(`
`),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"</"),t("template")]),n("span",{class:"token punctuation"},">")]),t(`
`),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),t("script")]),n("span",{class:"token punctuation"},">")]),n("span",{class:"token script"},[n("span",{class:"token language-javascript"},[t(`
`),n("span",{class:"token keyword"},"import"),t(),n("span",{class:"token punctuation"},"{"),t(" defineComponent"),n("span",{class:"token punctuation"},","),t(" ref"),n("span",{class:"token punctuation"},","),t(" watch "),n("span",{class:"token punctuation"},"}"),t(),n("span",{class:"token keyword"},"from"),t(),n("span",{class:"token string"},"'vue'"),n("span",{class:"token punctuation"},";"),t(`
`),n("span",{class:"token keyword"},"export"),t(),n("span",{class:"token keyword"},"default"),t(),n("span",{class:"token function"},"defineComponent"),n("span",{class:"token punctuation"},"("),n("span",{class:"token punctuation"},"{"),t(`
  `),n("span",{class:"token function"},"setup"),n("span",{class:"token punctuation"},"("),n("span",{class:"token punctuation"},")"),t(),n("span",{class:"token punctuation"},"{"),t(`
    `),n("span",{class:"token keyword"},"const"),t(" value "),n("span",{class:"token operator"},"="),t(),n("span",{class:"token function"},"ref"),n("span",{class:"token punctuation"},"("),n("span",{class:"token string"},"'@afc163'"),n("span",{class:"token punctuation"},")"),n("span",{class:"token punctuation"},";"),t(`
    `),n("span",{class:"token function"},"watch"),n("span",{class:"token punctuation"},"("),t("value"),n("span",{class:"token punctuation"},","),t(),n("span",{class:"token punctuation"},"("),n("span",{class:"token punctuation"},")"),t(),n("span",{class:"token operator"},"=>"),t(),n("span",{class:"token punctuation"},"{"),t(`
      console`),n("span",{class:"token punctuation"},"."),n("span",{class:"token function"},"log"),n("span",{class:"token punctuation"},"("),n("span",{class:"token string"},"'value'"),n("span",{class:"token punctuation"},","),t(" value"),n("span",{class:"token punctuation"},")"),n("span",{class:"token punctuation"},";"),t(`
    `),n("span",{class:"token punctuation"},"}"),n("span",{class:"token punctuation"},")"),n("span",{class:"token punctuation"},";"),t(`
    `),n("span",{class:"token keyword"},"const"),t(),n("span",{class:"token function-variable function"},"onSelect"),t(),n("span",{class:"token operator"},"="),t(),n("span",{class:"token parameter"},"option"),t(),n("span",{class:"token operator"},"=>"),t(),n("span",{class:"token punctuation"},"{"),t(`
      console`),n("span",{class:"token punctuation"},"."),n("span",{class:"token function"},"log"),n("span",{class:"token punctuation"},"("),n("span",{class:"token string"},"'select'"),n("span",{class:"token punctuation"},","),t(" option"),n("span",{class:"token punctuation"},")"),n("span",{class:"token punctuation"},";"),t(`
    `),n("span",{class:"token punctuation"},"}"),n("span",{class:"token punctuation"},";"),t(`
    `),n("span",{class:"token keyword"},"return"),t(),n("span",{class:"token punctuation"},"{"),t(`
      value`),n("span",{class:"token punctuation"},","),t(`
      onSelect`),n("span",{class:"token punctuation"},","),t(`
    `),n("span",{class:"token punctuation"},"}"),n("span",{class:"token punctuation"},";"),t(`
  `),n("span",{class:"token punctuation"},"}"),n("span",{class:"token punctuation"},","),t(`
`),n("span",{class:"token punctuation"},"}"),n("span",{class:"token punctuation"},")"),n("span",{class:"token punctuation"},";"),t(`
`)])]),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"</"),t("script")]),n("span",{class:"token punctuation"},">")]),t(`
`)])],-1)])),_:1})}const R=b(z,[["render",F]]),K=v({setup(){const s=I(""),a=I(!1),i=I([]),d=I(""),g=V(e=>{if(!e){i.value=[];return}fetch(`https://api.github.com/search/users?q=${e}`).then(u=>u.json()).then(({items:u=[]})=>{d.value===e&&(i.value=u.slice(0,10),a.value=!1)})},800);return{value:s,loading:a,users:i,loadGithubUsers:g,onSearch:e=>{d.value=e,a.value=!!e,console.log(!!e),i.value=[],console.log("Search:",e),g(e)}}}}),N=["src","alt"];function x(s,a,i,d,g,m){const e=l("a-mentions-option"),u=l("a-mentions"),k=l("demo-box");return r(),C(k,{jsfiddle:{us:"async.",cn:"\u5339\u914D\u5185\u5BB9\u5217\u8868\u4E3A\u5F02\u6B65\u8FD4\u56DE\u65F6\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>\u5339\u914D\u5185\u5BB9\u5217\u8868\u4E3A\u5F02\u6B65\u8FD4\u56DE\u65F6\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>async.</p>
`,order:1,title:{"zh-CN":"\u5F02\u6B65\u52A0\u8F7D","en-US":"Asynchronous loading"},relativePath:"components/mentions/demo/async.vue",sourceCode:"PHRlbXBsYXRlPgogIDxhLW1lbnRpb25zIHYtbW9kZWw6dmFsdWU9InZhbHVlIiA6bG9hZGluZz0ibG9hZGluZyIgQHNlYXJjaD0ib25TZWFyY2giPgogICAgPGEtbWVudGlvbnMtb3B0aW9uIHYtZm9yPSJ7IGxvZ2luLCBhdmF0YXJfdXJsOiBhdmF0YXIgfSBpbiB1c2VycyIgOmtleT0ibG9naW4iIDp2YWx1ZT0ibG9naW4iPgogICAgICA8aW1nIDpzcmM9ImF2YXRhciIgOmFsdD0ibG9naW4iIHN0eWxlPSJ3aWR0aDogMjBweDsgbWFyZ2luLXJpZ2h0OiA4cHgiIC8+CiAgICAgIDxzcGFuPnt7IGxvZ2luIH19PC9zcGFuPgogICAgPC9hLW1lbnRpb25zLW9wdGlvbj4KICA8L2EtbWVudGlvbnM+CjwvdGVtcGxhdGU+CjxzY3JpcHQgbGFuZz0idHMiPgppbXBvcnQgeyBkZWJvdW5jZSB9IGZyb20gJ2xvZGFzaC1lcyc7CmltcG9ydCB7IGRlZmluZUNvbXBvbmVudCwgcmVmIH0gZnJvbSAndnVlJzsKZXhwb3J0IGRlZmF1bHQgZGVmaW5lQ29tcG9uZW50KHsKICBzZXR1cCgpIHsKICAgIGNvbnN0IHZhbHVlID0gcmVmPHN0cmluZz4oJycpOwogICAgY29uc3QgbG9hZGluZyA9IHJlZjxib29sZWFuPihmYWxzZSk7CiAgICBjb25zdCB1c2VycyA9IHJlZjx7IGxvZ2luOiBzdHJpbmc7IGF2YXRhcl91cmw6IHN0cmluZyB9W10+KFtdKTsKICAgIGNvbnN0IHNlYXJjaCA9IHJlZjxzdHJpbmc+KCcnKTsKICAgIGNvbnN0IGxvYWRHaXRodWJVc2VycyA9IGRlYm91bmNlKChrZXk6IHN0cmluZykgPT4gewogICAgICBpZiAoIWtleSkgewogICAgICAgIHVzZXJzLnZhbHVlID0gW107CiAgICAgICAgcmV0dXJuOwogICAgICB9CgogICAgICBmZXRjaChgaHR0cHM6Ly9hcGkuZ2l0aHViLmNvbS9zZWFyY2gvdXNlcnM/cT0ke2tleX1gKQogICAgICAgIC50aGVuKHJlcyA9PiByZXMuanNvbigpKQogICAgICAgIC50aGVuKCh7IGl0ZW1zID0gW10gfSkgPT4gewogICAgICAgICAgaWYgKHNlYXJjaC52YWx1ZSAhPT0ga2V5KSByZXR1cm47CiAgICAgICAgICB1c2Vycy52YWx1ZSA9IGl0ZW1zLnNsaWNlKDAsIDEwKTsKICAgICAgICAgIGxvYWRpbmcudmFsdWUgPSBmYWxzZTsKICAgICAgICB9KTsKICAgIH0sIDgwMCk7CgogICAgY29uc3Qgb25TZWFyY2ggPSAoc2VhcmNoVmFsdWU6IHN0cmluZykgPT4gewogICAgICBzZWFyY2gudmFsdWUgPSBzZWFyY2hWYWx1ZTsKICAgICAgbG9hZGluZy52YWx1ZSA9ICEhc2VhcmNoVmFsdWU7CiAgICAgIGNvbnNvbGUubG9nKCEhc2VhcmNoVmFsdWUpOwogICAgICB1c2Vycy52YWx1ZSA9IFtdOwogICAgICBjb25zb2xlLmxvZygnU2VhcmNoOicsIHNlYXJjaFZhbHVlKTsKICAgICAgbG9hZEdpdGh1YlVzZXJzKHNlYXJjaFZhbHVlKTsKICAgIH07CgogICAgcmV0dXJuIHsKICAgICAgdmFsdWUsCiAgICAgIGxvYWRpbmcsCiAgICAgIHVzZXJzLAogICAgICBsb2FkR2l0aHViVXNlcnMsCiAgICAgIG9uU2VhcmNoLAogICAgfTsKICB9LAp9KTsKPC9zY3JpcHQ+Cgo=",jsSourceCode:"PHRlbXBsYXRlPgogIDxhLW1lbnRpb25zIHYtbW9kZWw6dmFsdWU9InZhbHVlIiA6bG9hZGluZz0ibG9hZGluZyIgQHNlYXJjaD0ib25TZWFyY2giPgogICAgPGEtbWVudGlvbnMtb3B0aW9uIHYtZm9yPSJ7IGxvZ2luLCBhdmF0YXJfdXJsOiBhdmF0YXIgfSBpbiB1c2VycyIgOmtleT0ibG9naW4iIDp2YWx1ZT0ibG9naW4iPgogICAgICA8aW1nIDpzcmM9ImF2YXRhciIgOmFsdD0ibG9naW4iIHN0eWxlPSJ3aWR0aDogMjBweDsgbWFyZ2luLXJpZ2h0OiA4cHgiIC8+CiAgICAgIDxzcGFuPnt7IGxvZ2luIH19PC9zcGFuPgogICAgPC9hLW1lbnRpb25zLW9wdGlvbj4KICA8L2EtbWVudGlvbnM+CjwvdGVtcGxhdGU+CjxzY3JpcHQ+CmltcG9ydCB7IGRlYm91bmNlIH0gZnJvbSAnbG9kYXNoLWVzJzsKaW1wb3J0IHsgZGVmaW5lQ29tcG9uZW50LCByZWYgfSBmcm9tICd2dWUnOwpleHBvcnQgZGVmYXVsdCBkZWZpbmVDb21wb25lbnQoewogIHNldHVwKCkgewogICAgY29uc3QgdmFsdWUgPSByZWYoJycpOwogICAgY29uc3QgbG9hZGluZyA9IHJlZihmYWxzZSk7CiAgICBjb25zdCB1c2VycyA9IHJlZihbXSk7CiAgICBjb25zdCBzZWFyY2ggPSByZWYoJycpOwogICAgY29uc3QgbG9hZEdpdGh1YlVzZXJzID0gZGVib3VuY2Uoa2V5ID0+IHsKICAgICAgaWYgKCFrZXkpIHsKICAgICAgICB1c2Vycy52YWx1ZSA9IFtdOwogICAgICAgIHJldHVybjsKICAgICAgfQogICAgICBmZXRjaChgaHR0cHM6Ly9hcGkuZ2l0aHViLmNvbS9zZWFyY2gvdXNlcnM/cT0ke2tleX1gKS50aGVuKHJlcyA9PiByZXMuanNvbigpKS50aGVuKCh7CiAgICAgICAgaXRlbXMgPSBbXSwKICAgICAgfSkgPT4gewogICAgICAgIGlmIChzZWFyY2gudmFsdWUgIT09IGtleSkgcmV0dXJuOwogICAgICAgIHVzZXJzLnZhbHVlID0gaXRlbXMuc2xpY2UoMCwgMTApOwogICAgICAgIGxvYWRpbmcudmFsdWUgPSBmYWxzZTsKICAgICAgfSk7CiAgICB9LCA4MDApOwogICAgY29uc3Qgb25TZWFyY2ggPSBzZWFyY2hWYWx1ZSA9PiB7CiAgICAgIHNlYXJjaC52YWx1ZSA9IHNlYXJjaFZhbHVlOwogICAgICBsb2FkaW5nLnZhbHVlID0gISFzZWFyY2hWYWx1ZTsKICAgICAgY29uc29sZS5sb2coISFzZWFyY2hWYWx1ZSk7CiAgICAgIHVzZXJzLnZhbHVlID0gW107CiAgICAgIGNvbnNvbGUubG9nKCdTZWFyY2g6Jywgc2VhcmNoVmFsdWUpOwogICAgICBsb2FkR2l0aHViVXNlcnMoc2VhcmNoVmFsdWUpOwogICAgfTsKICAgIHJldHVybiB7CiAgICAgIHZhbHVlLAogICAgICBsb2FkaW5nLAogICAgICB1c2VycywKICAgICAgbG9hZEdpdGh1YlVzZXJzLAogICAgICBvblNlYXJjaCwKICAgIH07CiAgfSwKfSk7Cjwvc2NyaXB0Pg=="}},{default:o(()=>[c(u,{value:s.value,"onUpdate:value":a[0]||(a[0]=p=>s.value=p),loading:s.loading,onSearch:s.onSearch},{default:o(()=>[(r(!0),h(Z,null,y(s.users,({login:p,avatar_url:A})=>(r(),C(e,{key:p,value:p},{default:o(()=>[n("img",{src:A,alt:p,style:{width:"20px","margin-right":"8px"}},null,8,N),n("span",null,W(p),1)]),_:2},1032,["value"]))),128))]),_:1},8,["value","loading","onSearch"])]),htmlCode:o(()=>a[1]||(a[1]=[n("pre",{class:"language-vue"},[n("code",null,[n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),t("template")]),n("span",{class:"token punctuation"},">")]),t(`
  `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),t("a-mentions")]),t(),n("span",{class:"token attr-name"},[n("span",{class:"token namespace"},"v-model:"),t("value")]),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),t("value"),n("span",{class:"token punctuation"},'"')]),t(),n("span",{class:"token attr-name"},":loading"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),t("loading"),n("span",{class:"token punctuation"},'"')]),t(),n("span",{class:"token attr-name"},"@search"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),t("onSearch"),n("span",{class:"token punctuation"},'"')]),n("span",{class:"token punctuation"},">")]),t(`
    `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),t("a-mentions-option")]),t(),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"},'"'),t("{ login, avatar_url: avatar } in users"),n("span",{class:"token punctuation"},'"')]),t(),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"},'"'),t("login"),n("span",{class:"token punctuation"},'"')]),t(),n("span",{class:"token attr-name"},":value"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),t("login"),n("span",{class:"token punctuation"},'"')]),n("span",{class:"token punctuation"},">")]),t(`
      `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),t("img")]),t(),n("span",{class:"token attr-name"},":src"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),t("avatar"),n("span",{class:"token punctuation"},'"')]),t(),n("span",{class:"token attr-name"},":alt"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),t("login"),n("span",{class:"token punctuation"},'"')]),t(),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"},"width"),n("span",{class:"token punctuation"},":"),t(" 20px"),n("span",{class:"token punctuation"},";"),t(),n("span",{class:"token property"},"margin-right"),n("span",{class:"token punctuation"},":"),t(" 8px")]),n("span",{class:"token punctuation"},'"')])]),t(),n("span",{class:"token punctuation"},"/>")]),t(`
      `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),t("span")]),n("span",{class:"token punctuation"},">")]),t("{{ login }}"),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"</"),t("span")]),n("span",{class:"token punctuation"},">")]),t(`
    `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"</"),t("a-mentions-option")]),n("span",{class:"token punctuation"},">")]),t(`
  `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"</"),t("a-mentions")]),n("span",{class:"token punctuation"},">")]),t(`
`),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"</"),t("template")]),n("span",{class:"token punctuation"},">")]),t(`
`),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),t("script")]),t(),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"},'"'),t("ts"),n("span",{class:"token punctuation"},'"')]),n("span",{class:"token punctuation"},">")]),n("span",{class:"token script"},[n("span",{class:"token language-javascript"},[t(`
`),n("span",{class:"token keyword"},"import"),t(),n("span",{class:"token punctuation"},"{"),t(" debounce "),n("span",{class:"token punctuation"},"}"),t(),n("span",{class:"token keyword"},"from"),t(),n("span",{class:"token string"},"'lodash-es'"),n("span",{class:"token punctuation"},";"),t(`
`),n("span",{class:"token keyword"},"import"),t(),n("span",{class:"token punctuation"},"{"),t(" defineComponent"),n("span",{class:"token punctuation"},","),t(" ref "),n("span",{class:"token punctuation"},"}"),t(),n("span",{class:"token keyword"},"from"),t(),n("span",{class:"token string"},"'vue'"),n("span",{class:"token punctuation"},";"),t(`
`),n("span",{class:"token keyword"},"export"),t(),n("span",{class:"token keyword"},"default"),t(),n("span",{class:"token function"},"defineComponent"),n("span",{class:"token punctuation"},"("),n("span",{class:"token punctuation"},"{"),t(`
  `),n("span",{class:"token function"},"setup"),n("span",{class:"token punctuation"},"("),n("span",{class:"token punctuation"},")"),t(),n("span",{class:"token punctuation"},"{"),t(`
    `),n("span",{class:"token keyword"},"const"),t(" value "),n("span",{class:"token operator"},"="),t(" ref"),n("span",{class:"token operator"},"<"),t("string"),n("span",{class:"token operator"},">"),n("span",{class:"token punctuation"},"("),n("span",{class:"token string"},"''"),n("span",{class:"token punctuation"},")"),n("span",{class:"token punctuation"},";"),t(`
    `),n("span",{class:"token keyword"},"const"),t(" loading "),n("span",{class:"token operator"},"="),t(" ref"),n("span",{class:"token operator"},"<"),t("boolean"),n("span",{class:"token operator"},">"),n("span",{class:"token punctuation"},"("),n("span",{class:"token boolean"},"false"),n("span",{class:"token punctuation"},")"),n("span",{class:"token punctuation"},";"),t(`
    `),n("span",{class:"token keyword"},"const"),t(" users "),n("span",{class:"token operator"},"="),t(" ref"),n("span",{class:"token operator"},"<"),n("span",{class:"token punctuation"},"{"),t(),n("span",{class:"token literal-property property"},"login"),n("span",{class:"token operator"},":"),t(" string"),n("span",{class:"token punctuation"},";"),t(" avatar_url"),n("span",{class:"token operator"},":"),t(" string "),n("span",{class:"token punctuation"},"}"),n("span",{class:"token punctuation"},"["),n("span",{class:"token punctuation"},"]"),n("span",{class:"token operator"},">"),n("span",{class:"token punctuation"},"("),n("span",{class:"token punctuation"},"["),n("span",{class:"token punctuation"},"]"),n("span",{class:"token punctuation"},")"),n("span",{class:"token punctuation"},";"),t(`
    `),n("span",{class:"token keyword"},"const"),t(" search "),n("span",{class:"token operator"},"="),t(" ref"),n("span",{class:"token operator"},"<"),t("string"),n("span",{class:"token operator"},">"),n("span",{class:"token punctuation"},"("),n("span",{class:"token string"},"''"),n("span",{class:"token punctuation"},")"),n("span",{class:"token punctuation"},";"),t(`
    `),n("span",{class:"token keyword"},"const"),t(" loadGithubUsers "),n("span",{class:"token operator"},"="),t(),n("span",{class:"token function"},"debounce"),n("span",{class:"token punctuation"},"("),n("span",{class:"token punctuation"},"("),n("span",{class:"token parameter"},[n("span",{class:"token literal-property property"},"key"),n("span",{class:"token operator"},":"),t(" string")]),n("span",{class:"token punctuation"},")"),t(),n("span",{class:"token operator"},"=>"),t(),n("span",{class:"token punctuation"},"{"),t(`
      `),n("span",{class:"token keyword"},"if"),t(),n("span",{class:"token punctuation"},"("),n("span",{class:"token operator"},"!"),t("key"),n("span",{class:"token punctuation"},")"),t(),n("span",{class:"token punctuation"},"{"),t(`
        users`),n("span",{class:"token punctuation"},"."),t("value "),n("span",{class:"token operator"},"="),t(),n("span",{class:"token punctuation"},"["),n("span",{class:"token punctuation"},"]"),n("span",{class:"token punctuation"},";"),t(`
        `),n("span",{class:"token keyword"},"return"),n("span",{class:"token punctuation"},";"),t(`
      `),n("span",{class:"token punctuation"},"}"),t(`

      `),n("span",{class:"token function"},"fetch"),n("span",{class:"token punctuation"},"("),n("span",{class:"token template-string"},[n("span",{class:"token template-punctuation string"},"`"),n("span",{class:"token string"},"https://api.github.com/search/users?q="),n("span",{class:"token interpolation"},[n("span",{class:"token interpolation-punctuation punctuation"},"${"),t("key"),n("span",{class:"token interpolation-punctuation punctuation"},"}")]),n("span",{class:"token template-punctuation string"},"`")]),n("span",{class:"token punctuation"},")"),t(`
        `),n("span",{class:"token punctuation"},"."),n("span",{class:"token function"},"then"),n("span",{class:"token punctuation"},"("),n("span",{class:"token parameter"},"res"),t(),n("span",{class:"token operator"},"=>"),t(" res"),n("span",{class:"token punctuation"},"."),n("span",{class:"token function"},"json"),n("span",{class:"token punctuation"},"("),n("span",{class:"token punctuation"},")"),n("span",{class:"token punctuation"},")"),t(`
        `),n("span",{class:"token punctuation"},"."),n("span",{class:"token function"},"then"),n("span",{class:"token punctuation"},"("),n("span",{class:"token punctuation"},"("),n("span",{class:"token parameter"},[n("span",{class:"token punctuation"},"{"),t(" items "),n("span",{class:"token operator"},"="),t(),n("span",{class:"token punctuation"},"["),n("span",{class:"token punctuation"},"]"),t(),n("span",{class:"token punctuation"},"}")]),n("span",{class:"token punctuation"},")"),t(),n("span",{class:"token operator"},"=>"),t(),n("span",{class:"token punctuation"},"{"),t(`
          `),n("span",{class:"token keyword"},"if"),t(),n("span",{class:"token punctuation"},"("),t("search"),n("span",{class:"token punctuation"},"."),t("value "),n("span",{class:"token operator"},"!=="),t(" key"),n("span",{class:"token punctuation"},")"),t(),n("span",{class:"token keyword"},"return"),n("span",{class:"token punctuation"},";"),t(`
          users`),n("span",{class:"token punctuation"},"."),t("value "),n("span",{class:"token operator"},"="),t(" items"),n("span",{class:"token punctuation"},"."),n("span",{class:"token function"},"slice"),n("span",{class:"token punctuation"},"("),n("span",{class:"token number"},"0"),n("span",{class:"token punctuation"},","),t(),n("span",{class:"token number"},"10"),n("span",{class:"token punctuation"},")"),n("span",{class:"token punctuation"},";"),t(`
          loading`),n("span",{class:"token punctuation"},"."),t("value "),n("span",{class:"token operator"},"="),t(),n("span",{class:"token boolean"},"false"),n("span",{class:"token punctuation"},";"),t(`
        `),n("span",{class:"token punctuation"},"}"),n("span",{class:"token punctuation"},")"),n("span",{class:"token punctuation"},";"),t(`
    `),n("span",{class:"token punctuation"},"}"),n("span",{class:"token punctuation"},","),t(),n("span",{class:"token number"},"800"),n("span",{class:"token punctuation"},")"),n("span",{class:"token punctuation"},";"),t(`

    `),n("span",{class:"token keyword"},"const"),t(),n("span",{class:"token function-variable function"},"onSearch"),t(),n("span",{class:"token operator"},"="),t(),n("span",{class:"token punctuation"},"("),n("span",{class:"token parameter"},[n("span",{class:"token literal-property property"},"searchValue"),n("span",{class:"token operator"},":"),t(" string")]),n("span",{class:"token punctuation"},")"),t(),n("span",{class:"token operator"},"=>"),t(),n("span",{class:"token punctuation"},"{"),t(`
      search`),n("span",{class:"token punctuation"},"."),t("value "),n("span",{class:"token operator"},"="),t(" searchValue"),n("span",{class:"token punctuation"},";"),t(`
      loading`),n("span",{class:"token punctuation"},"."),t("value "),n("span",{class:"token operator"},"="),t(),n("span",{class:"token operator"},"!"),n("span",{class:"token operator"},"!"),t("searchValue"),n("span",{class:"token punctuation"},";"),t(`
      console`),n("span",{class:"token punctuation"},"."),n("span",{class:"token function"},"log"),n("span",{class:"token punctuation"},"("),n("span",{class:"token operator"},"!"),n("span",{class:"token operator"},"!"),t("searchValue"),n("span",{class:"token punctuation"},")"),n("span",{class:"token punctuation"},";"),t(`
      users`),n("span",{class:"token punctuation"},"."),t("value "),n("span",{class:"token operator"},"="),t(),n("span",{class:"token punctuation"},"["),n("span",{class:"token punctuation"},"]"),n("span",{class:"token punctuation"},";"),t(`
      console`),n("span",{class:"token punctuation"},"."),n("span",{class:"token function"},"log"),n("span",{class:"token punctuation"},"("),n("span",{class:"token string"},"'Search:'"),n("span",{class:"token punctuation"},","),t(" searchValue"),n("span",{class:"token punctuation"},")"),n("span",{class:"token punctuation"},";"),t(`
      `),n("span",{class:"token function"},"loadGithubUsers"),n("span",{class:"token punctuation"},"("),t("searchValue"),n("span",{class:"token punctuation"},")"),n("span",{class:"token punctuation"},";"),t(`
    `),n("span",{class:"token punctuation"},"}"),n("span",{class:"token punctuation"},";"),t(`

    `),n("span",{class:"token keyword"},"return"),t(),n("span",{class:"token punctuation"},"{"),t(`
      value`),n("span",{class:"token punctuation"},","),t(`
      loading`),n("span",{class:"token punctuation"},","),t(`
      users`),n("span",{class:"token punctuation"},","),t(`
      loadGithubUsers`),n("span",{class:"token punctuation"},","),t(`
      onSearch`),n("span",{class:"token punctuation"},","),t(`
    `),n("span",{class:"token punctuation"},"}"),n("span",{class:"token punctuation"},";"),t(`
  `),n("span",{class:"token punctuation"},"}"),n("span",{class:"token punctuation"},","),t(`
`),n("span",{class:"token punctuation"},"}"),n("span",{class:"token punctuation"},")"),n("span",{class:"token punctuation"},";"),t(`
`)])]),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"</"),t("script")]),n("span",{class:"token punctuation"},">")]),t(`
`)])],-1)])),jsVersionHtml:o(()=>a[2]||(a[2]=[n("pre",{class:"language-vue"},[n("code",null,[n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),t("template")]),n("span",{class:"token punctuation"},">")]),t(`
  `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),t("a-mentions")]),t(),n("span",{class:"token attr-name"},[n("span",{class:"token namespace"},"v-model:"),t("value")]),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),t("value"),n("span",{class:"token punctuation"},'"')]),t(),n("span",{class:"token attr-name"},":loading"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),t("loading"),n("span",{class:"token punctuation"},'"')]),t(),n("span",{class:"token attr-name"},"@search"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),t("onSearch"),n("span",{class:"token punctuation"},'"')]),n("span",{class:"token punctuation"},">")]),t(`
    `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),t("a-mentions-option")]),t(),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"},'"'),t("{ login, avatar_url: avatar } in users"),n("span",{class:"token punctuation"},'"')]),t(),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"},'"'),t("login"),n("span",{class:"token punctuation"},'"')]),t(),n("span",{class:"token attr-name"},":value"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),t("login"),n("span",{class:"token punctuation"},'"')]),n("span",{class:"token punctuation"},">")]),t(`
      `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),t("img")]),t(),n("span",{class:"token attr-name"},":src"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),t("avatar"),n("span",{class:"token punctuation"},'"')]),t(),n("span",{class:"token attr-name"},":alt"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),t("login"),n("span",{class:"token punctuation"},'"')]),t(),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"},"width"),n("span",{class:"token punctuation"},":"),t(" 20px"),n("span",{class:"token punctuation"},";"),t(),n("span",{class:"token property"},"margin-right"),n("span",{class:"token punctuation"},":"),t(" 8px")]),n("span",{class:"token punctuation"},'"')])]),t(),n("span",{class:"token punctuation"},"/>")]),t(`
      `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),t("span")]),n("span",{class:"token punctuation"},">")]),t("{{ login }}"),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"</"),t("span")]),n("span",{class:"token punctuation"},">")]),t(`
    `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"</"),t("a-mentions-option")]),n("span",{class:"token punctuation"},">")]),t(`
  `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"</"),t("a-mentions")]),n("span",{class:"token punctuation"},">")]),t(`
`),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"</"),t("template")]),n("span",{class:"token punctuation"},">")]),t(`
`),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),t("script")]),n("span",{class:"token punctuation"},">")]),n("span",{class:"token script"},[n("span",{class:"token language-javascript"},[t(`
`),n("span",{class:"token keyword"},"import"),t(),n("span",{class:"token punctuation"},"{"),t(" debounce "),n("span",{class:"token punctuation"},"}"),t(),n("span",{class:"token keyword"},"from"),t(),n("span",{class:"token string"},"'lodash-es'"),n("span",{class:"token punctuation"},";"),t(`
`),n("span",{class:"token keyword"},"import"),t(),n("span",{class:"token punctuation"},"{"),t(" defineComponent"),n("span",{class:"token punctuation"},","),t(" ref "),n("span",{class:"token punctuation"},"}"),t(),n("span",{class:"token keyword"},"from"),t(),n("span",{class:"token string"},"'vue'"),n("span",{class:"token punctuation"},";"),t(`
`),n("span",{class:"token keyword"},"export"),t(),n("span",{class:"token keyword"},"default"),t(),n("span",{class:"token function"},"defineComponent"),n("span",{class:"token punctuation"},"("),n("span",{class:"token punctuation"},"{"),t(`
  `),n("span",{class:"token function"},"setup"),n("span",{class:"token punctuation"},"("),n("span",{class:"token punctuation"},")"),t(),n("span",{class:"token punctuation"},"{"),t(`
    `),n("span",{class:"token keyword"},"const"),t(" value "),n("span",{class:"token operator"},"="),t(),n("span",{class:"token function"},"ref"),n("span",{class:"token punctuation"},"("),n("span",{class:"token string"},"''"),n("span",{class:"token punctuation"},")"),n("span",{class:"token punctuation"},";"),t(`
    `),n("span",{class:"token keyword"},"const"),t(" loading "),n("span",{class:"token operator"},"="),t(),n("span",{class:"token function"},"ref"),n("span",{class:"token punctuation"},"("),n("span",{class:"token boolean"},"false"),n("span",{class:"token punctuation"},")"),n("span",{class:"token punctuation"},";"),t(`
    `),n("span",{class:"token keyword"},"const"),t(" users "),n("span",{class:"token operator"},"="),t(),n("span",{class:"token function"},"ref"),n("span",{class:"token punctuation"},"("),n("span",{class:"token punctuation"},"["),n("span",{class:"token punctuation"},"]"),n("span",{class:"token punctuation"},")"),n("span",{class:"token punctuation"},";"),t(`
    `),n("span",{class:"token keyword"},"const"),t(" search "),n("span",{class:"token operator"},"="),t(),n("span",{class:"token function"},"ref"),n("span",{class:"token punctuation"},"("),n("span",{class:"token string"},"''"),n("span",{class:"token punctuation"},")"),n("span",{class:"token punctuation"},";"),t(`
    `),n("span",{class:"token keyword"},"const"),t(" loadGithubUsers "),n("span",{class:"token operator"},"="),t(),n("span",{class:"token function"},"debounce"),n("span",{class:"token punctuation"},"("),n("span",{class:"token parameter"},"key"),t(),n("span",{class:"token operator"},"=>"),t(),n("span",{class:"token punctuation"},"{"),t(`
      `),n("span",{class:"token keyword"},"if"),t(),n("span",{class:"token punctuation"},"("),n("span",{class:"token operator"},"!"),t("key"),n("span",{class:"token punctuation"},")"),t(),n("span",{class:"token punctuation"},"{"),t(`
        users`),n("span",{class:"token punctuation"},"."),t("value "),n("span",{class:"token operator"},"="),t(),n("span",{class:"token punctuation"},"["),n("span",{class:"token punctuation"},"]"),n("span",{class:"token punctuation"},";"),t(`
        `),n("span",{class:"token keyword"},"return"),n("span",{class:"token punctuation"},";"),t(`
      `),n("span",{class:"token punctuation"},"}"),t(`
      `),n("span",{class:"token function"},"fetch"),n("span",{class:"token punctuation"},"("),n("span",{class:"token template-string"},[n("span",{class:"token template-punctuation string"},"`"),n("span",{class:"token string"},"https://api.github.com/search/users?q="),n("span",{class:"token interpolation"},[n("span",{class:"token interpolation-punctuation punctuation"},"${"),t("key"),n("span",{class:"token interpolation-punctuation punctuation"},"}")]),n("span",{class:"token template-punctuation string"},"`")]),n("span",{class:"token punctuation"},")"),n("span",{class:"token punctuation"},"."),n("span",{class:"token function"},"then"),n("span",{class:"token punctuation"},"("),n("span",{class:"token parameter"},"res"),t(),n("span",{class:"token operator"},"=>"),t(" res"),n("span",{class:"token punctuation"},"."),n("span",{class:"token function"},"json"),n("span",{class:"token punctuation"},"("),n("span",{class:"token punctuation"},")"),n("span",{class:"token punctuation"},")"),n("span",{class:"token punctuation"},"."),n("span",{class:"token function"},"then"),n("span",{class:"token punctuation"},"("),n("span",{class:"token punctuation"},"("),n("span",{class:"token parameter"},[n("span",{class:"token punctuation"},"{"),t(`
        items `),n("span",{class:"token operator"},"="),t(),n("span",{class:"token punctuation"},"["),n("span",{class:"token punctuation"},"]"),n("span",{class:"token punctuation"},","),t(`
      `),n("span",{class:"token punctuation"},"}")]),n("span",{class:"token punctuation"},")"),t(),n("span",{class:"token operator"},"=>"),t(),n("span",{class:"token punctuation"},"{"),t(`
        `),n("span",{class:"token keyword"},"if"),t(),n("span",{class:"token punctuation"},"("),t("search"),n("span",{class:"token punctuation"},"."),t("value "),n("span",{class:"token operator"},"!=="),t(" key"),n("span",{class:"token punctuation"},")"),t(),n("span",{class:"token keyword"},"return"),n("span",{class:"token punctuation"},";"),t(`
        users`),n("span",{class:"token punctuation"},"."),t("value "),n("span",{class:"token operator"},"="),t(" items"),n("span",{class:"token punctuation"},"."),n("span",{class:"token function"},"slice"),n("span",{class:"token punctuation"},"("),n("span",{class:"token number"},"0"),n("span",{class:"token punctuation"},","),t(),n("span",{class:"token number"},"10"),n("span",{class:"token punctuation"},")"),n("span",{class:"token punctuation"},";"),t(`
        loading`),n("span",{class:"token punctuation"},"."),t("value "),n("span",{class:"token operator"},"="),t(),n("span",{class:"token boolean"},"false"),n("span",{class:"token punctuation"},";"),t(`
      `),n("span",{class:"token punctuation"},"}"),n("span",{class:"token punctuation"},")"),n("span",{class:"token punctuation"},";"),t(`
    `),n("span",{class:"token punctuation"},"}"),n("span",{class:"token punctuation"},","),t(),n("span",{class:"token number"},"800"),n("span",{class:"token punctuation"},")"),n("span",{class:"token punctuation"},";"),t(`
    `),n("span",{class:"token keyword"},"const"),t(),n("span",{class:"token function-variable function"},"onSearch"),t(),n("span",{class:"token operator"},"="),t(),n("span",{class:"token parameter"},"searchValue"),t(),n("span",{class:"token operator"},"=>"),t(),n("span",{class:"token punctuation"},"{"),t(`
      search`),n("span",{class:"token punctuation"},"."),t("value "),n("span",{class:"token operator"},"="),t(" searchValue"),n("span",{class:"token punctuation"},";"),t(`
      loading`),n("span",{class:"token punctuation"},"."),t("value "),n("span",{class:"token operator"},"="),t(),n("span",{class:"token operator"},"!"),n("span",{class:"token operator"},"!"),t("searchValue"),n("span",{class:"token punctuation"},";"),t(`
      console`),n("span",{class:"token punctuation"},"."),n("span",{class:"token function"},"log"),n("span",{class:"token punctuation"},"("),n("span",{class:"token operator"},"!"),n("span",{class:"token operator"},"!"),t("searchValue"),n("span",{class:"token punctuation"},")"),n("span",{class:"token punctuation"},";"),t(`
      users`),n("span",{class:"token punctuation"},"."),t("value "),n("span",{class:"token operator"},"="),t(),n("span",{class:"token punctuation"},"["),n("span",{class:"token punctuation"},"]"),n("span",{class:"token punctuation"},";"),t(`
      console`),n("span",{class:"token punctuation"},"."),n("span",{class:"token function"},"log"),n("span",{class:"token punctuation"},"("),n("span",{class:"token string"},"'Search:'"),n("span",{class:"token punctuation"},","),t(" searchValue"),n("span",{class:"token punctuation"},")"),n("span",{class:"token punctuation"},";"),t(`
      `),n("span",{class:"token function"},"loadGithubUsers"),n("span",{class:"token punctuation"},"("),t("searchValue"),n("span",{class:"token punctuation"},")"),n("span",{class:"token punctuation"},";"),t(`
    `),n("span",{class:"token punctuation"},"}"),n("span",{class:"token punctuation"},";"),t(`
    `),n("span",{class:"token keyword"},"return"),t(),n("span",{class:"token punctuation"},"{"),t(`
      value`),n("span",{class:"token punctuation"},","),t(`
      loading`),n("span",{class:"token punctuation"},","),t(`
      users`),n("span",{class:"token punctuation"},","),t(`
      loadGithubUsers`),n("span",{class:"token punctuation"},","),t(`
      onSearch`),n("span",{class:"token punctuation"},","),t(`
    `),n("span",{class:"token punctuation"},"}"),n("span",{class:"token punctuation"},";"),t(`
  `),n("span",{class:"token punctuation"},"}"),n("span",{class:"token punctuation"},","),t(`
`),n("span",{class:"token punctuation"},"}"),n("span",{class:"token punctuation"},")"),n("span",{class:"token punctuation"},";"),t(`
`)])]),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"</"),t("script")]),n("span",{class:"token punctuation"},">")]),t(`
`)])],-1)])),_:1})}const M=b(K,[["render",x]]),X=Y.useForm,{getMentions:j}=J,L=v({setup(){const s=async(u,k)=>j(k).length<2?Promise.reject("More than one must be selected!"):Promise.resolve(),a=B({bio:"",coders:""}),i=B({bio:[{required:!0,message:"Must input bio"}],coders:[{required:!0,validator:s}]}),{resetFields:d,validate:g,validateInfos:m}=X(a,i);return{modelRef:a,resetFields:d,validateInfos:m,handleSubmit:u=>{u.preventDefault(),g().then(()=>{console.log("Submit!!!",a)}).catch(k=>{console.log("Errors in the form!!!",k)})}}}});function D(s,a,i,d,g,m){const e=l("a-mentions-option"),u=l("a-mentions"),k=l("a-form-item"),p=l("a-button"),A=l("a-form"),w=l("demo-box");return r(),C(w,{jsfiddle:{us:"to work with `Form`.",cn:"\u914D\u5408 Form \u4F7F\u7528\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>\u914D\u5408 Form \u4F7F\u7528\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>to work with <code>Form</code>.</p>
`,order:2,title:{"zh-CN":"\u914D\u5408 Form \u4F7F\u7528","en-US":"With Form"},relativePath:"components/mentions/demo/form.vue",sourceCode:"PHRlbXBsYXRlPgogIDxhLWZvcm0gbGF5b3V0PSJob3Jpem9udGFsIj4KICAgIDxhLWZvcm0taXRlbQogICAgICBsYWJlbD0iVG9wIGNvZGVycyIKICAgICAgOmxhYmVsLWNvbD0ieyBzcGFuOiA2IH0iCiAgICAgIDp3cmFwcGVyLWNvbD0ieyBzcGFuOiAxOCB9IgogICAgICBuYW1lPSJjb2RlcnMiCiAgICAgIHYtYmluZD0idmFsaWRhdGVJbmZvcy5jb2RlcnMiCiAgICA+CiAgICAgIDxhLW1lbnRpb25zIHYtbW9kZWw6dmFsdWU9Im1vZGVsUmVmLmNvZGVycyIgcm93cz0iMSI+CiAgICAgICAgPGEtbWVudGlvbnMtb3B0aW9uIHZhbHVlPSJhZmMxNjMiPmFmYzE2MzwvYS1tZW50aW9ucy1vcHRpb24+CiAgICAgICAgPGEtbWVudGlvbnMtb3B0aW9uIHZhbHVlPSJ6b21iaWVKIj56b21iaWVKPC9hLW1lbnRpb25zLW9wdGlvbj4KICAgICAgICA8YS1tZW50aW9ucy1vcHRpb24gdmFsdWU9Inllc21lY2siPnllc21lY2s8L2EtbWVudGlvbnMtb3B0aW9uPgogICAgICA8L2EtbWVudGlvbnM+CiAgICA8L2EtZm9ybS1pdGVtPgogICAgPGEtZm9ybS1pdGVtCiAgICAgIGxhYmVsPSJCaW8iCiAgICAgIDpsYWJlbC1jb2w9Insgc3BhbjogNiB9IgogICAgICA6d3JhcHBlci1jb2w9Insgc3BhbjogMTggfSIKICAgICAgbmFtZT0iYmlvIgogICAgICB2LWJpbmQ9InZhbGlkYXRlSW5mb3MuYmlvIgogICAgPgogICAgICA8YS1tZW50aW9ucwogICAgICAgIHYtbW9kZWw6dmFsdWU9Im1vZGVsUmVmLmJpbyIKICAgICAgICByb3dzPSIzIgogICAgICAgIHBsYWNlaG9sZGVyPSJZb3UgY2FuIHVzZSBAIHRvIHJlZiB1c2VyIGhlcmUiCiAgICAgID4KICAgICAgICA8YS1tZW50aW9ucy1vcHRpb24gdmFsdWU9ImFmYzE2MyI+YWZjMTYzPC9hLW1lbnRpb25zLW9wdGlvbj4KICAgICAgICA8YS1tZW50aW9ucy1vcHRpb24gdmFsdWU9InpvbWJpZUoiPnpvbWJpZUo8L2EtbWVudGlvbnMtb3B0aW9uPgogICAgICAgIDxhLW1lbnRpb25zLW9wdGlvbiB2YWx1ZT0ieWVzbWVjayI+eWVzbWVjazwvYS1tZW50aW9ucy1vcHRpb24+CiAgICAgIDwvYS1tZW50aW9ucz4KICAgIDwvYS1mb3JtLWl0ZW0+CiAgICA8YS1mb3JtLWl0ZW0gOndyYXBwZXItY29sPSJ7IHNwYW46IDEyLCBvZmZzZXQ6IDUgfSI+CiAgICAgIDxhLWJ1dHRvbiB0eXBlPSJwcmltYXJ5IiBAY2xpY2s9ImhhbmRsZVN1Ym1pdCI+U3VibWl0PC9hLWJ1dHRvbj4KICAgICAgPGEtYnV0dG9uIHN0eWxlPSJtYXJnaW4tbGVmdDogOHB4IiBAY2xpY2s9InJlc2V0RmllbGRzIj5SZXNldDwvYS1idXR0b24+CiAgICA8L2EtZm9ybS1pdGVtPgogIDwvYS1mb3JtPgo8L3RlbXBsYXRlPgo8c2NyaXB0PgppbXBvcnQgeyBNZW50aW9ucywgRm9ybSB9IGZyb20gJ2FudC1kZXNpZ24tdnVlJzsKaW1wb3J0IHsgZGVmaW5lQ29tcG9uZW50LCByZWFjdGl2ZSB9IGZyb20gJ3Z1ZSc7Cgpjb25zdCB1c2VGb3JtID0gRm9ybS51c2VGb3JtOwpjb25zdCB7IGdldE1lbnRpb25zIH0gPSBNZW50aW9uczsKZXhwb3J0IGRlZmF1bHQgZGVmaW5lQ29tcG9uZW50KHsKICBzZXR1cCgpIHsKICAgIGNvbnN0IGNoZWNrTWVudGlvbiA9IGFzeW5jIChydWxlLCB2YWx1ZSkgPT4gewogICAgICBjb25zdCBtZW50aW9ucyA9IGdldE1lbnRpb25zKHZhbHVlKTsKICAgICAgaWYgKG1lbnRpb25zLmxlbmd0aCA8IDIpIHsKICAgICAgICByZXR1cm4gUHJvbWlzZS5yZWplY3QoJ01vcmUgdGhhbiBvbmUgbXVzdCBiZSBzZWxlY3RlZCEnKTsKICAgICAgfSBlbHNlIHsKICAgICAgICByZXR1cm4gUHJvbWlzZS5yZXNvbHZlKCk7CiAgICAgIH0KICAgIH07CiAgICBjb25zdCBtb2RlbFJlZiA9IHJlYWN0aXZlKHsKICAgICAgYmlvOiAnJywKICAgICAgY29kZXJzOiAnJywKICAgIH0pOwogICAgY29uc3QgcnVsZXNSZWYgPSByZWFjdGl2ZSh7CiAgICAgIGJpbzogW3sgcmVxdWlyZWQ6IHRydWUsIG1lc3NhZ2U6ICdNdXN0IGlucHV0IGJpbycgfV0sCiAgICAgIGNvZGVyczogW3sgcmVxdWlyZWQ6IHRydWUsIHZhbGlkYXRvcjogY2hlY2tNZW50aW9uIH1dLAogICAgfSk7CiAgICBjb25zdCB7IHJlc2V0RmllbGRzLCB2YWxpZGF0ZSwgdmFsaWRhdGVJbmZvcyB9ID0gdXNlRm9ybShtb2RlbFJlZiwgcnVsZXNSZWYpOwogICAgY29uc3QgaGFuZGxlU3VibWl0ID0gZSA9PiB7CiAgICAgIGUucHJldmVudERlZmF1bHQoKTsKICAgICAgdmFsaWRhdGUoKQogICAgICAgIC50aGVuKCgpID0+IHsKICAgICAgICAgIGNvbnNvbGUubG9nKCdTdWJtaXQhISEnLCBtb2RlbFJlZik7CiAgICAgICAgfSkKICAgICAgICAuY2F0Y2goZXJyb3JzID0+IHsKICAgICAgICAgIGNvbnNvbGUubG9nKCdFcnJvcnMgaW4gdGhlIGZvcm0hISEnLCBlcnJvcnMpOwogICAgICAgIH0pOwogICAgfTsKICAgIHJldHVybiB7CiAgICAgIG1vZGVsUmVmLAogICAgICByZXNldEZpZWxkcywKICAgICAgdmFsaWRhdGVJbmZvcywKICAgICAgaGFuZGxlU3VibWl0LAogICAgfTsKICB9LAp9KTsKPC9zY3JpcHQ+Cgo=",jsSourceCode:"PHRlbXBsYXRlPgogIDxhLWZvcm0gbGF5b3V0PSJob3Jpem9udGFsIj4KICAgIDxhLWZvcm0taXRlbQogICAgICBsYWJlbD0iVG9wIGNvZGVycyIKICAgICAgOmxhYmVsLWNvbD0ieyBzcGFuOiA2IH0iCiAgICAgIDp3cmFwcGVyLWNvbD0ieyBzcGFuOiAxOCB9IgogICAgICBuYW1lPSJjb2RlcnMiCiAgICAgIHYtYmluZD0idmFsaWRhdGVJbmZvcy5jb2RlcnMiCiAgICA+CiAgICAgIDxhLW1lbnRpb25zIHYtbW9kZWw6dmFsdWU9Im1vZGVsUmVmLmNvZGVycyIgcm93cz0iMSI+CiAgICAgICAgPGEtbWVudGlvbnMtb3B0aW9uIHZhbHVlPSJhZmMxNjMiPmFmYzE2MzwvYS1tZW50aW9ucy1vcHRpb24+CiAgICAgICAgPGEtbWVudGlvbnMtb3B0aW9uIHZhbHVlPSJ6b21iaWVKIj56b21iaWVKPC9hLW1lbnRpb25zLW9wdGlvbj4KICAgICAgICA8YS1tZW50aW9ucy1vcHRpb24gdmFsdWU9Inllc21lY2siPnllc21lY2s8L2EtbWVudGlvbnMtb3B0aW9uPgogICAgICA8L2EtbWVudGlvbnM+CiAgICA8L2EtZm9ybS1pdGVtPgogICAgPGEtZm9ybS1pdGVtCiAgICAgIGxhYmVsPSJCaW8iCiAgICAgIDpsYWJlbC1jb2w9Insgc3BhbjogNiB9IgogICAgICA6d3JhcHBlci1jb2w9Insgc3BhbjogMTggfSIKICAgICAgbmFtZT0iYmlvIgogICAgICB2LWJpbmQ9InZhbGlkYXRlSW5mb3MuYmlvIgogICAgPgogICAgICA8YS1tZW50aW9ucwogICAgICAgIHYtbW9kZWw6dmFsdWU9Im1vZGVsUmVmLmJpbyIKICAgICAgICByb3dzPSIzIgogICAgICAgIHBsYWNlaG9sZGVyPSJZb3UgY2FuIHVzZSBAIHRvIHJlZiB1c2VyIGhlcmUiCiAgICAgID4KICAgICAgICA8YS1tZW50aW9ucy1vcHRpb24gdmFsdWU9ImFmYzE2MyI+YWZjMTYzPC9hLW1lbnRpb25zLW9wdGlvbj4KICAgICAgICA8YS1tZW50aW9ucy1vcHRpb24gdmFsdWU9InpvbWJpZUoiPnpvbWJpZUo8L2EtbWVudGlvbnMtb3B0aW9uPgogICAgICAgIDxhLW1lbnRpb25zLW9wdGlvbiB2YWx1ZT0ieWVzbWVjayI+eWVzbWVjazwvYS1tZW50aW9ucy1vcHRpb24+CiAgICAgIDwvYS1tZW50aW9ucz4KICAgIDwvYS1mb3JtLWl0ZW0+CiAgICA8YS1mb3JtLWl0ZW0gOndyYXBwZXItY29sPSJ7IHNwYW46IDEyLCBvZmZzZXQ6IDUgfSI+CiAgICAgIDxhLWJ1dHRvbiB0eXBlPSJwcmltYXJ5IiBAY2xpY2s9ImhhbmRsZVN1Ym1pdCI+U3VibWl0PC9hLWJ1dHRvbj4KICAgICAgPGEtYnV0dG9uIHN0eWxlPSJtYXJnaW4tbGVmdDogOHB4IiBAY2xpY2s9InJlc2V0RmllbGRzIj5SZXNldDwvYS1idXR0b24+CiAgICA8L2EtZm9ybS1pdGVtPgogIDwvYS1mb3JtPgo8L3RlbXBsYXRlPgo8c2NyaXB0PgppbXBvcnQgeyBNZW50aW9ucywgRm9ybSB9IGZyb20gJ2FudC1kZXNpZ24tdnVlJzsKaW1wb3J0IHsgZGVmaW5lQ29tcG9uZW50LCByZWFjdGl2ZSB9IGZyb20gJ3Z1ZSc7CmNvbnN0IHVzZUZvcm0gPSBGb3JtLnVzZUZvcm07CmNvbnN0IHsKICBnZXRNZW50aW9ucywKfSA9IE1lbnRpb25zOwpleHBvcnQgZGVmYXVsdCBkZWZpbmVDb21wb25lbnQoewogIHNldHVwKCkgewogICAgY29uc3QgY2hlY2tNZW50aW9uID0gYXN5bmMgKHJ1bGUsIHZhbHVlKSA9PiB7CiAgICAgIGNvbnN0IG1lbnRpb25zID0gZ2V0TWVudGlvbnModmFsdWUpOwogICAgICBpZiAobWVudGlvbnMubGVuZ3RoIDwgMikgewogICAgICAgIHJldHVybiBQcm9taXNlLnJlamVjdCgnTW9yZSB0aGFuIG9uZSBtdXN0IGJlIHNlbGVjdGVkIScpOwogICAgICB9IGVsc2UgewogICAgICAgIHJldHVybiBQcm9taXNlLnJlc29sdmUoKTsKICAgICAgfQogICAgfTsKICAgIGNvbnN0IG1vZGVsUmVmID0gcmVhY3RpdmUoewogICAgICBiaW86ICcnLAogICAgICBjb2RlcnM6ICcnLAogICAgfSk7CiAgICBjb25zdCBydWxlc1JlZiA9IHJlYWN0aXZlKHsKICAgICAgYmlvOiBbewogICAgICAgIHJlcXVpcmVkOiB0cnVlLAogICAgICAgIG1lc3NhZ2U6ICdNdXN0IGlucHV0IGJpbycsCiAgICAgIH1dLAogICAgICBjb2RlcnM6IFt7CiAgICAgICAgcmVxdWlyZWQ6IHRydWUsCiAgICAgICAgdmFsaWRhdG9yOiBjaGVja01lbnRpb24sCiAgICAgIH1dLAogICAgfSk7CiAgICBjb25zdCB7CiAgICAgIHJlc2V0RmllbGRzLAogICAgICB2YWxpZGF0ZSwKICAgICAgdmFsaWRhdGVJbmZvcywKICAgIH0gPSB1c2VGb3JtKG1vZGVsUmVmLCBydWxlc1JlZik7CiAgICBjb25zdCBoYW5kbGVTdWJtaXQgPSBlID0+IHsKICAgICAgZS5wcmV2ZW50RGVmYXVsdCgpOwogICAgICB2YWxpZGF0ZSgpLnRoZW4oKCkgPT4gewogICAgICAgIGNvbnNvbGUubG9nKCdTdWJtaXQhISEnLCBtb2RlbFJlZik7CiAgICAgIH0pLmNhdGNoKGVycm9ycyA9PiB7CiAgICAgICAgY29uc29sZS5sb2coJ0Vycm9ycyBpbiB0aGUgZm9ybSEhIScsIGVycm9ycyk7CiAgICAgIH0pOwogICAgfTsKICAgIHJldHVybiB7CiAgICAgIG1vZGVsUmVmLAogICAgICByZXNldEZpZWxkcywKICAgICAgdmFsaWRhdGVJbmZvcywKICAgICAgaGFuZGxlU3VibWl0LAogICAgfTsKICB9LAp9KTsKPC9zY3JpcHQ+"}},{default:o(()=>[c(A,{layout:"horizontal"},{default:o(()=>[c(k,G({label:"Top coders","label-col":{span:6},"wrapper-col":{span:18},name:"coders"},s.validateInfos.coders),{default:o(()=>[c(u,{value:s.modelRef.coders,"onUpdate:value":a[0]||(a[0]=f=>s.modelRef.coders=f),rows:"1"},{default:o(()=>[c(e,{value:"afc163"},{default:o(()=>a[2]||(a[2]=[t("afc163")])),_:1,__:[2]}),c(e,{value:"zombieJ"},{default:o(()=>a[3]||(a[3]=[t("zombieJ")])),_:1,__:[3]}),c(e,{value:"yesmeck"},{default:o(()=>a[4]||(a[4]=[t("yesmeck")])),_:1,__:[4]})]),_:1},8,["value"])]),_:1},16),c(k,G({label:"Bio","label-col":{span:6},"wrapper-col":{span:18},name:"bio"},s.validateInfos.bio),{default:o(()=>[c(u,{value:s.modelRef.bio,"onUpdate:value":a[1]||(a[1]=f=>s.modelRef.bio=f),rows:"3",placeholder:"You can use @ to ref user here"},{default:o(()=>[c(e,{value:"afc163"},{default:o(()=>a[5]||(a[5]=[t("afc163")])),_:1,__:[5]}),c(e,{value:"zombieJ"},{default:o(()=>a[6]||(a[6]=[t("zombieJ")])),_:1,__:[6]}),c(e,{value:"yesmeck"},{default:o(()=>a[7]||(a[7]=[t("yesmeck")])),_:1,__:[7]})]),_:1},8,["value"])]),_:1},16),c(k,{"wrapper-col":{span:12,offset:5}},{default:o(()=>[c(p,{type:"primary",onClick:s.handleSubmit},{default:o(()=>a[8]||(a[8]=[t("Submit")])),_:1,__:[8]},8,["onClick"]),c(p,{style:{"margin-left":"8px"},onClick:s.resetFields},{default:o(()=>a[9]||(a[9]=[t("Reset")])),_:1,__:[9]},8,["onClick"])]),_:1})]),_:1})]),htmlCode:o(()=>a[10]||(a[10]=[n("pre",{class:"language-vue"},[n("code",null,[n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),t("template")]),n("span",{class:"token punctuation"},">")]),t(`
  `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),t("a-form")]),t(),n("span",{class:"token attr-name"},"layout"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),t("horizontal"),n("span",{class:"token punctuation"},'"')]),n("span",{class:"token punctuation"},">")]),t(`
    `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),t("a-form-item")]),t(`
      `),n("span",{class:"token attr-name"},"label"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),t("Top coders"),n("span",{class:"token punctuation"},'"')]),t(`
      `),n("span",{class:"token attr-name"},":label-col"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),t("{ span: 6 }"),n("span",{class:"token punctuation"},'"')]),t(`
      `),n("span",{class:"token attr-name"},":wrapper-col"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),t("{ span: 18 }"),n("span",{class:"token punctuation"},'"')]),t(`
      `),n("span",{class:"token attr-name"},"name"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),t("coders"),n("span",{class:"token punctuation"},'"')]),t(`
      `),n("span",{class:"token attr-name"},"v-bind"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),t("validateInfos.coders"),n("span",{class:"token punctuation"},'"')]),t(`
    `),n("span",{class:"token punctuation"},">")]),t(`
      `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),t("a-mentions")]),t(),n("span",{class:"token attr-name"},[n("span",{class:"token namespace"},"v-model:"),t("value")]),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),t("modelRef.coders"),n("span",{class:"token punctuation"},'"')]),t(),n("span",{class:"token attr-name"},"rows"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),t("1"),n("span",{class:"token punctuation"},'"')]),n("span",{class:"token punctuation"},">")]),t(`
        `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),t("a-mentions-option")]),t(),n("span",{class:"token attr-name"},"value"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),t("afc163"),n("span",{class:"token punctuation"},'"')]),n("span",{class:"token punctuation"},">")]),t("afc163"),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"</"),t("a-mentions-option")]),n("span",{class:"token punctuation"},">")]),t(`
        `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),t("a-mentions-option")]),t(),n("span",{class:"token attr-name"},"value"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),t("zombieJ"),n("span",{class:"token punctuation"},'"')]),n("span",{class:"token punctuation"},">")]),t("zombieJ"),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"</"),t("a-mentions-option")]),n("span",{class:"token punctuation"},">")]),t(`
        `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),t("a-mentions-option")]),t(),n("span",{class:"token attr-name"},"value"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),t("yesmeck"),n("span",{class:"token punctuation"},'"')]),n("span",{class:"token punctuation"},">")]),t("yesmeck"),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"</"),t("a-mentions-option")]),n("span",{class:"token punctuation"},">")]),t(`
      `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"</"),t("a-mentions")]),n("span",{class:"token punctuation"},">")]),t(`
    `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"</"),t("a-form-item")]),n("span",{class:"token punctuation"},">")]),t(`
    `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),t("a-form-item")]),t(`
      `),n("span",{class:"token attr-name"},"label"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),t("Bio"),n("span",{class:"token punctuation"},'"')]),t(`
      `),n("span",{class:"token attr-name"},":label-col"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),t("{ span: 6 }"),n("span",{class:"token punctuation"},'"')]),t(`
      `),n("span",{class:"token attr-name"},":wrapper-col"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),t("{ span: 18 }"),n("span",{class:"token punctuation"},'"')]),t(`
      `),n("span",{class:"token attr-name"},"name"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),t("bio"),n("span",{class:"token punctuation"},'"')]),t(`
      `),n("span",{class:"token attr-name"},"v-bind"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),t("validateInfos.bio"),n("span",{class:"token punctuation"},'"')]),t(`
    `),n("span",{class:"token punctuation"},">")]),t(`
      `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),t("a-mentions")]),t(`
        `),n("span",{class:"token attr-name"},[n("span",{class:"token namespace"},"v-model:"),t("value")]),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),t("modelRef.bio"),n("span",{class:"token punctuation"},'"')]),t(`
        `),n("span",{class:"token attr-name"},"rows"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),t("3"),n("span",{class:"token punctuation"},'"')]),t(`
        `),n("span",{class:"token attr-name"},"placeholder"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),t("You can use @ to ref user here"),n("span",{class:"token punctuation"},'"')]),t(`
      `),n("span",{class:"token punctuation"},">")]),t(`
        `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),t("a-mentions-option")]),t(),n("span",{class:"token attr-name"},"value"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),t("afc163"),n("span",{class:"token punctuation"},'"')]),n("span",{class:"token punctuation"},">")]),t("afc163"),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"</"),t("a-mentions-option")]),n("span",{class:"token punctuation"},">")]),t(`
        `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),t("a-mentions-option")]),t(),n("span",{class:"token attr-name"},"value"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),t("zombieJ"),n("span",{class:"token punctuation"},'"')]),n("span",{class:"token punctuation"},">")]),t("zombieJ"),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"</"),t("a-mentions-option")]),n("span",{class:"token punctuation"},">")]),t(`
        `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),t("a-mentions-option")]),t(),n("span",{class:"token attr-name"},"value"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),t("yesmeck"),n("span",{class:"token punctuation"},'"')]),n("span",{class:"token punctuation"},">")]),t("yesmeck"),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"</"),t("a-mentions-option")]),n("span",{class:"token punctuation"},">")]),t(`
      `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"</"),t("a-mentions")]),n("span",{class:"token punctuation"},">")]),t(`
    `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"</"),t("a-form-item")]),n("span",{class:"token punctuation"},">")]),t(`
    `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),t("a-form-item")]),t(),n("span",{class:"token attr-name"},":wrapper-col"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),t("{ span: 12, offset: 5 }"),n("span",{class:"token punctuation"},'"')]),n("span",{class:"token punctuation"},">")]),t(`
      `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),t("a-button")]),t(),n("span",{class:"token attr-name"},"type"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),t("primary"),n("span",{class:"token punctuation"},'"')]),t(),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"},'"'),t("handleSubmit"),n("span",{class:"token punctuation"},'"')]),n("span",{class:"token punctuation"},">")]),t("Submit"),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"</"),t("a-button")]),n("span",{class:"token punctuation"},">")]),t(`
      `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),t("a-button")]),t(),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-left"),n("span",{class:"token punctuation"},":"),t(" 8px")]),n("span",{class:"token punctuation"},'"')])]),t(),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"},'"'),t("resetFields"),n("span",{class:"token punctuation"},'"')]),n("span",{class:"token punctuation"},">")]),t("Reset"),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"</"),t("a-button")]),n("span",{class:"token punctuation"},">")]),t(`
    `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"</"),t("a-form-item")]),n("span",{class:"token punctuation"},">")]),t(`
  `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"</"),t("a-form")]),n("span",{class:"token punctuation"},">")]),t(`
`),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"</"),t("template")]),n("span",{class:"token punctuation"},">")]),t(`
`),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),t("script")]),n("span",{class:"token punctuation"},">")]),n("span",{class:"token script"},[n("span",{class:"token language-javascript"},[t(`
`),n("span",{class:"token keyword"},"import"),t(),n("span",{class:"token punctuation"},"{"),t(" Mentions"),n("span",{class:"token punctuation"},","),t(" Form "),n("span",{class:"token punctuation"},"}"),t(),n("span",{class:"token keyword"},"from"),t(),n("span",{class:"token string"},"'ant-design-vue'"),n("span",{class:"token punctuation"},";"),t(`
`),n("span",{class:"token keyword"},"import"),t(),n("span",{class:"token punctuation"},"{"),t(" defineComponent"),n("span",{class:"token punctuation"},","),t(" reactive "),n("span",{class:"token punctuation"},"}"),t(),n("span",{class:"token keyword"},"from"),t(),n("span",{class:"token string"},"'vue'"),n("span",{class:"token punctuation"},";"),t(`

`),n("span",{class:"token keyword"},"const"),t(" useForm "),n("span",{class:"token operator"},"="),t(" Form"),n("span",{class:"token punctuation"},"."),t("useForm"),n("span",{class:"token punctuation"},";"),t(`
`),n("span",{class:"token keyword"},"const"),t(),n("span",{class:"token punctuation"},"{"),t(" getMentions "),n("span",{class:"token punctuation"},"}"),t(),n("span",{class:"token operator"},"="),t(" Mentions"),n("span",{class:"token punctuation"},";"),t(`
`),n("span",{class:"token keyword"},"export"),t(),n("span",{class:"token keyword"},"default"),t(),n("span",{class:"token function"},"defineComponent"),n("span",{class:"token punctuation"},"("),n("span",{class:"token punctuation"},"{"),t(`
  `),n("span",{class:"token function"},"setup"),n("span",{class:"token punctuation"},"("),n("span",{class:"token punctuation"},")"),t(),n("span",{class:"token punctuation"},"{"),t(`
    `),n("span",{class:"token keyword"},"const"),t(),n("span",{class:"token function-variable function"},"checkMention"),t(),n("span",{class:"token operator"},"="),t(),n("span",{class:"token keyword"},"async"),t(),n("span",{class:"token punctuation"},"("),n("span",{class:"token parameter"},[t("rule"),n("span",{class:"token punctuation"},","),t(" value")]),n("span",{class:"token punctuation"},")"),t(),n("span",{class:"token operator"},"=>"),t(),n("span",{class:"token punctuation"},"{"),t(`
      `),n("span",{class:"token keyword"},"const"),t(" mentions "),n("span",{class:"token operator"},"="),t(),n("span",{class:"token function"},"getMentions"),n("span",{class:"token punctuation"},"("),t("value"),n("span",{class:"token punctuation"},")"),n("span",{class:"token punctuation"},";"),t(`
      `),n("span",{class:"token keyword"},"if"),t(),n("span",{class:"token punctuation"},"("),t("mentions"),n("span",{class:"token punctuation"},"."),t("length "),n("span",{class:"token operator"},"<"),t(),n("span",{class:"token number"},"2"),n("span",{class:"token punctuation"},")"),t(),n("span",{class:"token punctuation"},"{"),t(`
        `),n("span",{class:"token keyword"},"return"),t(" Promise"),n("span",{class:"token punctuation"},"."),n("span",{class:"token function"},"reject"),n("span",{class:"token punctuation"},"("),n("span",{class:"token string"},"'More than one must be selected!'"),n("span",{class:"token punctuation"},")"),n("span",{class:"token punctuation"},";"),t(`
      `),n("span",{class:"token punctuation"},"}"),t(),n("span",{class:"token keyword"},"else"),t(),n("span",{class:"token punctuation"},"{"),t(`
        `),n("span",{class:"token keyword"},"return"),t(" Promise"),n("span",{class:"token punctuation"},"."),n("span",{class:"token function"},"resolve"),n("span",{class:"token punctuation"},"("),n("span",{class:"token punctuation"},")"),n("span",{class:"token punctuation"},";"),t(`
      `),n("span",{class:"token punctuation"},"}"),t(`
    `),n("span",{class:"token punctuation"},"}"),n("span",{class:"token punctuation"},";"),t(`
    `),n("span",{class:"token keyword"},"const"),t(" modelRef "),n("span",{class:"token operator"},"="),t(),n("span",{class:"token function"},"reactive"),n("span",{class:"token punctuation"},"("),n("span",{class:"token punctuation"},"{"),t(`
      `),n("span",{class:"token literal-property property"},"bio"),n("span",{class:"token operator"},":"),t(),n("span",{class:"token string"},"''"),n("span",{class:"token punctuation"},","),t(`
      `),n("span",{class:"token literal-property property"},"coders"),n("span",{class:"token operator"},":"),t(),n("span",{class:"token string"},"''"),n("span",{class:"token punctuation"},","),t(`
    `),n("span",{class:"token punctuation"},"}"),n("span",{class:"token punctuation"},")"),n("span",{class:"token punctuation"},";"),t(`
    `),n("span",{class:"token keyword"},"const"),t(" rulesRef "),n("span",{class:"token operator"},"="),t(),n("span",{class:"token function"},"reactive"),n("span",{class:"token punctuation"},"("),n("span",{class:"token punctuation"},"{"),t(`
      `),n("span",{class:"token literal-property property"},"bio"),n("span",{class:"token operator"},":"),t(),n("span",{class:"token punctuation"},"["),n("span",{class:"token punctuation"},"{"),t(),n("span",{class:"token literal-property property"},"required"),n("span",{class:"token operator"},":"),t(),n("span",{class:"token boolean"},"true"),n("span",{class:"token punctuation"},","),t(),n("span",{class:"token literal-property property"},"message"),n("span",{class:"token operator"},":"),t(),n("span",{class:"token string"},"'Must input bio'"),t(),n("span",{class:"token punctuation"},"}"),n("span",{class:"token punctuation"},"]"),n("span",{class:"token punctuation"},","),t(`
      `),n("span",{class:"token literal-property property"},"coders"),n("span",{class:"token operator"},":"),t(),n("span",{class:"token punctuation"},"["),n("span",{class:"token punctuation"},"{"),t(),n("span",{class:"token literal-property property"},"required"),n("span",{class:"token operator"},":"),t(),n("span",{class:"token boolean"},"true"),n("span",{class:"token punctuation"},","),t(),n("span",{class:"token literal-property property"},"validator"),n("span",{class:"token operator"},":"),t(" checkMention "),n("span",{class:"token punctuation"},"}"),n("span",{class:"token punctuation"},"]"),n("span",{class:"token punctuation"},","),t(`
    `),n("span",{class:"token punctuation"},"}"),n("span",{class:"token punctuation"},")"),n("span",{class:"token punctuation"},";"),t(`
    `),n("span",{class:"token keyword"},"const"),t(),n("span",{class:"token punctuation"},"{"),t(" resetFields"),n("span",{class:"token punctuation"},","),t(" validate"),n("span",{class:"token punctuation"},","),t(" validateInfos "),n("span",{class:"token punctuation"},"}"),t(),n("span",{class:"token operator"},"="),t(),n("span",{class:"token function"},"useForm"),n("span",{class:"token punctuation"},"("),t("modelRef"),n("span",{class:"token punctuation"},","),t(" rulesRef"),n("span",{class:"token punctuation"},")"),n("span",{class:"token punctuation"},";"),t(`
    `),n("span",{class:"token keyword"},"const"),t(),n("span",{class:"token function-variable function"},"handleSubmit"),t(),n("span",{class:"token operator"},"="),t(),n("span",{class:"token parameter"},"e"),t(),n("span",{class:"token operator"},"=>"),t(),n("span",{class:"token punctuation"},"{"),t(`
      e`),n("span",{class:"token punctuation"},"."),n("span",{class:"token function"},"preventDefault"),n("span",{class:"token punctuation"},"("),n("span",{class:"token punctuation"},")"),n("span",{class:"token punctuation"},";"),t(`
      `),n("span",{class:"token function"},"validate"),n("span",{class:"token punctuation"},"("),n("span",{class:"token punctuation"},")"),t(`
        `),n("span",{class:"token punctuation"},"."),n("span",{class:"token function"},"then"),n("span",{class:"token punctuation"},"("),n("span",{class:"token punctuation"},"("),n("span",{class:"token punctuation"},")"),t(),n("span",{class:"token operator"},"=>"),t(),n("span",{class:"token punctuation"},"{"),t(`
          console`),n("span",{class:"token punctuation"},"."),n("span",{class:"token function"},"log"),n("span",{class:"token punctuation"},"("),n("span",{class:"token string"},"'Submit!!!'"),n("span",{class:"token punctuation"},","),t(" modelRef"),n("span",{class:"token punctuation"},")"),n("span",{class:"token punctuation"},";"),t(`
        `),n("span",{class:"token punctuation"},"}"),n("span",{class:"token punctuation"},")"),t(`
        `),n("span",{class:"token punctuation"},"."),n("span",{class:"token function"},"catch"),n("span",{class:"token punctuation"},"("),n("span",{class:"token parameter"},"errors"),t(),n("span",{class:"token operator"},"=>"),t(),n("span",{class:"token punctuation"},"{"),t(`
          console`),n("span",{class:"token punctuation"},"."),n("span",{class:"token function"},"log"),n("span",{class:"token punctuation"},"("),n("span",{class:"token string"},"'Errors in the form!!!'"),n("span",{class:"token punctuation"},","),t(" errors"),n("span",{class:"token punctuation"},")"),n("span",{class:"token punctuation"},";"),t(`
        `),n("span",{class:"token punctuation"},"}"),n("span",{class:"token punctuation"},")"),n("span",{class:"token punctuation"},";"),t(`
    `),n("span",{class:"token punctuation"},"}"),n("span",{class:"token punctuation"},";"),t(`
    `),n("span",{class:"token keyword"},"return"),t(),n("span",{class:"token punctuation"},"{"),t(`
      modelRef`),n("span",{class:"token punctuation"},","),t(`
      resetFields`),n("span",{class:"token punctuation"},","),t(`
      validateInfos`),n("span",{class:"token punctuation"},","),t(`
      handleSubmit`),n("span",{class:"token punctuation"},","),t(`
    `),n("span",{class:"token punctuation"},"}"),n("span",{class:"token punctuation"},";"),t(`
  `),n("span",{class:"token punctuation"},"}"),n("span",{class:"token punctuation"},","),t(`
`),n("span",{class:"token punctuation"},"}"),n("span",{class:"token punctuation"},")"),n("span",{class:"token punctuation"},";"),t(`
`)])]),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"</"),t("script")]),n("span",{class:"token punctuation"},">")]),t(`
`)])],-1)])),jsVersionHtml:o(()=>a[11]||(a[11]=[n("pre",{class:"language-vue"},[n("code",null,[n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),t("template")]),n("span",{class:"token punctuation"},">")]),t(`
  `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),t("a-form")]),t(),n("span",{class:"token attr-name"},"layout"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),t("horizontal"),n("span",{class:"token punctuation"},'"')]),n("span",{class:"token punctuation"},">")]),t(`
    `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),t("a-form-item")]),t(`
      `),n("span",{class:"token attr-name"},"label"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),t("Top coders"),n("span",{class:"token punctuation"},'"')]),t(`
      `),n("span",{class:"token attr-name"},":label-col"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),t("{ span: 6 }"),n("span",{class:"token punctuation"},'"')]),t(`
      `),n("span",{class:"token attr-name"},":wrapper-col"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),t("{ span: 18 }"),n("span",{class:"token punctuation"},'"')]),t(`
      `),n("span",{class:"token attr-name"},"name"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),t("coders"),n("span",{class:"token punctuation"},'"')]),t(`
      `),n("span",{class:"token attr-name"},"v-bind"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),t("validateInfos.coders"),n("span",{class:"token punctuation"},'"')]),t(`
    `),n("span",{class:"token punctuation"},">")]),t(`
      `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),t("a-mentions")]),t(),n("span",{class:"token attr-name"},[n("span",{class:"token namespace"},"v-model:"),t("value")]),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),t("modelRef.coders"),n("span",{class:"token punctuation"},'"')]),t(),n("span",{class:"token attr-name"},"rows"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),t("1"),n("span",{class:"token punctuation"},'"')]),n("span",{class:"token punctuation"},">")]),t(`
        `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),t("a-mentions-option")]),t(),n("span",{class:"token attr-name"},"value"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),t("afc163"),n("span",{class:"token punctuation"},'"')]),n("span",{class:"token punctuation"},">")]),t("afc163"),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"</"),t("a-mentions-option")]),n("span",{class:"token punctuation"},">")]),t(`
        `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),t("a-mentions-option")]),t(),n("span",{class:"token attr-name"},"value"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),t("zombieJ"),n("span",{class:"token punctuation"},'"')]),n("span",{class:"token punctuation"},">")]),t("zombieJ"),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"</"),t("a-mentions-option")]),n("span",{class:"token punctuation"},">")]),t(`
        `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),t("a-mentions-option")]),t(),n("span",{class:"token attr-name"},"value"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),t("yesmeck"),n("span",{class:"token punctuation"},'"')]),n("span",{class:"token punctuation"},">")]),t("yesmeck"),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"</"),t("a-mentions-option")]),n("span",{class:"token punctuation"},">")]),t(`
      `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"</"),t("a-mentions")]),n("span",{class:"token punctuation"},">")]),t(`
    `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"</"),t("a-form-item")]),n("span",{class:"token punctuation"},">")]),t(`
    `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),t("a-form-item")]),t(`
      `),n("span",{class:"token attr-name"},"label"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),t("Bio"),n("span",{class:"token punctuation"},'"')]),t(`
      `),n("span",{class:"token attr-name"},":label-col"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),t("{ span: 6 }"),n("span",{class:"token punctuation"},'"')]),t(`
      `),n("span",{class:"token attr-name"},":wrapper-col"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),t("{ span: 18 }"),n("span",{class:"token punctuation"},'"')]),t(`
      `),n("span",{class:"token attr-name"},"name"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),t("bio"),n("span",{class:"token punctuation"},'"')]),t(`
      `),n("span",{class:"token attr-name"},"v-bind"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),t("validateInfos.bio"),n("span",{class:"token punctuation"},'"')]),t(`
    `),n("span",{class:"token punctuation"},">")]),t(`
      `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),t("a-mentions")]),t(`
        `),n("span",{class:"token attr-name"},[n("span",{class:"token namespace"},"v-model:"),t("value")]),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),t("modelRef.bio"),n("span",{class:"token punctuation"},'"')]),t(`
        `),n("span",{class:"token attr-name"},"rows"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),t("3"),n("span",{class:"token punctuation"},'"')]),t(`
        `),n("span",{class:"token attr-name"},"placeholder"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),t("You can use @ to ref user here"),n("span",{class:"token punctuation"},'"')]),t(`
      `),n("span",{class:"token punctuation"},">")]),t(`
        `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),t("a-mentions-option")]),t(),n("span",{class:"token attr-name"},"value"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),t("afc163"),n("span",{class:"token punctuation"},'"')]),n("span",{class:"token punctuation"},">")]),t("afc163"),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"</"),t("a-mentions-option")]),n("span",{class:"token punctuation"},">")]),t(`
        `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),t("a-mentions-option")]),t(),n("span",{class:"token attr-name"},"value"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),t("zombieJ"),n("span",{class:"token punctuation"},'"')]),n("span",{class:"token punctuation"},">")]),t("zombieJ"),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"</"),t("a-mentions-option")]),n("span",{class:"token punctuation"},">")]),t(`
        `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),t("a-mentions-option")]),t(),n("span",{class:"token attr-name"},"value"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),t("yesmeck"),n("span",{class:"token punctuation"},'"')]),n("span",{class:"token punctuation"},">")]),t("yesmeck"),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"</"),t("a-mentions-option")]),n("span",{class:"token punctuation"},">")]),t(`
      `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"</"),t("a-mentions")]),n("span",{class:"token punctuation"},">")]),t(`
    `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"</"),t("a-form-item")]),n("span",{class:"token punctuation"},">")]),t(`
    `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),t("a-form-item")]),t(),n("span",{class:"token attr-name"},":wrapper-col"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),t("{ span: 12, offset: 5 }"),n("span",{class:"token punctuation"},'"')]),n("span",{class:"token punctuation"},">")]),t(`
      `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),t("a-button")]),t(),n("span",{class:"token attr-name"},"type"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),t("primary"),n("span",{class:"token punctuation"},'"')]),t(),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"},'"'),t("handleSubmit"),n("span",{class:"token punctuation"},'"')]),n("span",{class:"token punctuation"},">")]),t("Submit"),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"</"),t("a-button")]),n("span",{class:"token punctuation"},">")]),t(`
      `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),t("a-button")]),t(),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-left"),n("span",{class:"token punctuation"},":"),t(" 8px")]),n("span",{class:"token punctuation"},'"')])]),t(),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"},'"'),t("resetFields"),n("span",{class:"token punctuation"},'"')]),n("span",{class:"token punctuation"},">")]),t("Reset"),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"</"),t("a-button")]),n("span",{class:"token punctuation"},">")]),t(`
    `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"</"),t("a-form-item")]),n("span",{class:"token punctuation"},">")]),t(`
  `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"</"),t("a-form")]),n("span",{class:"token punctuation"},">")]),t(`
`),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"</"),t("template")]),n("span",{class:"token punctuation"},">")]),t(`
`),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),t("script")]),n("span",{class:"token punctuation"},">")]),n("span",{class:"token script"},[n("span",{class:"token language-javascript"},[t(`
`),n("span",{class:"token keyword"},"import"),t(),n("span",{class:"token punctuation"},"{"),t(" Mentions"),n("span",{class:"token punctuation"},","),t(" Form "),n("span",{class:"token punctuation"},"}"),t(),n("span",{class:"token keyword"},"from"),t(),n("span",{class:"token string"},"'ant-design-vue'"),n("span",{class:"token punctuation"},";"),t(`
`),n("span",{class:"token keyword"},"import"),t(),n("span",{class:"token punctuation"},"{"),t(" defineComponent"),n("span",{class:"token punctuation"},","),t(" reactive "),n("span",{class:"token punctuation"},"}"),t(),n("span",{class:"token keyword"},"from"),t(),n("span",{class:"token string"},"'vue'"),n("span",{class:"token punctuation"},";"),t(`
`),n("span",{class:"token keyword"},"const"),t(" useForm "),n("span",{class:"token operator"},"="),t(" Form"),n("span",{class:"token punctuation"},"."),t("useForm"),n("span",{class:"token punctuation"},";"),t(`
`),n("span",{class:"token keyword"},"const"),t(),n("span",{class:"token punctuation"},"{"),t(`
  getMentions`),n("span",{class:"token punctuation"},","),t(`
`),n("span",{class:"token punctuation"},"}"),t(),n("span",{class:"token operator"},"="),t(" Mentions"),n("span",{class:"token punctuation"},";"),t(`
`),n("span",{class:"token keyword"},"export"),t(),n("span",{class:"token keyword"},"default"),t(),n("span",{class:"token function"},"defineComponent"),n("span",{class:"token punctuation"},"("),n("span",{class:"token punctuation"},"{"),t(`
  `),n("span",{class:"token function"},"setup"),n("span",{class:"token punctuation"},"("),n("span",{class:"token punctuation"},")"),t(),n("span",{class:"token punctuation"},"{"),t(`
    `),n("span",{class:"token keyword"},"const"),t(),n("span",{class:"token function-variable function"},"checkMention"),t(),n("span",{class:"token operator"},"="),t(),n("span",{class:"token keyword"},"async"),t(),n("span",{class:"token punctuation"},"("),n("span",{class:"token parameter"},[t("rule"),n("span",{class:"token punctuation"},","),t(" value")]),n("span",{class:"token punctuation"},")"),t(),n("span",{class:"token operator"},"=>"),t(),n("span",{class:"token punctuation"},"{"),t(`
      `),n("span",{class:"token keyword"},"const"),t(" mentions "),n("span",{class:"token operator"},"="),t(),n("span",{class:"token function"},"getMentions"),n("span",{class:"token punctuation"},"("),t("value"),n("span",{class:"token punctuation"},")"),n("span",{class:"token punctuation"},";"),t(`
      `),n("span",{class:"token keyword"},"if"),t(),n("span",{class:"token punctuation"},"("),t("mentions"),n("span",{class:"token punctuation"},"."),t("length "),n("span",{class:"token operator"},"<"),t(),n("span",{class:"token number"},"2"),n("span",{class:"token punctuation"},")"),t(),n("span",{class:"token punctuation"},"{"),t(`
        `),n("span",{class:"token keyword"},"return"),t(" Promise"),n("span",{class:"token punctuation"},"."),n("span",{class:"token function"},"reject"),n("span",{class:"token punctuation"},"("),n("span",{class:"token string"},"'More than one must be selected!'"),n("span",{class:"token punctuation"},")"),n("span",{class:"token punctuation"},";"),t(`
      `),n("span",{class:"token punctuation"},"}"),t(),n("span",{class:"token keyword"},"else"),t(),n("span",{class:"token punctuation"},"{"),t(`
        `),n("span",{class:"token keyword"},"return"),t(" Promise"),n("span",{class:"token punctuation"},"."),n("span",{class:"token function"},"resolve"),n("span",{class:"token punctuation"},"("),n("span",{class:"token punctuation"},")"),n("span",{class:"token punctuation"},";"),t(`
      `),n("span",{class:"token punctuation"},"}"),t(`
    `),n("span",{class:"token punctuation"},"}"),n("span",{class:"token punctuation"},";"),t(`
    `),n("span",{class:"token keyword"},"const"),t(" modelRef "),n("span",{class:"token operator"},"="),t(),n("span",{class:"token function"},"reactive"),n("span",{class:"token punctuation"},"("),n("span",{class:"token punctuation"},"{"),t(`
      `),n("span",{class:"token literal-property property"},"bio"),n("span",{class:"token operator"},":"),t(),n("span",{class:"token string"},"''"),n("span",{class:"token punctuation"},","),t(`
      `),n("span",{class:"token literal-property property"},"coders"),n("span",{class:"token operator"},":"),t(),n("span",{class:"token string"},"''"),n("span",{class:"token punctuation"},","),t(`
    `),n("span",{class:"token punctuation"},"}"),n("span",{class:"token punctuation"},")"),n("span",{class:"token punctuation"},";"),t(`
    `),n("span",{class:"token keyword"},"const"),t(" rulesRef "),n("span",{class:"token operator"},"="),t(),n("span",{class:"token function"},"reactive"),n("span",{class:"token punctuation"},"("),n("span",{class:"token punctuation"},"{"),t(`
      `),n("span",{class:"token literal-property property"},"bio"),n("span",{class:"token operator"},":"),t(),n("span",{class:"token punctuation"},"["),n("span",{class:"token punctuation"},"{"),t(`
        `),n("span",{class:"token literal-property property"},"required"),n("span",{class:"token operator"},":"),t(),n("span",{class:"token boolean"},"true"),n("span",{class:"token punctuation"},","),t(`
        `),n("span",{class:"token literal-property property"},"message"),n("span",{class:"token operator"},":"),t(),n("span",{class:"token string"},"'Must input bio'"),n("span",{class:"token punctuation"},","),t(`
      `),n("span",{class:"token punctuation"},"}"),n("span",{class:"token punctuation"},"]"),n("span",{class:"token punctuation"},","),t(`
      `),n("span",{class:"token literal-property property"},"coders"),n("span",{class:"token operator"},":"),t(),n("span",{class:"token punctuation"},"["),n("span",{class:"token punctuation"},"{"),t(`
        `),n("span",{class:"token literal-property property"},"required"),n("span",{class:"token operator"},":"),t(),n("span",{class:"token boolean"},"true"),n("span",{class:"token punctuation"},","),t(`
        `),n("span",{class:"token literal-property property"},"validator"),n("span",{class:"token operator"},":"),t(" checkMention"),n("span",{class:"token punctuation"},","),t(`
      `),n("span",{class:"token punctuation"},"}"),n("span",{class:"token punctuation"},"]"),n("span",{class:"token punctuation"},","),t(`
    `),n("span",{class:"token punctuation"},"}"),n("span",{class:"token punctuation"},")"),n("span",{class:"token punctuation"},";"),t(`
    `),n("span",{class:"token keyword"},"const"),t(),n("span",{class:"token punctuation"},"{"),t(`
      resetFields`),n("span",{class:"token punctuation"},","),t(`
      validate`),n("span",{class:"token punctuation"},","),t(`
      validateInfos`),n("span",{class:"token punctuation"},","),t(`
    `),n("span",{class:"token punctuation"},"}"),t(),n("span",{class:"token operator"},"="),t(),n("span",{class:"token function"},"useForm"),n("span",{class:"token punctuation"},"("),t("modelRef"),n("span",{class:"token punctuation"},","),t(" rulesRef"),n("span",{class:"token punctuation"},")"),n("span",{class:"token punctuation"},";"),t(`
    `),n("span",{class:"token keyword"},"const"),t(),n("span",{class:"token function-variable function"},"handleSubmit"),t(),n("span",{class:"token operator"},"="),t(),n("span",{class:"token parameter"},"e"),t(),n("span",{class:"token operator"},"=>"),t(),n("span",{class:"token punctuation"},"{"),t(`
      e`),n("span",{class:"token punctuation"},"."),n("span",{class:"token function"},"preventDefault"),n("span",{class:"token punctuation"},"("),n("span",{class:"token punctuation"},")"),n("span",{class:"token punctuation"},";"),t(`
      `),n("span",{class:"token function"},"validate"),n("span",{class:"token punctuation"},"("),n("span",{class:"token punctuation"},")"),n("span",{class:"token punctuation"},"."),n("span",{class:"token function"},"then"),n("span",{class:"token punctuation"},"("),n("span",{class:"token punctuation"},"("),n("span",{class:"token punctuation"},")"),t(),n("span",{class:"token operator"},"=>"),t(),n("span",{class:"token punctuation"},"{"),t(`
        console`),n("span",{class:"token punctuation"},"."),n("span",{class:"token function"},"log"),n("span",{class:"token punctuation"},"("),n("span",{class:"token string"},"'Submit!!!'"),n("span",{class:"token punctuation"},","),t(" modelRef"),n("span",{class:"token punctuation"},")"),n("span",{class:"token punctuation"},";"),t(`
      `),n("span",{class:"token punctuation"},"}"),n("span",{class:"token punctuation"},")"),n("span",{class:"token punctuation"},"."),n("span",{class:"token function"},"catch"),n("span",{class:"token punctuation"},"("),n("span",{class:"token parameter"},"errors"),t(),n("span",{class:"token operator"},"=>"),t(),n("span",{class:"token punctuation"},"{"),t(`
        console`),n("span",{class:"token punctuation"},"."),n("span",{class:"token function"},"log"),n("span",{class:"token punctuation"},"("),n("span",{class:"token string"},"'Errors in the form!!!'"),n("span",{class:"token punctuation"},","),t(" errors"),n("span",{class:"token punctuation"},")"),n("span",{class:"token punctuation"},";"),t(`
      `),n("span",{class:"token punctuation"},"}"),n("span",{class:"token punctuation"},")"),n("span",{class:"token punctuation"},";"),t(`
    `),n("span",{class:"token punctuation"},"}"),n("span",{class:"token punctuation"},";"),t(`
    `),n("span",{class:"token keyword"},"return"),t(),n("span",{class:"token punctuation"},"{"),t(`
      modelRef`),n("span",{class:"token punctuation"},","),t(`
      resetFields`),n("span",{class:"token punctuation"},","),t(`
      validateInfos`),n("span",{class:"token punctuation"},","),t(`
      handleSubmit`),n("span",{class:"token punctuation"},","),t(`
    `),n("span",{class:"token punctuation"},"}"),n("span",{class:"token punctuation"},";"),t(`
  `),n("span",{class:"token punctuation"},"}"),n("span",{class:"token punctuation"},","),t(`
`),n("span",{class:"token punctuation"},"}"),n("span",{class:"token punctuation"},")"),n("span",{class:"token punctuation"},";"),t(`
`)])]),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"</"),t("script")]),n("span",{class:"token punctuation"},">")]),t(`
`)])],-1)])),_:1})}const U=b(L,[["render",D]]),E={"@":["afc163","zombiej","yesmeck"],"#":["1.0","2.0","3.0"]},T=v({setup(){const s=I("@"),a=I(""),i=P(()=>E[s.value]||[]);return{value:a,options:i,onSearch:(g,m)=>{console.log(g,m),s.value=m}}}});function q(s,a,i,d,g,m){const e=l("a-mentions-option"),u=l("a-mentions"),k=l("demo-box");return r(),C(k,{jsfiddle:{us:"Customize Trigger Token by `prefix` props. Default to `@`, `Array<string>` also supported.",cn:"\u901A\u8FC7 prefix \u5C5E\u6027\u81EA\u5B9A\u4E49\u89E6\u53D1\u5B57\u7B26\u3002\u9ED8\u8BA4\u4E3A @, \u53EF\u4EE5\u5B9A\u4E49\u4E3A\u6570\u7EC4\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>\u901A\u8FC7 prefix \u5C5E\u6027\u81EA\u5B9A\u4E49\u89E6\u53D1\u5B57\u7B26\u3002\u9ED8\u8BA4\u4E3A @, \u53EF\u4EE5\u5B9A\u4E49\u4E3A\u6570\u7EC4\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>Customize Trigger Token by <code>prefix</code> props. Default to <code>@</code>, <code>Array&lt;string&gt;</code> also supported.</p>
`,order:2,title:{"zh-CN":"\u81EA\u5B9A\u4E49\u89E6\u53D1\u5B57\u7B26","en-US":"Customize Trigger Token"},relativePath:"components/mentions/demo/prefix.vue",sourceCode:"PHRlbXBsYXRlPgogIDxhLW1lbnRpb25zCiAgICB2LW1vZGVsOnZhbHVlPSJ2YWx1ZSIKICAgIHBsYWNlaG9sZGVyPSJpbnB1dCBAIHRvIG1lbnRpb24gcGVvcGxlLCAjIHRvIG1lbnRpb24gdGFnIgogICAgOnByZWZpeD0iWydAJywgJyMnXSIKICAgIEBzZWFyY2g9Im9uU2VhcmNoIgogID4KICAgIDxhLW1lbnRpb25zLW9wdGlvbiB2LWZvcj0idmFsIGluIG9wdGlvbnMiIDprZXk9InZhbCIgOnZhbHVlPSJ2YWwiPgogICAgICB7eyB2YWwgfX0KICAgIDwvYS1tZW50aW9ucy1vcHRpb24+CiAgPC9hLW1lbnRpb25zPgo8L3RlbXBsYXRlPgo8c2NyaXB0IGxhbmc9InRzIj4KaW1wb3J0IHsgY29tcHV0ZWQsIGRlZmluZUNvbXBvbmVudCwgcmVmIH0gZnJvbSAndnVlJzsKY29uc3QgTU9DS19EQVRBOiBSZWNvcmQ8c3RyaW5nLCBzdHJpbmdbXT4gPSB7CiAgJ0AnOiBbJ2FmYzE2MycsICd6b21iaWVqJywgJ3llc21lY2snXSwKICAnIyc6IFsnMS4wJywgJzIuMCcsICczLjAnXSwKfTsKZXhwb3J0IGRlZmF1bHQgZGVmaW5lQ29tcG9uZW50KHsKICBzZXR1cCgpIHsKICAgIGNvbnN0IHByZWZpeCA9IHJlZjxzdHJpbmc+KCdAJyk7CiAgICBjb25zdCB2YWx1ZSA9IHJlZjxzdHJpbmc+KCcnKTsKICAgIGNvbnN0IG9wdGlvbnMgPSBjb21wdXRlZCgoKSA9PiB7CiAgICAgIHJldHVybiBNT0NLX0RBVEFbcHJlZml4LnZhbHVlXSB8fCBbXTsKICAgIH0pOwoKICAgIGNvbnN0IG9uU2VhcmNoID0gKF86IHN0cmluZywgdmFsOiBzdHJpbmcpID0+IHsKICAgICAgY29uc29sZS5sb2coXywgdmFsKTsKICAgICAgcHJlZml4LnZhbHVlID0gdmFsOwogICAgfTsKCiAgICByZXR1cm4gewogICAgICB2YWx1ZSwKICAgICAgb3B0aW9ucywKICAgICAgb25TZWFyY2gsCiAgICB9OwogIH0sCn0pOwo8L3NjcmlwdD4KCg==",jsSourceCode:"PHRlbXBsYXRlPgogIDxhLW1lbnRpb25zCiAgICB2LW1vZGVsOnZhbHVlPSJ2YWx1ZSIKICAgIHBsYWNlaG9sZGVyPSJpbnB1dCBAIHRvIG1lbnRpb24gcGVvcGxlLCAjIHRvIG1lbnRpb24gdGFnIgogICAgOnByZWZpeD0iWydAJywgJyMnXSIKICAgIEBzZWFyY2g9Im9uU2VhcmNoIgogID4KICAgIDxhLW1lbnRpb25zLW9wdGlvbiB2LWZvcj0idmFsIGluIG9wdGlvbnMiIDprZXk9InZhbCIgOnZhbHVlPSJ2YWwiPgogICAgICB7eyB2YWwgfX0KICAgIDwvYS1tZW50aW9ucy1vcHRpb24+CiAgPC9hLW1lbnRpb25zPgo8L3RlbXBsYXRlPgo8c2NyaXB0PgppbXBvcnQgeyBjb21wdXRlZCwgZGVmaW5lQ29tcG9uZW50LCByZWYgfSBmcm9tICd2dWUnOwpjb25zdCBNT0NLX0RBVEEgPSB7CiAgJ0AnOiBbJ2FmYzE2MycsICd6b21iaWVqJywgJ3llc21lY2snXSwKICAnIyc6IFsnMS4wJywgJzIuMCcsICczLjAnXSwKfTsKZXhwb3J0IGRlZmF1bHQgZGVmaW5lQ29tcG9uZW50KHsKICBzZXR1cCgpIHsKICAgIGNvbnN0IHByZWZpeCA9IHJlZignQCcpOwogICAgY29uc3QgdmFsdWUgPSByZWYoJycpOwogICAgY29uc3Qgb3B0aW9ucyA9IGNvbXB1dGVkKCgpID0+IHsKICAgICAgcmV0dXJuIE1PQ0tfREFUQVtwcmVmaXgudmFsdWVdIHx8IFtdOwogICAgfSk7CiAgICBjb25zdCBvblNlYXJjaCA9IChfLCB2YWwpID0+IHsKICAgICAgY29uc29sZS5sb2coXywgdmFsKTsKICAgICAgcHJlZml4LnZhbHVlID0gdmFsOwogICAgfTsKICAgIHJldHVybiB7CiAgICAgIHZhbHVlLAogICAgICBvcHRpb25zLAogICAgICBvblNlYXJjaCwKICAgIH07CiAgfSwKfSk7Cjwvc2NyaXB0Pg=="}},{default:o(()=>[c(u,{value:s.value,"onUpdate:value":a[0]||(a[0]=p=>s.value=p),placeholder:"input @ to mention people, # to mention tag",prefix:["@","#"],onSearch:s.onSearch},{default:o(()=>[(r(!0),h(Z,null,y(s.options,p=>(r(),C(e,{key:p,value:p},{default:o(()=>[t(W(p),1)]),_:2},1032,["value"]))),128))]),_:1},8,["value","onSearch"])]),htmlCode:o(()=>a[1]||(a[1]=[n("pre",{class:"language-vue"},[n("code",null,[n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),t("template")]),n("span",{class:"token punctuation"},">")]),t(`
  `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),t("a-mentions")]),t(`
    `),n("span",{class:"token attr-name"},[n("span",{class:"token namespace"},"v-model:"),t("value")]),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),t("value"),n("span",{class:"token punctuation"},'"')]),t(`
    `),n("span",{class:"token attr-name"},"placeholder"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),t("input @ to mention people, # to mention tag"),n("span",{class:"token punctuation"},'"')]),t(`
    `),n("span",{class:"token attr-name"},":prefix"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),t("['@', '#']"),n("span",{class:"token punctuation"},'"')]),t(`
    `),n("span",{class:"token attr-name"},"@search"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),t("onSearch"),n("span",{class:"token punctuation"},'"')]),t(`
  `),n("span",{class:"token punctuation"},">")]),t(`
    `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),t("a-mentions-option")]),t(),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"},'"'),t("val in options"),n("span",{class:"token punctuation"},'"')]),t(),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"},'"'),t("val"),n("span",{class:"token punctuation"},'"')]),t(),n("span",{class:"token attr-name"},":value"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),t("val"),n("span",{class:"token punctuation"},'"')]),n("span",{class:"token punctuation"},">")]),t(`
      {{ val }}
    `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"</"),t("a-mentions-option")]),n("span",{class:"token punctuation"},">")]),t(`
  `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"</"),t("a-mentions")]),n("span",{class:"token punctuation"},">")]),t(`
`),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"</"),t("template")]),n("span",{class:"token punctuation"},">")]),t(`
`),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),t("script")]),t(),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"},'"'),t("ts"),n("span",{class:"token punctuation"},'"')]),n("span",{class:"token punctuation"},">")]),n("span",{class:"token script"},[n("span",{class:"token language-javascript"},[t(`
`),n("span",{class:"token keyword"},"import"),t(),n("span",{class:"token punctuation"},"{"),t(" computed"),n("span",{class:"token punctuation"},","),t(" defineComponent"),n("span",{class:"token punctuation"},","),t(" ref "),n("span",{class:"token punctuation"},"}"),t(),n("span",{class:"token keyword"},"from"),t(),n("span",{class:"token string"},"'vue'"),n("span",{class:"token punctuation"},";"),t(`
`),n("span",{class:"token keyword"},"const"),t(),n("span",{class:"token constant"},"MOCK_DATA"),n("span",{class:"token operator"},":"),t(" Record"),n("span",{class:"token operator"},"<"),t("string"),n("span",{class:"token punctuation"},","),t(" string"),n("span",{class:"token punctuation"},"["),n("span",{class:"token punctuation"},"]"),n("span",{class:"token operator"},">"),t(),n("span",{class:"token operator"},"="),t(),n("span",{class:"token punctuation"},"{"),t(`
  `),n("span",{class:"token string-property property"},"'@'"),n("span",{class:"token operator"},":"),t(),n("span",{class:"token punctuation"},"["),n("span",{class:"token string"},"'afc163'"),n("span",{class:"token punctuation"},","),t(),n("span",{class:"token string"},"'zombiej'"),n("span",{class:"token punctuation"},","),t(),n("span",{class:"token string"},"'yesmeck'"),n("span",{class:"token punctuation"},"]"),n("span",{class:"token punctuation"},","),t(`
  `),n("span",{class:"token string-property property"},"'#'"),n("span",{class:"token operator"},":"),t(),n("span",{class:"token punctuation"},"["),n("span",{class:"token string"},"'1.0'"),n("span",{class:"token punctuation"},","),t(),n("span",{class:"token string"},"'2.0'"),n("span",{class:"token punctuation"},","),t(),n("span",{class:"token string"},"'3.0'"),n("span",{class:"token punctuation"},"]"),n("span",{class:"token punctuation"},","),t(`
`),n("span",{class:"token punctuation"},"}"),n("span",{class:"token punctuation"},";"),t(`
`),n("span",{class:"token keyword"},"export"),t(),n("span",{class:"token keyword"},"default"),t(),n("span",{class:"token function"},"defineComponent"),n("span",{class:"token punctuation"},"("),n("span",{class:"token punctuation"},"{"),t(`
  `),n("span",{class:"token function"},"setup"),n("span",{class:"token punctuation"},"("),n("span",{class:"token punctuation"},")"),t(),n("span",{class:"token punctuation"},"{"),t(`
    `),n("span",{class:"token keyword"},"const"),t(" prefix "),n("span",{class:"token operator"},"="),t(" ref"),n("span",{class:"token operator"},"<"),t("string"),n("span",{class:"token operator"},">"),n("span",{class:"token punctuation"},"("),n("span",{class:"token string"},"'@'"),n("span",{class:"token punctuation"},")"),n("span",{class:"token punctuation"},";"),t(`
    `),n("span",{class:"token keyword"},"const"),t(" value "),n("span",{class:"token operator"},"="),t(" ref"),n("span",{class:"token operator"},"<"),t("string"),n("span",{class:"token operator"},">"),n("span",{class:"token punctuation"},"("),n("span",{class:"token string"},"''"),n("span",{class:"token punctuation"},")"),n("span",{class:"token punctuation"},";"),t(`
    `),n("span",{class:"token keyword"},"const"),t(" options "),n("span",{class:"token operator"},"="),t(),n("span",{class:"token function"},"computed"),n("span",{class:"token punctuation"},"("),n("span",{class:"token punctuation"},"("),n("span",{class:"token punctuation"},")"),t(),n("span",{class:"token operator"},"=>"),t(),n("span",{class:"token punctuation"},"{"),t(`
      `),n("span",{class:"token keyword"},"return"),t(),n("span",{class:"token constant"},"MOCK_DATA"),n("span",{class:"token punctuation"},"["),t("prefix"),n("span",{class:"token punctuation"},"."),t("value"),n("span",{class:"token punctuation"},"]"),t(),n("span",{class:"token operator"},"||"),t(),n("span",{class:"token punctuation"},"["),n("span",{class:"token punctuation"},"]"),n("span",{class:"token punctuation"},";"),t(`
    `),n("span",{class:"token punctuation"},"}"),n("span",{class:"token punctuation"},")"),n("span",{class:"token punctuation"},";"),t(`

    `),n("span",{class:"token keyword"},"const"),t(),n("span",{class:"token function-variable function"},"onSearch"),t(),n("span",{class:"token operator"},"="),t(),n("span",{class:"token punctuation"},"("),n("span",{class:"token parameter"},[n("span",{class:"token literal-property property"},"_"),n("span",{class:"token operator"},":"),t(" string"),n("span",{class:"token punctuation"},","),t(),n("span",{class:"token literal-property property"},"val"),n("span",{class:"token operator"},":"),t(" string")]),n("span",{class:"token punctuation"},")"),t(),n("span",{class:"token operator"},"=>"),t(),n("span",{class:"token punctuation"},"{"),t(`
      console`),n("span",{class:"token punctuation"},"."),n("span",{class:"token function"},"log"),n("span",{class:"token punctuation"},"("),t("_"),n("span",{class:"token punctuation"},","),t(" val"),n("span",{class:"token punctuation"},")"),n("span",{class:"token punctuation"},";"),t(`
      prefix`),n("span",{class:"token punctuation"},"."),t("value "),n("span",{class:"token operator"},"="),t(" val"),n("span",{class:"token punctuation"},";"),t(`
    `),n("span",{class:"token punctuation"},"}"),n("span",{class:"token punctuation"},";"),t(`

    `),n("span",{class:"token keyword"},"return"),t(),n("span",{class:"token punctuation"},"{"),t(`
      value`),n("span",{class:"token punctuation"},","),t(`
      options`),n("span",{class:"token punctuation"},","),t(`
      onSearch`),n("span",{class:"token punctuation"},","),t(`
    `),n("span",{class:"token punctuation"},"}"),n("span",{class:"token punctuation"},";"),t(`
  `),n("span",{class:"token punctuation"},"}"),n("span",{class:"token punctuation"},","),t(`
`),n("span",{class:"token punctuation"},"}"),n("span",{class:"token punctuation"},")"),n("span",{class:"token punctuation"},";"),t(`
`)])]),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"</"),t("script")]),n("span",{class:"token punctuation"},">")]),t(`
`)])],-1)])),jsVersionHtml:o(()=>a[2]||(a[2]=[n("pre",{class:"language-vue"},[n("code",null,[n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),t("template")]),n("span",{class:"token punctuation"},">")]),t(`
  `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),t("a-mentions")]),t(`
    `),n("span",{class:"token attr-name"},[n("span",{class:"token namespace"},"v-model:"),t("value")]),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),t("value"),n("span",{class:"token punctuation"},'"')]),t(`
    `),n("span",{class:"token attr-name"},"placeholder"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),t("input @ to mention people, # to mention tag"),n("span",{class:"token punctuation"},'"')]),t(`
    `),n("span",{class:"token attr-name"},":prefix"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),t("['@', '#']"),n("span",{class:"token punctuation"},'"')]),t(`
    `),n("span",{class:"token attr-name"},"@search"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),t("onSearch"),n("span",{class:"token punctuation"},'"')]),t(`
  `),n("span",{class:"token punctuation"},">")]),t(`
    `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),t("a-mentions-option")]),t(),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"},'"'),t("val in options"),n("span",{class:"token punctuation"},'"')]),t(),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"},'"'),t("val"),n("span",{class:"token punctuation"},'"')]),t(),n("span",{class:"token attr-name"},":value"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),t("val"),n("span",{class:"token punctuation"},'"')]),n("span",{class:"token punctuation"},">")]),t(`
      {{ val }}
    `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"</"),t("a-mentions-option")]),n("span",{class:"token punctuation"},">")]),t(`
  `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"</"),t("a-mentions")]),n("span",{class:"token punctuation"},">")]),t(`
`),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"</"),t("template")]),n("span",{class:"token punctuation"},">")]),t(`
`),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),t("script")]),n("span",{class:"token punctuation"},">")]),n("span",{class:"token script"},[n("span",{class:"token language-javascript"},[t(`
`),n("span",{class:"token keyword"},"import"),t(),n("span",{class:"token punctuation"},"{"),t(" computed"),n("span",{class:"token punctuation"},","),t(" defineComponent"),n("span",{class:"token punctuation"},","),t(" ref "),n("span",{class:"token punctuation"},"}"),t(),n("span",{class:"token keyword"},"from"),t(),n("span",{class:"token string"},"'vue'"),n("span",{class:"token punctuation"},";"),t(`
`),n("span",{class:"token keyword"},"const"),t(),n("span",{class:"token constant"},"MOCK_DATA"),t(),n("span",{class:"token operator"},"="),t(),n("span",{class:"token punctuation"},"{"),t(`
  `),n("span",{class:"token string-property property"},"'@'"),n("span",{class:"token operator"},":"),t(),n("span",{class:"token punctuation"},"["),n("span",{class:"token string"},"'afc163'"),n("span",{class:"token punctuation"},","),t(),n("span",{class:"token string"},"'zombiej'"),n("span",{class:"token punctuation"},","),t(),n("span",{class:"token string"},"'yesmeck'"),n("span",{class:"token punctuation"},"]"),n("span",{class:"token punctuation"},","),t(`
  `),n("span",{class:"token string-property property"},"'#'"),n("span",{class:"token operator"},":"),t(),n("span",{class:"token punctuation"},"["),n("span",{class:"token string"},"'1.0'"),n("span",{class:"token punctuation"},","),t(),n("span",{class:"token string"},"'2.0'"),n("span",{class:"token punctuation"},","),t(),n("span",{class:"token string"},"'3.0'"),n("span",{class:"token punctuation"},"]"),n("span",{class:"token punctuation"},","),t(`
`),n("span",{class:"token punctuation"},"}"),n("span",{class:"token punctuation"},";"),t(`
`),n("span",{class:"token keyword"},"export"),t(),n("span",{class:"token keyword"},"default"),t(),n("span",{class:"token function"},"defineComponent"),n("span",{class:"token punctuation"},"("),n("span",{class:"token punctuation"},"{"),t(`
  `),n("span",{class:"token function"},"setup"),n("span",{class:"token punctuation"},"("),n("span",{class:"token punctuation"},")"),t(),n("span",{class:"token punctuation"},"{"),t(`
    `),n("span",{class:"token keyword"},"const"),t(" prefix "),n("span",{class:"token operator"},"="),t(),n("span",{class:"token function"},"ref"),n("span",{class:"token punctuation"},"("),n("span",{class:"token string"},"'@'"),n("span",{class:"token punctuation"},")"),n("span",{class:"token punctuation"},";"),t(`
    `),n("span",{class:"token keyword"},"const"),t(" value "),n("span",{class:"token operator"},"="),t(),n("span",{class:"token function"},"ref"),n("span",{class:"token punctuation"},"("),n("span",{class:"token string"},"''"),n("span",{class:"token punctuation"},")"),n("span",{class:"token punctuation"},";"),t(`
    `),n("span",{class:"token keyword"},"const"),t(" options "),n("span",{class:"token operator"},"="),t(),n("span",{class:"token function"},"computed"),n("span",{class:"token punctuation"},"("),n("span",{class:"token punctuation"},"("),n("span",{class:"token punctuation"},")"),t(),n("span",{class:"token operator"},"=>"),t(),n("span",{class:"token punctuation"},"{"),t(`
      `),n("span",{class:"token keyword"},"return"),t(),n("span",{class:"token constant"},"MOCK_DATA"),n("span",{class:"token punctuation"},"["),t("prefix"),n("span",{class:"token punctuation"},"."),t("value"),n("span",{class:"token punctuation"},"]"),t(),n("span",{class:"token operator"},"||"),t(),n("span",{class:"token punctuation"},"["),n("span",{class:"token punctuation"},"]"),n("span",{class:"token punctuation"},";"),t(`
    `),n("span",{class:"token punctuation"},"}"),n("span",{class:"token punctuation"},")"),n("span",{class:"token punctuation"},";"),t(`
    `),n("span",{class:"token keyword"},"const"),t(),n("span",{class:"token function-variable function"},"onSearch"),t(),n("span",{class:"token operator"},"="),t(),n("span",{class:"token punctuation"},"("),n("span",{class:"token parameter"},[t("_"),n("span",{class:"token punctuation"},","),t(" val")]),n("span",{class:"token punctuation"},")"),t(),n("span",{class:"token operator"},"=>"),t(),n("span",{class:"token punctuation"},"{"),t(`
      console`),n("span",{class:"token punctuation"},"."),n("span",{class:"token function"},"log"),n("span",{class:"token punctuation"},"("),t("_"),n("span",{class:"token punctuation"},","),t(" val"),n("span",{class:"token punctuation"},")"),n("span",{class:"token punctuation"},";"),t(`
      prefix`),n("span",{class:"token punctuation"},"."),t("value "),n("span",{class:"token operator"},"="),t(" val"),n("span",{class:"token punctuation"},";"),t(`
    `),n("span",{class:"token punctuation"},"}"),n("span",{class:"token punctuation"},";"),t(`
    `),n("span",{class:"token keyword"},"return"),t(),n("span",{class:"token punctuation"},"{"),t(`
      value`),n("span",{class:"token punctuation"},","),t(`
      options`),n("span",{class:"token punctuation"},","),t(`
      onSearch`),n("span",{class:"token punctuation"},","),t(`
    `),n("span",{class:"token punctuation"},"}"),n("span",{class:"token punctuation"},";"),t(`
  `),n("span",{class:"token punctuation"},"}"),n("span",{class:"token punctuation"},","),t(`
`),n("span",{class:"token punctuation"},"}"),n("span",{class:"token punctuation"},")"),n("span",{class:"token punctuation"},";"),t(`
`)])]),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"</"),t("script")]),n("span",{class:"token punctuation"},">")]),t(`
`)])],-1)])),_:1})}const O=b(T,[["render",q]]),_=v({setup(){const s=I(""),a=I(""),i=I(["afc163","zombieJ","yesmeck"]);return{value1:s,value2:a,options:i}}}),Q={style:{"margin-bottom":"10px"}};function $(s,a,i,d,g,m){const e=l("a-mentions-option"),u=l("a-mentions"),k=l("demo-box");return r(),C(k,{jsfiddle:{us:"Configurate disabled and readonly.",cn:"\u901A\u8FC7 `disabled` \u5C5E\u6027\u8BBE\u7F6E\u662F\u5426\u751F\u6548\u3002\u901A\u8FC7 `readonly` \u5C5E\u6027\u8BBE\u7F6E\u662F\u5426\u53EA\u8BFB\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>\u901A\u8FC7 <code>disabled</code> \u5C5E\u6027\u8BBE\u7F6E\u662F\u5426\u751F\u6548\u3002\u901A\u8FC7 <code>readonly</code> \u5C5E\u6027\u8BBE\u7F6E\u662F\u5426\u53EA\u8BFB\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>Configurate disabled and readonly.</p>
`,order:3,title:{"zh-CN":"\u65E0\u6548\u6216\u53EA\u8BFB","en-US":"disabled or readonly"},relativePath:"components/mentions/demo/readonly.vue",sourceCode:"PHRlbXBsYXRlPgogIDxkaXY+CiAgICA8ZGl2IHN0eWxlPSJtYXJnaW4tYm90dG9tOiAxMHB4Ij4KICAgICAgPGEtbWVudGlvbnMgdi1tb2RlbDp2YWx1ZT0idmFsdWUxIiBwbGFjZWhvbGRlcj0idGhpcyBpcyBkaXNhYmxlZCBNZW50aW9ucyIgZGlzYWJsZWQ+CiAgICAgICAgPGEtbWVudGlvbnMtb3B0aW9uIHYtZm9yPSJ2YWx1ZSBpbiBvcHRpb25zIiA6a2V5PSJ2YWx1ZSIgOnZhbHVlPSJ2YWx1ZSI+CiAgICAgICAgICB7eyB2YWx1ZSB9fQogICAgICAgIDwvYS1tZW50aW9ucy1vcHRpb24+CiAgICAgIDwvYS1tZW50aW9ucz4KICAgIDwvZGl2PgogICAgPGEtbWVudGlvbnMgdi1tb2RlbDp2YWx1ZT0idmFsdWUyIiBwbGFjZWhvbGRlcj0idGhpcyBpcyByZWFkT25seSBhLW1lbnRpb25zIiByZWFkb25seT4KICAgICAgPGEtbWVudGlvbnMtb3B0aW9uIHYtZm9yPSJ2YWx1ZSBpbiBvcHRpb25zIiA6a2V5PSJ2YWx1ZSIgOnZhbHVlPSJ2YWx1ZSI+CiAgICAgICAge3sgdmFsdWUgfX0KICAgICAgPC9hLW1lbnRpb25zLW9wdGlvbj4KICAgIDwvYS1tZW50aW9ucz4KICA8L2Rpdj4KPC90ZW1wbGF0ZT4KPHNjcmlwdCBsYW5nPSJ0cyI+CmltcG9ydCB7IGRlZmluZUNvbXBvbmVudCwgcmVmIH0gZnJvbSAndnVlJzsKZXhwb3J0IGRlZmF1bHQgZGVmaW5lQ29tcG9uZW50KHsKICBzZXR1cCgpIHsKICAgIGNvbnN0IHZhbHVlMSA9IHJlZjxzdHJpbmc+KCcnKTsKICAgIGNvbnN0IHZhbHVlMiA9IHJlZjxzdHJpbmc+KCcnKTsKICAgIGNvbnN0IG9wdGlvbnMgPSByZWY8c3RyaW5nW10+KFsnYWZjMTYzJywgJ3pvbWJpZUonLCAneWVzbWVjayddKTsKICAgIHJldHVybiB7CiAgICAgIHZhbHVlMSwKICAgICAgdmFsdWUyLAogICAgICBvcHRpb25zLAogICAgfTsKICB9LAp9KTsKPC9zY3JpcHQ+Cgo=",jsSourceCode:"PHRlbXBsYXRlPgogIDxkaXY+CiAgICA8ZGl2IHN0eWxlPSJtYXJnaW4tYm90dG9tOiAxMHB4Ij4KICAgICAgPGEtbWVudGlvbnMgdi1tb2RlbDp2YWx1ZT0idmFsdWUxIiBwbGFjZWhvbGRlcj0idGhpcyBpcyBkaXNhYmxlZCBNZW50aW9ucyIgZGlzYWJsZWQ+CiAgICAgICAgPGEtbWVudGlvbnMtb3B0aW9uIHYtZm9yPSJ2YWx1ZSBpbiBvcHRpb25zIiA6a2V5PSJ2YWx1ZSIgOnZhbHVlPSJ2YWx1ZSI+CiAgICAgICAgICB7eyB2YWx1ZSB9fQogICAgICAgIDwvYS1tZW50aW9ucy1vcHRpb24+CiAgICAgIDwvYS1tZW50aW9ucz4KICAgIDwvZGl2PgogICAgPGEtbWVudGlvbnMgdi1tb2RlbDp2YWx1ZT0idmFsdWUyIiBwbGFjZWhvbGRlcj0idGhpcyBpcyByZWFkT25seSBhLW1lbnRpb25zIiByZWFkb25seT4KICAgICAgPGEtbWVudGlvbnMtb3B0aW9uIHYtZm9yPSJ2YWx1ZSBpbiBvcHRpb25zIiA6a2V5PSJ2YWx1ZSIgOnZhbHVlPSJ2YWx1ZSI+CiAgICAgICAge3sgdmFsdWUgfX0KICAgICAgPC9hLW1lbnRpb25zLW9wdGlvbj4KICAgIDwvYS1tZW50aW9ucz4KICA8L2Rpdj4KPC90ZW1wbGF0ZT4KPHNjcmlwdD4KaW1wb3J0IHsgZGVmaW5lQ29tcG9uZW50LCByZWYgfSBmcm9tICd2dWUnOwpleHBvcnQgZGVmYXVsdCBkZWZpbmVDb21wb25lbnQoewogIHNldHVwKCkgewogICAgY29uc3QgdmFsdWUxID0gcmVmKCcnKTsKICAgIGNvbnN0IHZhbHVlMiA9IHJlZignJyk7CiAgICBjb25zdCBvcHRpb25zID0gcmVmKFsnYWZjMTYzJywgJ3pvbWJpZUonLCAneWVzbWVjayddKTsKICAgIHJldHVybiB7CiAgICAgIHZhbHVlMSwKICAgICAgdmFsdWUyLAogICAgICBvcHRpb25zLAogICAgfTsKICB9LAp9KTsKPC9zY3JpcHQ+"}},{default:o(()=>[n("div",null,[n("div",Q,[c(u,{value:s.value1,"onUpdate:value":a[0]||(a[0]=p=>s.value1=p),placeholder:"this is disabled Mentions",disabled:""},{default:o(()=>[(r(!0),h(Z,null,y(s.options,p=>(r(),C(e,{key:p,value:p},{default:o(()=>[t(W(p),1)]),_:2},1032,["value"]))),128))]),_:1},8,["value"])]),c(u,{value:s.value2,"onUpdate:value":a[1]||(a[1]=p=>s.value2=p),placeholder:"this is readOnly a-mentions",readonly:""},{default:o(()=>[(r(!0),h(Z,null,y(s.options,p=>(r(),C(e,{key:p,value:p},{default:o(()=>[t(W(p),1)]),_:2},1032,["value"]))),128))]),_:1},8,["value"])])]),htmlCode:o(()=>a[2]||(a[2]=[n("pre",{class:"language-vue"},[n("code",null,[n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),t("template")]),n("span",{class:"token punctuation"},">")]),t(`
  `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),t("div")]),n("span",{class:"token punctuation"},">")]),t(`
    `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),t("div")]),t(),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"},":"),t(" 10px")]),n("span",{class:"token punctuation"},'"')])]),n("span",{class:"token punctuation"},">")]),t(`
      `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),t("a-mentions")]),t(),n("span",{class:"token attr-name"},[n("span",{class:"token namespace"},"v-model:"),t("value")]),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),t("value1"),n("span",{class:"token punctuation"},'"')]),t(),n("span",{class:"token attr-name"},"placeholder"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),t("this is disabled Mentions"),n("span",{class:"token punctuation"},'"')]),t(),n("span",{class:"token attr-name"},"disabled"),n("span",{class:"token punctuation"},">")]),t(`
        `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),t("a-mentions-option")]),t(),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"},'"'),t("value in options"),n("span",{class:"token punctuation"},'"')]),t(),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"},'"'),t("value"),n("span",{class:"token punctuation"},'"')]),t(),n("span",{class:"token attr-name"},":value"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),t("value"),n("span",{class:"token punctuation"},'"')]),n("span",{class:"token punctuation"},">")]),t(`
          {{ value }}
        `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"</"),t("a-mentions-option")]),n("span",{class:"token punctuation"},">")]),t(`
      `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"</"),t("a-mentions")]),n("span",{class:"token punctuation"},">")]),t(`
    `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"</"),t("div")]),n("span",{class:"token punctuation"},">")]),t(`
    `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),t("a-mentions")]),t(),n("span",{class:"token attr-name"},[n("span",{class:"token namespace"},"v-model:"),t("value")]),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),t("value2"),n("span",{class:"token punctuation"},'"')]),t(),n("span",{class:"token attr-name"},"placeholder"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),t("this is readOnly a-mentions"),n("span",{class:"token punctuation"},'"')]),t(),n("span",{class:"token attr-name"},"readonly"),n("span",{class:"token punctuation"},">")]),t(`
      `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),t("a-mentions-option")]),t(),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"},'"'),t("value in options"),n("span",{class:"token punctuation"},'"')]),t(),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"},'"'),t("value"),n("span",{class:"token punctuation"},'"')]),t(),n("span",{class:"token attr-name"},":value"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),t("value"),n("span",{class:"token punctuation"},'"')]),n("span",{class:"token punctuation"},">")]),t(`
        {{ value }}
      `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"</"),t("a-mentions-option")]),n("span",{class:"token punctuation"},">")]),t(`
    `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"</"),t("a-mentions")]),n("span",{class:"token punctuation"},">")]),t(`
  `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"</"),t("div")]),n("span",{class:"token punctuation"},">")]),t(`
`),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"</"),t("template")]),n("span",{class:"token punctuation"},">")]),t(`
`),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),t("script")]),t(),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"},'"'),t("ts"),n("span",{class:"token punctuation"},'"')]),n("span",{class:"token punctuation"},">")]),n("span",{class:"token script"},[n("span",{class:"token language-javascript"},[t(`
`),n("span",{class:"token keyword"},"import"),t(),n("span",{class:"token punctuation"},"{"),t(" defineComponent"),n("span",{class:"token punctuation"},","),t(" ref "),n("span",{class:"token punctuation"},"}"),t(),n("span",{class:"token keyword"},"from"),t(),n("span",{class:"token string"},"'vue'"),n("span",{class:"token punctuation"},";"),t(`
`),n("span",{class:"token keyword"},"export"),t(),n("span",{class:"token keyword"},"default"),t(),n("span",{class:"token function"},"defineComponent"),n("span",{class:"token punctuation"},"("),n("span",{class:"token punctuation"},"{"),t(`
  `),n("span",{class:"token function"},"setup"),n("span",{class:"token punctuation"},"("),n("span",{class:"token punctuation"},")"),t(),n("span",{class:"token punctuation"},"{"),t(`
    `),n("span",{class:"token keyword"},"const"),t(" value1 "),n("span",{class:"token operator"},"="),t(" ref"),n("span",{class:"token operator"},"<"),t("string"),n("span",{class:"token operator"},">"),n("span",{class:"token punctuation"},"("),n("span",{class:"token string"},"''"),n("span",{class:"token punctuation"},")"),n("span",{class:"token punctuation"},";"),t(`
    `),n("span",{class:"token keyword"},"const"),t(" value2 "),n("span",{class:"token operator"},"="),t(" ref"),n("span",{class:"token operator"},"<"),t("string"),n("span",{class:"token operator"},">"),n("span",{class:"token punctuation"},"("),n("span",{class:"token string"},"''"),n("span",{class:"token punctuation"},")"),n("span",{class:"token punctuation"},";"),t(`
    `),n("span",{class:"token keyword"},"const"),t(" options "),n("span",{class:"token operator"},"="),t(" ref"),n("span",{class:"token operator"},"<"),t("string"),n("span",{class:"token punctuation"},"["),n("span",{class:"token punctuation"},"]"),n("span",{class:"token operator"},">"),n("span",{class:"token punctuation"},"("),n("span",{class:"token punctuation"},"["),n("span",{class:"token string"},"'afc163'"),n("span",{class:"token punctuation"},","),t(),n("span",{class:"token string"},"'zombieJ'"),n("span",{class:"token punctuation"},","),t(),n("span",{class:"token string"},"'yesmeck'"),n("span",{class:"token punctuation"},"]"),n("span",{class:"token punctuation"},")"),n("span",{class:"token punctuation"},";"),t(`
    `),n("span",{class:"token keyword"},"return"),t(),n("span",{class:"token punctuation"},"{"),t(`
      value1`),n("span",{class:"token punctuation"},","),t(`
      value2`),n("span",{class:"token punctuation"},","),t(`
      options`),n("span",{class:"token punctuation"},","),t(`
    `),n("span",{class:"token punctuation"},"}"),n("span",{class:"token punctuation"},";"),t(`
  `),n("span",{class:"token punctuation"},"}"),n("span",{class:"token punctuation"},","),t(`
`),n("span",{class:"token punctuation"},"}"),n("span",{class:"token punctuation"},")"),n("span",{class:"token punctuation"},";"),t(`
`)])]),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"</"),t("script")]),n("span",{class:"token punctuation"},">")]),t(`
`)])],-1)])),jsVersionHtml:o(()=>a[3]||(a[3]=[n("pre",{class:"language-vue"},[n("code",null,[n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),t("template")]),n("span",{class:"token punctuation"},">")]),t(`
  `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),t("div")]),n("span",{class:"token punctuation"},">")]),t(`
    `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),t("div")]),t(),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"},":"),t(" 10px")]),n("span",{class:"token punctuation"},'"')])]),n("span",{class:"token punctuation"},">")]),t(`
      `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),t("a-mentions")]),t(),n("span",{class:"token attr-name"},[n("span",{class:"token namespace"},"v-model:"),t("value")]),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),t("value1"),n("span",{class:"token punctuation"},'"')]),t(),n("span",{class:"token attr-name"},"placeholder"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),t("this is disabled Mentions"),n("span",{class:"token punctuation"},'"')]),t(),n("span",{class:"token attr-name"},"disabled"),n("span",{class:"token punctuation"},">")]),t(`
        `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),t("a-mentions-option")]),t(),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"},'"'),t("value in options"),n("span",{class:"token punctuation"},'"')]),t(),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"},'"'),t("value"),n("span",{class:"token punctuation"},'"')]),t(),n("span",{class:"token attr-name"},":value"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),t("value"),n("span",{class:"token punctuation"},'"')]),n("span",{class:"token punctuation"},">")]),t(`
          {{ value }}
        `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"</"),t("a-mentions-option")]),n("span",{class:"token punctuation"},">")]),t(`
      `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"</"),t("a-mentions")]),n("span",{class:"token punctuation"},">")]),t(`
    `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"</"),t("div")]),n("span",{class:"token punctuation"},">")]),t(`
    `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),t("a-mentions")]),t(),n("span",{class:"token attr-name"},[n("span",{class:"token namespace"},"v-model:"),t("value")]),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),t("value2"),n("span",{class:"token punctuation"},'"')]),t(),n("span",{class:"token attr-name"},"placeholder"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),t("this is readOnly a-mentions"),n("span",{class:"token punctuation"},'"')]),t(),n("span",{class:"token attr-name"},"readonly"),n("span",{class:"token punctuation"},">")]),t(`
      `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),t("a-mentions-option")]),t(),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"},'"'),t("value in options"),n("span",{class:"token punctuation"},'"')]),t(),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"},'"'),t("value"),n("span",{class:"token punctuation"},'"')]),t(),n("span",{class:"token attr-name"},":value"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),t("value"),n("span",{class:"token punctuation"},'"')]),n("span",{class:"token punctuation"},">")]),t(`
        {{ value }}
      `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"</"),t("a-mentions-option")]),n("span",{class:"token punctuation"},">")]),t(`
    `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"</"),t("a-mentions")]),n("span",{class:"token punctuation"},">")]),t(`
  `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"</"),t("div")]),n("span",{class:"token punctuation"},">")]),t(`
`),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"</"),t("template")]),n("span",{class:"token punctuation"},">")]),t(`
`),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),t("script")]),n("span",{class:"token punctuation"},">")]),n("span",{class:"token script"},[n("span",{class:"token language-javascript"},[t(`
`),n("span",{class:"token keyword"},"import"),t(),n("span",{class:"token punctuation"},"{"),t(" defineComponent"),n("span",{class:"token punctuation"},","),t(" ref "),n("span",{class:"token punctuation"},"}"),t(),n("span",{class:"token keyword"},"from"),t(),n("span",{class:"token string"},"'vue'"),n("span",{class:"token punctuation"},";"),t(`
`),n("span",{class:"token keyword"},"export"),t(),n("span",{class:"token keyword"},"default"),t(),n("span",{class:"token function"},"defineComponent"),n("span",{class:"token punctuation"},"("),n("span",{class:"token punctuation"},"{"),t(`
  `),n("span",{class:"token function"},"setup"),n("span",{class:"token punctuation"},"("),n("span",{class:"token punctuation"},")"),t(),n("span",{class:"token punctuation"},"{"),t(`
    `),n("span",{class:"token keyword"},"const"),t(" value1 "),n("span",{class:"token operator"},"="),t(),n("span",{class:"token function"},"ref"),n("span",{class:"token punctuation"},"("),n("span",{class:"token string"},"''"),n("span",{class:"token punctuation"},")"),n("span",{class:"token punctuation"},";"),t(`
    `),n("span",{class:"token keyword"},"const"),t(" value2 "),n("span",{class:"token operator"},"="),t(),n("span",{class:"token function"},"ref"),n("span",{class:"token punctuation"},"("),n("span",{class:"token string"},"''"),n("span",{class:"token punctuation"},")"),n("span",{class:"token punctuation"},";"),t(`
    `),n("span",{class:"token keyword"},"const"),t(" options "),n("span",{class:"token operator"},"="),t(),n("span",{class:"token function"},"ref"),n("span",{class:"token punctuation"},"("),n("span",{class:"token punctuation"},"["),n("span",{class:"token string"},"'afc163'"),n("span",{class:"token punctuation"},","),t(),n("span",{class:"token string"},"'zombieJ'"),n("span",{class:"token punctuation"},","),t(),n("span",{class:"token string"},"'yesmeck'"),n("span",{class:"token punctuation"},"]"),n("span",{class:"token punctuation"},")"),n("span",{class:"token punctuation"},";"),t(`
    `),n("span",{class:"token keyword"},"return"),t(),n("span",{class:"token punctuation"},"{"),t(`
      value1`),n("span",{class:"token punctuation"},","),t(`
      value2`),n("span",{class:"token punctuation"},","),t(`
      options`),n("span",{class:"token punctuation"},","),t(`
    `),n("span",{class:"token punctuation"},"}"),n("span",{class:"token punctuation"},";"),t(`
  `),n("span",{class:"token punctuation"},"}"),n("span",{class:"token punctuation"},","),t(`
`),n("span",{class:"token punctuation"},"}"),n("span",{class:"token punctuation"},")"),n("span",{class:"token punctuation"},";"),t(`
`)])]),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"</"),t("script")]),n("span",{class:"token punctuation"},">")]),t(`
`)])],-1)])),_:1})}const nn=b(_,[["render",$]]),tn=v({setup(){return{value:I("")}}});function an(s,a,i,d,g,m){const e=l("a-mentions-option"),u=l("a-mentions"),k=l("demo-box");return r(),C(k,{jsfiddle:{us:"Change the suggestions placement.",cn:"\u5411\u4E0A\u5C55\u5F00\u5EFA\u8BAE\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>\u5411\u4E0A\u5C55\u5F00\u5EFA\u8BAE\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>Change the suggestions placement.</p>
`,order:4,title:{"zh-CN":"\u5411\u4E0A\u5C55\u5F00","en-US":"Placemen"},relativePath:"components/mentions/demo/placement.vue",sourceCode:"PHRlbXBsYXRlPgogIDxhLW1lbnRpb25zIHYtbW9kZWw6dmFsdWU9InZhbHVlIiBwbGFjZW1lbnQ9InRvcCI+CiAgICA8YS1tZW50aW9ucy1vcHRpb24gdmFsdWU9ImFmYzE2MyI+YWZjMTYzPC9hLW1lbnRpb25zLW9wdGlvbj4KICAgIDxhLW1lbnRpb25zLW9wdGlvbiB2YWx1ZT0iem9tYmllSiI+em9tYmllSjwvYS1tZW50aW9ucy1vcHRpb24+CiAgICA8YS1tZW50aW9ucy1vcHRpb24gdmFsdWU9Inllc21lY2siPnllc21lY2s8L2EtbWVudGlvbnMtb3B0aW9uPgogIDwvYS1tZW50aW9ucz4KPC90ZW1wbGF0ZT4KPHNjcmlwdCBsYW5nPSJ0cyI+CmltcG9ydCB7IGRlZmluZUNvbXBvbmVudCwgcmVmIH0gZnJvbSAndnVlJzsKZXhwb3J0IGRlZmF1bHQgZGVmaW5lQ29tcG9uZW50KHsKICBzZXR1cCgpIHsKICAgIGNvbnN0IHZhbHVlID0gcmVmPHN0cmluZz4oJycpOwogICAgcmV0dXJuIHsKICAgICAgdmFsdWUsCiAgICB9OwogIH0sCn0pOwo8L3NjcmlwdD4KCg==",jsSourceCode:"PHRlbXBsYXRlPgogIDxhLW1lbnRpb25zIHYtbW9kZWw6dmFsdWU9InZhbHVlIiBwbGFjZW1lbnQ9InRvcCI+CiAgICA8YS1tZW50aW9ucy1vcHRpb24gdmFsdWU9ImFmYzE2MyI+YWZjMTYzPC9hLW1lbnRpb25zLW9wdGlvbj4KICAgIDxhLW1lbnRpb25zLW9wdGlvbiB2YWx1ZT0iem9tYmllSiI+em9tYmllSjwvYS1tZW50aW9ucy1vcHRpb24+CiAgICA8YS1tZW50aW9ucy1vcHRpb24gdmFsdWU9Inllc21lY2siPnllc21lY2s8L2EtbWVudGlvbnMtb3B0aW9uPgogIDwvYS1tZW50aW9ucz4KPC90ZW1wbGF0ZT4KPHNjcmlwdD4KaW1wb3J0IHsgZGVmaW5lQ29tcG9uZW50LCByZWYgfSBmcm9tICd2dWUnOwpleHBvcnQgZGVmYXVsdCBkZWZpbmVDb21wb25lbnQoewogIHNldHVwKCkgewogICAgY29uc3QgdmFsdWUgPSByZWYoJycpOwogICAgcmV0dXJuIHsKICAgICAgdmFsdWUsCiAgICB9OwogIH0sCn0pOwo8L3NjcmlwdD4="}},{default:o(()=>[c(u,{value:s.value,"onUpdate:value":a[0]||(a[0]=p=>s.value=p),placement:"top"},{default:o(()=>[c(e,{value:"afc163"},{default:o(()=>a[1]||(a[1]=[t("afc163")])),_:1,__:[1]}),c(e,{value:"zombieJ"},{default:o(()=>a[2]||(a[2]=[t("zombieJ")])),_:1,__:[2]}),c(e,{value:"yesmeck"},{default:o(()=>a[3]||(a[3]=[t("yesmeck")])),_:1,__:[3]})]),_:1},8,["value"])]),htmlCode:o(()=>a[4]||(a[4]=[n("pre",{class:"language-vue"},[n("code",null,[n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),t("template")]),n("span",{class:"token punctuation"},">")]),t(`
  `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),t("a-mentions")]),t(),n("span",{class:"token attr-name"},[n("span",{class:"token namespace"},"v-model:"),t("value")]),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),t("value"),n("span",{class:"token punctuation"},'"')]),t(),n("span",{class:"token attr-name"},"placement"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),t("top"),n("span",{class:"token punctuation"},'"')]),n("span",{class:"token punctuation"},">")]),t(`
    `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),t("a-mentions-option")]),t(),n("span",{class:"token attr-name"},"value"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),t("afc163"),n("span",{class:"token punctuation"},'"')]),n("span",{class:"token punctuation"},">")]),t("afc163"),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"</"),t("a-mentions-option")]),n("span",{class:"token punctuation"},">")]),t(`
    `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),t("a-mentions-option")]),t(),n("span",{class:"token attr-name"},"value"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),t("zombieJ"),n("span",{class:"token punctuation"},'"')]),n("span",{class:"token punctuation"},">")]),t("zombieJ"),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"</"),t("a-mentions-option")]),n("span",{class:"token punctuation"},">")]),t(`
    `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),t("a-mentions-option")]),t(),n("span",{class:"token attr-name"},"value"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),t("yesmeck"),n("span",{class:"token punctuation"},'"')]),n("span",{class:"token punctuation"},">")]),t("yesmeck"),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"</"),t("a-mentions-option")]),n("span",{class:"token punctuation"},">")]),t(`
  `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"</"),t("a-mentions")]),n("span",{class:"token punctuation"},">")]),t(`
`),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"</"),t("template")]),n("span",{class:"token punctuation"},">")]),t(`
`),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),t("script")]),t(),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"},'"'),t("ts"),n("span",{class:"token punctuation"},'"')]),n("span",{class:"token punctuation"},">")]),n("span",{class:"token script"},[n("span",{class:"token language-javascript"},[t(`
`),n("span",{class:"token keyword"},"import"),t(),n("span",{class:"token punctuation"},"{"),t(" defineComponent"),n("span",{class:"token punctuation"},","),t(" ref "),n("span",{class:"token punctuation"},"}"),t(),n("span",{class:"token keyword"},"from"),t(),n("span",{class:"token string"},"'vue'"),n("span",{class:"token punctuation"},";"),t(`
`),n("span",{class:"token keyword"},"export"),t(),n("span",{class:"token keyword"},"default"),t(),n("span",{class:"token function"},"defineComponent"),n("span",{class:"token punctuation"},"("),n("span",{class:"token punctuation"},"{"),t(`
  `),n("span",{class:"token function"},"setup"),n("span",{class:"token punctuation"},"("),n("span",{class:"token punctuation"},")"),t(),n("span",{class:"token punctuation"},"{"),t(`
    `),n("span",{class:"token keyword"},"const"),t(" value "),n("span",{class:"token operator"},"="),t(" ref"),n("span",{class:"token operator"},"<"),t("string"),n("span",{class:"token operator"},">"),n("span",{class:"token punctuation"},"("),n("span",{class:"token string"},"''"),n("span",{class:"token punctuation"},")"),n("span",{class:"token punctuation"},";"),t(`
    `),n("span",{class:"token keyword"},"return"),t(),n("span",{class:"token punctuation"},"{"),t(`
      value`),n("span",{class:"token punctuation"},","),t(`
    `),n("span",{class:"token punctuation"},"}"),n("span",{class:"token punctuation"},";"),t(`
  `),n("span",{class:"token punctuation"},"}"),n("span",{class:"token punctuation"},","),t(`
`),n("span",{class:"token punctuation"},"}"),n("span",{class:"token punctuation"},")"),n("span",{class:"token punctuation"},";"),t(`
`)])]),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"</"),t("script")]),n("span",{class:"token punctuation"},">")]),t(`
`)])],-1)])),jsVersionHtml:o(()=>a[5]||(a[5]=[n("pre",{class:"language-vue"},[n("code",null,[n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),t("template")]),n("span",{class:"token punctuation"},">")]),t(`
  `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),t("a-mentions")]),t(),n("span",{class:"token attr-name"},[n("span",{class:"token namespace"},"v-model:"),t("value")]),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),t("value"),n("span",{class:"token punctuation"},'"')]),t(),n("span",{class:"token attr-name"},"placement"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),t("top"),n("span",{class:"token punctuation"},'"')]),n("span",{class:"token punctuation"},">")]),t(`
    `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),t("a-mentions-option")]),t(),n("span",{class:"token attr-name"},"value"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),t("afc163"),n("span",{class:"token punctuation"},'"')]),n("span",{class:"token punctuation"},">")]),t("afc163"),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"</"),t("a-mentions-option")]),n("span",{class:"token punctuation"},">")]),t(`
    `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),t("a-mentions-option")]),t(),n("span",{class:"token attr-name"},"value"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),t("zombieJ"),n("span",{class:"token punctuation"},'"')]),n("span",{class:"token punctuation"},">")]),t("zombieJ"),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"</"),t("a-mentions-option")]),n("span",{class:"token punctuation"},">")]),t(`
    `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),t("a-mentions-option")]),t(),n("span",{class:"token attr-name"},"value"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),t("yesmeck"),n("span",{class:"token punctuation"},'"')]),n("span",{class:"token punctuation"},">")]),t("yesmeck"),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"</"),t("a-mentions-option")]),n("span",{class:"token punctuation"},">")]),t(`
  `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"</"),t("a-mentions")]),n("span",{class:"token punctuation"},">")]),t(`
`),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"</"),t("template")]),n("span",{class:"token punctuation"},">")]),t(`
`),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),t("script")]),n("span",{class:"token punctuation"},">")]),n("span",{class:"token script"},[n("span",{class:"token language-javascript"},[t(`
`),n("span",{class:"token keyword"},"import"),t(),n("span",{class:"token punctuation"},"{"),t(" defineComponent"),n("span",{class:"token punctuation"},","),t(" ref "),n("span",{class:"token punctuation"},"}"),t(),n("span",{class:"token keyword"},"from"),t(),n("span",{class:"token string"},"'vue'"),n("span",{class:"token punctuation"},";"),t(`
`),n("span",{class:"token keyword"},"export"),t(),n("span",{class:"token keyword"},"default"),t(),n("span",{class:"token function"},"defineComponent"),n("span",{class:"token punctuation"},"("),n("span",{class:"token punctuation"},"{"),t(`
  `),n("span",{class:"token function"},"setup"),n("span",{class:"token punctuation"},"("),n("span",{class:"token punctuation"},")"),t(),n("span",{class:"token punctuation"},"{"),t(`
    `),n("span",{class:"token keyword"},"const"),t(" value "),n("span",{class:"token operator"},"="),t(),n("span",{class:"token function"},"ref"),n("span",{class:"token punctuation"},"("),n("span",{class:"token string"},"''"),n("span",{class:"token punctuation"},")"),n("span",{class:"token punctuation"},";"),t(`
    `),n("span",{class:"token keyword"},"return"),t(),n("span",{class:"token punctuation"},"{"),t(`
      value`),n("span",{class:"token punctuation"},","),t(`
    `),n("span",{class:"token punctuation"},"}"),n("span",{class:"token punctuation"},";"),t(`
  `),n("span",{class:"token punctuation"},"}"),n("span",{class:"token punctuation"},","),t(`
`),n("span",{class:"token punctuation"},"}"),n("span",{class:"token punctuation"},")"),n("span",{class:"token punctuation"},";"),t(`
`)])]),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"</"),t("script")]),n("span",{class:"token punctuation"},">")]),t(`
`)])],-1)])),_:1})}const sn=b(tn,[["render",an]]),on={pageData:{title:"Mentions",description:"",frontmatter:{category:"Components",type:"\u6570\u636E\u5F55\u5165",title:"Mentions",subtitle:"\u63D0\u53CA",cover:"https://gw.alipayobjects.com/zos/alicdn/jPE-itMFM/Mentions.svg"},headers:[{level:2,title:"\u4F55\u65F6\u4F7F\u7528",slug:"\u4F55\u65F6\u4F7F\u7528",content:""},{level:2,title:"API",slug:"API",content:"Mentions"},{level:3,title:"Mentions",slug:"Mentions",content:""},{level:3,title:"\u4E8B\u4EF6",slug:"\u4E8B\u4EF6",content:""},{level:3,title:"Mentions \u65B9\u6CD5",slug:"Mentions-\u65B9\u6CD5",content:""},{level:3,title:"Option",slug:"Option",content:""}],relativePath:"components/mentions/index.zh-CN.md",content:`
\u63D0\u53CA\u7EC4\u4EF6\u3002

## \u4F55\u65F6\u4F7F\u7528

- \u7528\u4E8E\u5728\u8F93\u5165\u4E2D\u63D0\u53CA\u67D0\u4EBA\u6216\u67D0\u4E8B\uFF0C\u5E38\u7528\u4E8E\u53D1\u5E03\u3001\u804A\u5929\u6216\u8BC4\u8BBA\u529F\u80FD\u3002

## API

### Mentions

| \u53C2\u6570 | \u8BF4\u660E | \u7C7B\u578B | \u9ED8\u8BA4\u503C |
| --- | --- | --- | --- |
| autofocus | \u81EA\u52A8\u83B7\u5F97\u7126\u70B9 | boolean | \`false\` |
| defaultValue | \u9ED8\u8BA4\u503C | string |  |
| filterOption | \u81EA\u5B9A\u4E49\u8FC7\u6EE4\u903B\u8F91 | false \\| (input: string, option: OptionProps) =&gt; boolean |  |
| getPopupContainer | \u6307\u5B9A\u5EFA\u8BAE\u6846\u6302\u8F7D\u7684 HTML \u8282\u70B9 | () =&gt; HTMLElement |  |
| notFoundContent | \u5F53\u4E0B\u62C9\u5217\u8868\u4E3A\u7A7A\u65F6\u663E\u793A\u7684\u5185\u5BB9 | string \\| slot | &#39;Not Found&#39; |
| placement | \u5F39\u51FA\u5C42\u5C55\u793A\u4F4D\u7F6E | \`top\` \\| \`bottom\` | \`bottom\` |
| prefix | \u8BBE\u7F6E\u89E6\u53D1\u5173\u952E\u5B57 | string \\| string\\[] | &#39;@&#39; |
| split | \u8BBE\u7F6E\u9009\u4E2D\u9879\u524D\u540E\u5206\u9694\u7B26 | string | &#39; &#39; |
| validateSearch | \u81EA\u5B9A\u4E49\u89E6\u53D1\u9A8C\u8BC1\u903B\u8F91 | (text: string, props: MentionsProps) =&gt; void |  |
| value(v-model) | \u8BBE\u7F6E\u503C | string |  |

### \u4E8B\u4EF6

| \u4E8B\u4EF6\u540D\u79F0 | \u8BF4\u660E               | \u56DE\u8C03\u53C2\u6570                                      |
| -------- | ------------------ | --------------------------------------------- |
| blur     | \u5931\u53BB\u7126\u70B9\u7684\u65F6\u56DE\u8C03   | function                                      |
| change   | \u503C\u6539\u53D8\u65F6\u89E6\u53D1       | function(value: string)                       |
| focus    | \u83B7\u5F97\u7126\u70B9\u65F6\u56DE\u8C03     | function                                      |
| search   | \u6587\u672C\u6846\u503C\u53D8\u5316\u65F6\u56DE\u8C03 | function(value: string, prefix: string)       |
| select   | \u9009\u62E9\u9009\u9879\u65F6\u89E6\u53D1     | function(option: OptionProps, prefix: string) |

### Mentions \u65B9\u6CD5

| \u540D\u79F0    | \u63CF\u8FF0     |
| ------- | -------- |
| blur()  | \u79FB\u9664\u7126\u70B9 |
| focus() | \u83B7\u53D6\u7126\u70B9 |

### Option

| \u53C2\u6570  | \u8BF4\u660E           | \u7C7B\u578B   | \u9ED8\u8BA4\u503C |
| ----- | -------------- | ------ | ------ |
| value | \u9009\u62E9\u65F6\u586B\u5145\u7684\u503C | string | &#39;&#39;     |
`,html:`<p>\u63D0\u53CA\u7EC4\u4EF6\u3002</p>
<h2 id="\u4F55\u65F6\u4F7F\u7528">\u4F55\u65F6\u4F7F\u7528 <a class="header-anchor" href="#\u4F55\u65F6\u4F7F\u7528">
          <span aria-hidden="true" class="anchor">#</span>
        </a></h2>
<ul>
<li>\u7528\u4E8E\u5728\u8F93\u5165\u4E2D\u63D0\u53CA\u67D0\u4EBA\u6216\u67D0\u4E8B\uFF0C\u5E38\u7528\u4E8E\u53D1\u5E03\u3001\u804A\u5929\u6216\u8BC4\u8BBA\u529F\u80FD\u3002</li>
</ul>
<h2 id="API">API <a class="header-anchor" href="#API">
          <span aria-hidden="true" class="anchor">#</span>
        </a></h2>
<h3 id="Mentions">Mentions <a class="header-anchor" href="#Mentions">
          <span aria-hidden="true" class="anchor">#</span>
        </a></h3>
<table>
<thead>
<tr>
<th>\u53C2\u6570</th>
<th>\u8BF4\u660E</th>
<th>\u7C7B\u578B</th>
<th>\u9ED8\u8BA4\u503C</th>
</tr>
</thead>
<tbody>
<tr>
<td>autofocus</td>
<td>\u81EA\u52A8\u83B7\u5F97\u7126\u70B9</td>
<td>boolean</td>
<td><code>false</code></td>
</tr>
<tr>
<td>defaultValue</td>
<td>\u9ED8\u8BA4\u503C</td>
<td>string</td>
<td></td>
</tr>
<tr>
<td>filterOption</td>
<td>\u81EA\u5B9A\u4E49\u8FC7\u6EE4\u903B\u8F91</td>
<td>false | (input: string, option: OptionProps) =&gt; boolean</td>
<td></td>
</tr>
<tr>
<td>getPopupContainer</td>
<td>\u6307\u5B9A\u5EFA\u8BAE\u6846\u6302\u8F7D\u7684 HTML \u8282\u70B9</td>
<td>() =&gt; HTMLElement</td>
<td></td>
</tr>
<tr>
<td>notFoundContent</td>
<td>\u5F53\u4E0B\u62C9\u5217\u8868\u4E3A\u7A7A\u65F6\u663E\u793A\u7684\u5185\u5BB9</td>
<td>string | slot</td>
<td>'Not Found'</td>
</tr>
<tr>
<td>placement</td>
<td>\u5F39\u51FA\u5C42\u5C55\u793A\u4F4D\u7F6E</td>
<td><code>top</code> | <code>bottom</code></td>
<td><code>bottom</code></td>
</tr>
<tr>
<td>prefix</td>
<td>\u8BBE\u7F6E\u89E6\u53D1\u5173\u952E\u5B57</td>
<td>string | string[]</td>
<td>'@'</td>
</tr>
<tr>
<td>split</td>
<td>\u8BBE\u7F6E\u9009\u4E2D\u9879\u524D\u540E\u5206\u9694\u7B26</td>
<td>string</td>
<td>' '</td>
</tr>
<tr>
<td>validateSearch</td>
<td>\u81EA\u5B9A\u4E49\u89E6\u53D1\u9A8C\u8BC1\u903B\u8F91</td>
<td>(text: string, props: MentionsProps) =&gt; void</td>
<td></td>
</tr>
<tr>
<td>value(v-model)</td>
<td>\u8BBE\u7F6E\u503C</td>
<td>string</td>
<td></td>
</tr>
</tbody>
</table>
<h3 id="\u4E8B\u4EF6">\u4E8B\u4EF6 <a class="header-anchor" href="#\u4E8B\u4EF6">
          <span aria-hidden="true" class="anchor">#</span>
        </a></h3>
<table>
<thead>
<tr>
<th>\u4E8B\u4EF6\u540D\u79F0</th>
<th>\u8BF4\u660E</th>
<th>\u56DE\u8C03\u53C2\u6570</th>
</tr>
</thead>
<tbody>
<tr>
<td>blur</td>
<td>\u5931\u53BB\u7126\u70B9\u7684\u65F6\u56DE\u8C03</td>
<td>function</td>
</tr>
<tr>
<td>change</td>
<td>\u503C\u6539\u53D8\u65F6\u89E6\u53D1</td>
<td>function(value: string)</td>
</tr>
<tr>
<td>focus</td>
<td>\u83B7\u5F97\u7126\u70B9\u65F6\u56DE\u8C03</td>
<td>function</td>
</tr>
<tr>
<td>search</td>
<td>\u6587\u672C\u6846\u503C\u53D8\u5316\u65F6\u56DE\u8C03</td>
<td>function(value: string, prefix: string)</td>
</tr>
<tr>
<td>select</td>
<td>\u9009\u62E9\u9009\u9879\u65F6\u89E6\u53D1</td>
<td>function(option: OptionProps, prefix: string)</td>
</tr>
</tbody>
</table>
<h3 id="Mentions-\u65B9\u6CD5">Mentions \u65B9\u6CD5 <a class="header-anchor" href="#Mentions-\u65B9\u6CD5">
          <span aria-hidden="true" class="anchor">#</span>
        </a></h3>
<table>
<thead>
<tr>
<th>\u540D\u79F0</th>
<th>\u63CF\u8FF0</th>
</tr>
</thead>
<tbody>
<tr>
<td>blur()</td>
<td>\u79FB\u9664\u7126\u70B9</td>
</tr>
<tr>
<td>focus()</td>
<td>\u83B7\u53D6\u7126\u70B9</td>
</tr>
</tbody>
</table>
<h3 id="Option">Option <a class="header-anchor" href="#Option">
          <span aria-hidden="true" class="anchor">#</span>
        </a></h3>
<table>
<thead>
<tr>
<th>\u53C2\u6570</th>
<th>\u8BF4\u660E</th>
<th>\u7C7B\u578B</th>
<th>\u9ED8\u8BA4\u503C</th>
</tr>
</thead>
<tbody>
<tr>
<td>value</td>
<td>\u9009\u62E9\u65F6\u586B\u5145\u7684\u503C</td>
<td>string</td>
<td>''</td>
</tr>
</tbody>
</table>
`,lastUpdated:1748060300910}},en={class:"markdown"};function pn(s,a,i,d,g,m){return r(),h("article",en,a[0]||(a[0]=[H('<p>\u63D0\u53CA\u7EC4\u4EF6\u3002</p><h2 id="\u4F55\u65F6\u4F7F\u7528">\u4F55\u65F6\u4F7F\u7528 <a class="header-anchor" href="#\u4F55\u65F6\u4F7F\u7528"><span aria-hidden="true" class="anchor">#</span></a></h2><ul><li>\u7528\u4E8E\u5728\u8F93\u5165\u4E2D\u63D0\u53CA\u67D0\u4EBA\u6216\u67D0\u4E8B\uFF0C\u5E38\u7528\u4E8E\u53D1\u5E03\u3001\u804A\u5929\u6216\u8BC4\u8BBA\u529F\u80FD\u3002</li></ul><h2 id="API">API <a class="header-anchor" href="#API"><span aria-hidden="true" class="anchor">#</span></a></h2><h3 id="Mentions">Mentions <a class="header-anchor" href="#Mentions"><span aria-hidden="true" class="anchor">#</span></a></h3><table><thead><tr><th>\u53C2\u6570</th><th>\u8BF4\u660E</th><th>\u7C7B\u578B</th><th>\u9ED8\u8BA4\u503C</th></tr></thead><tbody><tr><td>autofocus</td><td>\u81EA\u52A8\u83B7\u5F97\u7126\u70B9</td><td>boolean</td><td><code>false</code></td></tr><tr><td>defaultValue</td><td>\u9ED8\u8BA4\u503C</td><td>string</td><td></td></tr><tr><td>filterOption</td><td>\u81EA\u5B9A\u4E49\u8FC7\u6EE4\u903B\u8F91</td><td>false | (input: string, option: OptionProps) =&gt; boolean</td><td></td></tr><tr><td>getPopupContainer</td><td>\u6307\u5B9A\u5EFA\u8BAE\u6846\u6302\u8F7D\u7684 HTML \u8282\u70B9</td><td>() =&gt; HTMLElement</td><td></td></tr><tr><td>notFoundContent</td><td>\u5F53\u4E0B\u62C9\u5217\u8868\u4E3A\u7A7A\u65F6\u663E\u793A\u7684\u5185\u5BB9</td><td>string | slot</td><td>&#39;Not Found&#39;</td></tr><tr><td>placement</td><td>\u5F39\u51FA\u5C42\u5C55\u793A\u4F4D\u7F6E</td><td><code>top</code> | <code>bottom</code></td><td><code>bottom</code></td></tr><tr><td>prefix</td><td>\u8BBE\u7F6E\u89E6\u53D1\u5173\u952E\u5B57</td><td>string | string[]</td><td>&#39;@&#39;</td></tr><tr><td>split</td><td>\u8BBE\u7F6E\u9009\u4E2D\u9879\u524D\u540E\u5206\u9694\u7B26</td><td>string</td><td>&#39; &#39;</td></tr><tr><td>validateSearch</td><td>\u81EA\u5B9A\u4E49\u89E6\u53D1\u9A8C\u8BC1\u903B\u8F91</td><td>(text: string, props: MentionsProps) =&gt; void</td><td></td></tr><tr><td>value(v-model)</td><td>\u8BBE\u7F6E\u503C</td><td>string</td><td></td></tr></tbody></table><h3 id="\u4E8B\u4EF6">\u4E8B\u4EF6 <a class="header-anchor" href="#\u4E8B\u4EF6"><span aria-hidden="true" class="anchor">#</span></a></h3><table><thead><tr><th>\u4E8B\u4EF6\u540D\u79F0</th><th>\u8BF4\u660E</th><th>\u56DE\u8C03\u53C2\u6570</th></tr></thead><tbody><tr><td>blur</td><td>\u5931\u53BB\u7126\u70B9\u7684\u65F6\u56DE\u8C03</td><td>function</td></tr><tr><td>change</td><td>\u503C\u6539\u53D8\u65F6\u89E6\u53D1</td><td>function(value: string)</td></tr><tr><td>focus</td><td>\u83B7\u5F97\u7126\u70B9\u65F6\u56DE\u8C03</td><td>function</td></tr><tr><td>search</td><td>\u6587\u672C\u6846\u503C\u53D8\u5316\u65F6\u56DE\u8C03</td><td>function(value: string, prefix: string)</td></tr><tr><td>select</td><td>\u9009\u62E9\u9009\u9879\u65F6\u89E6\u53D1</td><td>function(option: OptionProps, prefix: string)</td></tr></tbody></table><h3 id="Mentions-\u65B9\u6CD5">Mentions \u65B9\u6CD5 <a class="header-anchor" href="#Mentions-\u65B9\u6CD5"><span aria-hidden="true" class="anchor">#</span></a></h3><table><thead><tr><th>\u540D\u79F0</th><th>\u63CF\u8FF0</th></tr></thead><tbody><tr><td>blur()</td><td>\u79FB\u9664\u7126\u70B9</td></tr><tr><td>focus()</td><td>\u83B7\u53D6\u7126\u70B9</td></tr></tbody></table><h3 id="Option">Option <a class="header-anchor" href="#Option"><span aria-hidden="true" class="anchor">#</span></a></h3><table><thead><tr><th>\u53C2\u6570</th><th>\u8BF4\u660E</th><th>\u7C7B\u578B</th><th>\u9ED8\u8BA4\u503C</th></tr></thead><tbody><tr><td>value</td><td>\u9009\u62E9\u65F6\u586B\u5145\u7684\u503C</td><td>string</td><td>&#39;&#39;</td></tr></tbody></table>',12)]))}const cn=b(on,[["render",pn]]),ln={pageData:{title:"Mentions",description:"",frontmatter:{category:"Components",type:"Data Entry",title:"Mentions",cover:"https://gw.alipayobjects.com/zos/alicdn/jPE-itMFM/Mentions.svg"},headers:[{level:2,title:"When To Use",slug:"When-To-Use",content:"When you need to mention someone or something."},{level:2,title:"API",slug:"API",content:"Mention"},{level:3,title:"Mention",slug:"Mention",content:""},{level:3,title:"Events",slug:"Events",content:""},{level:3,title:"Mention methods",slug:"Mention-methods",content:""},{level:3,title:"Option",slug:"Option",content:""}],relativePath:"components/mentions/index.en-US.md",content:`
Mention component.

## When To Use

When you need to mention someone or something.

## API

### Mention

| Property | Description | Type | Default |
| --- | --- | --- | --- |
| autofocus | Auto get focus when component mounted | boolean | \`false\` |
| defaultValue | Default value | string |  |
| filterOption | Customize filter option logic | false \\| (input: string, option: OptionProps) =&gt; boolean |  |
| getPopupContainer | Set the mount HTML node for suggestions | () =&gt; HTMLElement |  |
| notFoundContent | Set mentions content when not match | string \\| slot | &#39;Not Found&#39; |
| placement | Set popup placement | \`top\` \\| \`bottom\` | \`bottom\` |
| prefix | Set trigger prefix keyword | string \\| string\\[] | &#39;@&#39; |
| split | Set split string before and after selected mention | string | &#39; &#39; |
| validateSearch | Customize trigger search logic | (text: string, props: MentionsProps) =&gt; void |  |
| value(v-model) | Set value of mentions | string |  |

### Events

| Events Name | Description | Arguments |
| --- | --- | --- |
| blur | remove focus | function |
| change | Trigger when value changed | function(value: string) |
| focus | get focus | function |
| search | Trigger when prefix hit | function(value: string, prefix: string) |
| select | Trigger when user select the option | function(option: OptionProps, prefix: string) |

### Mention methods

| Name    | Description  |
| ------- | ------------ |
| blur()  | remove focus |
| focus() | get focus    |

### Option

| Property | Description | Type | Default |
| --- | --- | --- | --- |
| value | value of suggestion, the value will insert into input filed while selected | string | &#39;&#39; |
`,html:`<p>Mention component.</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>When you need to mention someone or something.</p>
<h2 id="API">API <a class="header-anchor" href="#API">
          <span aria-hidden="true" class="anchor">#</span>
        </a></h2>
<h3 id="Mention">Mention <a class="header-anchor" href="#Mention">
          <span aria-hidden="true" class="anchor">#</span>
        </a></h3>
<table>
<thead>
<tr>
<th>Property</th>
<th>Description</th>
<th>Type</th>
<th>Default</th>
</tr>
</thead>
<tbody>
<tr>
<td>autofocus</td>
<td>Auto get focus when component mounted</td>
<td>boolean</td>
<td><code>false</code></td>
</tr>
<tr>
<td>defaultValue</td>
<td>Default value</td>
<td>string</td>
<td></td>
</tr>
<tr>
<td>filterOption</td>
<td>Customize filter option logic</td>
<td>false | (input: string, option: OptionProps) =&gt; boolean</td>
<td></td>
</tr>
<tr>
<td>getPopupContainer</td>
<td>Set the mount HTML node for suggestions</td>
<td>() =&gt; HTMLElement</td>
<td></td>
</tr>
<tr>
<td>notFoundContent</td>
<td>Set mentions content when not match</td>
<td>string | slot</td>
<td>'Not Found'</td>
</tr>
<tr>
<td>placement</td>
<td>Set popup placement</td>
<td><code>top</code> | <code>bottom</code></td>
<td><code>bottom</code></td>
</tr>
<tr>
<td>prefix</td>
<td>Set trigger prefix keyword</td>
<td>string | string[]</td>
<td>'@'</td>
</tr>
<tr>
<td>split</td>
<td>Set split string before and after selected mention</td>
<td>string</td>
<td>' '</td>
</tr>
<tr>
<td>validateSearch</td>
<td>Customize trigger search logic</td>
<td>(text: string, props: MentionsProps) =&gt; void</td>
<td></td>
</tr>
<tr>
<td>value(v-model)</td>
<td>Set value of mentions</td>
<td>string</td>
<td></td>
</tr>
</tbody>
</table>
<h3 id="Events">Events <a class="header-anchor" href="#Events">
          <span aria-hidden="true" class="anchor">#</span>
        </a></h3>
<table>
<thead>
<tr>
<th>Events Name</th>
<th>Description</th>
<th>Arguments</th>
</tr>
</thead>
<tbody>
<tr>
<td>blur</td>
<td>remove focus</td>
<td>function</td>
</tr>
<tr>
<td>change</td>
<td>Trigger when value changed</td>
<td>function(value: string)</td>
</tr>
<tr>
<td>focus</td>
<td>get focus</td>
<td>function</td>
</tr>
<tr>
<td>search</td>
<td>Trigger when prefix hit</td>
<td>function(value: string, prefix: string)</td>
</tr>
<tr>
<td>select</td>
<td>Trigger when user select the option</td>
<td>function(option: OptionProps, prefix: string)</td>
</tr>
</tbody>
</table>
<h3 id="Mention-methods">Mention methods <a class="header-anchor" href="#Mention-methods">
          <span aria-hidden="true" class="anchor">#</span>
        </a></h3>
<table>
<thead>
<tr>
<th>Name</th>
<th>Description</th>
</tr>
</thead>
<tbody>
<tr>
<td>blur()</td>
<td>remove focus</td>
</tr>
<tr>
<td>focus()</td>
<td>get focus</td>
</tr>
</tbody>
</table>
<h3 id="Option">Option <a class="header-anchor" href="#Option">
          <span aria-hidden="true" class="anchor">#</span>
        </a></h3>
<table>
<thead>
<tr>
<th>Property</th>
<th>Description</th>
<th>Type</th>
<th>Default</th>
</tr>
</thead>
<tbody>
<tr>
<td>value</td>
<td>value of suggestion, the value will insert into input filed while selected</td>
<td>string</td>
<td>''</td>
</tr>
</tbody>
</table>
`,lastUpdated:1748060300908}},un={class:"markdown"};function kn(s,a,i,d,g,m){return r(),h("article",un,a[0]||(a[0]=[H('<p>Mention component.</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>When you need to mention someone or something.</p><h2 id="API">API <a class="header-anchor" href="#API"><span aria-hidden="true" class="anchor">#</span></a></h2><h3 id="Mention">Mention <a class="header-anchor" href="#Mention"><span aria-hidden="true" class="anchor">#</span></a></h3><table><thead><tr><th>Property</th><th>Description</th><th>Type</th><th>Default</th></tr></thead><tbody><tr><td>autofocus</td><td>Auto get focus when component mounted</td><td>boolean</td><td><code>false</code></td></tr><tr><td>defaultValue</td><td>Default value</td><td>string</td><td></td></tr><tr><td>filterOption</td><td>Customize filter option logic</td><td>false | (input: string, option: OptionProps) =&gt; boolean</td><td></td></tr><tr><td>getPopupContainer</td><td>Set the mount HTML node for suggestions</td><td>() =&gt; HTMLElement</td><td></td></tr><tr><td>notFoundContent</td><td>Set mentions content when not match</td><td>string | slot</td><td>&#39;Not Found&#39;</td></tr><tr><td>placement</td><td>Set popup placement</td><td><code>top</code> | <code>bottom</code></td><td><code>bottom</code></td></tr><tr><td>prefix</td><td>Set trigger prefix keyword</td><td>string | string[]</td><td>&#39;@&#39;</td></tr><tr><td>split</td><td>Set split string before and after selected mention</td><td>string</td><td>&#39; &#39;</td></tr><tr><td>validateSearch</td><td>Customize trigger search logic</td><td>(text: string, props: MentionsProps) =&gt; void</td><td></td></tr><tr><td>value(v-model)</td><td>Set value of mentions</td><td>string</td><td></td></tr></tbody></table><h3 id="Events">Events <a class="header-anchor" href="#Events"><span aria-hidden="true" class="anchor">#</span></a></h3><table><thead><tr><th>Events Name</th><th>Description</th><th>Arguments</th></tr></thead><tbody><tr><td>blur</td><td>remove focus</td><td>function</td></tr><tr><td>change</td><td>Trigger when value changed</td><td>function(value: string)</td></tr><tr><td>focus</td><td>get focus</td><td>function</td></tr><tr><td>search</td><td>Trigger when prefix hit</td><td>function(value: string, prefix: string)</td></tr><tr><td>select</td><td>Trigger when user select the option</td><td>function(option: OptionProps, prefix: string)</td></tr></tbody></table><h3 id="Mention-methods">Mention methods <a class="header-anchor" href="#Mention-methods"><span aria-hidden="true" class="anchor">#</span></a></h3><table><thead><tr><th>Name</th><th>Description</th></tr></thead><tbody><tr><td>blur()</td><td>remove focus</td></tr><tr><td>focus()</td><td>get focus</td></tr></tbody></table><h3 id="Option">Option <a class="header-anchor" href="#Option"><span aria-hidden="true" class="anchor">#</span></a></h3><table><thead><tr><th>Property</th><th>Description</th><th>Type</th><th>Default</th></tr></thead><tbody><tr><td>value</td><td>value of suggestion, the value will insert into input filed while selected</td><td>string</td><td>&#39;&#39;</td></tr></tbody></table>',12)]))}const rn=b(ln,[["render",kn]]),gn=v({CN:cn,US:rn,components:{Basic:R,Async:M,Prefix:O,Readonly:nn,Placement:sn,FormMentions:U}});function dn(s,a,i,d,g,m){const e=l("basic"),u=l("async"),k=l("prefix"),p=l("readonly"),A=l("placement"),w=l("FormMentions"),f=l("demo-sort");return r(),C(f,null,{default:o(()=>[c(e),c(u),c(k),c(p),c(A),c(w)]),_:1})}const In=b(gn,[["render",dn]]);export{In as default};