import{d as B,_ as m,l as y,w as s,j as p,k as r,f as e,e as n,b as t,t as W,r as b,z as X,at as v,y as E,b6 as w,a as Z,c as Y,q as f}from"./index.3fe853a6.js";import{H as S,S as V}from"./SmileFilled.c7f61187.js";import{S as x}from"./SmileOutlined.02787c93.js";const D=B({setup(){return{blockContent:`AntV \u662F\u8682\u8681\u91D1\u670D\u5168\u65B0\u4E00\u4EE3\u6570\u636E\u53EF\u89C6\u5316\u89E3\u51B3\u65B9\u6848\uFF0C\u81F4\u529B\u4E8E\u63D0\u4F9B\u4E00\u5957\u7B80\u5355\u65B9\u4FBF\u3001\u4E13\u4E1A\u53EF\u9760\u3001\u4E0D\u9650\u53EF\u80FD\u7684\u6570\u636E\u53EF\u89C6\u5316\u6700\u4F73\u5B9E\u8DF5\u3002\u5F97\u76CA\u4E8E\u4E30\u5BCC\u7684\u4E1A\u52A1\u573A\u666F\u548C\u7528\u6237\u9700\u6C42\u6311\u6218\uFF0CAntV \u7ECF\u5386\u591A\u5E74\u79EF\u7D2F\u4E0E\u4E0D\u65AD\u6253\u78E8\uFF0C\u5DF2\u652F\u6491\u6574\u4E2A\u963F\u91CC\u96C6\u56E2\u5185\u5916 20000+ \u4E1A\u52A1\u7CFB\u7EDF\uFF0C\u901A\u8FC7\u4E86\u65E5\u5747\u5343\u4E07\u7EA7 UV \u4EA7\u54C1\u7684\u4E25\u82DB\u8003\u9A8C\u3002 \u6211\u4EEC\u6B63\u5728\u57FA\u7840\u56FE\u8868\uFF0C\u56FE\u5206\u6790\uFF0C\u56FE\u7F16\u8F91\uFF0C\u5730\u7406\u7A7A\u95F4\u53EF\u89C6\u5316\uFF0C\u667A\u80FD\u53EF\u89C6\u5316\u7B49\u5404\u4E2A\u53EF\u89C6\u5316\u7684\u9886\u57DF\u8015\u8018\uFF0C\u6B22\u8FCE\u540C\u8DEF\u4EBA\u4E00\u8D77\u524D\u884C\u3002`}}});function R(o,a,l,k,g,I){const c=p("a-typography-title"),u=p("a-typography-paragraph"),i=p("a-typography-text"),h=p("a-typography-link"),C=p("a-divider"),A=p("a-typography"),G=p("demo-box");return r(),y(G,{jsfiddle:{us:"Display the document sample.",cn:"\u5C55\u793A\u6587\u6863\u6837\u4F8B\u3002",docHtml:`

zh-CN

\u5C55\u793A\u6587\u6863\u6837\u4F8B\u3002

en-US

Display the document sample.

`,order:0,title:{"zh-CN":"\u57FA\u672C","en-US":"Basic"},relativePath:"components/typography/demo/basic.vue",sourceCode:"PHRlbXBsYXRlPgogIDxhLXR5cG9ncmFwaHk+CiAgICA8YS10eXBvZ3JhcGh5LXRpdGxlPkludHJvZHVjdGlvbjwvYS10eXBvZ3JhcGh5LXRpdGxlPgogICAgPGEtdHlwb2dyYXBoeS1wYXJhZ3JhcGg+CiAgICAgIEluIHRoZSBwcm9jZXNzIG9mIGludGVybmFsIGRlc2t0b3AgYXBwbGljYXRpb25zIGRldmVsb3BtZW50LCBtYW55IGRpZmZlcmVudCBkZXNpZ24gc3BlY3MgYW5kCiAgICAgIGltcGxlbWVudGF0aW9ucyB3b3VsZCBiZSBpbnZvbHZlZCwgd2hpY2ggbWlnaHQgY2F1c2UgZGVzaWduZXJzIGFuZCBkZXZlbG9wZXJzIGRpZmZpY3VsdGllcyBhbmQKICAgICAgZHVwbGljYXRpb24gYW5kIHJlZHVjZSB0aGUgZWZmaWNpZW5jeSBvZiBkZXZlbG9wbWVudC4KICAgIDwvYS10eXBvZ3JhcGh5LXBhcmFncmFwaD4KICAgIDxhLXR5cG9ncmFwaHktcGFyYWdyYXBoPgogICAgICBBZnRlciBtYXNzaXZlIHByb2plY3QgcHJhY3RpY2UgYW5kIHN1bW1hcmllcywgQW50IERlc2lnbiwgYSBkZXNpZ24gbGFuZ3VhZ2UgZm9yIGJhY2tncm91bmQKICAgICAgYXBwbGljYXRpb25zLCBpcyByZWZpbmVkIGJ5IEFudCBVRUQgVGVhbSwgd2hpY2ggYWltcyB0bwogICAgICA8YS10eXBvZ3JhcGh5LXRleHQgc3Ryb25nPgogICAgICAgIHVuaWZvcm0gdGhlIHVzZXIgaW50ZXJmYWNlIHNwZWNzIGZvciBpbnRlcm5hbCBiYWNrZ3JvdW5kIHByb2plY3RzLCBsb3dlciB0aGUgdW5uZWNlc3NhcnkKICAgICAgICBjb3N0IG9mIGRlc2lnbiBkaWZmZXJlbmNlcyBhbmQgaW1wbGVtZW50YXRpb24gYW5kIGxpYmVyYXRlIHRoZSByZXNvdXJjZXMgb2YgZGVzaWduIGFuZAogICAgICAgIGZyb250LWVuZCBkZXZlbG9wbWVudC4KICAgICAgPC9hLXR5cG9ncmFwaHktdGV4dD4KICAgIDwvYS10eXBvZ3JhcGh5LXBhcmFncmFwaD4KICAgIDxhLXR5cG9ncmFwaHktdGl0bGUgOmxldmVsPSIyIj5HdWlkZWxpbmVzIGFuZCBSZXNvdXJjZXM8L2EtdHlwb2dyYXBoeS10aXRsZT4KICAgIDxhLXR5cG9ncmFwaHktcGFyYWdyYXBoPgogICAgICBXZSBzdXBwbHkgYSBzZXJpZXMgb2YgZGVzaWduIHByaW5jaXBsZXMsIHByYWN0aWNhbCBwYXR0ZXJucyBhbmQgaGlnaCBxdWFsaXR5IGRlc2lnbiByZXNvdXJjZXMKICAgICAgKAogICAgICA8YS10eXBvZ3JhcGh5LXRleHQgY29kZT5Ta2V0Y2g8L2EtdHlwb2dyYXBoeS10ZXh0PgogICAgICBhbmQKICAgICAgPGEtdHlwb2dyYXBoeS10ZXh0IGNvZGU+QXh1cmU8L2EtdHlwb2dyYXBoeS10ZXh0PgogICAgICApLCB0byBoZWxwIHBlb3BsZSBjcmVhdGUgdGhlaXIgcHJvZHVjdCBwcm90b3R5cGVzIGJlYXV0aWZ1bGx5IGFuZCBlZmZpY2llbnRseS4KICAgIDwvYS10eXBvZ3JhcGh5LXBhcmFncmFwaD4KCiAgICA8YS10eXBvZ3JhcGh5LXBhcmFncmFwaD4KICAgICAgPHVsPgogICAgICAgIDxsaT4KICAgICAgICAgIDxhLXR5cG9ncmFwaHktbGluayBocmVmPSIvZG9jcy9yZXNvdXJjZXMiPlJlc291cmNlIERvd25sb2FkPC9hLXR5cG9ncmFwaHktbGluaz4KICAgICAgICA8L2xpPgogICAgICA8L3VsPgogICAgPC9hLXR5cG9ncmFwaHktcGFyYWdyYXBoPgoKICAgIDxhLXR5cG9ncmFwaHktcGFyYWdyYXBoPgogICAgICBQcmVzcwogICAgICA8YS10eXBvZ3JhcGh5LXRleHQga2V5Ym9hcmQ+RXNjPC9hLXR5cG9ncmFwaHktdGV4dD4KICAgICAgdG8gZXhpdC4uLgogICAgPC9hLXR5cG9ncmFwaHktcGFyYWdyYXBoPgoKICAgIDxhLWRpdmlkZXIgLz4KCiAgICA8YS10eXBvZ3JhcGh5LXRpdGxlPuS7i+e7jTwvYS10eXBvZ3JhcGh5LXRpdGxlPgogICAgPGEtdHlwb2dyYXBoeS1wYXJhZ3JhcGg+CiAgICAgIOiaguiageeahOS8geS4mue6p+S6p+WTgeaYr+S4gOS4quW6nuWkp+S4lOWkjeadgueahOS9k+ezu+OAgui/meexu+S6p+WTgeS4jeS7hemHj+e6p+W3qOWkp+S4lOWKn+iDveWkjeadgu+8jOiAjOS4lOWPmOWKqOWSjOW5tuWPkemikee5ge+8jOW4uOW4uOmcgOimgeiuvuiuoeS4juW8gOWPkeiDveWkn+W/q+mAn+eahOWBmuWHuuWTjeW6lOOAguWQjOaXtui/meexu+S6p+WTgeS4reacieWtmOWcqOW+iOWkmuexu+S8vOeahOmhtemdouS7peWPiue7hOS7tu+8jOWPr+S7pemAmui/h+aKveixoeW+l+WIsOS4gOS6m+eos+WumuS4lOmrmOWkjeeUqOaAp+eahOWGheWuueOAggogICAgPC9hLXR5cG9ncmFwaHktcGFyYWdyYXBoPgogICAgPGEtdHlwb2dyYXBoeS1wYXJhZ3JhcGg+CiAgICAgIOmaj+edgOWVhuS4muWMlueahOi2i+WKv++8jOi2iuadpei2iuWkmueahOS8geS4mue6p+S6p+WTgeWvueabtOWlveeahOeUqOaIt+S9k+mqjOacieS6hui/m+S4gOatpeeahOimgeaxguOAguW4puedgOi/meagt+eahOS4gOS4que7iOaegeebruagh++8jOaIkeS7rO+8iOiaguiagemHkeacjeS9k+mqjOaKgOacr+mDqO+8iee7j+i/h+Wkp+mHj+eahOmhueebruWunui3teWSjOaAu+e7k++8jOmAkOatpeaJk+ejqOWHuuS4gOS4quacjeWKoeS6juS8geS4mue6p+S6p+WTgeeahOiuvuiuoeS9k+ezuwogICAgICBBbnQgRGVzaWdu44CC5Z+65LqOCiAgICAgIDxhLXR5cG9ncmFwaHktdGV4dCBtYXJrPuOAjuehruWumuOAj+WSjOOAjuiHqueEtuOAjzwvYS10eXBvZ3JhcGh5LXRleHQ+CiAgICAgIOeahOiuvuiuoeS7t+WAvOingu+8jOmAmui/h+aooeWdl+WMlueahOino+WGs+aWueahiO+8jOmZjeS9juWGl+S9meeahOeUn+S6p+aIkOacrO+8jOiuqeiuvuiuoeiAheS4k+azqOS6jgogICAgICA8YS10eXBvZ3JhcGh5LXRleHQgc3Ryb25nPuabtOWlveeahOeUqOaIt+S9k+mqjDwvYS10eXBvZ3JhcGh5LXRleHQ+CiAgICAgIOOAggogICAgPC9hLXR5cG9ncmFwaHktcGFyYWdyYXBoPgogICAgPGEtdHlwb2dyYXBoeS10aXRsZSA6bGV2ZWw9IjIiPuiuvuiuoei1hOa6kDwvYS10eXBvZ3JhcGh5LXRpdGxlPgogICAgPGEtdHlwb2dyYXBoeS1wYXJhZ3JhcGg+CiAgICAgIOaIkeS7rOaPkOS+m+WujOWWhOeahOiuvuiuoeWOn+WImeOAgeacgOS9s+Wunui3teWSjOiuvuiuoei1hOa6kOaWh+S7tu+8iAogICAgICA8YS10eXBvZ3JhcGh5LXRleHQgY29kZT5Ta2V0Y2g8L2EtdHlwb2dyYXBoeS10ZXh0PgogICAgICDlkowKICAgICAgPGEtdHlwb2dyYXBoeS10ZXh0IGNvZGU+QXh1cmU8L2EtdHlwb2dyYXBoeS10ZXh0PgogICAgICDvvInvvIzmnaXluK7liqnkuJrliqHlv6vpgJ/orr7orqHlh7rpq5jotKjph4/nmoTkuqflk4Hljp/lnovjgIIKICAgIDwvYS10eXBvZ3JhcGh5LXBhcmFncmFwaD4KCiAgICA8YS10eXBvZ3JhcGh5LXBhcmFncmFwaD4KICAgICAgPHVsPgogICAgICAgIDxsaT4KICAgICAgICAgIDxhLXR5cG9ncmFwaHktbGluayBocmVmPSIvZG9jcy9yZXNvdXJjZXMtY24iPuiuvuiuoei1hOa6kDwvYS10eXBvZ3JhcGh5LWxpbms+CiAgICAgICAgPC9saT4KICAgICAgPC91bD4KICAgIDwvYS10eXBvZ3JhcGh5LXBhcmFncmFwaD4KCiAgICA8YS10eXBvZ3JhcGh5LXBhcmFncmFwaD4KICAgICAgPGJsb2NrcXVvdGU+e3sgYmxvY2tDb250ZW50IH19PC9ibG9ja3F1b3RlPgogICAgICA8cHJlPnt7IGJsb2NrQ29udGVudCB9fTwvcHJlPgogICAgPC9hLXR5cG9ncmFwaHktcGFyYWdyYXBoPgoKICAgIDxhLXR5cG9ncmFwaHktcGFyYWdyYXBoPgogICAgICDmjIkKICAgICAgPGEtdHlwb2dyYXBoeS10ZXh0IGtleWJvYXJkPkVzYzwvYS10eXBvZ3JhcGh5LXRleHQ+CiAgICAgIOmUrumAgOWHuumYheivu+KApuKApgogICAgPC9hLXR5cG9ncmFwaHktcGFyYWdyYXBoPgogIDwvYS10eXBvZ3JhcGh5Pgo8L3RlbXBsYXRlPgo8c2NyaXB0IGxhbmc9InRzIj4KaW1wb3J0IHsgZGVmaW5lQ29tcG9uZW50IH0gZnJvbSAndnVlJzsKCmV4cG9ydCBkZWZhdWx0IGRlZmluZUNvbXBvbmVudCh7CiAgc2V0dXAoKSB7CiAgICByZXR1cm4gewogICAgICBibG9ja0NvbnRlbnQ6IGBBbnRWIOaYr+iaguiagemHkeacjeWFqOaWsOS4gOS7o+aVsOaNruWPr+inhuWMluino+WGs+aWueahiO+8jOiHtOWKm+S6juaPkOS+m+S4gOWll+eugOWNleaWueS+v+OAgeS4k+S4muWPr+mdoOOAgeS4jemZkOWPr+iDveeahOaVsOaNruWPr+inhuWMluacgOS9s+Wunui3teOAguW+l+ebiuS6juS4sOWvjOeahOS4muWKoeWcuuaZr+WSjOeUqOaIt+mcgOaxguaMkeaImO+8jEFudFYg57uP5Y6G5aSa5bm056ev57Sv5LiO5LiN5pat5omT56Oo77yM5bey5pSv5pKR5pW05Liq6Zi/6YeM6ZuG5Zui5YaF5aSWIDIwMDAwKyDkuJrliqHns7vnu5/vvIzpgJrov4fkuobml6XlnYfljYPkuIfnuqcgVVYg5Lqn5ZOB55qE5Lil6Iub6ICD6aqM44CCCuaIkeS7rOato+WcqOWfuuehgOWbvuihqO+8jOWbvuWIhuaekO+8jOWbvue8lui+ke+8jOWcsOeQhuepuumXtOWPr+inhuWMlu+8jOaZuuiDveWPr+inhuWMluetieWQhOS4quWPr+inhuWMlueahOmihuWfn+iAleiAmO+8jOasoui/juWQjOi3r+S6uuS4gOi1t+WJjeihjOOAgmAsCiAgICB9OwogIH0sCn0pOwo8L3NjcmlwdD4KCg==",jsSourceCode:"PHRlbXBsYXRlPgogIDxhLXR5cG9ncmFwaHk+CiAgICA8YS10eXBvZ3JhcGh5LXRpdGxlPkludHJvZHVjdGlvbjwvYS10eXBvZ3JhcGh5LXRpdGxlPgogICAgPGEtdHlwb2dyYXBoeS1wYXJhZ3JhcGg+CiAgICAgIEluIHRoZSBwcm9jZXNzIG9mIGludGVybmFsIGRlc2t0b3AgYXBwbGljYXRpb25zIGRldmVsb3BtZW50LCBtYW55IGRpZmZlcmVudCBkZXNpZ24gc3BlY3MgYW5kCiAgICAgIGltcGxlbWVudGF0aW9ucyB3b3VsZCBiZSBpbnZvbHZlZCwgd2hpY2ggbWlnaHQgY2F1c2UgZGVzaWduZXJzIGFuZCBkZXZlbG9wZXJzIGRpZmZpY3VsdGllcyBhbmQKICAgICAgZHVwbGljYXRpb24gYW5kIHJlZHVjZSB0aGUgZWZmaWNpZW5jeSBvZiBkZXZlbG9wbWVudC4KICAgIDwvYS10eXBvZ3JhcGh5LXBhcmFncmFwaD4KICAgIDxhLXR5cG9ncmFwaHktcGFyYWdyYXBoPgogICAgICBBZnRlciBtYXNzaXZlIHByb2plY3QgcHJhY3RpY2UgYW5kIHN1bW1hcmllcywgQW50IERlc2lnbiwgYSBkZXNpZ24gbGFuZ3VhZ2UgZm9yIGJhY2tncm91bmQKICAgICAgYXBwbGljYXRpb25zLCBpcyByZWZpbmVkIGJ5IEFudCBVRUQgVGVhbSwgd2hpY2ggYWltcyB0bwogICAgICA8YS10eXBvZ3JhcGh5LXRleHQgc3Ryb25nPgogICAgICAgIHVuaWZvcm0gdGhlIHVzZXIgaW50ZXJmYWNlIHNwZWNzIGZvciBpbnRlcm5hbCBiYWNrZ3JvdW5kIHByb2plY3RzLCBsb3dlciB0aGUgdW5uZWNlc3NhcnkKICAgICAgICBjb3N0IG9mIGRlc2lnbiBkaWZmZXJlbmNlcyBhbmQgaW1wbGVtZW50YXRpb24gYW5kIGxpYmVyYXRlIHRoZSByZXNvdXJjZXMgb2YgZGVzaWduIGFuZAogICAgICAgIGZyb250LWVuZCBkZXZlbG9wbWVudC4KICAgICAgPC9hLXR5cG9ncmFwaHktdGV4dD4KICAgIDwvYS10eXBvZ3JhcGh5LXBhcmFncmFwaD4KICAgIDxhLXR5cG9ncmFwaHktdGl0bGUgOmxldmVsPSIyIj5HdWlkZWxpbmVzIGFuZCBSZXNvdXJjZXM8L2EtdHlwb2dyYXBoeS10aXRsZT4KICAgIDxhLXR5cG9ncmFwaHktcGFyYWdyYXBoPgogICAgICBXZSBzdXBwbHkgYSBzZXJpZXMgb2YgZGVzaWduIHByaW5jaXBsZXMsIHByYWN0aWNhbCBwYXR0ZXJucyBhbmQgaGlnaCBxdWFsaXR5IGRlc2lnbiByZXNvdXJjZXMKICAgICAgKAogICAgICA8YS10eXBvZ3JhcGh5LXRleHQgY29kZT5Ta2V0Y2g8L2EtdHlwb2dyYXBoeS10ZXh0PgogICAgICBhbmQKICAgICAgPGEtdHlwb2dyYXBoeS10ZXh0IGNvZGU+QXh1cmU8L2EtdHlwb2dyYXBoeS10ZXh0PgogICAgICApLCB0byBoZWxwIHBlb3BsZSBjcmVhdGUgdGhlaXIgcHJvZHVjdCBwcm90b3R5cGVzIGJlYXV0aWZ1bGx5IGFuZCBlZmZpY2llbnRseS4KICAgIDwvYS10eXBvZ3JhcGh5LXBhcmFncmFwaD4KCiAgICA8YS10eXBvZ3JhcGh5LXBhcmFncmFwaD4KICAgICAgPHVsPgogICAgICAgIDxsaT4KICAgICAgICAgIDxhLXR5cG9ncmFwaHktbGluayBocmVmPSIvZG9jcy9yZXNvdXJjZXMiPlJlc291cmNlIERvd25sb2FkPC9hLXR5cG9ncmFwaHktbGluaz4KICAgICAgICA8L2xpPgogICAgICA8L3VsPgogICAgPC9hLXR5cG9ncmFwaHktcGFyYWdyYXBoPgoKICAgIDxhLXR5cG9ncmFwaHktcGFyYWdyYXBoPgogICAgICBQcmVzcwogICAgICA8YS10eXBvZ3JhcGh5LXRleHQga2V5Ym9hcmQ+RXNjPC9hLXR5cG9ncmFwaHktdGV4dD4KICAgICAgdG8gZXhpdC4uLgogICAgPC9hLXR5cG9ncmFwaHktcGFyYWdyYXBoPgoKICAgIDxhLWRpdmlkZXIgLz4KCiAgICA8YS10eXBvZ3JhcGh5LXRpdGxlPuS7i+e7jTwvYS10eXBvZ3JhcGh5LXRpdGxlPgogICAgPGEtdHlwb2dyYXBoeS1wYXJhZ3JhcGg+CiAgICAgIOiaguiageeahOS8geS4mue6p+S6p+WTgeaYr+S4gOS4quW6nuWkp+S4lOWkjeadgueahOS9k+ezu+OAgui/meexu+S6p+WTgeS4jeS7hemHj+e6p+W3qOWkp+S4lOWKn+iDveWkjeadgu+8jOiAjOS4lOWPmOWKqOWSjOW5tuWPkemikee5ge+8jOW4uOW4uOmcgOimgeiuvuiuoeS4juW8gOWPkeiDveWkn+W/q+mAn+eahOWBmuWHuuWTjeW6lOOAguWQjOaXtui/meexu+S6p+WTgeS4reacieWtmOWcqOW+iOWkmuexu+S8vOeahOmhtemdouS7peWPiue7hOS7tu+8jOWPr+S7pemAmui/h+aKveixoeW+l+WIsOS4gOS6m+eos+WumuS4lOmrmOWkjeeUqOaAp+eahOWGheWuueOAggogICAgPC9hLXR5cG9ncmFwaHktcGFyYWdyYXBoPgogICAgPGEtdHlwb2dyYXBoeS1wYXJhZ3JhcGg+CiAgICAgIOmaj+edgOWVhuS4muWMlueahOi2i+WKv++8jOi2iuadpei2iuWkmueahOS8geS4mue6p+S6p+WTgeWvueabtOWlveeahOeUqOaIt+S9k+mqjOacieS6hui/m+S4gOatpeeahOimgeaxguOAguW4puedgOi/meagt+eahOS4gOS4que7iOaegeebruagh++8jOaIkeS7rO+8iOiaguiagemHkeacjeS9k+mqjOaKgOacr+mDqO+8iee7j+i/h+Wkp+mHj+eahOmhueebruWunui3teWSjOaAu+e7k++8jOmAkOatpeaJk+ejqOWHuuS4gOS4quacjeWKoeS6juS8geS4mue6p+S6p+WTgeeahOiuvuiuoeS9k+ezuwogICAgICBBbnQgRGVzaWdu44CC5Z+65LqOCiAgICAgIDxhLXR5cG9ncmFwaHktdGV4dCBtYXJrPuOAjuehruWumuOAj+WSjOOAjuiHqueEtuOAjzwvYS10eXBvZ3JhcGh5LXRleHQ+CiAgICAgIOeahOiuvuiuoeS7t+WAvOingu+8jOmAmui/h+aooeWdl+WMlueahOino+WGs+aWueahiO+8jOmZjeS9juWGl+S9meeahOeUn+S6p+aIkOacrO+8jOiuqeiuvuiuoeiAheS4k+azqOS6jgogICAgICA8YS10eXBvZ3JhcGh5LXRleHQgc3Ryb25nPuabtOWlveeahOeUqOaIt+S9k+mqjDwvYS10eXBvZ3JhcGh5LXRleHQ+CiAgICAgIOOAggogICAgPC9hLXR5cG9ncmFwaHktcGFyYWdyYXBoPgogICAgPGEtdHlwb2dyYXBoeS10aXRsZSA6bGV2ZWw9IjIiPuiuvuiuoei1hOa6kDwvYS10eXBvZ3JhcGh5LXRpdGxlPgogICAgPGEtdHlwb2dyYXBoeS1wYXJhZ3JhcGg+CiAgICAgIOaIkeS7rOaPkOS+m+WujOWWhOeahOiuvuiuoeWOn+WImeOAgeacgOS9s+Wunui3teWSjOiuvuiuoei1hOa6kOaWh+S7tu+8iAogICAgICA8YS10eXBvZ3JhcGh5LXRleHQgY29kZT5Ta2V0Y2g8L2EtdHlwb2dyYXBoeS10ZXh0PgogICAgICDlkowKICAgICAgPGEtdHlwb2dyYXBoeS10ZXh0IGNvZGU+QXh1cmU8L2EtdHlwb2dyYXBoeS10ZXh0PgogICAgICDvvInvvIzmnaXluK7liqnkuJrliqHlv6vpgJ/orr7orqHlh7rpq5jotKjph4/nmoTkuqflk4Hljp/lnovjgIIKICAgIDwvYS10eXBvZ3JhcGh5LXBhcmFncmFwaD4KCiAgICA8YS10eXBvZ3JhcGh5LXBhcmFncmFwaD4KICAgICAgPHVsPgogICAgICAgIDxsaT4KICAgICAgICAgIDxhLXR5cG9ncmFwaHktbGluayBocmVmPSIvZG9jcy9yZXNvdXJjZXMtY24iPuiuvuiuoei1hOa6kDwvYS10eXBvZ3JhcGh5LWxpbms+CiAgICAgICAgPC9saT4KICAgICAgPC91bD4KICAgIDwvYS10eXBvZ3JhcGh5LXBhcmFncmFwaD4KCiAgICA8YS10eXBvZ3JhcGh5LXBhcmFncmFwaD4KICAgICAgPGJsb2NrcXVvdGU+e3sgYmxvY2tDb250ZW50IH19PC9ibG9ja3F1b3RlPgogICAgICA8cHJlPnt7IGJsb2NrQ29udGVudCB9fTwvcHJlPgogICAgPC9hLXR5cG9ncmFwaHktcGFyYWdyYXBoPgoKICAgIDxhLXR5cG9ncmFwaHktcGFyYWdyYXBoPgogICAgICDmjIkKICAgICAgPGEtdHlwb2dyYXBoeS10ZXh0IGtleWJvYXJkPkVzYzwvYS10eXBvZ3JhcGh5LXRleHQ+CiAgICAgIOmUrumAgOWHuumYheivu+KApuKApgogICAgPC9hLXR5cG9ncmFwaHktcGFyYWdyYXBoPgogIDwvYS10eXBvZ3JhcGh5Pgo8L3RlbXBsYXRlPgo8c2NyaXB0PgppbXBvcnQgeyBkZWZpbmVDb21wb25lbnQgfSBmcm9tICd2dWUnOwpleHBvcnQgZGVmYXVsdCBkZWZpbmVDb21wb25lbnQoewogIHNldHVwKCkgewogICAgcmV0dXJuIHsKICAgICAgYmxvY2tDb250ZW50OiBgQW50ViDmmK/omoLomoHph5HmnI3lhajmlrDkuIDku6PmlbDmja7lj6/op4bljJbop6PlhrPmlrnmoYjvvIzoh7Tlipvkuo7mj5DkvpvkuIDlpZfnroDljZXmlrnkvr/jgIHkuJPkuJrlj6/pnaDjgIHkuI3pmZDlj6/og73nmoTmlbDmja7lj6/op4bljJbmnIDkvbPlrp7ot7XjgILlvpfnm4rkuo7kuLDlr4znmoTkuJrliqHlnLrmma/lkoznlKjmiLfpnIDmsYLmjJHmiJjvvIxBbnRWIOe7j+WOhuWkmuW5tOenr+e0r+S4juS4jeaWreaJk+ejqO+8jOW3suaUr+aSkeaVtOS4qumYv+mHjOmbhuWbouWGheWkliAyMDAwMCsg5Lia5Yqh57O757uf77yM6YCa6L+H5LqG5pel5Z2H5Y2D5LiH57qnIFVWIOS6p+WTgeeahOS4peiLm+iAg+mqjOOAggrmiJHku6zmraPlnKjln7rnoYDlm77ooajvvIzlm77liIbmnpDvvIzlm77nvJbovpHvvIzlnLDnkIbnqbrpl7Tlj6/op4bljJbvvIzmmbrog73lj6/op4bljJbnrYnlkITkuKrlj6/op4bljJbnmoTpoobln5/ogJXogJjvvIzmrKLov47lkIzot6/kurrkuIDotbfliY3ooYzjgIJgLAogICAgfTsKICB9LAp9KTsKPC9zY3JpcHQ+"}},{default:s(()=>[e(A,null,{default:s(()=>[e(c,null,{default:s(()=>a[0]||(a[0]=[n("Introduction")])),_:1,__:[0]}),e(u,null,{default:s(()=>a[1]||(a[1]=[n(" In the process of internal desktop applications development, many different design specs and implementations would be involved, which might cause designers and developers difficulties and duplication and reduce the efficiency of development. ")])),_:1,__:[1]}),e(u,null,{default:s(()=>[a[3]||(a[3]=n(" After massive project practice and summaries, Ant Design, a design language for background applications, is refined by Ant UED Team, which aims to ")),e(i,{strong:""},{default:s(()=>a[2]||(a[2]=[n(" uniform the user interface specs for internal background projects, lower the unnecessary cost of design differences and implementation and liberate the resources of design and front-end development. ")])),_:1,__:[2]})]),_:1,__:[3]}),e(c,{level:2},{default:s(()=>a[4]||(a[4]=[n("Guidelines and Resources")])),_:1,__:[4]}),e(u,null,{default:s(()=>[a[7]||(a[7]=n(" We supply a series of design principles, practical patterns and high quality design resources ( ")),e(i,{code:""},{default:s(()=>a[5]||(a[5]=[n("Sketch")])),_:1,__:[5]}),a[8]||(a[8]=n(" and ")),e(i,{code:""},{default:s(()=>a[6]||(a[6]=[n("Axure")])),_:1,__:[6]}),a[9]||(a[9]=n(" ), to help people create their product prototypes beautifully and efficiently. "))]),_:1,__:[7,8,9]}),e(u,null,{default:s(()=>[t("ul",null,[t("li",null,[e(h,{href:"/docs/resources"},{default:s(()=>a[10]||(a[10]=[n("Resource Download")])),_:1,__:[10]})])])]),_:1}),e(u,null,{default:s(()=>[a[12]||(a[12]=n(" Press ")),e(i,{keyboard:""},{default:s(()=>a[11]||(a[11]=[n("Esc")])),_:1,__:[11]}),a[13]||(a[13]=n(" to exit... "))]),_:1,__:[12,13]}),e(C),e(c,null,{default:s(()=>a[14]||(a[14]=[n("\u4ECB\u7ECD")])),_:1,__:[14]}),e(u,null,{default:s(()=>a[15]||(a[15]=[n(" \u8682\u8681\u7684\u4F01\u4E1A\u7EA7\u4EA7\u54C1\u662F\u4E00\u4E2A\u5E9E\u5927\u4E14\u590D\u6742\u7684\u4F53\u7CFB\u3002\u8FD9\u7C7B\u4EA7\u54C1\u4E0D\u4EC5\u91CF\u7EA7\u5DE8\u5927\u4E14\u529F\u80FD\u590D\u6742\uFF0C\u800C\u4E14\u53D8\u52A8\u548C\u5E76\u53D1\u9891\u7E41\uFF0C\u5E38\u5E38\u9700\u8981\u8BBE\u8BA1\u4E0E\u5F00\u53D1\u80FD\u591F\u5FEB\u901F\u7684\u505A\u51FA\u54CD\u5E94\u3002\u540C\u65F6\u8FD9\u7C7B\u4EA7\u54C1\u4E2D\u6709\u5B58\u5728\u5F88\u591A\u7C7B\u4F3C\u7684\u9875\u9762\u4EE5\u53CA\u7EC4\u4EF6\uFF0C\u53EF\u4EE5\u901A\u8FC7\u62BD\u8C61\u5F97\u5230\u4E00\u4E9B\u7A33\u5B9A\u4E14\u9AD8\u590D\u7528\u6027\u7684\u5185\u5BB9\u3002 ")])),_:1,__:[15]}),e(u,null,{default:s(()=>[a[18]||(a[18]=n(" \u968F\u7740\u5546\u4E1A\u5316\u7684\u8D8B\u52BF\uFF0C\u8D8A\u6765\u8D8A\u591A\u7684\u4F01\u4E1A\u7EA7\u4EA7\u54C1\u5BF9\u66F4\u597D\u7684\u7528\u6237\u4F53\u9A8C\u6709\u4E86\u8FDB\u4E00\u6B65\u7684\u8981\u6C42\u3002\u5E26\u7740\u8FD9\u6837\u7684\u4E00\u4E2A\u7EC8\u6781\u76EE\u6807\uFF0C\u6211\u4EEC\uFF08\u8682\u8681\u91D1\u670D\u4F53\u9A8C\u6280\u672F\u90E8\uFF09\u7ECF\u8FC7\u5927\u91CF\u7684\u9879\u76EE\u5B9E\u8DF5\u548C\u603B\u7ED3\uFF0C\u9010\u6B65\u6253\u78E8\u51FA\u4E00\u4E2A\u670D\u52A1\u4E8E\u4F01\u4E1A\u7EA7\u4EA7\u54C1\u7684\u8BBE\u8BA1\u4F53\u7CFB Ant Design\u3002\u57FA\u4E8E ")),e(i,{mark:""},{default:s(()=>a[16]||(a[16]=[n("\u300E\u786E\u5B9A\u300F\u548C\u300E\u81EA\u7136\u300F")])),_:1,__:[16]}),a[19]||(a[19]=n(" \u7684\u8BBE\u8BA1\u4EF7\u503C\u89C2\uFF0C\u901A\u8FC7\u6A21\u5757\u5316\u7684\u89E3\u51B3\u65B9\u6848\uFF0C\u964D\u4F4E\u5197\u4F59\u7684\u751F\u4EA7\u6210\u672C\uFF0C\u8BA9\u8BBE\u8BA1\u8005\u4E13\u6CE8\u4E8E ")),e(i,{strong:""},{default:s(()=>a[17]||(a[17]=[n("\u66F4\u597D\u7684\u7528\u6237\u4F53\u9A8C")])),_:1,__:[17]}),a[20]||(a[20]=n(" \u3002 "))]),_:1,__:[18,19,20]}),e(c,{level:2},{default:s(()=>a[21]||(a[21]=[n("\u8BBE\u8BA1\u8D44\u6E90")])),_:1,__:[21]}),e(u,null,{default:s(()=>[a[24]||(a[24]=n(" \u6211\u4EEC\u63D0\u4F9B\u5B8C\u5584\u7684\u8BBE\u8BA1\u539F\u5219\u3001\u6700\u4F73\u5B9E\u8DF5\u548C\u8BBE\u8BA1\u8D44\u6E90\u6587\u4EF6\uFF08 ")),e(i,{code:""},{default:s(()=>a[22]||(a[22]=[n("Sketch")])),_:1,__:[22]}),a[25]||(a[25]=n(" \u548C ")),e(i,{code:""},{default:s(()=>a[23]||(a[23]=[n("Axure")])),_:1,__:[23]}),a[26]||(a[26]=n(" \uFF09\uFF0C\u6765\u5E2E\u52A9\u4E1A\u52A1\u5FEB\u901F\u8BBE\u8BA1\u51FA\u9AD8\u8D28\u91CF\u7684\u4EA7\u54C1\u539F\u578B\u3002 "))]),_:1,__:[24,25,26]}),e(u,null,{default:s(()=>[t("ul",null,[t("li",null,[e(h,{href:"/docs/resources-cn"},{default:s(()=>a[27]||(a[27]=[n("\u8BBE\u8BA1\u8D44\u6E90")])),_:1,__:[27]})])])]),_:1}),e(u,null,{default:s(()=>[t("blockquote",null,W(o.blockContent),1),t("pre",null,W(o.blockContent),1)]),_:1}),e(u,null,{default:s(()=>[a[29]||(a[29]=n(" \u6309 ")),e(i,{keyboard:""},{default:s(()=>a[28]||(a[28]=[n("Esc")])),_:1,__:[28]}),a[30]||(a[30]=n(" \u952E\u9000\u51FA\u9605\u8BFB\u2026\u2026 "))]),_:1,__:[29,30]})]),_:1})]),htmlCode:s(()=>a[31]||(a[31]=[t("pre",{class:"language-vue"},[t("code",null,[t("span",{class:"token tag"},[t("span",{class:"token tag"},[t("span",{class:"token punctuation"},"<"),n("template")]),t("span",{class:"token punctuation"},">")]),n(` `),t("span",{class:"token tag"},[t("span",{class:"token tag"},[t("span",{class:"token punctuation"},"<"),n("a-typography")]),t("span",{class:"token punctuation"},">")]),n(` `),t("span",{class:"token tag"},[t("span",{class:"token tag"},[t("span",{class:"token punctuation"},"<"),n("a-typography-title")]),t("span",{class:"token punctuation"},">")]),n("Introduction"),t("span",{class:"token tag"},[t("span",{class:"token tag"},[t("span",{class:"token punctuation"},"")]),n(` `),t("span",{class:"token tag"},[t("span",{class:"token tag"},[t("span",{class:"token punctuation"},"<"),n("a-typography-paragraph")]),t("span",{class:"token punctuation"},">")]),n(` In the process of internal desktop applications development, many different design specs and implementations would be involved, which might cause designers and developers difficulties and duplication and reduce the efficiency of development. `),t("span",{class:"token tag"},[t("span",{class:"token tag"},[t("span",{class:"token punctuation"},"")]),n(` `),t("span",{class:"token tag"},[t("span",{class:"token tag"},[t("span",{class:"token punctuation"},"<"),n("a-typography-paragraph")]),t("span",{class:"token punctuation"},">")]),n(` After massive project practice and summaries, Ant Design, a design language for background applications, is refined by Ant UED Team, which aims to `),t("span",{class:"token tag"},[t("span",{class:"token tag"},[t("span",{class:"token punctuation"},"<"),n("a-typography-text")]),n(),t("span",{class:"token attr-name"},"strong"),t("span",{class:"token punctuation"},">")]),n(` uniform the user interface specs for internal background projects, lower the unnecessary cost of design differences and implementation and liberate the resources of design and front-end development. `),t("span",{class:"token tag"},[t("span",{class:"token tag"},[t("span",{class:"token punctuation"},"")]),n(` `),t("span",{class:"token tag"},[t("span",{class:"token tag"},[t("span",{class:"token punctuation"},"")]),n(` `),t("span",{class:"token tag"},[t("span",{class:"token tag"},[t("span",{class:"token punctuation"},"<"),n("a-typography-title")]),n(),t("span",{class:"token attr-name"},":level"),t("span",{class:"token attr-value"},[t("span",{class:"token punctuation attr-equals"},"="),t("span",{class:"token punctuation"},'"'),n("2"),t("span",{class:"token punctuation"},'"')]),t("span",{class:"token punctuation"},">")]),n("Guidelines and Resources"),t("span",{class:"token tag"},[t("span",{class:"token tag"},[t("span",{class:"token punctuation"},"")]),n(` `),t("span",{class:"token tag"},[t("span",{class:"token tag"},[t("span",{class:"token punctuation"},"<"),n("a-typography-paragraph")]),t("span",{class:"token punctuation"},">")]),n(` We supply a series of design principles, practical patterns and high quality design resources ( `),t("span",{class:"token tag"},[t("span",{class:"token tag"},[t("span",{class:"token punctuation"},"<"),n("a-typography-text")]),n(),t("span",{class:"token attr-name"},"code"),t("span",{class:"token punctuation"},">")]),n("Sketch"),t("span",{class:"token tag"},[t("span",{class:"token tag"},[t("span",{class:"token punctuation"},"")]),n(` and `),t("span",{class:"token tag"},[t("span",{class:"token tag"},[t("span",{class:"token punctuation"},"<"),n("a-typography-text")]),n(),t("span",{class:"token attr-name"},"code"),t("span",{class:"token punctuation"},">")]),n("Axure"),t("span",{class:"token tag"},[t("span",{class:"token tag"},[t("span",{class:"token punctuation"},"")]),n(` ), to help people create their product prototypes beautifully and efficiently. `),t("span",{class:"token tag"},[t("span",{class:"token tag"},[t("span",{class:"token punctuation"},"")]),n(` `),t("span",{class:"token tag"},[t("span",{class:"token tag"},[t("span",{class:"token punctuation"},"<"),n("a-typography-paragraph")]),t("span",{class:"token punctuation"},">")]),n(` `),t("span",{class:"token tag"},[t("span",{class:"token tag"},[t("span",{class:"token punctuation"},"<"),n("ul")]),t("span",{class:"token punctuation"},">")]),n(` `),t("span",{class:"token tag"},[t("span",{class:"token tag"},[t("span",{class:"token punctuation"},"<"),n("li")]),t("span",{class:"token punctuation"},">")]),n(` `),t("span",{class:"token tag"},[t("span",{class:"token tag"},[t("span",{class:"token punctuation"},"<"),n("a-typography-link")]),n(),t("span",{class:"token attr-name"},"href"),t("span",{class:"token attr-value"},[t("span",{class:"token punctuation attr-equals"},"="),t("span",{class:"token punctuation"},'"'),n("/docs/resources"),t("span",{class:"token punctuation"},'"')]),t("span",{class:"token punctuation"},">")]),n("Resource Download"),t("span",{class:"token tag"},[t("span",{class:"token tag"},[t("span",{class:"token punctuation"},"")]),n(` `),t("span",{class:"token tag"},[t("span",{class:"token tag"},[t("span",{class:"token punctuation"},"")]),n(` `),t("span",{class:"token tag"},[t("span",{class:"token tag"},[t("span",{class:"token punctuation"},"")]),n(` `),t("span",{class:"token tag"},[t("span",{class:"token tag"},[t("span",{class:"token punctuation"},"")]),n(` `),t("span",{class:"token tag"},[t("span",{class:"token tag"},[t("span",{class:"token punctuation"},"<"),n("a-typography-paragraph")]),t("span",{class:"token punctuation"},">")]),n(` Press `),t("span",{class:"token tag"},[t("span",{class:"token tag"},[t("span",{class:"token punctuation"},"<"),n("a-typography-text")]),n(),t("span",{class:"token attr-name"},"keyboard"),t("span",{class:"token punctuation"},">")]),n("Esc"),t("span",{class:"token tag"},[t("span",{class:"token tag"},[t("span",{class:"token punctuation"},"")]),n(` to exit... `),t("span",{class:"token tag"},[t("span",{class:"token tag"},[t("span",{class:"token punctuation"},"")]),n(` `),t("span",{class:"token tag"},[t("span",{class:"token tag"},[t("span",{class:"token punctuation"},"<"),n("a-divider")]),n(),t("span",{class:"token punctuation"},"/>")]),n(` `),t("span",{class:"token tag"},[t("span",{class:"token tag"},[t("span",{class:"token punctuation"},"<"),n("a-typography-title")]),t("span",{class:"token punctuation"},">")]),n("\u4ECB\u7ECD"),t("span",{class:"token tag"},[t("span",{class:"token tag"},[t("span",{class:"token punctuation"},"")]),n(` `),t("span",{class:"token tag"},[t("span",{class:"token tag"},[t("span",{class:"token punctuation"},"<"),n("a-typography-paragraph")]),t("span",{class:"token punctuation"},">")]),n(` \u8682\u8681\u7684\u4F01\u4E1A\u7EA7\u4EA7\u54C1\u662F\u4E00\u4E2A\u5E9E\u5927\u4E14\u590D\u6742\u7684\u4F53\u7CFB\u3002\u8FD9\u7C7B\u4EA7\u54C1\u4E0D\u4EC5\u91CF\u7EA7\u5DE8\u5927\u4E14\u529F\u80FD\u590D\u6742\uFF0C\u800C\u4E14\u53D8\u52A8\u548C\u5E76\u53D1\u9891\u7E41\uFF0C\u5E38\u5E38\u9700\u8981\u8BBE\u8BA1\u4E0E\u5F00\u53D1\u80FD\u591F\u5FEB\u901F\u7684\u505A\u51FA\u54CD\u5E94\u3002\u540C\u65F6\u8FD9\u7C7B\u4EA7\u54C1\u4E2D\u6709\u5B58\u5728\u5F88\u591A\u7C7B\u4F3C\u7684\u9875\u9762\u4EE5\u53CA\u7EC4\u4EF6\uFF0C\u53EF\u4EE5\u901A\u8FC7\u62BD\u8C61\u5F97\u5230\u4E00\u4E9B\u7A33\u5B9A\u4E14\u9AD8\u590D\u7528\u6027\u7684\u5185\u5BB9\u3002 `),t("span",{class:"token tag"},[t("span",{class:"token tag"},[t("span",{class:"token punctuation"},"")]),n(` `),t("span",{class:"token tag"},[t("span",{class:"token tag"},[t("span",{class:"token punctuation"},"<"),n("a-typography-paragraph")]),t("span",{class:"token punctuation"},">")]),n(` \u968F\u7740\u5546\u4E1A\u5316\u7684\u8D8B\u52BF\uFF0C\u8D8A\u6765\u8D8A\u591A\u7684\u4F01\u4E1A\u7EA7\u4EA7\u54C1\u5BF9\u66F4\u597D\u7684\u7528\u6237\u4F53\u9A8C\u6709\u4E86\u8FDB\u4E00\u6B65\u7684\u8981\u6C42\u3002\u5E26\u7740\u8FD9\u6837\u7684\u4E00\u4E2A\u7EC8\u6781\u76EE\u6807\uFF0C\u6211\u4EEC\uFF08\u8682\u8681\u91D1\u670D\u4F53\u9A8C\u6280\u672F\u90E8\uFF09\u7ECF\u8FC7\u5927\u91CF\u7684\u9879\u76EE\u5B9E\u8DF5\u548C\u603B\u7ED3\uFF0C\u9010\u6B65\u6253\u78E8\u51FA\u4E00\u4E2A\u670D\u52A1\u4E8E\u4F01\u4E1A\u7EA7\u4EA7\u54C1\u7684\u8BBE\u8BA1\u4F53\u7CFB Ant Design\u3002\u57FA\u4E8E `),t("span",{class:"token tag"},[t("span",{class:"token tag"},[t("span",{class:"token punctuation"},"<"),n("a-typography-text")]),n(),t("span",{class:"token attr-name"},"mark"),t("span",{class:"token punctuation"},">")]),n("\u300E\u786E\u5B9A\u300F\u548C\u300E\u81EA\u7136\u300F"),t("span",{class:"token tag"},[t("span",{class:"token tag"},[t("span",{class:"token punctuation"},"")]),n(` \u7684\u8BBE\u8BA1\u4EF7\u503C\u89C2\uFF0C\u901A\u8FC7\u6A21\u5757\u5316\u7684\u89E3\u51B3\u65B9\u6848\uFF0C\u964D\u4F4E\u5197\u4F59\u7684\u751F\u4EA7\u6210\u672C\uFF0C\u8BA9\u8BBE\u8BA1\u8005\u4E13\u6CE8\u4E8E `),t("span",{class:"token tag"},[t("span",{class:"token tag"},[t("span",{class:"token punctuation"},"<"),n("a-typography-text")]),n(),t("span",{class:"token attr-name"},"strong"),t("span",{class:"token punctuation"},">")]),n("\u66F4\u597D\u7684\u7528\u6237\u4F53\u9A8C"),t("span",{class:"token tag"},[t("span",{class:"token tag"},[t("span",{class:"token punctuation"},"")]),n(` \u3002 `),t("span",{class:"token tag"},[t("span",{class:"token tag"},[t("span",{class:"token punctuation"},"")]),n(` `),t("span",{class:"token tag"},[t("span",{class:"token tag"},[t("span",{class:"token punctuation"},"<"),n("a-typography-title")]),n(),t("span",{class:"token attr-name"},":level"),t("span",{class:"token attr-value"},[t("span",{class:"token punctuation attr-equals"},"="),t("span",{class:"token punctuation"},'"'),n("2"),t("span",{class:"token punctuation"},'"')]),t("span",{class:"token punctuation"},">")]),n("\u8BBE\u8BA1\u8D44\u6E90"),t("span",{class:"token tag"},[t("span",{class:"token tag"},[t("span",{class:"token punctuation"},"")]),n(` `),t("span",{class:"token tag"},[t("span",{class:"token tag"},[t("span",{class:"token punctuation"},"<"),n("a-typography-paragraph")]),t("span",{class:"token punctuation"},">")]),n(` \u6211\u4EEC\u63D0\u4F9B\u5B8C\u5584\u7684\u8BBE\u8BA1\u539F\u5219\u3001\u6700\u4F73\u5B9E\u8DF5\u548C\u8BBE\u8BA1\u8D44\u6E90\u6587\u4EF6\uFF08 `),t("span",{class:"token tag"},[t("span",{class:"token tag"},[t("span",{class:"token punctuation"},"<"),n("a-typography-text")]),n(),t("span",{class:"token attr-name"},"code"),t("span",{class:"token punctuation"},">")]),n("Sketch"),t("span",{class:"token tag"},[t("span",{class:"token tag"},[t("span",{class:"token punctuation"},"")]),n(` \u548C `),t("span",{class:"token tag"},[t("span",{class:"token tag"},[t("span",{class:"token punctuation"},"<"),n("a-typography-text")]),n(),t("span",{class:"token attr-name"},"code"),t("span",{class:"token punctuation"},">")]),n("Axure"),t("span",{class:"token tag"},[t("span",{class:"token tag"},[t("span",{class:"token punctuation"},"")]),n(` \uFF09\uFF0C\u6765\u5E2E\u52A9\u4E1A\u52A1\u5FEB\u901F\u8BBE\u8BA1\u51FA\u9AD8\u8D28\u91CF\u7684\u4EA7\u54C1\u539F\u578B\u3002 `),t("span",{class:"token tag"},[t("span",{class:"token tag"},[t("span",{class:"token punctuation"},"")]),n(` `),t("span",{class:"token tag"},[t("span",{class:"token tag"},[t("span",{class:"token punctuation"},"<"),n("a-typography-paragraph")]),t("span",{class:"token punctuation"},">")]),n(` `),t("span",{class:"token tag"},[t("span",{class:"token tag"},[t("span",{class:"token punctuation"},"<"),n("ul")]),t("span",{class:"token punctuation"},">")]),n(` `),t("span",{class:"token tag"},[t("span",{class:"token tag"},[t("span",{class:"token punctuation"},"<"),n("li")]),t("span",{class:"token punctuation"},">")]),n(` `),t("span",{class:"token tag"},[t("span",{class:"token tag"},[t("span",{class:"token punctuation"},"<"),n("a-typography-link")]),n(),t("span",{class:"token attr-name"},"href"),t("span",{class:"token attr-value"},[t("span",{class:"token punctuation attr-equals"},"="),t("span",{class:"token punctuation"},'"'),n("/docs/resources-cn"),t("span",{class:"token punctuation"},'"')]),t("span",{class:"token punctuation"},">")]),n("\u8BBE\u8BA1\u8D44\u6E90"),t("span",{class:"token tag"},[t("span",{class:"token tag"},[t("span",{class:"token punctuation"},"")]),n(` `),t("span",{class:"token tag"},[t("span",{class:"token tag"},[t("span",{class:"token punctuation"},"")]),n(` `),t("span",{class:"token tag"},[t("span",{class:"token tag"},[t("span",{class:"token punctuation"},"")]),n(` `),t("span",{class:"token tag"},[t("span",{class:"token tag"},[t("span",{class:"token punctuation"},"")]),n(` `),t("span",{class:"token tag"},[t("span",{class:"token tag"},[t("span",{class:"token punctuation"},"<"),n("a-typography-paragraph")]),t("span",{class:"token punctuation"},">")]),n(` `),t("span",{class:"token tag"},[t("span",{class:"token tag"},[t("span",{class:"token punctuation"},"<"),n("blockquote")]),t("span",{class:"token punctuation"},">")]),n("{{ blockContent }}"),t("span",{class:"token tag"},[t("span",{class:"token tag"},[t("span",{class:"token punctuation"},"")]),n(` `),t("span",{class:"token tag"},[t("span",{class:"token tag"},[t("span",{class:"token punctuation"},"<"),n("pre")]),t("span",{class:"token punctuation"},">")]),n("{{ blockContent }}"),t("span",{class:"token tag"},[t("span",{class:"token tag"},[t("span",{class:"token punctuation"},"")]),n(` `),t("span",{class:"token tag"},[t("span",{class:"token tag"},[t("span",{class:"token punctuation"},"")]),n(` `),t("span",{class:"token tag"},[t("span",{class:"token tag"},[t("span",{class:"token punctuation"},"<"),n("a-typography-paragraph")]),t("span",{class:"token punctuation"},">")]),n(` \u6309 `),t("span",{class:"token tag"},[t("span",{class:"token tag"},[t("span",{class:"token punctuation"},"<"),n("a-typography-text")]),n(),t("span",{class:"token attr-name"},"keyboard"),t("span",{class:"token punctuation"},">")]),n("Esc"),t("span",{class:"token tag"},[t("span",{class:"token tag"},[t("span",{class:"token punctuation"},"")]),n(` \u952E\u9000\u51FA\u9605\u8BFB\u2026\u2026 `),t("span",{class:"token tag"},[t("span",{class:"token tag"},[t("span",{class:"token punctuation"},"")]),n(` `),t("span",{class:"token tag"},[t("span",{class:"token tag"},[t("span",{class:"token punctuation"},"")]),n(` `),t("span",{class:"token tag"},[t("span",{class:"token tag"},[t("span",{class:"token punctuation"},"")]),n(` `),t("span",{class:"token tag"},[t("span",{class:"token tag"},[t("span",{class:"token punctuation"},"<"),n("script")]),n(),t("span",{class:"token attr-name"},"lang"),t("span",{class:"token attr-value"},[t("span",{class:"token punctuation attr-equals"},"="),t("span",{class:"token punctuation"},'"'),n("ts"),t("span",{class:"token punctuation"},'"')]),t("span",{class:"token punctuation"},">")]),t("span",{class:"token script"},[t("span",{class:"token language-javascript"},[n(` `),t("span",{class:"token keyword"},"import"),n(),t("span",{class:"token punctuation"},"{"),n(" defineComponent "),t("span",{class:"token punctuation"},"}"),n(),t("span",{class:"token keyword"},"from"),n(),t("span",{class:"token string"},"'vue'"),t("span",{class:"token punctuation"},";"),n(` `),t("span",{class:"token keyword"},"export"),n(),t("span",{class:"token keyword"},"default"),n(),t("span",{class:"token function"},"defineComponent"),t("span",{class:"token punctuation"},"("),t("span",{class:"token punctuation"},"{"),n(` `),t("span",{class:"token function"},"setup"),t("span",{class:"token punctuation"},"("),t("span",{class:"token punctuation"},")"),n(),t("span",{class:"token punctuation"},"{"),n(` `),t("span",{class:"token keyword"},"return"),n(),t("span",{class:"token punctuation"},"{"),n(` `),t("span",{class:"token literal-property property"},"blockContent"),t("span",{class:"token operator"},":"),n(),t("span",{class:"token template-string"},[t("span",{class:"token template-punctuation string"},"`"),t("span",{class:"token string"},`AntV \u662F\u8682\u8681\u91D1\u670D\u5168\u65B0\u4E00\u4EE3\u6570\u636E\u53EF\u89C6\u5316\u89E3\u51B3\u65B9\u6848\uFF0C\u81F4\u529B\u4E8E\u63D0\u4F9B\u4E00\u5957\u7B80\u5355\u65B9\u4FBF\u3001\u4E13\u4E1A\u53EF\u9760\u3001\u4E0D\u9650\u53EF\u80FD\u7684\u6570\u636E\u53EF\u89C6\u5316\u6700\u4F73\u5B9E\u8DF5\u3002\u5F97\u76CA\u4E8E\u4E30\u5BCC\u7684\u4E1A\u52A1\u573A\u666F\u548C\u7528\u6237\u9700\u6C42\u6311\u6218\uFF0CAntV \u7ECF\u5386\u591A\u5E74\u79EF\u7D2F\u4E0E\u4E0D\u65AD\u6253\u78E8\uFF0C\u5DF2\u652F\u6491\u6574\u4E2A\u963F\u91CC\u96C6\u56E2\u5185\u5916 20000+ \u4E1A\u52A1\u7CFB\u7EDF\uFF0C\u901A\u8FC7\u4E86\u65E5\u5747\u5343\u4E07\u7EA7 UV \u4EA7\u54C1\u7684\u4E25\u82DB\u8003\u9A8C\u3002 \u6211\u4EEC\u6B63\u5728\u57FA\u7840\u56FE\u8868\uFF0C\u56FE\u5206\u6790\uFF0C\u56FE\u7F16\u8F91\uFF0C\u5730\u7406\u7A7A\u95F4\u53EF\u89C6\u5316\uFF0C\u667A\u80FD\u53EF\u89C6\u5316\u7B49\u5404\u4E2A\u53EF\u89C6\u5316\u7684\u9886\u57DF\u8015\u8018\uFF0C\u6B22\u8FCE\u540C\u8DEF\u4EBA\u4E00\u8D77\u524D\u884C\u3002`),t("span",{class:"token template-punctuation string"},"`")]),t("span",{class:"token punctuation"},","),n(` `),t("span",{class:"token punctuation"},"}"),t("span",{class:"token punctuation"},";"),n(` `),t("span",{class:"token punctuation"},"}"),t("span",{class:"token punctuation"},","),n(` `),t("span",{class:"token punctuation"},"}"),t("span",{class:"token punctuation"},")"),t("span",{class:"token punctuation"},";"),n(` `)])]),t("span",{class:"token tag"},[t("span",{class:"token tag"},[t("span",{class:"token punctuation"},"")]),n(` `)])],-1)])),jsVersionHtml:s(()=>a[32]||(a[32]=[t("pre",{class:"language-vue"},[t("code",null,[t("span",{class:"token tag"},[t("span",{class:"token tag"},[t("span",{class:"token punctuation"},"<"),n("template")]),t("span",{class:"token punctuation"},">")]),n(` `),t("span",{class:"token tag"},[t("span",{class:"token tag"},[t("span",{class:"token punctuation"},"<"),n("a-typography")]),t("span",{class:"token punctuation"},">")]),n(` `),t("span",{class:"token tag"},[t("span",{class:"token tag"},[t("span",{class:"token punctuation"},"<"),n("a-typography-title")]),t("span",{class:"token punctuation"},">")]),n("Introduction"),t("span",{class:"token tag"},[t("span",{class:"token tag"},[t("span",{class:"token punctuation"},"")]),n(` `),t("span",{class:"token tag"},[t("span",{class:"token tag"},[t("span",{class:"token punctuation"},"<"),n("a-typography-paragraph")]),t("span",{class:"token punctuation"},">")]),n(` In the process of internal desktop applications development, many different design specs and implementations would be involved, which might cause designers and developers difficulties and duplication and reduce the efficiency of development. `),t("span",{class:"token tag"},[t("span",{class:"token tag"},[t("span",{class:"token punctuation"},"")]),n(` `),t("span",{class:"token tag"},[t("span",{class:"token tag"},[t("span",{class:"token punctuation"},"<"),n("a-typography-paragraph")]),t("span",{class:"token punctuation"},">")]),n(` After massive project practice and summaries, Ant Design, a design language for background applications, is refined by Ant UED Team, which aims to `),t("span",{class:"token tag"},[t("span",{class:"token tag"},[t("span",{class:"token punctuation"},"<"),n("a-typography-text")]),n(),t("span",{class:"token attr-name"},"strong"),t("span",{class:"token punctuation"},">")]),n(` uniform the user interface specs for internal background projects, lower the unnecessary cost of design differences and implementation and liberate the resources of design and front-end development. `),t("span",{class:"token tag"},[t("span",{class:"token tag"},[t("span",{class:"token punctuation"},"")]),n(` `),t("span",{class:"token tag"},[t("span",{class:"token tag"},[t("span",{class:"token punctuation"},"")]),n(` `),t("span",{class:"token tag"},[t("span",{class:"token tag"},[t("span",{class:"token punctuation"},"<"),n("a-typography-title")]),n(),t("span",{class:"token attr-name"},":level"),t("span",{class:"token attr-value"},[t("span",{class:"token punctuation attr-equals"},"="),t("span",{class:"token punctuation"},'"'),n("2"),t("span",{class:"token punctuation"},'"')]),t("span",{class:"token punctuation"},">")]),n("Guidelines and Resources"),t("span",{class:"token tag"},[t("span",{class:"token tag"},[t("span",{class:"token punctuation"},"")]),n(` `),t("span",{class:"token tag"},[t("span",{class:"token tag"},[t("span",{class:"token punctuation"},"<"),n("a-typography-paragraph")]),t("span",{class:"token punctuation"},">")]),n(` We supply a series of design principles, practical patterns and high quality design resources ( `),t("span",{class:"token tag"},[t("span",{class:"token tag"},[t("span",{class:"token punctuation"},"<"),n("a-typography-text")]),n(),t("span",{class:"token attr-name"},"code"),t("span",{class:"token punctuation"},">")]),n("Sketch"),t("span",{class:"token tag"},[t("span",{class:"token tag"},[t("span",{class:"token punctuation"},"")]),n(` and `),t("span",{class:"token tag"},[t("span",{class:"token tag"},[t("span",{class:"token punctuation"},"<"),n("a-typography-text")]),n(),t("span",{class:"token attr-name"},"code"),t("span",{class:"token punctuation"},">")]),n("Axure"),t("span",{class:"token tag"},[t("span",{class:"token tag"},[t("span",{class:"token punctuation"},"")]),n(` ), to help people create their product prototypes beautifully and efficiently. `),t("span",{class:"token tag"},[t("span",{class:"token tag"},[t("span",{class:"token punctuation"},"")]),n(` `),t("span",{class:"token tag"},[t("span",{class:"token tag"},[t("span",{class:"token punctuation"},"<"),n("a-typography-paragraph")]),t("span",{class:"token punctuation"},">")]),n(` `),t("span",{class:"token tag"},[t("span",{class:"token tag"},[t("span",{class:"token punctuation"},"<"),n("ul")]),t("span",{class:"token punctuation"},">")]),n(` `),t("span",{class:"token tag"},[t("span",{class:"token tag"},[t("span",{class:"token punctuation"},"<"),n("li")]),t("span",{class:"token punctuation"},">")]),n(` `),t("span",{class:"token tag"},[t("span",{class:"token tag"},[t("span",{class:"token punctuation"},"<"),n("a-typography-link")]),n(),t("span",{class:"token attr-name"},"href"),t("span",{class:"token attr-value"},[t("span",{class:"token punctuation attr-equals"},"="),t("span",{class:"token punctuation"},'"'),n("/docs/resources"),t("span",{class:"token punctuation"},'"')]),t("span",{class:"token punctuation"},">")]),n("Resource Download"),t("span",{class:"token tag"},[t("span",{class:"token tag"},[t("span",{class:"token punctuation"},"")]),n(` `),t("span",{class:"token tag"},[t("span",{class:"token tag"},[t("span",{class:"token punctuation"},"")]),n(` `),t("span",{class:"token tag"},[t("span",{class:"token tag"},[t("span",{class:"token punctuation"},"")]),n(` `),t("span",{class:"token tag"},[t("span",{class:"token tag"},[t("span",{class:"token punctuation"},"")]),n(` `),t("span",{class:"token tag"},[t("span",{class:"token tag"},[t("span",{class:"token punctuation"},"<"),n("a-typography-paragraph")]),t("span",{class:"token punctuation"},">")]),n(` Press `),t("span",{class:"token tag"},[t("span",{class:"token tag"},[t("span",{class:"token punctuation"},"<"),n("a-typography-text")]),n(),t("span",{class:"token attr-name"},"keyboard"),t("span",{class:"token punctuation"},">")]),n("Esc"),t("span",{class:"token tag"},[t("span",{class:"token tag"},[t("span",{class:"token punctuation"},"")]),n(` to exit... `),t("span",{class:"token tag"},[t("span",{class:"token tag"},[t("span",{class:"token punctuation"},"")]),n(` `),t("span",{class:"token tag"},[t("span",{class:"token tag"},[t("span",{class:"token punctuation"},"<"),n("a-divider")]),n(),t("span",{class:"token punctuation"},"/>")]),n(` `),t("span",{class:"token tag"},[t("span",{class:"token tag"},[t("span",{class:"token punctuation"},"<"),n("a-typography-title")]),t("span",{class:"token punctuation"},">")]),n("\u4ECB\u7ECD"),t("span",{class:"token tag"},[t("span",{class:"token tag"},[t("span",{class:"token punctuation"},"")]),n(` `),t("span",{class:"token tag"},[t("span",{class:"token tag"},[t("span",{class:"token punctuation"},"<"),n("a-typography-paragraph")]),t("span",{class:"token punctuation"},">")]),n(` \u8682\u8681\u7684\u4F01\u4E1A\u7EA7\u4EA7\u54C1\u662F\u4E00\u4E2A\u5E9E\u5927\u4E14\u590D\u6742\u7684\u4F53\u7CFB\u3002\u8FD9\u7C7B\u4EA7\u54C1\u4E0D\u4EC5\u91CF\u7EA7\u5DE8\u5927\u4E14\u529F\u80FD\u590D\u6742\uFF0C\u800C\u4E14\u53D8\u52A8\u548C\u5E76\u53D1\u9891\u7E41\uFF0C\u5E38\u5E38\u9700\u8981\u8BBE\u8BA1\u4E0E\u5F00\u53D1\u80FD\u591F\u5FEB\u901F\u7684\u505A\u51FA\u54CD\u5E94\u3002\u540C\u65F6\u8FD9\u7C7B\u4EA7\u54C1\u4E2D\u6709\u5B58\u5728\u5F88\u591A\u7C7B\u4F3C\u7684\u9875\u9762\u4EE5\u53CA\u7EC4\u4EF6\uFF0C\u53EF\u4EE5\u901A\u8FC7\u62BD\u8C61\u5F97\u5230\u4E00\u4E9B\u7A33\u5B9A\u4E14\u9AD8\u590D\u7528\u6027\u7684\u5185\u5BB9\u3002 `),t("span",{class:"token tag"},[t("span",{class:"token tag"},[t("span",{class:"token punctuation"},"")]),n(` `),t("span",{class:"token tag"},[t("span",{class:"token tag"},[t("span",{class:"token punctuation"},"<"),n("a-typography-paragraph")]),t("span",{class:"token punctuation"},">")]),n(` \u968F\u7740\u5546\u4E1A\u5316\u7684\u8D8B\u52BF\uFF0C\u8D8A\u6765\u8D8A\u591A\u7684\u4F01\u4E1A\u7EA7\u4EA7\u54C1\u5BF9\u66F4\u597D\u7684\u7528\u6237\u4F53\u9A8C\u6709\u4E86\u8FDB\u4E00\u6B65\u7684\u8981\u6C42\u3002\u5E26\u7740\u8FD9\u6837\u7684\u4E00\u4E2A\u7EC8\u6781\u76EE\u6807\uFF0C\u6211\u4EEC\uFF08\u8682\u8681\u91D1\u670D\u4F53\u9A8C\u6280\u672F\u90E8\uFF09\u7ECF\u8FC7\u5927\u91CF\u7684\u9879\u76EE\u5B9E\u8DF5\u548C\u603B\u7ED3\uFF0C\u9010\u6B65\u6253\u78E8\u51FA\u4E00\u4E2A\u670D\u52A1\u4E8E\u4F01\u4E1A\u7EA7\u4EA7\u54C1\u7684\u8BBE\u8BA1\u4F53\u7CFB Ant Design\u3002\u57FA\u4E8E `),t("span",{class:"token tag"},[t("span",{class:"token tag"},[t("span",{class:"token punctuation"},"<"),n("a-typography-text")]),n(),t("span",{class:"token attr-name"},"mark"),t("span",{class:"token punctuation"},">")]),n("\u300E\u786E\u5B9A\u300F\u548C\u300E\u81EA\u7136\u300F"),t("span",{class:"token tag"},[t("span",{class:"token tag"},[t("span",{class:"token punctuation"},"")]),n(` \u7684\u8BBE\u8BA1\u4EF7\u503C\u89C2\uFF0C\u901A\u8FC7\u6A21\u5757\u5316\u7684\u89E3\u51B3\u65B9\u6848\uFF0C\u964D\u4F4E\u5197\u4F59\u7684\u751F\u4EA7\u6210\u672C\uFF0C\u8BA9\u8BBE\u8BA1\u8005\u4E13\u6CE8\u4E8E `),t("span",{class:"token tag"},[t("span",{class:"token tag"},[t("span",{class:"token punctuation"},"<"),n("a-typography-text")]),n(),t("span",{class:"token attr-name"},"strong"),t("span",{class:"token punctuation"},">")]),n("\u66F4\u597D\u7684\u7528\u6237\u4F53\u9A8C"),t("span",{class:"token tag"},[t("span",{class:"token tag"},[t("span",{class:"token punctuation"},"")]),n(` \u3002 `),t("span",{class:"token tag"},[t("span",{class:"token tag"},[t("span",{class:"token punctuation"},"")]),n(` `),t("span",{class:"token tag"},[t("span",{class:"token tag"},[t("span",{class:"token punctuation"},"<"),n("a-typography-title")]),n(),t("span",{class:"token attr-name"},":level"),t("span",{class:"token attr-value"},[t("span",{class:"token punctuation attr-equals"},"="),t("span",{class:"token punctuation"},'"'),n("2"),t("span",{class:"token punctuation"},'"')]),t("span",{class:"token punctuation"},">")]),n("\u8BBE\u8BA1\u8D44\u6E90"),t("span",{class:"token tag"},[t("span",{class:"token tag"},[t("span",{class:"token punctuation"},"")]),n(` `),t("span",{class:"token tag"},[t("span",{class:"token tag"},[t("span",{class:"token punctuation"},"<"),n("a-typography-paragraph")]),t("span",{class:"token punctuation"},">")]),n(` \u6211\u4EEC\u63D0\u4F9B\u5B8C\u5584\u7684\u8BBE\u8BA1\u539F\u5219\u3001\u6700\u4F73\u5B9E\u8DF5\u548C\u8BBE\u8BA1\u8D44\u6E90\u6587\u4EF6\uFF08 `),t("span",{class:"token tag"},[t("span",{class:"token tag"},[t("span",{class:"token punctuation"},"<"),n("a-typography-text")]),n(),t("span",{class:"token attr-name"},"code"),t("span",{class:"token punctuation"},">")]),n("Sketch"),t("span",{class:"token tag"},[t("span",{class:"token tag"},[t("span",{class:"token punctuation"},"")]),n(` \u548C `),t("span",{class:"token tag"},[t("span",{class:"token tag"},[t("span",{class:"token punctuation"},"<"),n("a-typography-text")]),n(),t("span",{class:"token attr-name"},"code"),t("span",{class:"token punctuation"},">")]),n("Axure"),t("span",{class:"token tag"},[t("span",{class:"token tag"},[t("span",{class:"token punctuation"},"")]),n(` \uFF09\uFF0C\u6765\u5E2E\u52A9\u4E1A\u52A1\u5FEB\u901F\u8BBE\u8BA1\u51FA\u9AD8\u8D28\u91CF\u7684\u4EA7\u54C1\u539F\u578B\u3002 `),t("span",{class:"token tag"},[t("span",{class:"token tag"},[t("span",{class:"token punctuation"},"")]),n(` `),t("span",{class:"token tag"},[t("span",{class:"token tag"},[t("span",{class:"token punctuation"},"<"),n("a-typography-paragraph")]),t("span",{class:"token punctuation"},">")]),n(` `),t("span",{class:"token tag"},[t("span",{class:"token tag"},[t("span",{class:"token punctuation"},"<"),n("ul")]),t("span",{class:"token punctuation"},">")]),n(` `),t("span",{class:"token tag"},[t("span",{class:"token tag"},[t("span",{class:"token punctuation"},"<"),n("li")]),t("span",{class:"token punctuation"},">")]),n(` `),t("span",{class:"token tag"},[t("span",{class:"token tag"},[t("span",{class:"token punctuation"},"<"),n("a-typography-link")]),n(),t("span",{class:"token attr-name"},"href"),t("span",{class:"token attr-value"},[t("span",{class:"token punctuation attr-equals"},"="),t("span",{class:"token punctuation"},'"'),n("/docs/resources-cn"),t("span",{class:"token punctuation"},'"')]),t("span",{class:"token punctuation"},">")]),n("\u8BBE\u8BA1\u8D44\u6E90"),t("span",{class:"token tag"},[t("span",{class:"token tag"},[t("span",{class:"token punctuation"},"")]),n(` `),t("span",{class:"token tag"},[t("span",{class:"token tag"},[t("span",{class:"token punctuation"},"")]),n(` `),t("span",{class:"token tag"},[t("span",{class:"token tag"},[t("span",{class:"token punctuation"},"")]),n(` `),t("span",{class:"token tag"},[t("span",{class:"token tag"},[t("span",{class:"token punctuation"},"")]),n(` `),t("span",{class:"token tag"},[t("span",{class:"token tag"},[t("span",{class:"token punctuation"},"<"),n("a-typography-paragraph")]),t("span",{class:"token punctuation"},">")]),n(` `),t("span",{class:"token tag"},[t("span",{class:"token tag"},[t("span",{class:"token punctuation"},"<"),n("blockquote")]),t("span",{class:"token punctuation"},">")]),n("{{ blockContent }}"),t("span",{class:"token tag"},[t("span",{class:"token tag"},[t("span",{class:"token punctuation"},"")]),n(` `),t("span",{class:"token tag"},[t("span",{class:"token tag"},[t("span",{class:"token punctuation"},"<"),n("pre")]),t("span",{class:"token punctuation"},">")]),n("{{ blockContent }}"),t("span",{class:"token tag"},[t("span",{class:"token tag"},[t("span",{class:"token punctuation"},"")]),n(` `),t("span",{class:"token tag"},[t("span",{class:"token tag"},[t("span",{class:"token punctuation"},"")]),n(` `),t("span",{class:"token tag"},[t("span",{class:"token tag"},[t("span",{class:"token punctuation"},"<"),n("a-typography-paragraph")]),t("span",{class:"token punctuation"},">")]),n(` \u6309 `),t("span",{class:"token tag"},[t("span",{class:"token tag"},[t("span",{class:"token punctuation"},"<"),n("a-typography-text")]),n(),t("span",{class:"token attr-name"},"keyboard"),t("span",{class:"token punctuation"},">")]),n("Esc"),t("span",{class:"token tag"},[t("span",{class:"token tag"},[t("span",{class:"token punctuation"},"")]),n(` \u952E\u9000\u51FA\u9605\u8BFB\u2026\u2026 `),t("span",{class:"token tag"},[t("span",{class:"token tag"},[t("span",{class:"token punctuation"},"")]),n(` `),t("span",{class:"token tag"},[t("span",{class:"token tag"},[t("span",{class:"token punctuation"},"")]),n(` `),t("span",{class:"token tag"},[t("span",{class:"token tag"},[t("span",{class:"token punctuation"},"")]),n(` `),t("span",{class:"token tag"},[t("span",{class:"token tag"},[t("span",{class:"token punctuation"},"<"),n("script")]),t("span",{class:"token punctuation"},">")]),t("span",{class:"token script"},[t("span",{class:"token language-javascript"},[n(` `),t("span",{class:"token keyword"},"import"),n(),t("span",{class:"token punctuation"},"{"),n(" defineComponent "),t("span",{class:"token punctuation"},"}"),n(),t("span",{class:"token keyword"},"from"),n(),t("span",{class:"token string"},"'vue'"),t("span",{class:"token punctuation"},";"),n(` `),t("span",{class:"token keyword"},"export"),n(),t("span",{class:"token keyword"},"default"),n(),t("span",{class:"token function"},"defineComponent"),t("span",{class:"token punctuation"},"("),t("span",{class:"token punctuation"},"{"),n(` `),t("span",{class:"token function"},"setup"),t("span",{class:"token punctuation"},"("),t("span",{class:"token punctuation"},")"),n(),t("span",{class:"token punctuation"},"{"),n(` `),t("span",{class:"token keyword"},"return"),n(),t("span",{class:"token punctuation"},"{"),n(` `),t("span",{class:"token literal-property property"},"blockContent"),t("span",{class:"token operator"},":"),n(),t("span",{class:"token template-string"},[t("span",{class:"token template-punctuation string"},"`"),t("span",{class:"token string"},`AntV \u662F\u8682\u8681\u91D1\u670D\u5168\u65B0\u4E00\u4EE3\u6570\u636E\u53EF\u89C6\u5316\u89E3\u51B3\u65B9\u6848\uFF0C\u81F4\u529B\u4E8E\u63D0\u4F9B\u4E00\u5957\u7B80\u5355\u65B9\u4FBF\u3001\u4E13\u4E1A\u53EF\u9760\u3001\u4E0D\u9650\u53EF\u80FD\u7684\u6570\u636E\u53EF\u89C6\u5316\u6700\u4F73\u5B9E\u8DF5\u3002\u5F97\u76CA\u4E8E\u4E30\u5BCC\u7684\u4E1A\u52A1\u573A\u666F\u548C\u7528\u6237\u9700\u6C42\u6311\u6218\uFF0CAntV \u7ECF\u5386\u591A\u5E74\u79EF\u7D2F\u4E0E\u4E0D\u65AD\u6253\u78E8\uFF0C\u5DF2\u652F\u6491\u6574\u4E2A\u963F\u91CC\u96C6\u56E2\u5185\u5916 20000+ \u4E1A\u52A1\u7CFB\u7EDF\uFF0C\u901A\u8FC7\u4E86\u65E5\u5747\u5343\u4E07\u7EA7 UV \u4EA7\u54C1\u7684\u4E25\u82DB\u8003\u9A8C\u3002 \u6211\u4EEC\u6B63\u5728\u57FA\u7840\u56FE\u8868\uFF0C\u56FE\u5206\u6790\uFF0C\u56FE\u7F16\u8F91\uFF0C\u5730\u7406\u7A7A\u95F4\u53EF\u89C6\u5316\uFF0C\u667A\u80FD\u53EF\u89C6\u5316\u7B49\u5404\u4E2A\u53EF\u89C6\u5316\u7684\u9886\u57DF\u8015\u8018\uFF0C\u6B22\u8FCE\u540C\u8DEF\u4EBA\u4E00\u8D77\u524D\u884C\u3002`),t("span",{class:"token template-punctuation string"},"`")]),t("span",{class:"token punctuation"},","),n(` `),t("span",{class:"token punctuation"},"}"),t("span",{class:"token punctuation"},";"),n(` `),t("span",{class:"token punctuation"},"}"),t("span",{class:"token punctuation"},","),n(` `),t("span",{class:"token punctuation"},"}"),t("span",{class:"token punctuation"},")"),t("span",{class:"token punctuation"},";"),n(` `)])]),t("span",{class:"token tag"},[t("span",{class:"token tag"},[t("span",{class:"token punctuation"},"")]),n(` `)])],-1)])),_:1})}const H=m(D,[["render",R]]),T=B({setup(){return{ellipsis:b(!0)}}});function J(o,a,l,k,g,I){const c=p("a-switch"),u=p("a-typography-paragraph"),i=p("a-typography-text"),h=p("demo-box");return r(),y(h,{jsfiddle:{us:"Multiple line ellipsis support. You can use `tooltip` to config ellipsis tooltip. Recommend `expandable` when have lots of content.",cn:"\u591A\u884C\u6587\u672C\u7701\u7565\u3002\u4F60\u53EF\u4EE5\u901A\u8FC7 `tooltip` \u5C5E\u6027\u914D\u7F6E\u7701\u7565\u5C55\u793A\u5185\u5BB9\uFF0C\u5927\u91CF\u6587\u672C\u65F6\u63A8\u8350\u4F18\u5148\u4F7F\u7528 `expandable`\u3002",docHtml:`

zh-CN

\u591A\u884C\u6587\u672C\u7701\u7565\u3002\u4F60\u53EF\u4EE5\u901A\u8FC7 tooltip \u5C5E\u6027\u914D\u7F6E\u7701\u7565\u5C55\u793A\u5185\u5BB9\uFF0C\u5927\u91CF\u6587\u672C\u65F6\u63A8\u8350\u4F18\u5148\u4F7F\u7528 expandable\u3002

en-US

Multiple line ellipsis support. You can use tooltip to config ellipsis tooltip. Recommend expandable when have lots of content.

`,order:4,title:{"zh-CN":"\u7701\u7565\u53F7","en-US":"Ellipsis"},relativePath:"components/typography/demo/ellipsis.vue",sourceCode:"PHRlbXBsYXRlPgogIDxhLXN3aXRjaCB2LW1vZGVsOmNoZWNrZWQ9ImVsbGlwc2lzIiAvPgogIDxhLXR5cG9ncmFwaHktcGFyYWdyYXBoCiAgICA6ZWxsaXBzaXM9ImVsbGlwc2lzIgogICAgY29udGVudD0iIEFudCBEZXNpZ24sIGEgZGVzaWduIGxhbmd1YWdlIGZvciBiYWNrZ3JvdW5kIGFwcGxpY2F0aW9ucywgaXMgcmVmaW5lZCBieSBBbnQgVUVEIFRlYW0uIEFudAogICAgRGVzaWduLCBhIGRlc2lnbiBsYW5ndWFnZSBmb3IgYmFja2dyb3VuZCBhcHBsaWNhdGlvbnMsIGlzIHJlZmluZWQgYnkgQW50IFVFRCBUZWFtLiBBbnQKICAgIERlc2lnbiwgYSBkZXNpZ24gbGFuZ3VhZ2UgZm9yIGJhY2tncm91bmQgYXBwbGljYXRpb25zLCBpcyByZWZpbmVkIGJ5IEFudCBVRUQgVGVhbS4gQW50CiAgICBEZXNpZ24sIGEgZGVzaWduIGxhbmd1YWdlIGZvciBiYWNrZ3JvdW5kIGFwcGxpY2F0aW9ucywgaXMgcmVmaW5lZCBieSBBbnQgVUVEIFRlYW0uIEFudAogICAgRGVzaWduLCBhIGRlc2lnbiBsYW5ndWFnZSBmb3IgYmFja2dyb3VuZCBhcHBsaWNhdGlvbnMsIGlzIHJlZmluZWQgYnkgQW50IFVFRCBUZWFtLiBBbnQKICAgIERlc2lnbiwgYSBkZXNpZ24gbGFuZ3VhZ2UgZm9yIGJhY2tncm91bmQgYXBwbGljYXRpb25zLCBpcyByZWZpbmVkIGJ5IEFudCBVRUQgVGVhbS4iCiAgLz4KCiAgPGEtdHlwb2dyYXBoeS1wYXJhZ3JhcGgKICAgIDplbGxpcHNpcz0iZWxsaXBzaXMgPyB7IHJvd3M6IDIsIGV4cGFuZGFibGU6IHRydWUsIHN5bWJvbDogJ21vcmUnIH0gOiBmYWxzZSIKICAgIGNvbnRlbnQ9IkFudCBEZXNpZ24sIGEgZGVzaWduIGxhbmd1YWdlIGZvciBiYWNrZ3JvdW5kIGFwcGxpY2F0aW9ucywgaXMgcmVmaW5lZCBieSBBbnQgVUVEIFRlYW0uIEFudAogICAgRGVzaWduLCBhIGRlc2lnbiBsYW5ndWFnZSBmb3IgYmFja2dyb3VuZCBhcHBsaWNhdGlvbnMsIGlzIHJlZmluZWQgYnkgQW50IFVFRCBUZWFtLiBBbnQKICAgIERlc2lnbiwgYSBkZXNpZ24gbGFuZ3VhZ2UgZm9yIGJhY2tncm91bmQgYXBwbGljYXRpb25zLCBpcyByZWZpbmVkIGJ5IEFudCBVRUQgVGVhbS4gQW50CiAgICBEZXNpZ24sIGEgZGVzaWduIGxhbmd1YWdlIGZvciBiYWNrZ3JvdW5kIGFwcGxpY2F0aW9ucywgaXMgcmVmaW5lZCBieSBBbnQgVUVEIFRlYW0uIEFudAogICAgRGVzaWduLCBhIGRlc2lnbiBsYW5ndWFnZSBmb3IgYmFja2dyb3VuZCBhcHBsaWNhdGlvbnMsIGlzIHJlZmluZWQgYnkgQW50IFVFRCBUZWFtLiBBbnQKICAgIERlc2lnbiwgYSBkZXNpZ24gbGFuZ3VhZ2UgZm9yIGJhY2tncm91bmQgYXBwbGljYXRpb25zLCBpcyByZWZpbmVkIGJ5IEFudCBVRUQgVGVhbS4iCiAgLz4KCiAgPGEtdHlwb2dyYXBoeS10ZXh0CiAgICA6c3R5bGU9ImVsbGlwc2lzID8geyB3aWR0aDogJzEwMHB4JyB9IDoge30iCiAgICA6ZWxsaXBzaXM9ImVsbGlwc2lzID8geyB0b29sdGlwOiAnSSBhbSBlbGxpcHNpcyBub3chJyB9IDogZmFsc2UiCiAgICBjb250ZW50PSJBbnQgRGVzaWduLCBhIGRlc2lnbiBsYW5ndWFnZSBmb3IgYmFja2dyb3VuZCBhcHBsaWNhdGlvbnMsIGlzIHJlZmluZWQgYnkgQW50IFVFRCBUZWFtLiIKICAvPgo8L3RlbXBsYXRlPgo8c2NyaXB0IGxhbmc9InRzIj4KaW1wb3J0IHsgZGVmaW5lQ29tcG9uZW50LCByZWYgfSBmcm9tICd2dWUnOwpleHBvcnQgZGVmYXVsdCBkZWZpbmVDb21wb25lbnQoewogIHNldHVwKCkgewogICAgcmV0dXJuIHsKICAgICAgZWxsaXBzaXM6IHJlZih0cnVlKSwKICAgIH07CiAgfSwKfSk7Cjwvc2NyaXB0PgoK",jsSourceCode:"PHRlbXBsYXRlPgogIDxhLXN3aXRjaCB2LW1vZGVsOmNoZWNrZWQ9ImVsbGlwc2lzIiAvPgogIDxhLXR5cG9ncmFwaHktcGFyYWdyYXBoCiAgICA6ZWxsaXBzaXM9ImVsbGlwc2lzIgogICAgY29udGVudD0iIEFudCBEZXNpZ24sIGEgZGVzaWduIGxhbmd1YWdlIGZvciBiYWNrZ3JvdW5kIGFwcGxpY2F0aW9ucywgaXMgcmVmaW5lZCBieSBBbnQgVUVEIFRlYW0uIEFudAogICAgRGVzaWduLCBhIGRlc2lnbiBsYW5ndWFnZSBmb3IgYmFja2dyb3VuZCBhcHBsaWNhdGlvbnMsIGlzIHJlZmluZWQgYnkgQW50IFVFRCBUZWFtLiBBbnQKICAgIERlc2lnbiwgYSBkZXNpZ24gbGFuZ3VhZ2UgZm9yIGJhY2tncm91bmQgYXBwbGljYXRpb25zLCBpcyByZWZpbmVkIGJ5IEFudCBVRUQgVGVhbS4gQW50CiAgICBEZXNpZ24sIGEgZGVzaWduIGxhbmd1YWdlIGZvciBiYWNrZ3JvdW5kIGFwcGxpY2F0aW9ucywgaXMgcmVmaW5lZCBieSBBbnQgVUVEIFRlYW0uIEFudAogICAgRGVzaWduLCBhIGRlc2lnbiBsYW5ndWFnZSBmb3IgYmFja2dyb3VuZCBhcHBsaWNhdGlvbnMsIGlzIHJlZmluZWQgYnkgQW50IFVFRCBUZWFtLiBBbnQKICAgIERlc2lnbiwgYSBkZXNpZ24gbGFuZ3VhZ2UgZm9yIGJhY2tncm91bmQgYXBwbGljYXRpb25zLCBpcyByZWZpbmVkIGJ5IEFudCBVRUQgVGVhbS4iCiAgLz4KCiAgPGEtdHlwb2dyYXBoeS1wYXJhZ3JhcGgKICAgIDplbGxpcHNpcz0iZWxsaXBzaXMgPyB7IHJvd3M6IDIsIGV4cGFuZGFibGU6IHRydWUsIHN5bWJvbDogJ21vcmUnIH0gOiBmYWxzZSIKICAgIGNvbnRlbnQ9IkFudCBEZXNpZ24sIGEgZGVzaWduIGxhbmd1YWdlIGZvciBiYWNrZ3JvdW5kIGFwcGxpY2F0aW9ucywgaXMgcmVmaW5lZCBieSBBbnQgVUVEIFRlYW0uIEFudAogICAgRGVzaWduLCBhIGRlc2lnbiBsYW5ndWFnZSBmb3IgYmFja2dyb3VuZCBhcHBsaWNhdGlvbnMsIGlzIHJlZmluZWQgYnkgQW50IFVFRCBUZWFtLiBBbnQKICAgIERlc2lnbiwgYSBkZXNpZ24gbGFuZ3VhZ2UgZm9yIGJhY2tncm91bmQgYXBwbGljYXRpb25zLCBpcyByZWZpbmVkIGJ5IEFudCBVRUQgVGVhbS4gQW50CiAgICBEZXNpZ24sIGEgZGVzaWduIGxhbmd1YWdlIGZvciBiYWNrZ3JvdW5kIGFwcGxpY2F0aW9ucywgaXMgcmVmaW5lZCBieSBBbnQgVUVEIFRlYW0uIEFudAogICAgRGVzaWduLCBhIGRlc2lnbiBsYW5ndWFnZSBmb3IgYmFja2dyb3VuZCBhcHBsaWNhdGlvbnMsIGlzIHJlZmluZWQgYnkgQW50IFVFRCBUZWFtLiBBbnQKICAgIERlc2lnbiwgYSBkZXNpZ24gbGFuZ3VhZ2UgZm9yIGJhY2tncm91bmQgYXBwbGljYXRpb25zLCBpcyByZWZpbmVkIGJ5IEFudCBVRUQgVGVhbS4iCiAgLz4KCiAgPGEtdHlwb2dyYXBoeS10ZXh0CiAgICA6c3R5bGU9ImVsbGlwc2lzID8geyB3aWR0aDogJzEwMHB4JyB9IDoge30iCiAgICA6ZWxsaXBzaXM9ImVsbGlwc2lzID8geyB0b29sdGlwOiAnSSBhbSBlbGxpcHNpcyBub3chJyB9IDogZmFsc2UiCiAgICBjb250ZW50PSJBbnQgRGVzaWduLCBhIGRlc2lnbiBsYW5ndWFnZSBmb3IgYmFja2dyb3VuZCBhcHBsaWNhdGlvbnMsIGlzIHJlZmluZWQgYnkgQW50IFVFRCBUZWFtLiIKICAvPgo8L3RlbXBsYXRlPgo8c2NyaXB0PgppbXBvcnQgeyBkZWZpbmVDb21wb25lbnQsIHJlZiB9IGZyb20gJ3Z1ZSc7CmV4cG9ydCBkZWZhdWx0IGRlZmluZUNvbXBvbmVudCh7CiAgc2V0dXAoKSB7CiAgICByZXR1cm4gewogICAgICBlbGxpcHNpczogcmVmKHRydWUpLAogICAgfTsKICB9LAp9KTsKPC9zY3JpcHQ+"}},{default:s(()=>[e(c,{checked:o.ellipsis,"onUpdate:checked":a[0]||(a[0]=C=>o.ellipsis=C)},null,8,["checked"]),e(u,{ellipsis:o.ellipsis,content:` Ant Design, a design language for background applications, is refined by Ant UED Team. Ant Design, a design language for background applications, is refined by Ant UED Team. Ant Design, a design language for background applications, is refined by Ant UED Team. Ant Design, a design language for background applications, is refined by Ant UED Team. Ant Design, a design language for background applications, is refined by Ant UED Team. Ant Design, a design language for background applications, is refined by Ant UED Team.`},null,8,["ellipsis"]),e(u,{ellipsis:o.ellipsis?{rows:2,expandable:!0,symbol:"more"}:!1,content:`Ant Design, a design language for background applications, is refined by Ant UED Team. Ant Design, a design language for background applications, is refined by Ant UED Team. Ant Design, a design language for background applications, is refined by Ant UED Team. Ant Design, a design language for background applications, is refined by Ant UED Team. Ant Design, a design language for background applications, is refined by Ant UED Team. Ant Design, a design language for background applications, is refined by Ant UED Team.`},null,8,["ellipsis"]),e(i,{style:X(o.ellipsis?{width:"100px"}:{}),ellipsis:o.ellipsis?{tooltip:"I am ellipsis now!"}:!1,content:"Ant Design, a design language for background applications, is refined by Ant UED Team."},null,8,["style","ellipsis"])]),htmlCode:s(()=>a[1]||(a[1]=[t("pre",{class:"language-vue"},[t("code",null,[t("span",{class:"token tag"},[t("span",{class:"token tag"},[t("span",{class:"token punctuation"},"<"),n("template")]),t("span",{class:"token punctuation"},">")]),n(` `),t("span",{class:"token tag"},[t("span",{class:"token tag"},[t("span",{class:"token punctuation"},"<"),n("a-switch")]),n(),t("span",{class:"token attr-name"},[t("span",{class:"token namespace"},"v-model:"),n("checked")]),t("span",{class:"token attr-value"},[t("span",{class:"token punctuation attr-equals"},"="),t("span",{class:"token punctuation"},'"'),n("ellipsis"),t("span",{class:"token punctuation"},'"')]),n(),t("span",{class:"token punctuation"},"/>")]),n(` `),t("span",{class:"token tag"},[t("span",{class:"token tag"},[t("span",{class:"token punctuation"},"<"),n("a-typography-paragraph")]),n(` `),t("span",{class:"token attr-name"},":ellipsis"),t("span",{class:"token attr-value"},[t("span",{class:"token punctuation attr-equals"},"="),t("span",{class:"token punctuation"},'"'),n("ellipsis"),t("span",{class:"token punctuation"},'"')]),n(` `),t("span",{class:"token attr-name"},"content"),t("span",{class:"token attr-value"},[t("span",{class:"token punctuation attr-equals"},"="),t("span",{class:"token punctuation"},'"'),n(` Ant Design, a design language for background applications, is refined by Ant UED Team. Ant Design, a design language for background applications, is refined by Ant UED Team. Ant Design, a design language for background applications, is refined by Ant UED Team. Ant Design, a design language for background applications, is refined by Ant UED Team. Ant Design, a design language for background applications, is refined by Ant UED Team. Ant Design, a design language for background applications, is refined by Ant UED Team.`),t("span",{class:"token punctuation"},'"')]),n(` `),t("span",{class:"token punctuation"},"/>")]),n(` `),t("span",{class:"token tag"},[t("span",{class:"token tag"},[t("span",{class:"token punctuation"},"<"),n("a-typography-paragraph")]),n(` `),t("span",{class:"token attr-name"},":ellipsis"),t("span",{class:"token attr-value"},[t("span",{class:"token punctuation attr-equals"},"="),t("span",{class:"token punctuation"},'"'),n("ellipsis ? { rows: 2, expandable: true, symbol: 'more' } : false"),t("span",{class:"token punctuation"},'"')]),n(` `),t("span",{class:"token attr-name"},"content"),t("span",{class:"token attr-value"},[t("span",{class:"token punctuation attr-equals"},"="),t("span",{class:"token punctuation"},'"'),n(`Ant Design, a design language for background applications, is refined by Ant UED Team. Ant Design, a design language for background applications, is refined by Ant UED Team. Ant Design, a design language for background applications, is refined by Ant UED Team. Ant Design, a design language for background applications, is refined by Ant UED Team. Ant Design, a design language for background applications, is refined by Ant UED Team. Ant Design, a design language for background applications, is refined by Ant UED Team.`),t("span",{class:"token punctuation"},'"')]),n(` `),t("span",{class:"token punctuation"},"/>")]),n(` `),t("span",{class:"token tag"},[t("span",{class:"token tag"},[t("span",{class:"token punctuation"},"<"),n("a-typography-text")]),n(` `),t("span",{class:"token attr-name"},":style"),t("span",{class:"token attr-value"},[t("span",{class:"token punctuation attr-equals"},"="),t("span",{class:"token punctuation"},'"'),n("ellipsis ? { width: '100px' } : {}"),t("span",{class:"token punctuation"},'"')]),n(` `),t("span",{class:"token attr-name"},":ellipsis"),t("span",{class:"token attr-value"},[t("span",{class:"token punctuation attr-equals"},"="),t("span",{class:"token punctuation"},'"'),n("ellipsis ? { tooltip: 'I am ellipsis now!' } : false"),t("span",{class:"token punctuation"},'"')]),n(` `),t("span",{class:"token attr-name"},"content"),t("span",{class:"token attr-value"},[t("span",{class:"token punctuation attr-equals"},"="),t("span",{class:"token punctuation"},'"'),n("Ant Design, a design language for background applications, is refined by Ant UED Team."),t("span",{class:"token punctuation"},'"')]),n(` `),t("span",{class:"token punctuation"},"/>")]),n(` `),t("span",{class:"token tag"},[t("span",{class:"token tag"},[t("span",{class:"token punctuation"},"")]),n(` `),t("span",{class:"token tag"},[t("span",{class:"token tag"},[t("span",{class:"token punctuation"},"<"),n("script")]),n(),t("span",{class:"token attr-name"},"lang"),t("span",{class:"token attr-value"},[t("span",{class:"token punctuation attr-equals"},"="),t("span",{class:"token punctuation"},'"'),n("ts"),t("span",{class:"token punctuation"},'"')]),t("span",{class:"token punctuation"},">")]),t("span",{class:"token script"},[t("span",{class:"token language-javascript"},[n(` `),t("span",{class:"token keyword"},"import"),n(),t("span",{class:"token punctuation"},"{"),n(" defineComponent"),t("span",{class:"token punctuation"},","),n(" ref "),t("span",{class:"token punctuation"},"}"),n(),t("span",{class:"token keyword"},"from"),n(),t("span",{class:"token string"},"'vue'"),t("span",{class:"token punctuation"},";"),n(` `),t("span",{class:"token keyword"},"export"),n(),t("span",{class:"token keyword"},"default"),n(),t("span",{class:"token function"},"defineComponent"),t("span",{class:"token punctuation"},"("),t("span",{class:"token punctuation"},"{"),n(` `),t("span",{class:"token function"},"setup"),t("span",{class:"token punctuation"},"("),t("span",{class:"token punctuation"},")"),n(),t("span",{class:"token punctuation"},"{"),n(` `),t("span",{class:"token keyword"},"return"),n(),t("span",{class:"token punctuation"},"{"),n(` `),t("span",{class:"token literal-property property"},"ellipsis"),t("span",{class:"token operator"},":"),n(),t("span",{class:"token function"},"ref"),t("span",{class:"token punctuation"},"("),t("span",{class:"token boolean"},"true"),t("span",{class:"token punctuation"},")"),t("span",{class:"token punctuation"},","),n(` `),t("span",{class:"token punctuation"},"}"),t("span",{class:"token punctuation"},";"),n(` `),t("span",{class:"token punctuation"},"}"),t("span",{class:"token punctuation"},","),n(` `),t("span",{class:"token punctuation"},"}"),t("span",{class:"token punctuation"},")"),t("span",{class:"token punctuation"},";"),n(` `)])]),t("span",{class:"token tag"},[t("span",{class:"token tag"},[t("span",{class:"token punctuation"},"")]),n(` `)])],-1)])),jsVersionHtml:s(()=>a[2]||(a[2]=[t("pre",{class:"language-vue"},[t("code",null,[t("span",{class:"token tag"},[t("span",{class:"token tag"},[t("span",{class:"token punctuation"},"<"),n("template")]),t("span",{class:"token punctuation"},">")]),n(` `),t("span",{class:"token tag"},[t("span",{class:"token tag"},[t("span",{class:"token punctuation"},"<"),n("a-switch")]),n(),t("span",{class:"token attr-name"},[t("span",{class:"token namespace"},"v-model:"),n("checked")]),t("span",{class:"token attr-value"},[t("span",{class:"token punctuation attr-equals"},"="),t("span",{class:"token punctuation"},'"'),n("ellipsis"),t("span",{class:"token punctuation"},'"')]),n(),t("span",{class:"token punctuation"},"/>")]),n(` `),t("span",{class:"token tag"},[t("span",{class:"token tag"},[t("span",{class:"token punctuation"},"<"),n("a-typography-paragraph")]),n(` `),t("span",{class:"token attr-name"},":ellipsis"),t("span",{class:"token attr-value"},[t("span",{class:"token punctuation attr-equals"},"="),t("span",{class:"token punctuation"},'"'),n("ellipsis"),t("span",{class:"token punctuation"},'"')]),n(` `),t("span",{class:"token attr-name"},"content"),t("span",{class:"token attr-value"},[t("span",{class:"token punctuation attr-equals"},"="),t("span",{class:"token punctuation"},'"'),n(` Ant Design, a design language for background applications, is refined by Ant UED Team. Ant Design, a design language for background applications, is refined by Ant UED Team. Ant Design, a design language for background applications, is refined by Ant UED Team. Ant Design, a design language for background applications, is refined by Ant UED Team. Ant Design, a design language for background applications, is refined by Ant UED Team. Ant Design, a design language for background applications, is refined by Ant UED Team.`),t("span",{class:"token punctuation"},'"')]),n(` `),t("span",{class:"token punctuation"},"/>")]),n(` `),t("span",{class:"token tag"},[t("span",{class:"token tag"},[t("span",{class:"token punctuation"},"<"),n("a-typography-paragraph")]),n(` `),t("span",{class:"token attr-name"},":ellipsis"),t("span",{class:"token attr-value"},[t("span",{class:"token punctuation attr-equals"},"="),t("span",{class:"token punctuation"},'"'),n("ellipsis ? { rows: 2, expandable: true, symbol: 'more' } : false"),t("span",{class:"token punctuation"},'"')]),n(` `),t("span",{class:"token attr-name"},"content"),t("span",{class:"token attr-value"},[t("span",{class:"token punctuation attr-equals"},"="),t("span",{class:"token punctuation"},'"'),n(`Ant Design, a design language for background applications, is refined by Ant UED Team. Ant Design, a design language for background applications, is refined by Ant UED Team. Ant Design, a design language for background applications, is refined by Ant UED Team. Ant Design, a design language for background applications, is refined by Ant UED Team. Ant Design, a design language for background applications, is refined by Ant UED Team. Ant Design, a design language for background applications, is refined by Ant UED Team.`),t("span",{class:"token punctuation"},'"')]),n(` `),t("span",{class:"token punctuation"},"/>")]),n(` `),t("span",{class:"token tag"},[t("span",{class:"token tag"},[t("span",{class:"token punctuation"},"<"),n("a-typography-text")]),n(` `),t("span",{class:"token attr-name"},":style"),t("span",{class:"token attr-value"},[t("span",{class:"token punctuation attr-equals"},"="),t("span",{class:"token punctuation"},'"'),n("ellipsis ? { width: '100px' } : {}"),t("span",{class:"token punctuation"},'"')]),n(` `),t("span",{class:"token attr-name"},":ellipsis"),t("span",{class:"token attr-value"},[t("span",{class:"token punctuation attr-equals"},"="),t("span",{class:"token punctuation"},'"'),n("ellipsis ? { tooltip: 'I am ellipsis now!' } : false"),t("span",{class:"token punctuation"},'"')]),n(` `),t("span",{class:"token attr-name"},"content"),t("span",{class:"token attr-value"},[t("span",{class:"token punctuation attr-equals"},"="),t("span",{class:"token punctuation"},'"'),n("Ant Design, a design language for background applications, is refined by Ant UED Team."),t("span",{class:"token punctuation"},'"')]),n(` `),t("span",{class:"token punctuation"},"/>")]),n(` `),t("span",{class:"token tag"},[t("span",{class:"token tag"},[t("span",{class:"token punctuation"},"")]),n(` `),t("span",{class:"token tag"},[t("span",{class:"token tag"},[t("span",{class:"token punctuation"},"<"),n("script")]),t("span",{class:"token punctuation"},">")]),t("span",{class:"token script"},[t("span",{class:"token language-javascript"},[n(` `),t("span",{class:"token keyword"},"import"),n(),t("span",{class:"token punctuation"},"{"),n(" defineComponent"),t("span",{class:"token punctuation"},","),n(" ref "),t("span",{class:"token punctuation"},"}"),n(),t("span",{class:"token keyword"},"from"),n(),t("span",{class:"token string"},"'vue'"),t("span",{class:"token punctuation"},";"),n(` `),t("span",{class:"token keyword"},"export"),n(),t("span",{class:"token keyword"},"default"),n(),t("span",{class:"token function"},"defineComponent"),t("span",{class:"token punctuation"},"("),t("span",{class:"token punctuation"},"{"),n(` `),t("span",{class:"token function"},"setup"),t("span",{class:"token punctuation"},"("),t("span",{class:"token punctuation"},")"),n(),t("span",{class:"token punctuation"},"{"),n(` `),t("span",{class:"token keyword"},"return"),n(),t("span",{class:"token punctuation"},"{"),n(` `),t("span",{class:"token literal-property property"},"ellipsis"),t("span",{class:"token operator"},":"),n(),t("span",{class:"token function"},"ref"),t("span",{class:"token punctuation"},"("),t("span",{class:"token boolean"},"true"),t("span",{class:"token punctuation"},")"),t("span",{class:"token punctuation"},","),n(` `),t("span",{class:"token punctuation"},"}"),t("span",{class:"token punctuation"},";"),n(` `),t("span",{class:"token punctuation"},"}"),t("span",{class:"token punctuation"},","),n(` `),t("span",{class:"token punctuation"},"}"),t("span",{class:"token punctuation"},")"),t("span",{class:"token punctuation"},";"),n(` `)])]),t("span",{class:"token tag"},[t("span",{class:"token tag"},[t("span",{class:"token punctuation"},"")]),n(` `)])],-1)])),_:1})}const j=m(T,[["render",J]]),P=B({components:{HighlightOutlined:S,SmileOutlined:x,SmileFilled:V,CheckOutlined:v},setup(){const o=b("This is an editable text.");E(o,()=>{console.log("editableStr",o.value)});const a=b(["icon"]);return{radioToState:g=>{switch(g){case"text":return["text"];case"both":return["icon","text"];case"icon":default:return["icon"]}},stateToRadio:()=>a.value.indexOf("text")!==-1?a.value.indexOf("icon")!==-1?"both":"text":"icon",editableStr:o,customIconStr:b("Custom Edit icon and replace tooltip text."),hideTooltipStr:b("Hide Edit tooltip."),lengthLimitedStr:b("This is an editable text with limited length."),clickTriggerStr:b("Text or icon as trigger - click to start editing."),chooseTrigger:a,customEnterIconStr:b("Editable text with a custom enter icon in edit field."),noEnterIconStr:b("Editable text with no enter icon in edit field.")}}}),O={key:"copy-tooltip"},L={key:"copied-tooltip"};function N(o,a,l,k,g,I){const c=p("a-typography-paragraph"),u=p("HighlightOutlined"),i=p("a-radio"),h=p("a-radio-group"),C=p("CheckOutlined"),A=p("SmileOutlined"),G=p("SmileFilled"),F=p("demo-box");return r(),y(F,{jsfiddle:{us:"Provide additional interactive capacity of editable and copyable.",cn:"\u63D0\u4F9B\u53EF\u7F16\u8F91\u548C\u53EF\u590D\u5236\u7B49\u989D\u5916\u7684\u4EA4\u4E92\u80FD\u529B\u3002",docHtml:`

zh-CN

\u63D0\u4F9B\u53EF\u7F16\u8F91\u548C\u53EF\u590D\u5236\u7B49\u989D\u5916\u7684\u4EA4\u4E92\u80FD\u529B\u3002

en-US

Provide additional interactive capacity of editable and copyable.

`,order:3,title:{"zh-CN":"\u53EF\u4EA4\u4E92","en-US":"Interactive"},relativePath:"components/typography/demo/interactive.vue",sourceCode:"PHRlbXBsYXRlPgogIDxhLXR5cG9ncmFwaHktcGFyYWdyYXBoIHYtbW9kZWw6Y29udGVudD0iZWRpdGFibGVTdHIiIGVkaXRhYmxlIC8+CiAgPGEtdHlwb2dyYXBoeS1wYXJhZ3JhcGggdi1tb2RlbDpjb250ZW50PSJjdXN0b21JY29uU3RyIiBlZGl0YWJsZT4KICAgIDx0ZW1wbGF0ZSAjZWRpdGFibGVJY29uPjxIaWdobGlnaHRPdXRsaW5lZCAvPjwvdGVtcGxhdGU+CiAgICA8dGVtcGxhdGUgI2VkaXRhYmxlVG9vbHRpcD5jbGljayB0byBlZGl0IHRleHQ8L3RlbXBsYXRlPgogIDwvYS10eXBvZ3JhcGh5LXBhcmFncmFwaD4KICBUcmlnZ2VyIGVkaXQgd2l0aDombmJzcDsmbmJzcDsKICA8YS1yYWRpby1ncm91cAogICAgOnZhbHVlPSJzdGF0ZVRvUmFkaW8oKSIKICAgIEBjaGFuZ2U9ImUgPT4gKGNob29zZVRyaWdnZXIgPSByYWRpb1RvU3RhdGUoZS50YXJnZXQudmFsdWUpKSIKICA+CiAgICA8YS1yYWRpbyB2YWx1ZT0iaWNvbiI+aWNvbjwvYS1yYWRpbz4KICAgIDxhLXJhZGlvIHZhbHVlPSJ0ZXh0Ij50ZXh0PC9hLXJhZGlvPgogICAgPGEtcmFkaW8gdmFsdWU9ImJvdGgiPmJvdGg8L2EtcmFkaW8+CiAgPC9hLXJhZGlvLWdyb3VwPgogIDxhLXR5cG9ncmFwaHktcGFyYWdyYXBoCiAgICB2LW1vZGVsOmNvbnRlbnQ9ImNsaWNrVHJpZ2dlclN0ciIKICAgIDplZGl0YWJsZT0ieyB0cmlnZ2VyVHlwZTogY2hvb3NlVHJpZ2dlciB9IgogID4KICAgIDx0ZW1wbGF0ZSAjZWRpdGFibGVUb29sdGlwPmNsaWNrIHRvIGVkaXQgdGV4dDwvdGVtcGxhdGU+CiAgPC9hLXR5cG9ncmFwaHktcGFyYWdyYXBoPgogIDxhLXR5cG9ncmFwaHktcGFyYWdyYXBoIHYtbW9kZWw6Y29udGVudD0iY3VzdG9tRW50ZXJJY29uU3RyIiBlZGl0YWJsZT4KICAgIDx0ZW1wbGF0ZSAjZWRpdGFibGVJY29uPjxIaWdobGlnaHRPdXRsaW5lZCAvPjwvdGVtcGxhdGU+CiAgICA8dGVtcGxhdGUgI2VkaXRhYmxlVG9vbHRpcD5jbGljayB0byBlZGl0IHRleHQ8L3RlbXBsYXRlPgogICAgPHRlbXBsYXRlICNlZGl0YWJsZUVudGVySWNvbj0ieyBjbGFzc05hbWUgfSI+CiAgICAgIDxDaGVja091dGxpbmVkIDpjbGFzcz0iY2xhc3NOYW1lIiAvPgogICAgPC90ZW1wbGF0ZT4KICA8L2EtdHlwb2dyYXBoeS1wYXJhZ3JhcGg+CiAgPGEtdHlwb2dyYXBoeS1wYXJhZ3JhcGggdi1tb2RlbDpjb250ZW50PSJub0VudGVySWNvblN0ciIgZWRpdGFibGU+CiAgICA8dGVtcGxhdGUgI2VkaXRhYmxlSWNvbj48SGlnaGxpZ2h0T3V0bGluZWQgLz48L3RlbXBsYXRlPgogICAgPHRlbXBsYXRlICNlZGl0YWJsZVRvb2x0aXA+Y2xpY2sgdG8gZWRpdCB0ZXh0PC90ZW1wbGF0ZT4KICAgIDx0ZW1wbGF0ZSAjZWRpdGFibGVFbnRlckljb24+e3sgbnVsbCB9fTwvdGVtcGxhdGU+CiAgPC9hLXR5cG9ncmFwaHktcGFyYWdyYXBoPgogIDxhLXR5cG9ncmFwaHktcGFyYWdyYXBoIHYtbW9kZWw6Y29udGVudD0iaGlkZVRvb2x0aXBTdHIiIDplZGl0YWJsZT0ieyB0b29sdGlwOiBmYWxzZSB9IiAvPgogIDxhLXR5cG9ncmFwaHktcGFyYWdyYXBoCiAgICB2LW1vZGVsOmNvbnRlbnQ9Imxlbmd0aExpbWl0ZWRTdHIiCiAgICA6ZWRpdGFibGU9InsgbWF4bGVuZ3RoOiA1MCwgYXV0b1NpemU6IHsgbWF4Um93czogNSwgbWluUm93czogMyB9IH0iCiAgLz4KCiAgPGEtdHlwb2dyYXBoeS1wYXJhZ3JhcGggY29weWFibGU+VGhpcyBpcyBhIGNvcHlhYmxlIHRleHQuPC9hLXR5cG9ncmFwaHktcGFyYWdyYXBoPgogIDxhLXR5cG9ncmFwaHktcGFyYWdyYXBoIDpjb3B5YWJsZT0ieyB0ZXh0OiAnSGVsbG8sIEFudCBEZXNpZ24hJyB9Ij4KICAgIFJlcGxhY2UgY29weSB0ZXh0LgogIDwvYS10eXBvZ3JhcGh5LXBhcmFncmFwaD4KICA8YS10eXBvZ3JhcGh5LXBhcmFncmFwaCBjb3B5YWJsZSBjb250ZW50PSJDdXN0b20gQ29weSBpY29uIGFuZCByZXBsYWNlIHRvb2x0aXBzIHRleHQuIj4KICAgIDx0ZW1wbGF0ZSAjY29weWFibGVJY29uPSJ7IGNvcGllZCB9Ij4KICAgICAgPFNtaWxlT3V0bGluZWQgdi1pZj0iIWNvcGllZCIga2V5PSJjb3B5LWljb24iIC8+CiAgICAgIDxTbWlsZUZpbGxlZCB2LWVsc2Uga2V5PSJjb3BpZWQtaWNvbiIgLz4KICAgIDwvdGVtcGxhdGU+CiAgICA8dGVtcGxhdGUgI2NvcHlhYmxlVG9vbHRpcD0ieyBjb3BpZWQgfSI+CiAgICAgIDxzcGFuIHYtaWY9IiFjb3BpZWQiIGtleT0iY29weS10b29sdGlwIj5jbGljayBoZXJlPC9zcGFuPgogICAgICA8c3BhbiB2LWVsc2Uga2V5PSJjb3BpZWQtdG9vbHRpcCI+eW91IGNsaWNrZWQhITwvc3Bhbj4KICAgIDwvdGVtcGxhdGU+CiAgPC9hLXR5cG9ncmFwaHktcGFyYWdyYXBoPgogIDxhLXR5cG9ncmFwaHktcGFyYWdyYXBoIDpjb3B5YWJsZT0ieyB0b29sdGlwOiBmYWxzZSB9Ij4KICAgIEhpZGUgQ29weSB0b29sdGlwcy4KICA8L2EtdHlwb2dyYXBoeS1wYXJhZ3JhcGg+CjwvdGVtcGxhdGU+CjxzY3JpcHQgbGFuZz0idHMiPgppbXBvcnQgeyBkZWZpbmVDb21wb25lbnQsIHJlZiwgd2F0Y2ggfSBmcm9tICd2dWUnOwppbXBvcnQgewogIEhpZ2hsaWdodE91dGxpbmVkLAogIFNtaWxlT3V0bGluZWQsCiAgU21pbGVGaWxsZWQsCiAgQ2hlY2tPdXRsaW5lZCwKfSBmcm9tICdAYW50LWRlc2lnbi9pY29ucy12dWUnOwoKZXhwb3J0IGRlZmF1bHQgZGVmaW5lQ29tcG9uZW50KHsKICBjb21wb25lbnRzOiB7CiAgICBIaWdobGlnaHRPdXRsaW5lZCwKICAgIFNtaWxlT3V0bGluZWQsCiAgICBTbWlsZUZpbGxlZCwKICAgIENoZWNrT3V0bGluZWQsCiAgfSwKICBzZXR1cCgpIHsKICAgIGNvbnN0IGVkaXRhYmxlU3RyID0gcmVmKCdUaGlzIGlzIGFuIGVkaXRhYmxlIHRleHQuJyk7CiAgICB3YXRjaChlZGl0YWJsZVN0ciwgKCkgPT4gewogICAgICBjb25zb2xlLmxvZygnZWRpdGFibGVTdHInLCBlZGl0YWJsZVN0ci52YWx1ZSk7CiAgICB9KTsKICAgIGNvbnN0IGNob29zZVRyaWdnZXIgPSByZWY8KCdpY29uJyB8ICd0ZXh0JylbXT4oWydpY29uJ10pOwoKICAgIGNvbnN0IHJhZGlvVG9TdGF0ZSA9IChpbnB1dDogc3RyaW5nKTogKCdpY29uJyB8ICd0ZXh0JylbXSA9PiB7CiAgICAgIHN3aXRjaCAoaW5wdXQpIHsKICAgICAgICBjYXNlICd0ZXh0JzoKICAgICAgICAgIHJldHVybiBbJ3RleHQnXTsKICAgICAgICBjYXNlICdib3RoJzoKICAgICAgICAgIHJldHVybiBbJ2ljb24nLCAndGV4dCddOwogICAgICAgIGNhc2UgJ2ljb24nOgogICAgICAgIGRlZmF1bHQ6CiAgICAgICAgICByZXR1cm4gWydpY29uJ107CiAgICAgIH0KICAgIH07CgogICAgY29uc3Qgc3RhdGVUb1JhZGlvID0gKCkgPT4gewogICAgICBpZiAoY2hvb3NlVHJpZ2dlci52YWx1ZS5pbmRleE9mKCd0ZXh0JykgIT09IC0xKSB7CiAgICAgICAgcmV0dXJuIGNob29zZVRyaWdnZXIudmFsdWUuaW5kZXhPZignaWNvbicpICE9PSAtMSA/ICdib3RoJyA6ICd0ZXh0JzsKICAgICAgfQogICAgICByZXR1cm4gJ2ljb24nOwogICAgfTsKICAgIHJldHVybiB7CiAgICAgIHJhZGlvVG9TdGF0ZSwKICAgICAgc3RhdGVUb1JhZGlvLAogICAgICBlZGl0YWJsZVN0ciwKICAgICAgY3VzdG9tSWNvblN0cjogcmVmKCdDdXN0b20gRWRpdCBpY29uIGFuZCByZXBsYWNlIHRvb2x0aXAgdGV4dC4nKSwKICAgICAgaGlkZVRvb2x0aXBTdHI6IHJlZignSGlkZSBFZGl0IHRvb2x0aXAuJyksCiAgICAgIGxlbmd0aExpbWl0ZWRTdHI6IHJlZignVGhpcyBpcyBhbiBlZGl0YWJsZSB0ZXh0IHdpdGggbGltaXRlZCBsZW5ndGguJyksCiAgICAgIGNsaWNrVHJpZ2dlclN0cjogcmVmKCdUZXh0IG9yIGljb24gYXMgdHJpZ2dlciAtIGNsaWNrIHRvIHN0YXJ0IGVkaXRpbmcuJyksCiAgICAgIGNob29zZVRyaWdnZXIsCiAgICAgIGN1c3RvbUVudGVySWNvblN0cjogcmVmKCdFZGl0YWJsZSB0ZXh0IHdpdGggYSBjdXN0b20gZW50ZXIgaWNvbiBpbiBlZGl0IGZpZWxkLicpLAogICAgICBub0VudGVySWNvblN0cjogcmVmKCdFZGl0YWJsZSB0ZXh0IHdpdGggbm8gZW50ZXIgaWNvbiBpbiBlZGl0IGZpZWxkLicpLAogICAgfTsKICB9LAp9KTsKPC9zY3JpcHQ+Cgo=",jsSourceCode:"PHRlbXBsYXRlPgogIDxhLXR5cG9ncmFwaHktcGFyYWdyYXBoIHYtbW9kZWw6Y29udGVudD0iZWRpdGFibGVTdHIiIGVkaXRhYmxlIC8+CiAgPGEtdHlwb2dyYXBoeS1wYXJhZ3JhcGggdi1tb2RlbDpjb250ZW50PSJjdXN0b21JY29uU3RyIiBlZGl0YWJsZT4KICAgIDx0ZW1wbGF0ZSAjZWRpdGFibGVJY29uPjxIaWdobGlnaHRPdXRsaW5lZCAvPjwvdGVtcGxhdGU+CiAgICA8dGVtcGxhdGUgI2VkaXRhYmxlVG9vbHRpcD5jbGljayB0byBlZGl0IHRleHQ8L3RlbXBsYXRlPgogIDwvYS10eXBvZ3JhcGh5LXBhcmFncmFwaD4KICBUcmlnZ2VyIGVkaXQgd2l0aDombmJzcDsmbmJzcDsKICA8YS1yYWRpby1ncm91cAogICAgOnZhbHVlPSJzdGF0ZVRvUmFkaW8oKSIKICAgIEBjaGFuZ2U9ImUgPT4gKGNob29zZVRyaWdnZXIgPSByYWRpb1RvU3RhdGUoZS50YXJnZXQudmFsdWUpKSIKICA+CiAgICA8YS1yYWRpbyB2YWx1ZT0iaWNvbiI+aWNvbjwvYS1yYWRpbz4KICAgIDxhLXJhZGlvIHZhbHVlPSJ0ZXh0Ij50ZXh0PC9hLXJhZGlvPgogICAgPGEtcmFkaW8gdmFsdWU9ImJvdGgiPmJvdGg8L2EtcmFkaW8+CiAgPC9hLXJhZGlvLWdyb3VwPgogIDxhLXR5cG9ncmFwaHktcGFyYWdyYXBoCiAgICB2LW1vZGVsOmNvbnRlbnQ9ImNsaWNrVHJpZ2dlclN0ciIKICAgIDplZGl0YWJsZT0ieyB0cmlnZ2VyVHlwZTogY2hvb3NlVHJpZ2dlciB9IgogID4KICAgIDx0ZW1wbGF0ZSAjZWRpdGFibGVUb29sdGlwPmNsaWNrIHRvIGVkaXQgdGV4dDwvdGVtcGxhdGU+CiAgPC9hLXR5cG9ncmFwaHktcGFyYWdyYXBoPgogIDxhLXR5cG9ncmFwaHktcGFyYWdyYXBoIHYtbW9kZWw6Y29udGVudD0iY3VzdG9tRW50ZXJJY29uU3RyIiBlZGl0YWJsZT4KICAgIDx0ZW1wbGF0ZSAjZWRpdGFibGVJY29uPjxIaWdobGlnaHRPdXRsaW5lZCAvPjwvdGVtcGxhdGU+CiAgICA8dGVtcGxhdGUgI2VkaXRhYmxlVG9vbHRpcD5jbGljayB0byBlZGl0IHRleHQ8L3RlbXBsYXRlPgogICAgPHRlbXBsYXRlICNlZGl0YWJsZUVudGVySWNvbj0ieyBjbGFzc05hbWUgfSI+CiAgICAgIDxDaGVja091dGxpbmVkIDpjbGFzcz0iY2xhc3NOYW1lIiAvPgogICAgPC90ZW1wbGF0ZT4KICA8L2EtdHlwb2dyYXBoeS1wYXJhZ3JhcGg+CiAgPGEtdHlwb2dyYXBoeS1wYXJhZ3JhcGggdi1tb2RlbDpjb250ZW50PSJub0VudGVySWNvblN0ciIgZWRpdGFibGU+CiAgICA8dGVtcGxhdGUgI2VkaXRhYmxlSWNvbj48SGlnaGxpZ2h0T3V0bGluZWQgLz48L3RlbXBsYXRlPgogICAgPHRlbXBsYXRlICNlZGl0YWJsZVRvb2x0aXA+Y2xpY2sgdG8gZWRpdCB0ZXh0PC90ZW1wbGF0ZT4KICAgIDx0ZW1wbGF0ZSAjZWRpdGFibGVFbnRlckljb24+e3sgbnVsbCB9fTwvdGVtcGxhdGU+CiAgPC9hLXR5cG9ncmFwaHktcGFyYWdyYXBoPgogIDxhLXR5cG9ncmFwaHktcGFyYWdyYXBoIHYtbW9kZWw6Y29udGVudD0iaGlkZVRvb2x0aXBTdHIiIDplZGl0YWJsZT0ieyB0b29sdGlwOiBmYWxzZSB9IiAvPgogIDxhLXR5cG9ncmFwaHktcGFyYWdyYXBoCiAgICB2LW1vZGVsOmNvbnRlbnQ9Imxlbmd0aExpbWl0ZWRTdHIiCiAgICA6ZWRpdGFibGU9InsgbWF4bGVuZ3RoOiA1MCwgYXV0b1NpemU6IHsgbWF4Um93czogNSwgbWluUm93czogMyB9IH0iCiAgLz4KCiAgPGEtdHlwb2dyYXBoeS1wYXJhZ3JhcGggY29weWFibGU+VGhpcyBpcyBhIGNvcHlhYmxlIHRleHQuPC9hLXR5cG9ncmFwaHktcGFyYWdyYXBoPgogIDxhLXR5cG9ncmFwaHktcGFyYWdyYXBoIDpjb3B5YWJsZT0ieyB0ZXh0OiAnSGVsbG8sIEFudCBEZXNpZ24hJyB9Ij4KICAgIFJlcGxhY2UgY29weSB0ZXh0LgogIDwvYS10eXBvZ3JhcGh5LXBhcmFncmFwaD4KICA8YS10eXBvZ3JhcGh5LXBhcmFncmFwaCBjb3B5YWJsZSBjb250ZW50PSJDdXN0b20gQ29weSBpY29uIGFuZCByZXBsYWNlIHRvb2x0aXBzIHRleHQuIj4KICAgIDx0ZW1wbGF0ZSAjY29weWFibGVJY29uPSJ7IGNvcGllZCB9Ij4KICAgICAgPFNtaWxlT3V0bGluZWQgdi1pZj0iIWNvcGllZCIga2V5PSJjb3B5LWljb24iIC8+CiAgICAgIDxTbWlsZUZpbGxlZCB2LWVsc2Uga2V5PSJjb3BpZWQtaWNvbiIgLz4KICAgIDwvdGVtcGxhdGU+CiAgICA8dGVtcGxhdGUgI2NvcHlhYmxlVG9vbHRpcD0ieyBjb3BpZWQgfSI+CiAgICAgIDxzcGFuIHYtaWY9IiFjb3BpZWQiIGtleT0iY29weS10b29sdGlwIj5jbGljayBoZXJlPC9zcGFuPgogICAgICA8c3BhbiB2LWVsc2Uga2V5PSJjb3BpZWQtdG9vbHRpcCI+eW91IGNsaWNrZWQhITwvc3Bhbj4KICAgIDwvdGVtcGxhdGU+CiAgPC9hLXR5cG9ncmFwaHktcGFyYWdyYXBoPgogIDxhLXR5cG9ncmFwaHktcGFyYWdyYXBoIDpjb3B5YWJsZT0ieyB0b29sdGlwOiBmYWxzZSB9Ij4KICAgIEhpZGUgQ29weSB0b29sdGlwcy4KICA8L2EtdHlwb2dyYXBoeS1wYXJhZ3JhcGg+CjwvdGVtcGxhdGU+CjxzY3JpcHQ+CmltcG9ydCB7IGRlZmluZUNvbXBvbmVudCwgcmVmLCB3YXRjaCB9IGZyb20gJ3Z1ZSc7CmltcG9ydCB7IEhpZ2hsaWdodE91dGxpbmVkLCBTbWlsZU91dGxpbmVkLCBTbWlsZUZpbGxlZCwgQ2hlY2tPdXRsaW5lZCB9IGZyb20gJ0BhbnQtZGVzaWduL2ljb25zLXZ1ZSc7CmV4cG9ydCBkZWZhdWx0IGRlZmluZUNvbXBvbmVudCh7CiAgY29tcG9uZW50czogewogICAgSGlnaGxpZ2h0T3V0bGluZWQsCiAgICBTbWlsZU91dGxpbmVkLAogICAgU21pbGVGaWxsZWQsCiAgICBDaGVja091dGxpbmVkLAogIH0sCiAgc2V0dXAoKSB7CiAgICBjb25zdCBlZGl0YWJsZVN0ciA9IHJlZignVGhpcyBpcyBhbiBlZGl0YWJsZSB0ZXh0LicpOwogICAgd2F0Y2goZWRpdGFibGVTdHIsICgpID0+IHsKICAgICAgY29uc29sZS5sb2coJ2VkaXRhYmxlU3RyJywgZWRpdGFibGVTdHIudmFsdWUpOwogICAgfSk7CiAgICBjb25zdCBjaG9vc2VUcmlnZ2VyID0gcmVmKFsnaWNvbiddKTsKICAgIGNvbnN0IHJhZGlvVG9TdGF0ZSA9IGlucHV0ID0+IHsKICAgICAgc3dpdGNoIChpbnB1dCkgewogICAgICAgIGNhc2UgJ3RleHQnOgogICAgICAgICAgcmV0dXJuIFsndGV4dCddOwogICAgICAgIGNhc2UgJ2JvdGgnOgogICAgICAgICAgcmV0dXJuIFsnaWNvbicsICd0ZXh0J107CiAgICAgICAgY2FzZSAnaWNvbic6CiAgICAgICAgZGVmYXVsdDoKICAgICAgICAgIHJldHVybiBbJ2ljb24nXTsKICAgICAgfQogICAgfTsKICAgIGNvbnN0IHN0YXRlVG9SYWRpbyA9ICgpID0+IHsKICAgICAgaWYgKGNob29zZVRyaWdnZXIudmFsdWUuaW5kZXhPZigndGV4dCcpICE9PSAtMSkgewogICAgICAgIHJldHVybiBjaG9vc2VUcmlnZ2VyLnZhbHVlLmluZGV4T2YoJ2ljb24nKSAhPT0gLTEgPyAnYm90aCcgOiAndGV4dCc7CiAgICAgIH0KICAgICAgcmV0dXJuICdpY29uJzsKICAgIH07CiAgICByZXR1cm4gewogICAgICByYWRpb1RvU3RhdGUsCiAgICAgIHN0YXRlVG9SYWRpbywKICAgICAgZWRpdGFibGVTdHIsCiAgICAgIGN1c3RvbUljb25TdHI6IHJlZignQ3VzdG9tIEVkaXQgaWNvbiBhbmQgcmVwbGFjZSB0b29sdGlwIHRleHQuJyksCiAgICAgIGhpZGVUb29sdGlwU3RyOiByZWYoJ0hpZGUgRWRpdCB0b29sdGlwLicpLAogICAgICBsZW5ndGhMaW1pdGVkU3RyOiByZWYoJ1RoaXMgaXMgYW4gZWRpdGFibGUgdGV4dCB3aXRoIGxpbWl0ZWQgbGVuZ3RoLicpLAogICAgICBjbGlja1RyaWdnZXJTdHI6IHJlZignVGV4dCBvciBpY29uIGFzIHRyaWdnZXIgLSBjbGljayB0byBzdGFydCBlZGl0aW5nLicpLAogICAgICBjaG9vc2VUcmlnZ2VyLAogICAgICBjdXN0b21FbnRlckljb25TdHI6IHJlZignRWRpdGFibGUgdGV4dCB3aXRoIGEgY3VzdG9tIGVudGVyIGljb24gaW4gZWRpdCBmaWVsZC4nKSwKICAgICAgbm9FbnRlckljb25TdHI6IHJlZignRWRpdGFibGUgdGV4dCB3aXRoIG5vIGVudGVyIGljb24gaW4gZWRpdCBmaWVsZC4nKSwKICAgIH07CiAgfSwKfSk7Cjwvc2NyaXB0Pg=="}},{default:s(()=>[e(c,{content:o.editableStr,"onUpdate:content":a[0]||(a[0]=d=>o.editableStr=d),editable:""},null,8,["content"]),e(c,{content:o.customIconStr,"onUpdate:content":a[1]||(a[1]=d=>o.customIconStr=d),editable:""},{editableIcon:s(()=>[e(u)]),editableTooltip:s(()=>a[8]||(a[8]=[n("click to edit text")])),_:1},8,["content"]),a[19]||(a[19]=n(" Trigger edit with:\xA0\xA0 ")),e(h,{value:o.stateToRadio(),onChange:a[2]||(a[2]=d=>o.chooseTrigger=o.radioToState(d.target.value))},{default:s(()=>[e(i,{value:"icon"},{default:s(()=>a[9]||(a[9]=[n("icon")])),_:1,__:[9]}),e(i,{value:"text"},{default:s(()=>a[10]||(a[10]=[n("text")])),_:1,__:[10]}),e(i,{value:"both"},{default:s(()=>a[11]||(a[11]=[n("both")])),_:1,__:[11]})]),_:1},8,["value"]),e(c,{content:o.clickTriggerStr,"onUpdate:content":a[3]||(a[3]=d=>o.clickTriggerStr=d),editable:{triggerType:o.chooseTrigger}},{editableTooltip:s(()=>a[12]||(a[12]=[n("click to edit text")])),_:1},8,["content","editable"]),e(c,{content:o.customEnterIconStr,"onUpdate:content":a[4]||(a[4]=d=>o.customEnterIconStr=d),editable:""},{editableIcon:s(()=>[e(u)]),editableTooltip:s(()=>a[13]||(a[13]=[n("click to edit text")])),editableEnterIcon:s(({className:d})=>[e(C,{class:w(d)},null,8,["class"])]),_:1},8,["content"]),e(c,{content:o.noEnterIconStr,"onUpdate:content":a[5]||(a[5]=d=>o.noEnterIconStr=d),editable:""},{editableIcon:s(()=>[e(u)]),editableTooltip:s(()=>a[14]||(a[14]=[n("click to edit text")])),editableEnterIcon:s(()=>a[15]||(a[15]=[n(W(null))])),_:1},8,["content"]),e(c,{content:o.hideTooltipStr,"onUpdate:content":a[6]||(a[6]=d=>o.hideTooltipStr=d),editable:{tooltip:!1}},null,8,["content"]),e(c,{content:o.lengthLimitedStr,"onUpdate:content":a[7]||(a[7]=d=>o.lengthLimitedStr=d),editable:{maxlength:50,autoSize:{maxRows:5,minRows:3}}},null,8,["content"]),e(c,{copyable:""},{default:s(()=>a[16]||(a[16]=[n("This is a copyable text.")])),_:1,__:[16]}),e(c,{copyable:{text:"Hello, Ant Design!"}},{default:s(()=>a[17]||(a[17]=[n(" Replace copy text. ")])),_:1,__:[17]}),e(c,{copyable:"",content:"Custom Copy icon and replace tooltips text."},{copyableIcon:s(({copied:d})=>[d?(r(),y(G,{key:"copied-icon"})):(r(),y(A,{key:"copy-icon"}))]),copyableTooltip:s(({copied:d})=>[d?(r(),Z("span",L,"you clicked!!")):(r(),Z("span",O,"click here"))]),_:1}),e(c,{copyable:{tooltip:!1}},{default:s(()=>a[18]||(a[18]=[n(" Hide Copy tooltips. ")])),_:1,__:[18]})]),htmlCode:s(()=>a[20]||(a[20]=[t("pre",{class:"language-vue"},[t("code",null,[t("span",{class:"token tag"},[t("span",{class:"token tag"},[t("span",{class:"token punctuation"},"<"),n("template")]),t("span",{class:"token punctuation"},">")]),n(` `),t("span",{class:"token tag"},[t("span",{class:"token tag"},[t("span",{class:"token punctuation"},"<"),n("a-typography-paragraph")]),n(),t("span",{class:"token attr-name"},[t("span",{class:"token namespace"},"v-model:"),n("content")]),t("span",{class:"token attr-value"},[t("span",{class:"token punctuation attr-equals"},"="),t("span",{class:"token punctuation"},'"'),n("editableStr"),t("span",{class:"token punctuation"},'"')]),n(),t("span",{class:"token attr-name"},"editable"),n(),t("span",{class:"token punctuation"},"/>")]),n(` `),t("span",{class:"token tag"},[t("span",{class:"token tag"},[t("span",{class:"token punctuation"},"<"),n("a-typography-paragraph")]),n(),t("span",{class:"token attr-name"},[t("span",{class:"token namespace"},"v-model:"),n("content")]),t("span",{class:"token attr-value"},[t("span",{class:"token punctuation attr-equals"},"="),t("span",{class:"token punctuation"},'"'),n("customIconStr"),t("span",{class:"token punctuation"},'"')]),n(),t("span",{class:"token attr-name"},"editable"),t("span",{class:"token punctuation"},">")]),n(` `),t("span",{class:"token tag"},[t("span",{class:"token tag"},[t("span",{class:"token punctuation"},"<"),n("template")]),n(),t("span",{class:"token attr-name"},"#editableIcon"),t("span",{class:"token punctuation"},">")]),t("span",{class:"token tag"},[t("span",{class:"token tag"},[t("span",{class:"token punctuation"},"<"),n("HighlightOutlined")]),n(),t("span",{class:"token punctuation"},"/>")]),t("span",{class:"token tag"},[t("span",{class:"token tag"},[t("span",{class:"token punctuation"},"")]),n(` `),t("span",{class:"token tag"},[t("span",{class:"token tag"},[t("span",{class:"token punctuation"},"<"),n("template")]),n(),t("span",{class:"token attr-name"},"#editableTooltip"),t("span",{class:"token punctuation"},">")]),n("click to edit text"),t("span",{class:"token tag"},[t("span",{class:"token tag"},[t("span",{class:"token punctuation"},"")]),n(` `),t("span",{class:"token tag"},[t("span",{class:"token tag"},[t("span",{class:"token punctuation"},"")]),n(` Trigger edit with:`),t("span",{class:"token entity named-entity",title:"\xA0"}," "),t("span",{class:"token entity named-entity",title:"\xA0"}," "),n(` `),t("span",{class:"token tag"},[t("span",{class:"token tag"},[t("span",{class:"token punctuation"},"<"),n("a-radio-group")]),n(` `),t("span",{class:"token attr-name"},":value"),t("span",{class:"token attr-value"},[t("span",{class:"token punctuation attr-equals"},"="),t("span",{class:"token punctuation"},'"'),n("stateToRadio()"),t("span",{class:"token punctuation"},'"')]),n(` `),t("span",{class:"token attr-name"},"@change"),t("span",{class:"token attr-value"},[t("span",{class:"token punctuation attr-equals"},"="),t("span",{class:"token punctuation"},'"'),n("e => (chooseTrigger = radioToState(e.target.value))"),t("span",{class:"token punctuation"},'"')]),n(` `),t("span",{class:"token punctuation"},">")]),n(` `),t("span",{class:"token tag"},[t("span",{class:"token tag"},[t("span",{class:"token punctuation"},"<"),n("a-radio")]),n(),t("span",{class:"token attr-name"},"value"),t("span",{class:"token attr-value"},[t("span",{class:"token punctuation attr-equals"},"="),t("span",{class:"token punctuation"},'"'),n("icon"),t("span",{class:"token punctuation"},'"')]),t("span",{class:"token punctuation"},">")]),n("icon"),t("span",{class:"token tag"},[t("span",{class:"token tag"},[t("span",{class:"token punctuation"},"")]),n(` `),t("span",{class:"token tag"},[t("span",{class:"token tag"},[t("span",{class:"token punctuation"},"<"),n("a-radio")]),n(),t("span",{class:"token attr-name"},"value"),t("span",{class:"token attr-value"},[t("span",{class:"token punctuation attr-equals"},"="),t("span",{class:"token punctuation"},'"'),n("text"),t("span",{class:"token punctuation"},'"')]),t("span",{class:"token punctuation"},">")]),n("text"),t("span",{class:"token tag"},[t("span",{class:"token tag"},[t("span",{class:"token punctuation"},"")]),n(` `),t("span",{class:"token tag"},[t("span",{class:"token tag"},[t("span",{class:"token punctuation"},"<"),n("a-radio")]),n(),t("span",{class:"token attr-name"},"value"),t("span",{class:"token attr-value"},[t("span",{class:"token punctuation attr-equals"},"="),t("span",{class:"token punctuation"},'"'),n("both"),t("span",{class:"token punctuation"},'"')]),t("span",{class:"token punctuation"},">")]),n("both"),t("span",{class:"token tag"},[t("span",{class:"token tag"},[t("span",{class:"token punctuation"},"")]),n(` `),t("span",{class:"token tag"},[t("span",{class:"token tag"},[t("span",{class:"token punctuation"},"")]),n(` `),t("span",{class:"token tag"},[t("span",{class:"token tag"},[t("span",{class:"token punctuation"},"<"),n("a-typography-paragraph")]),n(` `),t("span",{class:"token attr-name"},[t("span",{class:"token namespace"},"v-model:"),n("content")]),t("span",{class:"token attr-value"},[t("span",{class:"token punctuation attr-equals"},"="),t("span",{class:"token punctuation"},'"'),n("clickTriggerStr"),t("span",{class:"token punctuation"},'"')]),n(` `),t("span",{class:"token attr-name"},":editable"),t("span",{class:"token attr-value"},[t("span",{class:"token punctuation attr-equals"},"="),t("span",{class:"token punctuation"},'"'),n("{ triggerType: chooseTrigger }"),t("span",{class:"token punctuation"},'"')]),n(` `),t("span",{class:"token punctuation"},">")]),n(` `),t("span",{class:"token tag"},[t("span",{class:"token tag"},[t("span",{class:"token punctuation"},"<"),n("template")]),n(),t("span",{class:"token attr-name"},"#editableTooltip"),t("span",{class:"token punctuation"},">")]),n("click to edit text"),t("span",{class:"token tag"},[t("span",{class:"token tag"},[t("span",{class:"token punctuation"},"")]),n(` `),t("span",{class:"token tag"},[t("span",{class:"token tag"},[t("span",{class:"token punctuation"},"")]),n(` `),t("span",{class:"token tag"},[t("span",{class:"token tag"},[t("span",{class:"token punctuation"},"<"),n("a-typography-paragraph")]),n(),t("span",{class:"token attr-name"},[t("span",{class:"token namespace"},"v-model:"),n("content")]),t("span",{class:"token attr-value"},[t("span",{class:"token punctuation attr-equals"},"="),t("span",{class:"token punctuation"},'"'),n("customEnterIconStr"),t("span",{class:"token punctuation"},'"')]),n(),t("span",{class:"token attr-name"},"editable"),t("span",{class:"token punctuation"},">")]),n(` `),t("span",{class:"token tag"},[t("span",{class:"token tag"},[t("span",{class:"token punctuation"},"<"),n("template")]),n(),t("span",{class:"token attr-name"},"#editableIcon"),t("span",{class:"token punctuation"},">")]),t("span",{class:"token tag"},[t("span",{class:"token tag"},[t("span",{class:"token punctuation"},"<"),n("HighlightOutlined")]),n(),t("span",{class:"token punctuation"},"/>")]),t("span",{class:"token tag"},[t("span",{class:"token tag"},[t("span",{class:"token punctuation"},"")]),n(` `),t("span",{class:"token tag"},[t("span",{class:"token tag"},[t("span",{class:"token punctuation"},"<"),n("template")]),n(),t("span",{class:"token attr-name"},"#editableTooltip"),t("span",{class:"token punctuation"},">")]),n("click to edit text"),t("span",{class:"token tag"},[t("span",{class:"token tag"},[t("span",{class:"token punctuation"},"")]),n(` `),t("span",{class:"token tag"},[t("span",{class:"token tag"},[t("span",{class:"token punctuation"},"<"),n("template")]),n(),t("span",{class:"token attr-name"},"#editableEnterIcon"),t("span",{class:"token attr-value"},[t("span",{class:"token punctuation attr-equals"},"="),t("span",{class:"token punctuation"},'"'),n("{ className }"),t("span",{class:"token punctuation"},'"')]),t("span",{class:"token punctuation"},">")]),n(` `),t("span",{class:"token tag"},[t("span",{class:"token tag"},[t("span",{class:"token punctuation"},"<"),n("CheckOutlined")]),n(),t("span",{class:"token attr-name"},":class"),t("span",{class:"token attr-value"},[t("span",{class:"token punctuation attr-equals"},"="),t("span",{class:"token punctuation"},'"'),n("className"),t("span",{class:"token punctuation"},'"')]),n(),t("span",{class:"token punctuation"},"/>")]),n(` `),t("span",{class:"token tag"},[t("span",{class:"token tag"},[t("span",{class:"token punctuation"},"")]),n(` `),t("span",{class:"token tag"},[t("span",{class:"token tag"},[t("span",{class:"token punctuation"},"")]),n(` `),t("span",{class:"token tag"},[t("span",{class:"token tag"},[t("span",{class:"token punctuation"},"<"),n("a-typography-paragraph")]),n(),t("span",{class:"token attr-name"},[t("span",{class:"token namespace"},"v-model:"),n("content")]),t("span",{class:"token attr-value"},[t("span",{class:"token punctuation attr-equals"},"="),t("span",{class:"token punctuation"},'"'),n("noEnterIconStr"),t("span",{class:"token punctuation"},'"')]),n(),t("span",{class:"token attr-name"},"editable"),t("span",{class:"token punctuation"},">")]),n(` `),t("span",{class:"token tag"},[t("span",{class:"token tag"},[t("span",{class:"token punctuation"},"<"),n("template")]),n(),t("span",{class:"token attr-name"},"#editableIcon"),t("span",{class:"token punctuation"},">")]),t("span",{class:"token tag"},[t("span",{class:"token tag"},[t("span",{class:"token punctuation"},"<"),n("HighlightOutlined")]),n(),t("span",{class:"token punctuation"},"/>")]),t("span",{class:"token tag"},[t("span",{class:"token tag"},[t("span",{class:"token punctuation"},"")]),n(` `),t("span",{class:"token tag"},[t("span",{class:"token tag"},[t("span",{class:"token punctuation"},"<"),n("template")]),n(),t("span",{class:"token attr-name"},"#editableTooltip"),t("span",{class:"token punctuation"},">")]),n("click to edit text"),t("span",{class:"token tag"},[t("span",{class:"token tag"},[t("span",{class:"token punctuation"},"")]),n(` `),t("span",{class:"token tag"},[t("span",{class:"token tag"},[t("span",{class:"token punctuation"},"<"),n("template")]),n(),t("span",{class:"token attr-name"},"#editableEnterIcon"),t("span",{class:"token punctuation"},">")]),n("{{ null }}"),t("span",{class:"token tag"},[t("span",{class:"token tag"},[t("span",{class:"token punctuation"},"")]),n(` `),t("span",{class:"token tag"},[t("span",{class:"token tag"},[t("span",{class:"token punctuation"},"")]),n(` `),t("span",{class:"token tag"},[t("span",{class:"token tag"},[t("span",{class:"token punctuation"},"<"),n("a-typography-paragraph")]),n(),t("span",{class:"token attr-name"},[t("span",{class:"token namespace"},"v-model:"),n("content")]),t("span",{class:"token attr-value"},[t("span",{class:"token punctuation attr-equals"},"="),t("span",{class:"token punctuation"},'"'),n("hideTooltipStr"),t("span",{class:"token punctuation"},'"')]),n(),t("span",{class:"token attr-name"},":editable"),t("span",{class:"token attr-value"},[t("span",{class:"token punctuation attr-equals"},"="),t("span",{class:"token punctuation"},'"'),n("{ tooltip: false }"),t("span",{class:"token punctuation"},'"')]),n(),t("span",{class:"token punctuation"},"/>")]),n(` `),t("span",{class:"token tag"},[t("span",{class:"token tag"},[t("span",{class:"token punctuation"},"<"),n("a-typography-paragraph")]),n(` `),t("span",{class:"token attr-name"},[t("span",{class:"token namespace"},"v-model:"),n("content")]),t("span",{class:"token attr-value"},[t("span",{class:"token punctuation attr-equals"},"="),t("span",{class:"token punctuation"},'"'),n("lengthLimitedStr"),t("span",{class:"token punctuation"},'"')]),n(` `),t("span",{class:"token attr-name"},":editable"),t("span",{class:"token attr-value"},[t("span",{class:"token punctuation attr-equals"},"="),t("span",{class:"token punctuation"},'"'),n("{ maxlength: 50, autoSize: { maxRows: 5, minRows: 3 } }"),t("span",{class:"token punctuation"},'"')]),n(` `),t("span",{class:"token punctuation"},"/>")]),n(` `),t("span",{class:"token tag"},[t("span",{class:"token tag"},[t("span",{class:"token punctuation"},"<"),n("a-typography-paragraph")]),n(),t("span",{class:"token attr-name"},"copyable"),t("span",{class:"token punctuation"},">")]),n("This is a copyable text."),t("span",{class:"token tag"},[t("span",{class:"token tag"},[t("span",{class:"token punctuation"},"")]),n(` `),t("span",{class:"token tag"},[t("span",{class:"token tag"},[t("span",{class:"token punctuation"},"<"),n("a-typography-paragraph")]),n(),t("span",{class:"token attr-name"},":copyable"),t("span",{class:"token attr-value"},[t("span",{class:"token punctuation attr-equals"},"="),t("span",{class:"token punctuation"},'"'),n("{ text: 'Hello, Ant Design!' }"),t("span",{class:"token punctuation"},'"')]),t("span",{class:"token punctuation"},">")]),n(` Replace copy text. `),t("span",{class:"token tag"},[t("span",{class:"token tag"},[t("span",{class:"token punctuation"},"")]),n(` `),t("span",{class:"token tag"},[t("span",{class:"token tag"},[t("span",{class:"token punctuation"},"<"),n("a-typography-paragraph")]),n(),t("span",{class:"token attr-name"},"copyable"),n(),t("span",{class:"token attr-name"},"content"),t("span",{class:"token attr-value"},[t("span",{class:"token punctuation attr-equals"},"="),t("span",{class:"token punctuation"},'"'),n("Custom Copy icon and replace tooltips text."),t("span",{class:"token punctuation"},'"')]),t("span",{class:"token punctuation"},">")]),n(` `),t("span",{class:"token tag"},[t("span",{class:"token tag"},[t("span",{class:"token punctuation"},"<"),n("template")]),n(),t("span",{class:"token attr-name"},"#copyableIcon"),t("span",{class:"token attr-value"},[t("span",{class:"token punctuation attr-equals"},"="),t("span",{class:"token punctuation"},'"'),n("{ copied }"),t("span",{class:"token punctuation"},'"')]),t("span",{class:"token punctuation"},">")]),n(` `),t("span",{class:"token tag"},[t("span",{class:"token tag"},[t("span",{class:"token punctuation"},"<"),n("SmileOutlined")]),n(),t("span",{class:"token attr-name"},"v-if"),t("span",{class:"token attr-value"},[t("span",{class:"token punctuation attr-equals"},"="),t("span",{class:"token punctuation"},'"'),n("!copied"),t("span",{class:"token punctuation"},'"')]),n(),t("span",{class:"token attr-name"},"key"),t("span",{class:"token attr-value"},[t("span",{class:"token punctuation attr-equals"},"="),t("span",{class:"token punctuation"},'"'),n("copy-icon"),t("span",{class:"token punctuation"},'"')]),n(),t("span",{class:"token punctuation"},"/>")]),n(` `),t("span",{class:"token tag"},[t("span",{class:"token tag"},[t("span",{class:"token punctuation"},"<"),n("SmileFilled")]),n(),t("span",{class:"token attr-name"},"v-else"),n(),t("span",{class:"token attr-name"},"key"),t("span",{class:"token attr-value"},[t("span",{class:"token punctuation attr-equals"},"="),t("span",{class:"token punctuation"},'"'),n("copied-icon"),t("span",{class:"token punctuation"},'"')]),n(),t("span",{class:"token punctuation"},"/>")]),n(` `),t("span",{class:"token tag"},[t("span",{class:"token tag"},[t("span",{class:"token punctuation"},"")]),n(` `),t("span",{class:"token tag"},[t("span",{class:"token tag"},[t("span",{class:"token punctuation"},"<"),n("template")]),n(),t("span",{class:"token attr-name"},"#copyableTooltip"),t("span",{class:"token attr-value"},[t("span",{class:"token punctuation attr-equals"},"="),t("span",{class:"token punctuation"},'"'),n("{ copied }"),t("span",{class:"token punctuation"},'"')]),t("span",{class:"token punctuation"},">")]),n(` `),t("span",{class:"token tag"},[t("span",{class:"token tag"},[t("span",{class:"token punctuation"},"<"),n("span")]),n(),t("span",{class:"token attr-name"},"v-if"),t("span",{class:"token attr-value"},[t("span",{class:"token punctuation attr-equals"},"="),t("span",{class:"token punctuation"},'"'),n("!copied"),t("span",{class:"token punctuation"},'"')]),n(),t("span",{class:"token attr-name"},"key"),t("span",{class:"token attr-value"},[t("span",{class:"token punctuation attr-equals"},"="),t("span",{class:"token punctuation"},'"'),n("copy-tooltip"),t("span",{class:"token punctuation"},'"')]),t("span",{class:"token punctuation"},">")]),n("click here"),t("span",{class:"token tag"},[t("span",{class:"token tag"},[t("span",{class:"token punctuation"},"")]),n(` `),t("span",{class:"token tag"},[t("span",{class:"token tag"},[t("span",{class:"token punctuation"},"<"),n("span")]),n(),t("span",{class:"token attr-name"},"v-else"),n(),t("span",{class:"token attr-name"},"key"),t("span",{class:"token attr-value"},[t("span",{class:"token punctuation attr-equals"},"="),t("span",{class:"token punctuation"},'"'),n("copied-tooltip"),t("span",{class:"token punctuation"},'"')]),t("span",{class:"token punctuation"},">")]),n("you clicked!!"),t("span",{class:"token tag"},[t("span",{class:"token tag"},[t("span",{class:"token punctuation"},"")]),n(` `),t("span",{class:"token tag"},[t("span",{class:"token tag"},[t("span",{class:"token punctuation"},"")]),n(` `),t("span",{class:"token tag"},[t("span",{class:"token tag"},[t("span",{class:"token punctuation"},"")]),n(` `),t("span",{class:"token tag"},[t("span",{class:"token tag"},[t("span",{class:"token punctuation"},"<"),n("a-typography-paragraph")]),n(),t("span",{class:"token attr-name"},":copyable"),t("span",{class:"token attr-value"},[t("span",{class:"token punctuation attr-equals"},"="),t("span",{class:"token punctuation"},'"'),n("{ tooltip: false }"),t("span",{class:"token punctuation"},'"')]),t("span",{class:"token punctuation"},">")]),n(` Hide Copy tooltips. `),t("span",{class:"token tag"},[t("span",{class:"token tag"},[t("span",{class:"token punctuation"},"")]),n(` `),t("span",{class:"token tag"},[t("span",{class:"token tag"},[t("span",{class:"token punctuation"},"")]),n(` `),t("span",{class:"token tag"},[t("span",{class:"token tag"},[t("span",{class:"token punctuation"},"<"),n("script")]),n(),t("span",{class:"token attr-name"},"lang"),t("span",{class:"token attr-value"},[t("span",{class:"token punctuation attr-equals"},"="),t("span",{class:"token punctuation"},'"'),n("ts"),t("span",{class:"token punctuation"},'"')]),t("span",{class:"token punctuation"},">")]),t("span",{class:"token script"},[t("span",{class:"token language-javascript"},[n(` `),t("span",{class:"token keyword"},"import"),n(),t("span",{class:"token punctuation"},"{"),n(" defineComponent"),t("span",{class:"token punctuation"},","),n(" ref"),t("span",{class:"token punctuation"},","),n(" watch "),t("span",{class:"token punctuation"},"}"),n(),t("span",{class:"token keyword"},"from"),n(),t("span",{class:"token string"},"'vue'"),t("span",{class:"token punctuation"},";"),n(` `),t("span",{class:"token keyword"},"import"),n(),t("span",{class:"token punctuation"},"{"),n(` HighlightOutlined`),t("span",{class:"token punctuation"},","),n(` SmileOutlined`),t("span",{class:"token punctuation"},","),n(` SmileFilled`),t("span",{class:"token punctuation"},","),n(` CheckOutlined`),t("span",{class:"token punctuation"},","),n(` `),t("span",{class:"token punctuation"},"}"),n(),t("span",{class:"token keyword"},"from"),n(),t("span",{class:"token string"},"'@ant-design/icons-vue'"),t("span",{class:"token punctuation"},";"),n(` `),t("span",{class:"token keyword"},"export"),n(),t("span",{class:"token keyword"},"default"),n(),t("span",{class:"token function"},"defineComponent"),t("span",{class:"token punctuation"},"("),t("span",{class:"token punctuation"},"{"),n(` `),t("span",{class:"token literal-property property"},"components"),t("span",{class:"token operator"},":"),n(),t("span",{class:"token punctuation"},"{"),n(` HighlightOutlined`),t("span",{class:"token punctuation"},","),n(` SmileOutlined`),t("span",{class:"token punctuation"},","),n(` SmileFilled`),t("span",{class:"token punctuation"},","),n(` CheckOutlined`),t("span",{class:"token punctuation"},","),n(` `),t("span",{class:"token punctuation"},"}"),t("span",{class:"token punctuation"},","),n(` `),t("span",{class:"token function"},"setup"),t("span",{class:"token punctuation"},"("),t("span",{class:"token punctuation"},")"),n(),t("span",{class:"token punctuation"},"{"),n(` `),t("span",{class:"token keyword"},"const"),n(" editableStr "),t("span",{class:"token operator"},"="),n(),t("span",{class:"token function"},"ref"),t("span",{class:"token punctuation"},"("),t("span",{class:"token string"},"'This is an editable text.'"),t("span",{class:"token punctuation"},")"),t("span",{class:"token punctuation"},";"),n(` `),t("span",{class:"token function"},"watch"),t("span",{class:"token punctuation"},"("),n("editableStr"),t("span",{class:"token punctuation"},","),n(),t("span",{class:"token punctuation"},"("),t("span",{class:"token punctuation"},")"),n(),t("span",{class:"token operator"},"=>"),n(),t("span",{class:"token punctuation"},"{"),n(` console`),t("span",{class:"token punctuation"},"."),t("span",{class:"token function"},"log"),t("span",{class:"token punctuation"},"("),t("span",{class:"token string"},"'editableStr'"),t("span",{class:"token punctuation"},","),n(" editableStr"),t("span",{class:"token punctuation"},"."),n("value"),t("span",{class:"token punctuation"},")"),t("span",{class:"token punctuation"},";"),n(` `),t("span",{class:"token punctuation"},"}"),t("span",{class:"token punctuation"},")"),t("span",{class:"token punctuation"},";"),n(` `),t("span",{class:"token keyword"},"const"),n(" chooseTrigger "),t("span",{class:"token operator"},"="),n(" ref"),t("span",{class:"token operator"},"<"),t("span",{class:"token punctuation"},"("),t("span",{class:"token string"},"'icon'"),n(),t("span",{class:"token operator"},"|"),n(),t("span",{class:"token string"},"'text'"),t("span",{class:"token punctuation"},")"),t("span",{class:"token punctuation"},"["),t("span",{class:"token punctuation"},"]"),t("span",{class:"token operator"},">"),t("span",{class:"token punctuation"},"("),t("span",{class:"token punctuation"},"["),t("span",{class:"token string"},"'icon'"),t("span",{class:"token punctuation"},"]"),t("span",{class:"token punctuation"},")"),t("span",{class:"token punctuation"},";"),n(` `),t("span",{class:"token keyword"},"const"),n(" radioToState "),t("span",{class:"token operator"},"="),n(),t("span",{class:"token punctuation"},"("),n("input"),t("span",{class:"token operator"},":"),n(" string"),t("span",{class:"token punctuation"},")"),t("span",{class:"token operator"},":"),n(),t("span",{class:"token punctuation"},"("),t("span",{class:"token string"},"'icon'"),n(),t("span",{class:"token operator"},"|"),n(),t("span",{class:"token string"},"'text'"),t("span",{class:"token punctuation"},")"),t("span",{class:"token punctuation"},"["),t("span",{class:"token punctuation"},"]"),n(),t("span",{class:"token operator"},"=>"),n(),t("span",{class:"token punctuation"},"{"),n(` `),t("span",{class:"token keyword"},"switch"),n(),t("span",{class:"token punctuation"},"("),n("input"),t("span",{class:"token punctuation"},")"),n(),t("span",{class:"token punctuation"},"{"),n(` `),t("span",{class:"token keyword"},"case"),n(),t("span",{class:"token string"},"'text'"),t("span",{class:"token operator"},":"),n(` `),t("span",{class:"token keyword"},"return"),n(),t("span",{class:"token punctuation"},"["),t("span",{class:"token string"},"'text'"),t("span",{class:"token punctuation"},"]"),t("span",{class:"token punctuation"},";"),n(` `),t("span",{class:"token keyword"},"case"),n(),t("span",{class:"token string"},"'both'"),t("span",{class:"token operator"},":"),n(` `),t("span",{class:"token keyword"},"return"),n(),t("span",{class:"token punctuation"},"["),t("span",{class:"token string"},"'icon'"),t("span",{class:"token punctuation"},","),n(),t("span",{class:"token string"},"'text'"),t("span",{class:"token punctuation"},"]"),t("span",{class:"token punctuation"},";"),n(` `),t("span",{class:"token keyword"},"case"),n(),t("span",{class:"token string"},"'icon'"),t("span",{class:"token operator"},":"),n(` `),t("span",{class:"token keyword"},"default"),t("span",{class:"token operator"},":"),n(` `),t("span",{class:"token keyword"},"return"),n(),t("span",{class:"token punctuation"},"["),t("span",{class:"token string"},"'icon'"),t("span",{class:"token punctuation"},"]"),t("span",{class:"token punctuation"},";"),n(` `),t("span",{class:"token punctuation"},"}"),n(` `),t("span",{class:"token punctuation"},"}"),t("span",{class:"token punctuation"},";"),n(` `),t("span",{class:"token keyword"},"const"),n(),t("span",{class:"token function-variable function"},"stateToRadio"),n(),t("span",{class:"token operator"},"="),n(),t("span",{class:"token punctuation"},"("),t("span",{class:"token punctuation"},")"),n(),t("span",{class:"token operator"},"=>"),n(),t("span",{class:"token punctuation"},"{"),n(` `),t("span",{class:"token keyword"},"if"),n(),t("span",{class:"token punctuation"},"("),n("chooseTrigger"),t("span",{class:"token punctuation"},"."),n("value"),t("span",{class:"token punctuation"},"."),t("span",{class:"token function"},"indexOf"),t("span",{class:"token punctuation"},"("),t("span",{class:"token string"},"'text'"),t("span",{class:"token punctuation"},")"),n(),t("span",{class:"token operator"},"!=="),n(),t("span",{class:"token operator"},"-"),t("span",{class:"token number"},"1"),t("span",{class:"token punctuation"},")"),n(),t("span",{class:"token punctuation"},"{"),n(` `),t("span",{class:"token keyword"},"return"),n(" chooseTrigger"),t("span",{class:"token punctuation"},"."),n("value"),t("span",{class:"token punctuation"},"."),t("span",{class:"token function"},"indexOf"),t("span",{class:"token punctuation"},"("),t("span",{class:"token string"},"'icon'"),t("span",{class:"token punctuation"},")"),n(),t("span",{class:"token operator"},"!=="),n(),t("span",{class:"token operator"},"-"),t("span",{class:"token number"},"1"),n(),t("span",{class:"token operator"},"?"),n(),t("span",{class:"token string"},"'both'"),n(),t("span",{class:"token operator"},":"),n(),t("span",{class:"token string"},"'text'"),t("span",{class:"token punctuation"},";"),n(` `),t("span",{class:"token punctuation"},"}"),n(` `),t("span",{class:"token keyword"},"return"),n(),t("span",{class:"token string"},"'icon'"),t("span",{class:"token punctuation"},";"),n(` `),t("span",{class:"token punctuation"},"}"),t("span",{class:"token punctuation"},";"),n(` `),t("span",{class:"token keyword"},"return"),n(),t("span",{class:"token punctuation"},"{"),n(` radioToState`),t("span",{class:"token punctuation"},","),n(` stateToRadio`),t("span",{class:"token punctuation"},","),n(` editableStr`),t("span",{class:"token punctuation"},","),n(` `),t("span",{class:"token literal-property property"},"customIconStr"),t("span",{class:"token operator"},":"),n(),t("span",{class:"token function"},"ref"),t("span",{class:"token punctuation"},"("),t("span",{class:"token string"},"'Custom Edit icon and replace tooltip text.'"),t("span",{class:"token punctuation"},")"),t("span",{class:"token punctuation"},","),n(` `),t("span",{class:"token literal-property property"},"hideTooltipStr"),t("span",{class:"token operator"},":"),n(),t("span",{class:"token function"},"ref"),t("span",{class:"token punctuation"},"("),t("span",{class:"token string"},"'Hide Edit tooltip.'"),t("span",{class:"token punctuation"},")"),t("span",{class:"token punctuation"},","),n(` `),t("span",{class:"token literal-property property"},"lengthLimitedStr"),t("span",{class:"token operator"},":"),n(),t("span",{class:"token function"},"ref"),t("span",{class:"token punctuation"},"("),t("span",{class:"token string"},"'This is an editable text with limited length.'"),t("span",{class:"token punctuation"},")"),t("span",{class:"token punctuation"},","),n(` `),t("span",{class:"token literal-property property"},"clickTriggerStr"),t("span",{class:"token operator"},":"),n(),t("span",{class:"token function"},"ref"),t("span",{class:"token punctuation"},"("),t("span",{class:"token string"},"'Text or icon as trigger - click to start editing.'"),t("span",{class:"token punctuation"},")"),t("span",{class:"token punctuation"},","),n(` chooseTrigger`),t("span",{class:"token punctuation"},","),n(` `),t("span",{class:"token literal-property property"},"customEnterIconStr"),t("span",{class:"token operator"},":"),n(),t("span",{class:"token function"},"ref"),t("span",{class:"token punctuation"},"("),t("span",{class:"token string"},"'Editable text with a custom enter icon in edit field.'"),t("span",{class:"token punctuation"},")"),t("span",{class:"token punctuation"},","),n(` `),t("span",{class:"token literal-property property"},"noEnterIconStr"),t("span",{class:"token operator"},":"),n(),t("span",{class:"token function"},"ref"),t("span",{class:"token punctuation"},"("),t("span",{class:"token string"},"'Editable text with no enter icon in edit field.'"),t("span",{class:"token punctuation"},")"),t("span",{class:"token punctuation"},","),n(` `),t("span",{class:"token punctuation"},"}"),t("span",{class:"token punctuation"},";"),n(` `),t("span",{class:"token punctuation"},"}"),t("span",{class:"token punctuation"},","),n(` `),t("span",{class:"token punctuation"},"}"),t("span",{class:"token punctuation"},")"),t("span",{class:"token punctuation"},";"),n(` `)])]),t("span",{class:"token tag"},[t("span",{class:"token tag"},[t("span",{class:"token punctuation"},"")]),n(` `)])],-1)])),jsVersionHtml:s(()=>a[21]||(a[21]=[t("pre",{class:"language-vue"},[t("code",null,[t("span",{class:"token tag"},[t("span",{class:"token tag"},[t("span",{class:"token punctuation"},"<"),n("template")]),t("span",{class:"token punctuation"},">")]),n(` `),t("span",{class:"token tag"},[t("span",{class:"token tag"},[t("span",{class:"token punctuation"},"<"),n("a-typography-paragraph")]),n(),t("span",{class:"token attr-name"},[t("span",{class:"token namespace"},"v-model:"),n("content")]),t("span",{class:"token attr-value"},[t("span",{class:"token punctuation attr-equals"},"="),t("span",{class:"token punctuation"},'"'),n("editableStr"),t("span",{class:"token punctuation"},'"')]),n(),t("span",{class:"token attr-name"},"editable"),n(),t("span",{class:"token punctuation"},"/>")]),n(` `),t("span",{class:"token tag"},[t("span",{class:"token tag"},[t("span",{class:"token punctuation"},"<"),n("a-typography-paragraph")]),n(),t("span",{class:"token attr-name"},[t("span",{class:"token namespace"},"v-model:"),n("content")]),t("span",{class:"token attr-value"},[t("span",{class:"token punctuation attr-equals"},"="),t("span",{class:"token punctuation"},'"'),n("customIconStr"),t("span",{class:"token punctuation"},'"')]),n(),t("span",{class:"token attr-name"},"editable"),t("span",{class:"token punctuation"},">")]),n(` `),t("span",{class:"token tag"},[t("span",{class:"token tag"},[t("span",{class:"token punctuation"},"<"),n("template")]),n(),t("span",{class:"token attr-name"},"#editableIcon"),t("span",{class:"token punctuation"},">")]),t("span",{class:"token tag"},[t("span",{class:"token tag"},[t("span",{class:"token punctuation"},"<"),n("HighlightOutlined")]),n(),t("span",{class:"token punctuation"},"/>")]),t("span",{class:"token tag"},[t("span",{class:"token tag"},[t("span",{class:"token punctuation"},"")]),n(` `),t("span",{class:"token tag"},[t("span",{class:"token tag"},[t("span",{class:"token punctuation"},"<"),n("template")]),n(),t("span",{class:"token attr-name"},"#editableTooltip"),t("span",{class:"token punctuation"},">")]),n("click to edit text"),t("span",{class:"token tag"},[t("span",{class:"token tag"},[t("span",{class:"token punctuation"},"")]),n(` `),t("span",{class:"token tag"},[t("span",{class:"token tag"},[t("span",{class:"token punctuation"},"")]),n(` Trigger edit with:`),t("span",{class:"token entity named-entity",title:"\xA0"}," "),t("span",{class:"token entity named-entity",title:"\xA0"}," "),n(` `),t("span",{class:"token tag"},[t("span",{class:"token tag"},[t("span",{class:"token punctuation"},"<"),n("a-radio-group")]),n(` `),t("span",{class:"token attr-name"},":value"),t("span",{class:"token attr-value"},[t("span",{class:"token punctuation attr-equals"},"="),t("span",{class:"token punctuation"},'"'),n("stateToRadio()"),t("span",{class:"token punctuation"},'"')]),n(` `),t("span",{class:"token attr-name"},"@change"),t("span",{class:"token attr-value"},[t("span",{class:"token punctuation attr-equals"},"="),t("span",{class:"token punctuation"},'"'),n("e => (chooseTrigger = radioToState(e.target.value))"),t("span",{class:"token punctuation"},'"')]),n(` `),t("span",{class:"token punctuation"},">")]),n(` `),t("span",{class:"token tag"},[t("span",{class:"token tag"},[t("span",{class:"token punctuation"},"<"),n("a-radio")]),n(),t("span",{class:"token attr-name"},"value"),t("span",{class:"token attr-value"},[t("span",{class:"token punctuation attr-equals"},"="),t("span",{class:"token punctuation"},'"'),n("icon"),t("span",{class:"token punctuation"},'"')]),t("span",{class:"token punctuation"},">")]),n("icon"),t("span",{class:"token tag"},[t("span",{class:"token tag"},[t("span",{class:"token punctuation"},"")]),n(` `),t("span",{class:"token tag"},[t("span",{class:"token tag"},[t("span",{class:"token punctuation"},"<"),n("a-radio")]),n(),t("span",{class:"token attr-name"},"value"),t("span",{class:"token attr-value"},[t("span",{class:"token punctuation attr-equals"},"="),t("span",{class:"token punctuation"},'"'),n("text"),t("span",{class:"token punctuation"},'"')]),t("span",{class:"token punctuation"},">")]),n("text"),t("span",{class:"token tag"},[t("span",{class:"token tag"},[t("span",{class:"token punctuation"},"")]),n(` `),t("span",{class:"token tag"},[t("span",{class:"token tag"},[t("span",{class:"token punctuation"},"<"),n("a-radio")]),n(),t("span",{class:"token attr-name"},"value"),t("span",{class:"token attr-value"},[t("span",{class:"token punctuation attr-equals"},"="),t("span",{class:"token punctuation"},'"'),n("both"),t("span",{class:"token punctuation"},'"')]),t("span",{class:"token punctuation"},">")]),n("both"),t("span",{class:"token tag"},[t("span",{class:"token tag"},[t("span",{class:"token punctuation"},"")]),n(` `),t("span",{class:"token tag"},[t("span",{class:"token tag"},[t("span",{class:"token punctuation"},"")]),n(` `),t("span",{class:"token tag"},[t("span",{class:"token tag"},[t("span",{class:"token punctuation"},"<"),n("a-typography-paragraph")]),n(` `),t("span",{class:"token attr-name"},[t("span",{class:"token namespace"},"v-model:"),n("content")]),t("span",{class:"token attr-value"},[t("span",{class:"token punctuation attr-equals"},"="),t("span",{class:"token punctuation"},'"'),n("clickTriggerStr"),t("span",{class:"token punctuation"},'"')]),n(` `),t("span",{class:"token attr-name"},":editable"),t("span",{class:"token attr-value"},[t("span",{class:"token punctuation attr-equals"},"="),t("span",{class:"token punctuation"},'"'),n("{ triggerType: chooseTrigger }"),t("span",{class:"token punctuation"},'"')]),n(` `),t("span",{class:"token punctuation"},">")]),n(` `),t("span",{class:"token tag"},[t("span",{class:"token tag"},[t("span",{class:"token punctuation"},"<"),n("template")]),n(),t("span",{class:"token attr-name"},"#editableTooltip"),t("span",{class:"token punctuation"},">")]),n("click to edit text"),t("span",{class:"token tag"},[t("span",{class:"token tag"},[t("span",{class:"token punctuation"},"")]),n(` `),t("span",{class:"token tag"},[t("span",{class:"token tag"},[t("span",{class:"token punctuation"},"")]),n(` `),t("span",{class:"token tag"},[t("span",{class:"token tag"},[t("span",{class:"token punctuation"},"<"),n("a-typography-paragraph")]),n(),t("span",{class:"token attr-name"},[t("span",{class:"token namespace"},"v-model:"),n("content")]),t("span",{class:"token attr-value"},[t("span",{class:"token punctuation attr-equals"},"="),t("span",{class:"token punctuation"},'"'),n("customEnterIconStr"),t("span",{class:"token punctuation"},'"')]),n(),t("span",{class:"token attr-name"},"editable"),t("span",{class:"token punctuation"},">")]),n(` `),t("span",{class:"token tag"},[t("span",{class:"token tag"},[t("span",{class:"token punctuation"},"<"),n("template")]),n(),t("span",{class:"token attr-name"},"#editableIcon"),t("span",{class:"token punctuation"},">")]),t("span",{class:"token tag"},[t("span",{class:"token tag"},[t("span",{class:"token punctuation"},"<"),n("HighlightOutlined")]),n(),t("span",{class:"token punctuation"},"/>")]),t("span",{class:"token tag"},[t("span",{class:"token tag"},[t("span",{class:"token punctuation"},"")]),n(` `),t("span",{class:"token tag"},[t("span",{class:"token tag"},[t("span",{class:"token punctuation"},"<"),n("template")]),n(),t("span",{class:"token attr-name"},"#editableTooltip"),t("span",{class:"token punctuation"},">")]),n("click to edit text"),t("span",{class:"token tag"},[t("span",{class:"token tag"},[t("span",{class:"token punctuation"},"")]),n(` `),t("span",{class:"token tag"},[t("span",{class:"token tag"},[t("span",{class:"token punctuation"},"<"),n("template")]),n(),t("span",{class:"token attr-name"},"#editableEnterIcon"),t("span",{class:"token attr-value"},[t("span",{class:"token punctuation attr-equals"},"="),t("span",{class:"token punctuation"},'"'),n("{ className }"),t("span",{class:"token punctuation"},'"')]),t("span",{class:"token punctuation"},">")]),n(` `),t("span",{class:"token tag"},[t("span",{class:"token tag"},[t("span",{class:"token punctuation"},"<"),n("CheckOutlined")]),n(),t("span",{class:"token attr-name"},":class"),t("span",{class:"token attr-value"},[t("span",{class:"token punctuation attr-equals"},"="),t("span",{class:"token punctuation"},'"'),n("className"),t("span",{class:"token punctuation"},'"')]),n(),t("span",{class:"token punctuation"},"/>")]),n(` `),t("span",{class:"token tag"},[t("span",{class:"token tag"},[t("span",{class:"token punctuation"},"")]),n(` `),t("span",{class:"token tag"},[t("span",{class:"token tag"},[t("span",{class:"token punctuation"},"")]),n(` `),t("span",{class:"token tag"},[t("span",{class:"token tag"},[t("span",{class:"token punctuation"},"<"),n("a-typography-paragraph")]),n(),t("span",{class:"token attr-name"},[t("span",{class:"token namespace"},"v-model:"),n("content")]),t("span",{class:"token attr-value"},[t("span",{class:"token punctuation attr-equals"},"="),t("span",{class:"token punctuation"},'"'),n("noEnterIconStr"),t("span",{class:"token punctuation"},'"')]),n(),t("span",{class:"token attr-name"},"editable"),t("span",{class:"token punctuation"},">")]),n(` `),t("span",{class:"token tag"},[t("span",{class:"token tag"},[t("span",{class:"token punctuation"},"<"),n("template")]),n(),t("span",{class:"token attr-name"},"#editableIcon"),t("span",{class:"token punctuation"},">")]),t("span",{class:"token tag"},[t("span",{class:"token tag"},[t("span",{class:"token punctuation"},"<"),n("HighlightOutlined")]),n(),t("span",{class:"token punctuation"},"/>")]),t("span",{class:"token tag"},[t("span",{class:"token tag"},[t("span",{class:"token punctuation"},"")]),n(` `),t("span",{class:"token tag"},[t("span",{class:"token tag"},[t("span",{class:"token punctuation"},"<"),n("template")]),n(),t("span",{class:"token attr-name"},"#editableTooltip"),t("span",{class:"token punctuation"},">")]),n("click to edit text"),t("span",{class:"token tag"},[t("span",{class:"token tag"},[t("span",{class:"token punctuation"},"")]),n(` `),t("span",{class:"token tag"},[t("span",{class:"token tag"},[t("span",{class:"token punctuation"},"<"),n("template")]),n(),t("span",{class:"token attr-name"},"#editableEnterIcon"),t("span",{class:"token punctuation"},">")]),n("{{ null }}"),t("span",{class:"token tag"},[t("span",{class:"token tag"},[t("span",{class:"token punctuation"},"")]),n(` `),t("span",{class:"token tag"},[t("span",{class:"token tag"},[t("span",{class:"token punctuation"},"")]),n(` `),t("span",{class:"token tag"},[t("span",{class:"token tag"},[t("span",{class:"token punctuation"},"<"),n("a-typography-paragraph")]),n(),t("span",{class:"token attr-name"},[t("span",{class:"token namespace"},"v-model:"),n("content")]),t("span",{class:"token attr-value"},[t("span",{class:"token punctuation attr-equals"},"="),t("span",{class:"token punctuation"},'"'),n("hideTooltipStr"),t("span",{class:"token punctuation"},'"')]),n(),t("span",{class:"token attr-name"},":editable"),t("span",{class:"token attr-value"},[t("span",{class:"token punctuation attr-equals"},"="),t("span",{class:"token punctuation"},'"'),n("{ tooltip: false }"),t("span",{class:"token punctuation"},'"')]),n(),t("span",{class:"token punctuation"},"/>")]),n(` `),t("span",{class:"token tag"},[t("span",{class:"token tag"},[t("span",{class:"token punctuation"},"<"),n("a-typography-paragraph")]),n(` `),t("span",{class:"token attr-name"},[t("span",{class:"token namespace"},"v-model:"),n("content")]),t("span",{class:"token attr-value"},[t("span",{class:"token punctuation attr-equals"},"="),t("span",{class:"token punctuation"},'"'),n("lengthLimitedStr"),t("span",{class:"token punctuation"},'"')]),n(` `),t("span",{class:"token attr-name"},":editable"),t("span",{class:"token attr-value"},[t("span",{class:"token punctuation attr-equals"},"="),t("span",{class:"token punctuation"},'"'),n("{ maxlength: 50, autoSize: { maxRows: 5, minRows: 3 } }"),t("span",{class:"token punctuation"},'"')]),n(` `),t("span",{class:"token punctuation"},"/>")]),n(` `),t("span",{class:"token tag"},[t("span",{class:"token tag"},[t("span",{class:"token punctuation"},"<"),n("a-typography-paragraph")]),n(),t("span",{class:"token attr-name"},"copyable"),t("span",{class:"token punctuation"},">")]),n("This is a copyable text."),t("span",{class:"token tag"},[t("span",{class:"token tag"},[t("span",{class:"token punctuation"},"")]),n(` `),t("span",{class:"token tag"},[t("span",{class:"token tag"},[t("span",{class:"token punctuation"},"<"),n("a-typography-paragraph")]),n(),t("span",{class:"token attr-name"},":copyable"),t("span",{class:"token attr-value"},[t("span",{class:"token punctuation attr-equals"},"="),t("span",{class:"token punctuation"},'"'),n("{ text: 'Hello, Ant Design!' }"),t("span",{class:"token punctuation"},'"')]),t("span",{class:"token punctuation"},">")]),n(` Replace copy text. `),t("span",{class:"token tag"},[t("span",{class:"token tag"},[t("span",{class:"token punctuation"},"")]),n(` `),t("span",{class:"token tag"},[t("span",{class:"token tag"},[t("span",{class:"token punctuation"},"<"),n("a-typography-paragraph")]),n(),t("span",{class:"token attr-name"},"copyable"),n(),t("span",{class:"token attr-name"},"content"),t("span",{class:"token attr-value"},[t("span",{class:"token punctuation attr-equals"},"="),t("span",{class:"token punctuation"},'"'),n("Custom Copy icon and replace tooltips text."),t("span",{class:"token punctuation"},'"')]),t("span",{class:"token punctuation"},">")]),n(` `),t("span",{class:"token tag"},[t("span",{class:"token tag"},[t("span",{class:"token punctuation"},"<"),n("template")]),n(),t("span",{class:"token attr-name"},"#copyableIcon"),t("span",{class:"token attr-value"},[t("span",{class:"token punctuation attr-equals"},"="),t("span",{class:"token punctuation"},'"'),n("{ copied }"),t("span",{class:"token punctuation"},'"')]),t("span",{class:"token punctuation"},">")]),n(` `),t("span",{class:"token tag"},[t("span",{class:"token tag"},[t("span",{class:"token punctuation"},"<"),n("SmileOutlined")]),n(),t("span",{class:"token attr-name"},"v-if"),t("span",{class:"token attr-value"},[t("span",{class:"token punctuation attr-equals"},"="),t("span",{class:"token punctuation"},'"'),n("!copied"),t("span",{class:"token punctuation"},'"')]),n(),t("span",{class:"token attr-name"},"key"),t("span",{class:"token attr-value"},[t("span",{class:"token punctuation attr-equals"},"="),t("span",{class:"token punctuation"},'"'),n("copy-icon"),t("span",{class:"token punctuation"},'"')]),n(),t("span",{class:"token punctuation"},"/>")]),n(` `),t("span",{class:"token tag"},[t("span",{class:"token tag"},[t("span",{class:"token punctuation"},"<"),n("SmileFilled")]),n(),t("span",{class:"token attr-name"},"v-else"),n(),t("span",{class:"token attr-name"},"key"),t("span",{class:"token attr-value"},[t("span",{class:"token punctuation attr-equals"},"="),t("span",{class:"token punctuation"},'"'),n("copied-icon"),t("span",{class:"token punctuation"},'"')]),n(),t("span",{class:"token punctuation"},"/>")]),n(` `),t("span",{class:"token tag"},[t("span",{class:"token tag"},[t("span",{class:"token punctuation"},"")]),n(` `),t("span",{class:"token tag"},[t("span",{class:"token tag"},[t("span",{class:"token punctuation"},"<"),n("template")]),n(),t("span",{class:"token attr-name"},"#copyableTooltip"),t("span",{class:"token attr-value"},[t("span",{class:"token punctuation attr-equals"},"="),t("span",{class:"token punctuation"},'"'),n("{ copied }"),t("span",{class:"token punctuation"},'"')]),t("span",{class:"token punctuation"},">")]),n(` `),t("span",{class:"token tag"},[t("span",{class:"token tag"},[t("span",{class:"token punctuation"},"<"),n("span")]),n(),t("span",{class:"token attr-name"},"v-if"),t("span",{class:"token attr-value"},[t("span",{class:"token punctuation attr-equals"},"="),t("span",{class:"token punctuation"},'"'),n("!copied"),t("span",{class:"token punctuation"},'"')]),n(),t("span",{class:"token attr-name"},"key"),t("span",{class:"token attr-value"},[t("span",{class:"token punctuation attr-equals"},"="),t("span",{class:"token punctuation"},'"'),n("copy-tooltip"),t("span",{class:"token punctuation"},'"')]),t("span",{class:"token punctuation"},">")]),n("click here"),t("span",{class:"token tag"},[t("span",{class:"token tag"},[t("span",{class:"token punctuation"},"")]),n(` `),t("span",{class:"token tag"},[t("span",{class:"token tag"},[t("span",{class:"token punctuation"},"<"),n("span")]),n(),t("span",{class:"token attr-name"},"v-else"),n(),t("span",{class:"token attr-name"},"key"),t("span",{class:"token attr-value"},[t("span",{class:"token punctuation attr-equals"},"="),t("span",{class:"token punctuation"},'"'),n("copied-tooltip"),t("span",{class:"token punctuation"},'"')]),t("span",{class:"token punctuation"},">")]),n("you clicked!!"),t("span",{class:"token tag"},[t("span",{class:"token tag"},[t("span",{class:"token punctuation"},"")]),n(` `),t("span",{class:"token tag"},[t("span",{class:"token tag"},[t("span",{class:"token punctuation"},"")]),n(` `),t("span",{class:"token tag"},[t("span",{class:"token tag"},[t("span",{class:"token punctuation"},"")]),n(` `),t("span",{class:"token tag"},[t("span",{class:"token tag"},[t("span",{class:"token punctuation"},"<"),n("a-typography-paragraph")]),n(),t("span",{class:"token attr-name"},":copyable"),t("span",{class:"token attr-value"},[t("span",{class:"token punctuation attr-equals"},"="),t("span",{class:"token punctuation"},'"'),n("{ tooltip: false }"),t("span",{class:"token punctuation"},'"')]),t("span",{class:"token punctuation"},">")]),n(` Hide Copy tooltips. `),t("span",{class:"token tag"},[t("span",{class:"token tag"},[t("span",{class:"token punctuation"},"")]),n(` `),t("span",{class:"token tag"},[t("span",{class:"token tag"},[t("span",{class:"token punctuation"},"")]),n(` `),t("span",{class:"token tag"},[t("span",{class:"token tag"},[t("span",{class:"token punctuation"},"<"),n("script")]),t("span",{class:"token punctuation"},">")]),t("span",{class:"token script"},[t("span",{class:"token language-javascript"},[n(` `),t("span",{class:"token keyword"},"import"),n(),t("span",{class:"token punctuation"},"{"),n(" defineComponent"),t("span",{class:"token punctuation"},","),n(" ref"),t("span",{class:"token punctuation"},","),n(" watch "),t("span",{class:"token punctuation"},"}"),n(),t("span",{class:"token keyword"},"from"),n(),t("span",{class:"token string"},"'vue'"),t("span",{class:"token punctuation"},";"),n(` `),t("span",{class:"token keyword"},"import"),n(),t("span",{class:"token punctuation"},"{"),n(" HighlightOutlined"),t("span",{class:"token punctuation"},","),n(" SmileOutlined"),t("span",{class:"token punctuation"},","),n(" SmileFilled"),t("span",{class:"token punctuation"},","),n(" CheckOutlined "),t("span",{class:"token punctuation"},"}"),n(),t("span",{class:"token keyword"},"from"),n(),t("span",{class:"token string"},"'@ant-design/icons-vue'"),t("span",{class:"token punctuation"},";"),n(` `),t("span",{class:"token keyword"},"export"),n(),t("span",{class:"token keyword"},"default"),n(),t("span",{class:"token function"},"defineComponent"),t("span",{class:"token punctuation"},"("),t("span",{class:"token punctuation"},"{"),n(` `),t("span",{class:"token literal-property property"},"components"),t("span",{class:"token operator"},":"),n(),t("span",{class:"token punctuation"},"{"),n(` HighlightOutlined`),t("span",{class:"token punctuation"},","),n(` SmileOutlined`),t("span",{class:"token punctuation"},","),n(` SmileFilled`),t("span",{class:"token punctuation"},","),n(` CheckOutlined`),t("span",{class:"token punctuation"},","),n(` `),t("span",{class:"token punctuation"},"}"),t("span",{class:"token punctuation"},","),n(` `),t("span",{class:"token function"},"setup"),t("span",{class:"token punctuation"},"("),t("span",{class:"token punctuation"},")"),n(),t("span",{class:"token punctuation"},"{"),n(` `),t("span",{class:"token keyword"},"const"),n(" editableStr "),t("span",{class:"token operator"},"="),n(),t("span",{class:"token function"},"ref"),t("span",{class:"token punctuation"},"("),t("span",{class:"token string"},"'This is an editable text.'"),t("span",{class:"token punctuation"},")"),t("span",{class:"token punctuation"},";"),n(` `),t("span",{class:"token function"},"watch"),t("span",{class:"token punctuation"},"("),n("editableStr"),t("span",{class:"token punctuation"},","),n(),t("span",{class:"token punctuation"},"("),t("span",{class:"token punctuation"},")"),n(),t("span",{class:"token operator"},"=>"),n(),t("span",{class:"token punctuation"},"{"),n(` console`),t("span",{class:"token punctuation"},"."),t("span",{class:"token function"},"log"),t("span",{class:"token punctuation"},"("),t("span",{class:"token string"},"'editableStr'"),t("span",{class:"token punctuation"},","),n(" editableStr"),t("span",{class:"token punctuation"},"."),n("value"),t("span",{class:"token punctuation"},")"),t("span",{class:"token punctuation"},";"),n(` `),t("span",{class:"token punctuation"},"}"),t("span",{class:"token punctuation"},")"),t("span",{class:"token punctuation"},";"),n(` `),t("span",{class:"token keyword"},"const"),n(" chooseTrigger "),t("span",{class:"token operator"},"="),n(),t("span",{class:"token function"},"ref"),t("span",{class:"token punctuation"},"("),t("span",{class:"token punctuation"},"["),t("span",{class:"token string"},"'icon'"),t("span",{class:"token punctuation"},"]"),t("span",{class:"token punctuation"},")"),t("span",{class:"token punctuation"},";"),n(` `),t("span",{class:"token keyword"},"const"),n(),t("span",{class:"token function-variable function"},"radioToState"),n(),t("span",{class:"token operator"},"="),n(),t("span",{class:"token parameter"},"input"),n(),t("span",{class:"token operator"},"=>"),n(),t("span",{class:"token punctuation"},"{"),n(` `),t("span",{class:"token keyword"},"switch"),n(),t("span",{class:"token punctuation"},"("),n("input"),t("span",{class:"token punctuation"},")"),n(),t("span",{class:"token punctuation"},"{"),n(` `),t("span",{class:"token keyword"},"case"),n(),t("span",{class:"token string"},"'text'"),t("span",{class:"token operator"},":"),n(` `),t("span",{class:"token keyword"},"return"),n(),t("span",{class:"token punctuation"},"["),t("span",{class:"token string"},"'text'"),t("span",{class:"token punctuation"},"]"),t("span",{class:"token punctuation"},";"),n(` `),t("span",{class:"token keyword"},"case"),n(),t("span",{class:"token string"},"'both'"),t("span",{class:"token operator"},":"),n(` `),t("span",{class:"token keyword"},"return"),n(),t("span",{class:"token punctuation"},"["),t("span",{class:"token string"},"'icon'"),t("span",{class:"token punctuation"},","),n(),t("span",{class:"token string"},"'text'"),t("span",{class:"token punctuation"},"]"),t("span",{class:"token punctuation"},";"),n(` `),t("span",{class:"token keyword"},"case"),n(),t("span",{class:"token string"},"'icon'"),t("span",{class:"token operator"},":"),n(` `),t("span",{class:"token keyword"},"default"),t("span",{class:"token operator"},":"),n(` `),t("span",{class:"token keyword"},"return"),n(),t("span",{class:"token punctuation"},"["),t("span",{class:"token string"},"'icon'"),t("span",{class:"token punctuation"},"]"),t("span",{class:"token punctuation"},";"),n(` `),t("span",{class:"token punctuation"},"}"),n(` `),t("span",{class:"token punctuation"},"}"),t("span",{class:"token punctuation"},";"),n(` `),t("span",{class:"token keyword"},"const"),n(),t("span",{class:"token function-variable function"},"stateToRadio"),n(),t("span",{class:"token operator"},"="),n(),t("span",{class:"token punctuation"},"("),t("span",{class:"token punctuation"},")"),n(),t("span",{class:"token operator"},"=>"),n(),t("span",{class:"token punctuation"},"{"),n(` `),t("span",{class:"token keyword"},"if"),n(),t("span",{class:"token punctuation"},"("),n("chooseTrigger"),t("span",{class:"token punctuation"},"."),n("value"),t("span",{class:"token punctuation"},"."),t("span",{class:"token function"},"indexOf"),t("span",{class:"token punctuation"},"("),t("span",{class:"token string"},"'text'"),t("span",{class:"token punctuation"},")"),n(),t("span",{class:"token operator"},"!=="),n(),t("span",{class:"token operator"},"-"),t("span",{class:"token number"},"1"),t("span",{class:"token punctuation"},")"),n(),t("span",{class:"token punctuation"},"{"),n(` `),t("span",{class:"token keyword"},"return"),n(" chooseTrigger"),t("span",{class:"token punctuation"},"."),n("value"),t("span",{class:"token punctuation"},"."),t("span",{class:"token function"},"indexOf"),t("span",{class:"token punctuation"},"("),t("span",{class:"token string"},"'icon'"),t("span",{class:"token punctuation"},")"),n(),t("span",{class:"token operator"},"!=="),n(),t("span",{class:"token operator"},"-"),t("span",{class:"token number"},"1"),n(),t("span",{class:"token operator"},"?"),n(),t("span",{class:"token string"},"'both'"),n(),t("span",{class:"token operator"},":"),n(),t("span",{class:"token string"},"'text'"),t("span",{class:"token punctuation"},";"),n(` `),t("span",{class:"token punctuation"},"}"),n(` `),t("span",{class:"token keyword"},"return"),n(),t("span",{class:"token string"},"'icon'"),t("span",{class:"token punctuation"},";"),n(` `),t("span",{class:"token punctuation"},"}"),t("span",{class:"token punctuation"},";"),n(` `),t("span",{class:"token keyword"},"return"),n(),t("span",{class:"token punctuation"},"{"),n(` radioToState`),t("span",{class:"token punctuation"},","),n(` stateToRadio`),t("span",{class:"token punctuation"},","),n(` editableStr`),t("span",{class:"token punctuation"},","),n(` `),t("span",{class:"token literal-property property"},"customIconStr"),t("span",{class:"token operator"},":"),n(),t("span",{class:"token function"},"ref"),t("span",{class:"token punctuation"},"("),t("span",{class:"token string"},"'Custom Edit icon and replace tooltip text.'"),t("span",{class:"token punctuation"},")"),t("span",{class:"token punctuation"},","),n(` `),t("span",{class:"token literal-property property"},"hideTooltipStr"),t("span",{class:"token operator"},":"),n(),t("span",{class:"token function"},"ref"),t("span",{class:"token punctuation"},"("),t("span",{class:"token string"},"'Hide Edit tooltip.'"),t("span",{class:"token punctuation"},")"),t("span",{class:"token punctuation"},","),n(` `),t("span",{class:"token literal-property property"},"lengthLimitedStr"),t("span",{class:"token operator"},":"),n(),t("span",{class:"token function"},"ref"),t("span",{class:"token punctuation"},"("),t("span",{class:"token string"},"'This is an editable text with limited length.'"),t("span",{class:"token punctuation"},")"),t("span",{class:"token punctuation"},","),n(` `),t("span",{class:"token literal-property property"},"clickTriggerStr"),t("span",{class:"token operator"},":"),n(),t("span",{class:"token function"},"ref"),t("span",{class:"token punctuation"},"("),t("span",{class:"token string"},"'Text or icon as trigger - click to start editing.'"),t("span",{class:"token punctuation"},")"),t("span",{class:"token punctuation"},","),n(` chooseTrigger`),t("span",{class:"token punctuation"},","),n(` `),t("span",{class:"token literal-property property"},"customEnterIconStr"),t("span",{class:"token operator"},":"),n(),t("span",{class:"token function"},"ref"),t("span",{class:"token punctuation"},"("),t("span",{class:"token string"},"'Editable text with a custom enter icon in edit field.'"),t("span",{class:"token punctuation"},")"),t("span",{class:"token punctuation"},","),n(` `),t("span",{class:"token literal-property property"},"noEnterIconStr"),t("span",{class:"token operator"},":"),n(),t("span",{class:"token function"},"ref"),t("span",{class:"token punctuation"},"("),t("span",{class:"token string"},"'Editable text with no enter icon in edit field.'"),t("span",{class:"token punctuation"},")"),t("span",{class:"token punctuation"},","),n(` `),t("span",{class:"token punctuation"},"}"),t("span",{class:"token punctuation"},";"),n(` `),t("span",{class:"token punctuation"},"}"),t("span",{class:"token punctuation"},","),n(` `),t("span",{class:"token punctuation"},"}"),t("span",{class:"token punctuation"},")"),t("span",{class:"token punctuation"},";"),n(` `)])]),t("span",{class:"token tag"},[t("span",{class:"token tag"},[t("span",{class:"token punctuation"},"")]),n(` `)])],-1)])),_:1})}const U=m(P,[["render",N]]),z=B({setup(){const o=b(1),a=Y(()=>({rows:o.value,expandable:!0,suffix:"--William Shakespeare",onEllipsis:l=>{console.log("Ellipsis changed:",l)}}));return{rows:o,ellipsis:a,article:"To be, or not to be, that is a question: Whether it is nobler in the mind to suffer. The slings and arrows of outrageous fortune Or to take arms against a sea of troubles, And by opposing end them? To die: to sleep; No more; and by a sleep to say we end The heart-ache and the thousand natural shocks That flesh is heir to, 'tis a consummation Devoutly to be wish'd. To die, to sleep To sleep- perchance to dream: ay, there's the rub! For in that sleep of death what dreams may come When we have shuffled off this mortal coil, Must give us pause. There 's the respect That makes calamity of so long life"}}});function K(o,a,l,k,g,I){const c=p("a-slider"),u=p("a-typography-paragraph"),i=p("demo-box");return r(),y(i,{jsfiddle:{us:"add suffix ellipsis support.",cn:"\u6DFB\u52A0\u540E\u7F00\u7684\u7701\u7565\u3002",docHtml:`

zh-CN

\u6DFB\u52A0\u540E\u7F00\u7684\u7701\u7565\u3002

en-US

add suffix ellipsis support.

`,order:100,title:{"zh-CN":"\u540E\u7F00","en-US":"suffix"},relativePath:"components/typography/demo/suffix.vue",sourceCode:"PHRlbXBsYXRlPgogIDxhLXNsaWRlciB2LW1vZGVsOnZhbHVlPSJyb3dzIiA6bWluPSIxIiA6bWF4PSIxMCIgLz4KICA8YS10eXBvZ3JhcGh5LXBhcmFncmFwaAogICAgOmVsbGlwc2lzPSJlbGxpcHNpcyIKICAgIDp0aXRsZT0iYCR7YXJ0aWNsZX0tLVdpbGxpYW0gU2hha2VzcGVhcmVgIgogICAgOmNvbnRlbnQ9ImFydGljbGUiCiAgPjwvYS10eXBvZ3JhcGh5LXBhcmFncmFwaD4KPC90ZW1wbGF0ZT4KPHNjcmlwdCBsYW5nPSJ0cyI+CmltcG9ydCB7IGNvbXB1dGVkLCBkZWZpbmVDb21wb25lbnQsIHJlZiB9IGZyb20gJ3Z1ZSc7CgpleHBvcnQgZGVmYXVsdCBkZWZpbmVDb21wb25lbnQoewogIHNldHVwKCkgewogICAgY29uc3Qgcm93cyA9IHJlZigxKTsKICAgIGNvbnN0IGVsbGlwc2lzID0gY29tcHV0ZWQoKCkgPT4gewogICAgICByZXR1cm4gewogICAgICAgIHJvd3M6IHJvd3MudmFsdWUsCiAgICAgICAgZXhwYW5kYWJsZTogdHJ1ZSwKICAgICAgICBzdWZmaXg6ICctLVdpbGxpYW0gU2hha2VzcGVhcmUnLAogICAgICAgIG9uRWxsaXBzaXM6IChlbGxpcHNpczogYm9vbGVhbikgPT4gewogICAgICAgICAgY29uc29sZS5sb2coJ0VsbGlwc2lzIGNoYW5nZWQ6JywgZWxsaXBzaXMpOwogICAgICAgIH0sCiAgICAgIH07CiAgICB9KTsKICAgIHJldHVybiB7CiAgICAgIHJvd3MsCiAgICAgIGVsbGlwc2lzLAogICAgICBhcnRpY2xlOgogICAgICAgICJUbyBiZSwgb3Igbm90IHRvIGJlLCB0aGF0IGlzIGEgcXVlc3Rpb246IFdoZXRoZXIgaXQgaXMgbm9ibGVyIGluIHRoZSBtaW5kIHRvIHN1ZmZlci4gVGhlIHNsaW5ncyBhbmQgYXJyb3dzIG9mIG91dHJhZ2VvdXMgZm9ydHVuZSBPciB0byB0YWtlIGFybXMgYWdhaW5zdCBhIHNlYSBvZiB0cm91YmxlcywgQW5kIGJ5IG9wcG9zaW5nIGVuZCB0aGVtPyBUbyBkaWU6IHRvIHNsZWVwOyBObyBtb3JlOyBhbmQgYnkgYSBzbGVlcCB0byBzYXkgd2UgZW5kIFRoZSBoZWFydC1hY2hlIGFuZCB0aGUgdGhvdXNhbmQgbmF0dXJhbCBzaG9ja3MgVGhhdCBmbGVzaCBpcyBoZWlyIHRvLCAndGlzIGEgY29uc3VtbWF0aW9uIERldm91dGx5IHRvIGJlIHdpc2gnZC4gVG8gZGllLCB0byBzbGVlcCBUbyBzbGVlcC0gcGVyY2hhbmNlIHRvIGRyZWFtOiBheSwgdGhlcmUncyB0aGUgcnViISBGb3IgaW4gdGhhdCBzbGVlcCBvZiBkZWF0aCB3aGF0IGRyZWFtcyBtYXkgY29tZSBXaGVuIHdlIGhhdmUgc2h1ZmZsZWQgb2ZmIHRoaXMgbW9ydGFsIGNvaWwsIE11c3QgZ2l2ZSB1cyBwYXVzZS4gVGhlcmUgJ3MgdGhlIHJlc3BlY3QgVGhhdCBtYWtlcyBjYWxhbWl0eSBvZiBzbyBsb25nIGxpZmUiLAogICAgfTsKICB9LAp9KTsKPC9zY3JpcHQ+Cgo=",jsSourceCode:"PHRlbXBsYXRlPgogIDxhLXNsaWRlciB2LW1vZGVsOnZhbHVlPSJyb3dzIiA6bWluPSIxIiA6bWF4PSIxMCIgLz4KICA8YS10eXBvZ3JhcGh5LXBhcmFncmFwaAogICAgOmVsbGlwc2lzPSJlbGxpcHNpcyIKICAgIDp0aXRsZT0iYCR7YXJ0aWNsZX0tLVdpbGxpYW0gU2hha2VzcGVhcmVgIgogICAgOmNvbnRlbnQ9ImFydGljbGUiCiAgPjwvYS10eXBvZ3JhcGh5LXBhcmFncmFwaD4KPC90ZW1wbGF0ZT4KPHNjcmlwdD4KaW1wb3J0IHsgY29tcHV0ZWQsIGRlZmluZUNvbXBvbmVudCwgcmVmIH0gZnJvbSAndnVlJzsKZXhwb3J0IGRlZmF1bHQgZGVmaW5lQ29tcG9uZW50KHsKICBzZXR1cCgpIHsKICAgIGNvbnN0IHJvd3MgPSByZWYoMSk7CiAgICBjb25zdCBlbGxpcHNpcyA9IGNvbXB1dGVkKCgpID0+IHsKICAgICAgcmV0dXJuIHsKICAgICAgICByb3dzOiByb3dzLnZhbHVlLAogICAgICAgIGV4cGFuZGFibGU6IHRydWUsCiAgICAgICAgc3VmZml4OiAnLS1XaWxsaWFtIFNoYWtlc3BlYXJlJywKICAgICAgICBvbkVsbGlwc2lzOiBlbGxpcHNpcyA9PiB7CiAgICAgICAgICBjb25zb2xlLmxvZygnRWxsaXBzaXMgY2hhbmdlZDonLCBlbGxpcHNpcyk7CiAgICAgICAgfSwKICAgICAgfTsKICAgIH0pOwogICAgcmV0dXJuIHsKICAgICAgcm93cywKICAgICAgZWxsaXBzaXMsCiAgICAgIGFydGljbGU6ICJUbyBiZSwgb3Igbm90IHRvIGJlLCB0aGF0IGlzIGEgcXVlc3Rpb246IFdoZXRoZXIgaXQgaXMgbm9ibGVyIGluIHRoZSBtaW5kIHRvIHN1ZmZlci4gVGhlIHNsaW5ncyBhbmQgYXJyb3dzIG9mIG91dHJhZ2VvdXMgZm9ydHVuZSBPciB0byB0YWtlIGFybXMgYWdhaW5zdCBhIHNlYSBvZiB0cm91YmxlcywgQW5kIGJ5IG9wcG9zaW5nIGVuZCB0aGVtPyBUbyBkaWU6IHRvIHNsZWVwOyBObyBtb3JlOyBhbmQgYnkgYSBzbGVlcCB0byBzYXkgd2UgZW5kIFRoZSBoZWFydC1hY2hlIGFuZCB0aGUgdGhvdXNhbmQgbmF0dXJhbCBzaG9ja3MgVGhhdCBmbGVzaCBpcyBoZWlyIHRvLCAndGlzIGEgY29uc3VtbWF0aW9uIERldm91dGx5IHRvIGJlIHdpc2gnZC4gVG8gZGllLCB0byBzbGVlcCBUbyBzbGVlcC0gcGVyY2hhbmNlIHRvIGRyZWFtOiBheSwgdGhlcmUncyB0aGUgcnViISBGb3IgaW4gdGhhdCBzbGVlcCBvZiBkZWF0aCB3aGF0IGRyZWFtcyBtYXkgY29tZSBXaGVuIHdlIGhhdmUgc2h1ZmZsZWQgb2ZmIHRoaXMgbW9ydGFsIGNvaWwsIE11c3QgZ2l2ZSB1cyBwYXVzZS4gVGhlcmUgJ3MgdGhlIHJlc3BlY3QgVGhhdCBtYWtlcyBjYWxhbWl0eSBvZiBzbyBsb25nIGxpZmUiLAogICAgfTsKICB9LAp9KTsKPC9zY3JpcHQ+"}},{default:s(()=>[e(c,{value:o.rows,"onUpdate:value":a[0]||(a[0]=h=>o.rows=h),min:1,max:10},null,8,["value"]),e(u,{ellipsis:o.ellipsis,title:`${o.article}--William Shakespeare`,content:o.article},null,8,["ellipsis","title","content"])]),htmlCode:s(()=>a[1]||(a[1]=[t("pre",{class:"language-vue"},[t("code",null,[t("span",{class:"token tag"},[t("span",{class:"token tag"},[t("span",{class:"token punctuation"},"<"),n("template")]),t("span",{class:"token punctuation"},">")]),n(` `),t("span",{class:"token tag"},[t("span",{class:"token tag"},[t("span",{class:"token punctuation"},"<"),n("a-slider")]),n(),t("span",{class:"token attr-name"},[t("span",{class:"token namespace"},"v-model:"),n("value")]),t("span",{class:"token attr-value"},[t("span",{class:"token punctuation attr-equals"},"="),t("span",{class:"token punctuation"},'"'),n("rows"),t("span",{class:"token punctuation"},'"')]),n(),t("span",{class:"token attr-name"},":min"),t("span",{class:"token attr-value"},[t("span",{class:"token punctuation attr-equals"},"="),t("span",{class:"token punctuation"},'"'),n("1"),t("span",{class:"token punctuation"},'"')]),n(),t("span",{class:"token attr-name"},":max"),t("span",{class:"token attr-value"},[t("span",{class:"token punctuation attr-equals"},"="),t("span",{class:"token punctuation"},'"'),n("10"),t("span",{class:"token punctuation"},'"')]),n(),t("span",{class:"token punctuation"},"/>")]),n(` `),t("span",{class:"token tag"},[t("span",{class:"token tag"},[t("span",{class:"token punctuation"},"<"),n("a-typography-paragraph")]),n(` `),t("span",{class:"token attr-name"},":ellipsis"),t("span",{class:"token attr-value"},[t("span",{class:"token punctuation attr-equals"},"="),t("span",{class:"token punctuation"},'"'),n("ellipsis"),t("span",{class:"token punctuation"},'"')]),n(` `),t("span",{class:"token attr-name"},":title"),t("span",{class:"token attr-value"},[t("span",{class:"token punctuation attr-equals"},"="),t("span",{class:"token punctuation"},'"'),n("`${article}--William Shakespeare`"),t("span",{class:"token punctuation"},'"')]),n(` `),t("span",{class:"token attr-name"},":content"),t("span",{class:"token attr-value"},[t("span",{class:"token punctuation attr-equals"},"="),t("span",{class:"token punctuation"},'"'),n("article"),t("span",{class:"token punctuation"},'"')]),n(` `),t("span",{class:"token punctuation"},">")]),t("span",{class:"token tag"},[t("span",{class:"token tag"},[t("span",{class:"token punctuation"},"")]),n(` `),t("span",{class:"token tag"},[t("span",{class:"token tag"},[t("span",{class:"token punctuation"},"")]),n(` `),t("span",{class:"token tag"},[t("span",{class:"token tag"},[t("span",{class:"token punctuation"},"<"),n("script")]),n(),t("span",{class:"token attr-name"},"lang"),t("span",{class:"token attr-value"},[t("span",{class:"token punctuation attr-equals"},"="),t("span",{class:"token punctuation"},'"'),n("ts"),t("span",{class:"token punctuation"},'"')]),t("span",{class:"token punctuation"},">")]),t("span",{class:"token script"},[t("span",{class:"token language-javascript"},[n(` `),t("span",{class:"token keyword"},"import"),n(),t("span",{class:"token punctuation"},"{"),n(" computed"),t("span",{class:"token punctuation"},","),n(" defineComponent"),t("span",{class:"token punctuation"},","),n(" ref "),t("span",{class:"token punctuation"},"}"),n(),t("span",{class:"token keyword"},"from"),n(),t("span",{class:"token string"},"'vue'"),t("span",{class:"token punctuation"},";"),n(` `),t("span",{class:"token keyword"},"export"),n(),t("span",{class:"token keyword"},"default"),n(),t("span",{class:"token function"},"defineComponent"),t("span",{class:"token punctuation"},"("),t("span",{class:"token punctuation"},"{"),n(` `),t("span",{class:"token function"},"setup"),t("span",{class:"token punctuation"},"("),t("span",{class:"token punctuation"},")"),n(),t("span",{class:"token punctuation"},"{"),n(` `),t("span",{class:"token keyword"},"const"),n(" rows "),t("span",{class:"token operator"},"="),n(),t("span",{class:"token function"},"ref"),t("span",{class:"token punctuation"},"("),t("span",{class:"token number"},"1"),t("span",{class:"token punctuation"},")"),t("span",{class:"token punctuation"},";"),n(` `),t("span",{class:"token keyword"},"const"),n(" ellipsis "),t("span",{class:"token operator"},"="),n(),t("span",{class:"token function"},"computed"),t("span",{class:"token punctuation"},"("),t("span",{class:"token punctuation"},"("),t("span",{class:"token punctuation"},")"),n(),t("span",{class:"token operator"},"=>"),n(),t("span",{class:"token punctuation"},"{"),n(` `),t("span",{class:"token keyword"},"return"),n(),t("span",{class:"token punctuation"},"{"),n(` `),t("span",{class:"token literal-property property"},"rows"),t("span",{class:"token operator"},":"),n(" rows"),t("span",{class:"token punctuation"},"."),n("value"),t("span",{class:"token punctuation"},","),n(` `),t("span",{class:"token literal-property property"},"expandable"),t("span",{class:"token operator"},":"),n(),t("span",{class:"token boolean"},"true"),t("span",{class:"token punctuation"},","),n(` `),t("span",{class:"token literal-property property"},"suffix"),t("span",{class:"token operator"},":"),n(),t("span",{class:"token string"},"'--William Shakespeare'"),t("span",{class:"token punctuation"},","),n(` `),t("span",{class:"token function-variable function"},"onEllipsis"),t("span",{class:"token operator"},":"),n(),t("span",{class:"token punctuation"},"("),t("span",{class:"token parameter"},[t("span",{class:"token literal-property property"},"ellipsis"),t("span",{class:"token operator"},":"),n(" boolean")]),t("span",{class:"token punctuation"},")"),n(),t("span",{class:"token operator"},"=>"),n(),t("span",{class:"token punctuation"},"{"),n(` console`),t("span",{class:"token punctuation"},"."),t("span",{class:"token function"},"log"),t("span",{class:"token punctuation"},"("),t("span",{class:"token string"},"'Ellipsis changed:'"),t("span",{class:"token punctuation"},","),n(" ellipsis"),t("span",{class:"token punctuation"},")"),t("span",{class:"token punctuation"},";"),n(` `),t("span",{class:"token punctuation"},"}"),t("span",{class:"token punctuation"},","),n(` `),t("span",{class:"token punctuation"},"}"),t("span",{class:"token punctuation"},";"),n(` `),t("span",{class:"token punctuation"},"}"),t("span",{class:"token punctuation"},")"),t("span",{class:"token punctuation"},";"),n(` `),t("span",{class:"token keyword"},"return"),n(),t("span",{class:"token punctuation"},"{"),n(` rows`),t("span",{class:"token punctuation"},","),n(` ellipsis`),t("span",{class:"token punctuation"},","),n(` `),t("span",{class:"token literal-property property"},"article"),t("span",{class:"token operator"},":"),n(` `),t("span",{class:"token string"},`"To be, or not to be, that is a question: Whether it is nobler in the mind to suffer. The slings and arrows of outrageous fortune Or to take arms against a sea of troubles, And by opposing end them? To die: to sleep; No more; and by a sleep to say we end The heart-ache and the thousand natural shocks That flesh is heir to, 'tis a consummation Devoutly to be wish'd. To die, to sleep To sleep- perchance to dream: ay, there's the rub! For in that sleep of death what dreams may come When we have shuffled off this mortal coil, Must give us pause. There 's the respect That makes calamity of so long life"`),t("span",{class:"token punctuation"},","),n(` `),t("span",{class:"token punctuation"},"}"),t("span",{class:"token punctuation"},";"),n(` `),t("span",{class:"token punctuation"},"}"),t("span",{class:"token punctuation"},","),n(` `),t("span",{class:"token punctuation"},"}"),t("span",{class:"token punctuation"},")"),t("span",{class:"token punctuation"},";"),n(` `)])]),t("span",{class:"token tag"},[t("span",{class:"token tag"},[t("span",{class:"token punctuation"},"")]),n(` `)])],-1)])),jsVersionHtml:s(()=>a[2]||(a[2]=[t("pre",{class:"language-vue"},[t("code",null,[t("span",{class:"token tag"},[t("span",{class:"token tag"},[t("span",{class:"token punctuation"},"<"),n("template")]),t("span",{class:"token punctuation"},">")]),n(` `),t("span",{class:"token tag"},[t("span",{class:"token tag"},[t("span",{class:"token punctuation"},"<"),n("a-slider")]),n(),t("span",{class:"token attr-name"},[t("span",{class:"token namespace"},"v-model:"),n("value")]),t("span",{class:"token attr-value"},[t("span",{class:"token punctuation attr-equals"},"="),t("span",{class:"token punctuation"},'"'),n("rows"),t("span",{class:"token punctuation"},'"')]),n(),t("span",{class:"token attr-name"},":min"),t("span",{class:"token attr-value"},[t("span",{class:"token punctuation attr-equals"},"="),t("span",{class:"token punctuation"},'"'),n("1"),t("span",{class:"token punctuation"},'"')]),n(),t("span",{class:"token attr-name"},":max"),t("span",{class:"token attr-value"},[t("span",{class:"token punctuation attr-equals"},"="),t("span",{class:"token punctuation"},'"'),n("10"),t("span",{class:"token punctuation"},'"')]),n(),t("span",{class:"token punctuation"},"/>")]),n(` `),t("span",{class:"token tag"},[t("span",{class:"token tag"},[t("span",{class:"token punctuation"},"<"),n("a-typography-paragraph")]),n(` `),t("span",{class:"token attr-name"},":ellipsis"),t("span",{class:"token attr-value"},[t("span",{class:"token punctuation attr-equals"},"="),t("span",{class:"token punctuation"},'"'),n("ellipsis"),t("span",{class:"token punctuation"},'"')]),n(` `),t("span",{class:"token attr-name"},":title"),t("span",{class:"token attr-value"},[t("span",{class:"token punctuation attr-equals"},"="),t("span",{class:"token punctuation"},'"'),n("`${article}--William Shakespeare`"),t("span",{class:"token punctuation"},'"')]),n(` `),t("span",{class:"token attr-name"},":content"),t("span",{class:"token attr-value"},[t("span",{class:"token punctuation attr-equals"},"="),t("span",{class:"token punctuation"},'"'),n("article"),t("span",{class:"token punctuation"},'"')]),n(` `),t("span",{class:"token punctuation"},">")]),t("span",{class:"token tag"},[t("span",{class:"token tag"},[t("span",{class:"token punctuation"},"")]),n(` `),t("span",{class:"token tag"},[t("span",{class:"token tag"},[t("span",{class:"token punctuation"},"")]),n(` `),t("span",{class:"token tag"},[t("span",{class:"token tag"},[t("span",{class:"token punctuation"},"<"),n("script")]),t("span",{class:"token punctuation"},">")]),t("span",{class:"token script"},[t("span",{class:"token language-javascript"},[n(` `),t("span",{class:"token keyword"},"import"),n(),t("span",{class:"token punctuation"},"{"),n(" computed"),t("span",{class:"token punctuation"},","),n(" defineComponent"),t("span",{class:"token punctuation"},","),n(" ref "),t("span",{class:"token punctuation"},"}"),n(),t("span",{class:"token keyword"},"from"),n(),t("span",{class:"token string"},"'vue'"),t("span",{class:"token punctuation"},";"),n(` `),t("span",{class:"token keyword"},"export"),n(),t("span",{class:"token keyword"},"default"),n(),t("span",{class:"token function"},"defineComponent"),t("span",{class:"token punctuation"},"("),t("span",{class:"token punctuation"},"{"),n(` `),t("span",{class:"token function"},"setup"),t("span",{class:"token punctuation"},"("),t("span",{class:"token punctuation"},")"),n(),t("span",{class:"token punctuation"},"{"),n(` `),t("span",{class:"token keyword"},"const"),n(" rows "),t("span",{class:"token operator"},"="),n(),t("span",{class:"token function"},"ref"),t("span",{class:"token punctuation"},"("),t("span",{class:"token number"},"1"),t("span",{class:"token punctuation"},")"),t("span",{class:"token punctuation"},";"),n(` `),t("span",{class:"token keyword"},"const"),n(" ellipsis "),t("span",{class:"token operator"},"="),n(),t("span",{class:"token function"},"computed"),t("span",{class:"token punctuation"},"("),t("span",{class:"token punctuation"},"("),t("span",{class:"token punctuation"},")"),n(),t("span",{class:"token operator"},"=>"),n(),t("span",{class:"token punctuation"},"{"),n(` `),t("span",{class:"token keyword"},"return"),n(),t("span",{class:"token punctuation"},"{"),n(` `),t("span",{class:"token literal-property property"},"rows"),t("span",{class:"token operator"},":"),n(" rows"),t("span",{class:"token punctuation"},"."),n("value"),t("span",{class:"token punctuation"},","),n(` `),t("span",{class:"token literal-property property"},"expandable"),t("span",{class:"token operator"},":"),n(),t("span",{class:"token boolean"},"true"),t("span",{class:"token punctuation"},","),n(` `),t("span",{class:"token literal-property property"},"suffix"),t("span",{class:"token operator"},":"),n(),t("span",{class:"token string"},"'--William Shakespeare'"),t("span",{class:"token punctuation"},","),n(` `),t("span",{class:"token function-variable function"},"onEllipsis"),t("span",{class:"token operator"},":"),n(),t("span",{class:"token parameter"},"ellipsis"),n(),t("span",{class:"token operator"},"=>"),n(),t("span",{class:"token punctuation"},"{"),n(` console`),t("span",{class:"token punctuation"},"."),t("span",{class:"token function"},"log"),t("span",{class:"token punctuation"},"("),t("span",{class:"token string"},"'Ellipsis changed:'"),t("span",{class:"token punctuation"},","),n(" ellipsis"),t("span",{class:"token punctuation"},")"),t("span",{class:"token punctuation"},";"),n(` `),t("span",{class:"token punctuation"},"}"),t("span",{class:"token punctuation"},","),n(` `),t("span",{class:"token punctuation"},"}"),t("span",{class:"token punctuation"},";"),n(` `),t("span",{class:"token punctuation"},"}"),t("span",{class:"token punctuation"},")"),t("span",{class:"token punctuation"},";"),n(` `),t("span",{class:"token keyword"},"return"),n(),t("span",{class:"token punctuation"},"{"),n(` rows`),t("span",{class:"token punctuation"},","),n(` ellipsis`),t("span",{class:"token punctuation"},","),n(` `),t("span",{class:"token literal-property property"},"article"),t("span",{class:"token operator"},":"),n(),t("span",{class:"token string"},`"To be, or not to be, that is a question: Whether it is nobler in the mind to suffer. The slings and arrows of outrageous fortune Or to take arms against a sea of troubles, And by opposing end them? To die: to sleep; No more; and by a sleep to say we end The heart-ache and the thousand natural shocks That flesh is heir to, 'tis a consummation Devoutly to be wish'd. To die, to sleep To sleep- perchance to dream: ay, there's the rub! For in that sleep of death what dreams may come When we have shuffled off this mortal coil, Must give us pause. There 's the respect That makes calamity of so long life"`),t("span",{class:"token punctuation"},","),n(` `),t("span",{class:"token punctuation"},"}"),t("span",{class:"token punctuation"},";"),n(` `),t("span",{class:"token punctuation"},"}"),t("span",{class:"token punctuation"},","),n(` `),t("span",{class:"token punctuation"},"}"),t("span",{class:"token punctuation"},")"),t("span",{class:"token punctuation"},";"),n(` `)])]),t("span",{class:"token tag"},[t("span",{class:"token tag"},[t("span",{class:"token punctuation"},"")]),n(` `)])],-1)])),_:1})}const Q=m(z,[["render",K]]),q={};function _(o,a){const l=p("a-typography-text"),k=p("a-typography-link"),g=p("a-space"),I=p("demo-box");return r(),y(I,{jsfiddle:{us:"Provides multiple types of text and link.",cn:"\u5185\u7F6E\u4E0D\u540C\u6837\u5F0F\u7684\u6587\u672C\u4EE5\u53CA\u8D85\u94FE\u63A5\u7EC4\u4EF6\u3002",docHtml:`

zh-CN

\u5185\u7F6E\u4E0D\u540C\u6837\u5F0F\u7684\u6587\u672C\u4EE5\u53CA\u8D85\u94FE\u63A5\u7EC4\u4EF6\u3002

en-US

Provides multiple types of text and link.

`,order:2,title:{"zh-CN":"\u6587\u672C\u4E0E\u8D85\u94FE\u63A5\u7EC4\u4EF6","en-US":"Text and Link Component"},relativePath:"components/typography/demo/text.vue",sourceCode:"PHRlbXBsYXRlPgogIDxhLXNwYWNlIGRpcmVjdGlvbj0idmVydGljYWwiPgogICAgPGEtdHlwb2dyYXBoeS10ZXh0PkFudCBEZXNpZ24gVnVlIChkZWZhdWx0KTwvYS10eXBvZ3JhcGh5LXRleHQ+CiAgICA8YS10eXBvZ3JhcGh5LXRleHQgdHlwZT0ic2Vjb25kYXJ5Ij5BbnQgRGVzaWduIFZ1ZSAoc2Vjb25kYXJ5KTwvYS10eXBvZ3JhcGh5LXRleHQ+CiAgICA8YS10eXBvZ3JhcGh5LXRleHQgdHlwZT0ic3VjY2VzcyI+QW50IERlc2lnbiBWdWUgKHN1Y2Nlc3MpPC9hLXR5cG9ncmFwaHktdGV4dD4KICAgIDxhLXR5cG9ncmFwaHktdGV4dCB0eXBlPSJ3YXJuaW5nIj5BbnQgRGVzaWduIFZ1ZSAod2FybmluZyk8L2EtdHlwb2dyYXBoeS10ZXh0PgogICAgPGEtdHlwb2dyYXBoeS10ZXh0IHR5cGU9ImRhbmdlciI+QW50IERlc2lnbiBWdWUgKGRhbmdlcik8L2EtdHlwb2dyYXBoeS10ZXh0PgogICAgPGEtdHlwb2dyYXBoeS10ZXh0IGRpc2FibGVkPkFudCBEZXNpZ24gVnVlIChkaXNhYmxlZCk8L2EtdHlwb2dyYXBoeS10ZXh0PgogICAgPGEtdHlwb2dyYXBoeS10ZXh0IG1hcms+QW50IERlc2lnbiBWdWUgKG1hcmspPC9hLXR5cG9ncmFwaHktdGV4dD4KICAgIDxhLXR5cG9ncmFwaHktdGV4dCBjb2RlPkFudCBEZXNpZ24gVnVlIChjb2RlKTwvYS10eXBvZ3JhcGh5LXRleHQ+CiAgICA8YS10eXBvZ3JhcGh5LXRleHQga2V5Ym9hcmQ+QW50IERlc2lnbiBWdWUgKGtleWJvYXJkKTwvYS10eXBvZ3JhcGh5LXRleHQ+CiAgICA8YS10eXBvZ3JhcGh5LXRleHQgdW5kZXJsaW5lPkFudCBEZXNpZ24gVnVlICh1bmRlcmxpbmUpPC9hLXR5cG9ncmFwaHktdGV4dD4KICAgIDxhLXR5cG9ncmFwaHktdGV4dCBkZWxldGU+QW50IERlc2lnbiBWdWUgKGRlbGV0ZSk8L2EtdHlwb2dyYXBoeS10ZXh0PgogICAgPGEtdHlwb2dyYXBoeS10ZXh0IHN0cm9uZz5BbnQgRGVzaWduIFZ1ZSAoc3Ryb25nKTwvYS10eXBvZ3JhcGh5LXRleHQ+CiAgICA8YS10eXBvZ3JhcGh5LWxpbmsgaHJlZj0iaHR0cHM6Ly9hbnRkdi5jb20iIHRhcmdldD0iX2JsYW5rIj4KICAgICAgQW50IERlc2lnbiBWdWUgKExpbmspCiAgICA8L2EtdHlwb2dyYXBoeS1saW5rPgogIDwvYS1zcGFjZT4KPC90ZW1wbGF0ZT4KCgo=",jsSourceCode:"PHRlbXBsYXRlPgogIDxhLXNwYWNlIGRpcmVjdGlvbj0idmVydGljYWwiPgogICAgPGEtdHlwb2dyYXBoeS10ZXh0PkFudCBEZXNpZ24gVnVlIChkZWZhdWx0KTwvYS10eXBvZ3JhcGh5LXRleHQ+CiAgICA8YS10eXBvZ3JhcGh5LXRleHQgdHlwZT0ic2Vjb25kYXJ5Ij5BbnQgRGVzaWduIFZ1ZSAoc2Vjb25kYXJ5KTwvYS10eXBvZ3JhcGh5LXRleHQ+CiAgICA8YS10eXBvZ3JhcGh5LXRleHQgdHlwZT0ic3VjY2VzcyI+QW50IERlc2lnbiBWdWUgKHN1Y2Nlc3MpPC9hLXR5cG9ncmFwaHktdGV4dD4KICAgIDxhLXR5cG9ncmFwaHktdGV4dCB0eXBlPSJ3YXJuaW5nIj5BbnQgRGVzaWduIFZ1ZSAod2FybmluZyk8L2EtdHlwb2dyYXBoeS10ZXh0PgogICAgPGEtdHlwb2dyYXBoeS10ZXh0IHR5cGU9ImRhbmdlciI+QW50IERlc2lnbiBWdWUgKGRhbmdlcik8L2EtdHlwb2dyYXBoeS10ZXh0PgogICAgPGEtdHlwb2dyYXBoeS10ZXh0IGRpc2FibGVkPkFudCBEZXNpZ24gVnVlIChkaXNhYmxlZCk8L2EtdHlwb2dyYXBoeS10ZXh0PgogICAgPGEtdHlwb2dyYXBoeS10ZXh0IG1hcms+QW50IERlc2lnbiBWdWUgKG1hcmspPC9hLXR5cG9ncmFwaHktdGV4dD4KICAgIDxhLXR5cG9ncmFwaHktdGV4dCBjb2RlPkFudCBEZXNpZ24gVnVlIChjb2RlKTwvYS10eXBvZ3JhcGh5LXRleHQ+CiAgICA8YS10eXBvZ3JhcGh5LXRleHQga2V5Ym9hcmQ+QW50IERlc2lnbiBWdWUgKGtleWJvYXJkKTwvYS10eXBvZ3JhcGh5LXRleHQ+CiAgICA8YS10eXBvZ3JhcGh5LXRleHQgdW5kZXJsaW5lPkFudCBEZXNpZ24gVnVlICh1bmRlcmxpbmUpPC9hLXR5cG9ncmFwaHktdGV4dD4KICAgIDxhLXR5cG9ncmFwaHktdGV4dCBkZWxldGU+QW50IERlc2lnbiBWdWUgKGRlbGV0ZSk8L2EtdHlwb2dyYXBoeS10ZXh0PgogICAgPGEtdHlwb2dyYXBoeS10ZXh0IHN0cm9uZz5BbnQgRGVzaWduIFZ1ZSAoc3Ryb25nKTwvYS10eXBvZ3JhcGh5LXRleHQ+CiAgICA8YS10eXBvZ3JhcGh5LWxpbmsgaHJlZj0iaHR0cHM6Ly9hbnRkdi5jb20iIHRhcmdldD0iX2JsYW5rIj4KICAgICAgQW50IERlc2lnbiBWdWUgKExpbmspCiAgICA8L2EtdHlwb2dyYXBoeS1saW5rPgogIDwvYS1zcGFjZT4KPC90ZW1wbGF0ZT4="}},{default:s(()=>[e(g,{direction:"vertical"},{default:s(()=>[e(l,null,{default:s(()=>a[0]||(a[0]=[n("Ant Design Vue (default)")])),_:1,__:[0]}),e(l,{type:"secondary"},{default:s(()=>a[1]||(a[1]=[n("Ant Design Vue (secondary)")])),_:1,__:[1]}),e(l,{type:"success"},{default:s(()=>a[2]||(a[2]=[n("Ant Design Vue (success)")])),_:1,__:[2]}),e(l,{type:"warning"},{default:s(()=>a[3]||(a[3]=[n("Ant Design Vue (warning)")])),_:1,__:[3]}),e(l,{type:"danger"},{default:s(()=>a[4]||(a[4]=[n("Ant Design Vue (danger)")])),_:1,__:[4]}),e(l,{disabled:""},{default:s(()=>a[5]||(a[5]=[n("Ant Design Vue (disabled)")])),_:1,__:[5]}),e(l,{mark:""},{default:s(()=>a[6]||(a[6]=[n("Ant Design Vue (mark)")])),_:1,__:[6]}),e(l,{code:""},{default:s(()=>a[7]||(a[7]=[n("Ant Design Vue (code)")])),_:1,__:[7]}),e(l,{keyboard:""},{default:s(()=>a[8]||(a[8]=[n("Ant Design Vue (keyboard)")])),_:1,__:[8]}),e(l,{underline:""},{default:s(()=>a[9]||(a[9]=[n("Ant Design Vue (underline)")])),_:1,__:[9]}),e(l,{delete:""},{default:s(()=>a[10]||(a[10]=[n("Ant Design Vue (delete)")])),_:1,__:[10]}),e(l,{strong:""},{default:s(()=>a[11]||(a[11]=[n("Ant Design Vue (strong)")])),_:1,__:[11]}),e(k,{href:"https://antdv.com",target:"_blank"},{default:s(()=>a[12]||(a[12]=[n(" Ant Design Vue (Link) ")])),_:1,__:[12]})]),_:1})]),htmlCode:s(()=>a[13]||(a[13]=[t("pre",{class:"language-vue"},[t("code",null,[t("span",{class:"token tag"},[t("span",{class:"token tag"},[t("span",{class:"token punctuation"},"<"),n("template")]),t("span",{class:"token punctuation"},">")]),n(` `),t("span",{class:"token tag"},[t("span",{class:"token tag"},[t("span",{class:"token punctuation"},"<"),n("a-space")]),n(),t("span",{class:"token attr-name"},"direction"),t("span",{class:"token attr-value"},[t("span",{class:"token punctuation attr-equals"},"="),t("span",{class:"token punctuation"},'"'),n("vertical"),t("span",{class:"token punctuation"},'"')]),t("span",{class:"token punctuation"},">")]),n(` `),t("span",{class:"token tag"},[t("span",{class:"token tag"},[t("span",{class:"token punctuation"},"<"),n("a-typography-text")]),t("span",{class:"token punctuation"},">")]),n("Ant Design Vue (default)"),t("span",{class:"token tag"},[t("span",{class:"token tag"},[t("span",{class:"token punctuation"},"")]),n(` `),t("span",{class:"token tag"},[t("span",{class:"token tag"},[t("span",{class:"token punctuation"},"<"),n("a-typography-text")]),n(),t("span",{class:"token attr-name"},"type"),t("span",{class:"token attr-value"},[t("span",{class:"token punctuation attr-equals"},"="),t("span",{class:"token punctuation"},'"'),n("secondary"),t("span",{class:"token punctuation"},'"')]),t("span",{class:"token punctuation"},">")]),n("Ant Design Vue (secondary)"),t("span",{class:"token tag"},[t("span",{class:"token tag"},[t("span",{class:"token punctuation"},"")]),n(` `),t("span",{class:"token tag"},[t("span",{class:"token tag"},[t("span",{class:"token punctuation"},"<"),n("a-typography-text")]),n(),t("span",{class:"token attr-name"},"type"),t("span",{class:"token attr-value"},[t("span",{class:"token punctuation attr-equals"},"="),t("span",{class:"token punctuation"},'"'),n("success"),t("span",{class:"token punctuation"},'"')]),t("span",{class:"token punctuation"},">")]),n("Ant Design Vue (success)"),t("span",{class:"token tag"},[t("span",{class:"token tag"},[t("span",{class:"token punctuation"},"")]),n(` `),t("span",{class:"token tag"},[t("span",{class:"token tag"},[t("span",{class:"token punctuation"},"<"),n("a-typography-text")]),n(),t("span",{class:"token attr-name"},"type"),t("span",{class:"token attr-value"},[t("span",{class:"token punctuation attr-equals"},"="),t("span",{class:"token punctuation"},'"'),n("warning"),t("span",{class:"token punctuation"},'"')]),t("span",{class:"token punctuation"},">")]),n("Ant Design Vue (warning)"),t("span",{class:"token tag"},[t("span",{class:"token tag"},[t("span",{class:"token punctuation"},"")]),n(` `),t("span",{class:"token tag"},[t("span",{class:"token tag"},[t("span",{class:"token punctuation"},"<"),n("a-typography-text")]),n(),t("span",{class:"token attr-name"},"type"),t("span",{class:"token attr-value"},[t("span",{class:"token punctuation attr-equals"},"="),t("span",{class:"token punctuation"},'"'),n("danger"),t("span",{class:"token punctuation"},'"')]),t("span",{class:"token punctuation"},">")]),n("Ant Design Vue (danger)"),t("span",{class:"token tag"},[t("span",{class:"token tag"},[t("span",{class:"token punctuation"},"")]),n(` `),t("span",{class:"token tag"},[t("span",{class:"token tag"},[t("span",{class:"token punctuation"},"<"),n("a-typography-text")]),n(),t("span",{class:"token attr-name"},"disabled"),t("span",{class:"token punctuation"},">")]),n("Ant Design Vue (disabled)"),t("span",{class:"token tag"},[t("span",{class:"token tag"},[t("span",{class:"token punctuation"},"")]),n(` `),t("span",{class:"token tag"},[t("span",{class:"token tag"},[t("span",{class:"token punctuation"},"<"),n("a-typography-text")]),n(),t("span",{class:"token attr-name"},"mark"),t("span",{class:"token punctuation"},">")]),n("Ant Design Vue (mark)"),t("span",{class:"token tag"},[t("span",{class:"token tag"},[t("span",{class:"token punctuation"},"")]),n(` `),t("span",{class:"token tag"},[t("span",{class:"token tag"},[t("span",{class:"token punctuation"},"<"),n("a-typography-text")]),n(),t("span",{class:"token attr-name"},"code"),t("span",{class:"token punctuation"},">")]),n("Ant Design Vue (code)"),t("span",{class:"token tag"},[t("span",{class:"token tag"},[t("span",{class:"token punctuation"},"")]),n(` `),t("span",{class:"token tag"},[t("span",{class:"token tag"},[t("span",{class:"token punctuation"},"<"),n("a-typography-text")]),n(),t("span",{class:"token attr-name"},"keyboard"),t("span",{class:"token punctuation"},">")]),n("Ant Design Vue (keyboard)"),t("span",{class:"token tag"},[t("span",{class:"token tag"},[t("span",{class:"token punctuation"},"")]),n(` `),t("span",{class:"token tag"},[t("span",{class:"token tag"},[t("span",{class:"token punctuation"},"<"),n("a-typography-text")]),n(),t("span",{class:"token attr-name"},"underline"),t("span",{class:"token punctuation"},">")]),n("Ant Design Vue (underline)"),t("span",{class:"token tag"},[t("span",{class:"token tag"},[t("span",{class:"token punctuation"},"")]),n(` `),t("span",{class:"token tag"},[t("span",{class:"token tag"},[t("span",{class:"token punctuation"},"<"),n("a-typography-text")]),n(),t("span",{class:"token attr-name"},"delete"),t("span",{class:"token punctuation"},">")]),n("Ant Design Vue (delete)"),t("span",{class:"token tag"},[t("span",{class:"token tag"},[t("span",{class:"token punctuation"},"")]),n(` `),t("span",{class:"token tag"},[t("span",{class:"token tag"},[t("span",{class:"token punctuation"},"<"),n("a-typography-text")]),n(),t("span",{class:"token attr-name"},"strong"),t("span",{class:"token punctuation"},">")]),n("Ant Design Vue (strong)"),t("span",{class:"token tag"},[t("span",{class:"token tag"},[t("span",{class:"token punctuation"},"")]),n(` `),t("span",{class:"token tag"},[t("span",{class:"token tag"},[t("span",{class:"token punctuation"},"<"),n("a-typography-link")]),n(),t("span",{class:"token attr-name"},"href"),t("span",{class:"token attr-value"},[t("span",{class:"token punctuation attr-equals"},"="),t("span",{class:"token punctuation"},'"'),n("https://antdv.com"),t("span",{class:"token punctuation"},'"')]),n(),t("span",{class:"token attr-name"},"target"),t("span",{class:"token attr-value"},[t("span",{class:"token punctuation attr-equals"},"="),t("span",{class:"token punctuation"},'"'),n("_blank"),t("span",{class:"token punctuation"},'"')]),t("span",{class:"token punctuation"},">")]),n(` Ant Design Vue (Link) `),t("span",{class:"token tag"},[t("span",{class:"token tag"},[t("span",{class:"token punctuation"},"")]),n(` `),t("span",{class:"token tag"},[t("span",{class:"token tag"},[t("span",{class:"token punctuation"},"")]),n(` `),t("span",{class:"token tag"},[t("span",{class:"token tag"},[t("span",{class:"token punctuation"},"")]),n(` `)])],-1)])),jsVersionHtml:s(()=>a[14]||(a[14]=[t("pre",{class:"language-vue"},[t("code",null,[t("span",{class:"token tag"},[t("span",{class:"token tag"},[t("span",{class:"token punctuation"},"<"),n("template")]),t("span",{class:"token punctuation"},">")]),n(` `),t("span",{class:"token tag"},[t("span",{class:"token tag"},[t("span",{class:"token punctuation"},"<"),n("a-space")]),n(),t("span",{class:"token attr-name"},"direction"),t("span",{class:"token attr-value"},[t("span",{class:"token punctuation attr-equals"},"="),t("span",{class:"token punctuation"},'"'),n("vertical"),t("span",{class:"token punctuation"},'"')]),t("span",{class:"token punctuation"},">")]),n(` `),t("span",{class:"token tag"},[t("span",{class:"token tag"},[t("span",{class:"token punctuation"},"<"),n("a-typography-text")]),t("span",{class:"token punctuation"},">")]),n("Ant Design Vue (default)"),t("span",{class:"token tag"},[t("span",{class:"token tag"},[t("span",{class:"token punctuation"},"")]),n(` `),t("span",{class:"token tag"},[t("span",{class:"token tag"},[t("span",{class:"token punctuation"},"<"),n("a-typography-text")]),n(),t("span",{class:"token attr-name"},"type"),t("span",{class:"token attr-value"},[t("span",{class:"token punctuation attr-equals"},"="),t("span",{class:"token punctuation"},'"'),n("secondary"),t("span",{class:"token punctuation"},'"')]),t("span",{class:"token punctuation"},">")]),n("Ant Design Vue (secondary)"),t("span",{class:"token tag"},[t("span",{class:"token tag"},[t("span",{class:"token punctuation"},"")]),n(` `),t("span",{class:"token tag"},[t("span",{class:"token tag"},[t("span",{class:"token punctuation"},"<"),n("a-typography-text")]),n(),t("span",{class:"token attr-name"},"type"),t("span",{class:"token attr-value"},[t("span",{class:"token punctuation attr-equals"},"="),t("span",{class:"token punctuation"},'"'),n("success"),t("span",{class:"token punctuation"},'"')]),t("span",{class:"token punctuation"},">")]),n("Ant Design Vue (success)"),t("span",{class:"token tag"},[t("span",{class:"token tag"},[t("span",{class:"token punctuation"},"")]),n(` `),t("span",{class:"token tag"},[t("span",{class:"token tag"},[t("span",{class:"token punctuation"},"<"),n("a-typography-text")]),n(),t("span",{class:"token attr-name"},"type"),t("span",{class:"token attr-value"},[t("span",{class:"token punctuation attr-equals"},"="),t("span",{class:"token punctuation"},'"'),n("warning"),t("span",{class:"token punctuation"},'"')]),t("span",{class:"token punctuation"},">")]),n("Ant Design Vue (warning)"),t("span",{class:"token tag"},[t("span",{class:"token tag"},[t("span",{class:"token punctuation"},"")]),n(` `),t("span",{class:"token tag"},[t("span",{class:"token tag"},[t("span",{class:"token punctuation"},"<"),n("a-typography-text")]),n(),t("span",{class:"token attr-name"},"type"),t("span",{class:"token attr-value"},[t("span",{class:"token punctuation attr-equals"},"="),t("span",{class:"token punctuation"},'"'),n("danger"),t("span",{class:"token punctuation"},'"')]),t("span",{class:"token punctuation"},">")]),n("Ant Design Vue (danger)"),t("span",{class:"token tag"},[t("span",{class:"token tag"},[t("span",{class:"token punctuation"},"")]),n(` `),t("span",{class:"token tag"},[t("span",{class:"token tag"},[t("span",{class:"token punctuation"},"<"),n("a-typography-text")]),n(),t("span",{class:"token attr-name"},"disabled"),t("span",{class:"token punctuation"},">")]),n("Ant Design Vue (disabled)"),t("span",{class:"token tag"},[t("span",{class:"token tag"},[t("span",{class:"token punctuation"},"")]),n(` `),t("span",{class:"token tag"},[t("span",{class:"token tag"},[t("span",{class:"token punctuation"},"<"),n("a-typography-text")]),n(),t("span",{class:"token attr-name"},"mark"),t("span",{class:"token punctuation"},">")]),n("Ant Design Vue (mark)"),t("span",{class:"token tag"},[t("span",{class:"token tag"},[t("span",{class:"token punctuation"},"")]),n(` `),t("span",{class:"token tag"},[t("span",{class:"token tag"},[t("span",{class:"token punctuation"},"<"),n("a-typography-text")]),n(),t("span",{class:"token attr-name"},"code"),t("span",{class:"token punctuation"},">")]),n("Ant Design Vue (code)"),t("span",{class:"token tag"},[t("span",{class:"token tag"},[t("span",{class:"token punctuation"},"")]),n(` `),t("span",{class:"token tag"},[t("span",{class:"token tag"},[t("span",{class:"token punctuation"},"<"),n("a-typography-text")]),n(),t("span",{class:"token attr-name"},"keyboard"),t("span",{class:"token punctuation"},">")]),n("Ant Design Vue (keyboard)"),t("span",{class:"token tag"},[t("span",{class:"token tag"},[t("span",{class:"token punctuation"},"")]),n(` `),t("span",{class:"token tag"},[t("span",{class:"token tag"},[t("span",{class:"token punctuation"},"<"),n("a-typography-text")]),n(),t("span",{class:"token attr-name"},"underline"),t("span",{class:"token punctuation"},">")]),n("Ant Design Vue (underline)"),t("span",{class:"token tag"},[t("span",{class:"token tag"},[t("span",{class:"token punctuation"},"")]),n(` `),t("span",{class:"token tag"},[t("span",{class:"token tag"},[t("span",{class:"token punctuation"},"<"),n("a-typography-text")]),n(),t("span",{class:"token attr-name"},"delete"),t("span",{class:"token punctuation"},">")]),n("Ant Design Vue (delete)"),t("span",{class:"token tag"},[t("span",{class:"token tag"},[t("span",{class:"token punctuation"},"")]),n(` `),t("span",{class:"token tag"},[t("span",{class:"token tag"},[t("span",{class:"token punctuation"},"<"),n("a-typography-text")]),n(),t("span",{class:"token attr-name"},"strong"),t("span",{class:"token punctuation"},">")]),n("Ant Design Vue (strong)"),t("span",{class:"token tag"},[t("span",{class:"token tag"},[t("span",{class:"token punctuation"},"")]),n(` `),t("span",{class:"token tag"},[t("span",{class:"token tag"},[t("span",{class:"token punctuation"},"<"),n("a-typography-link")]),n(),t("span",{class:"token attr-name"},"href"),t("span",{class:"token attr-value"},[t("span",{class:"token punctuation attr-equals"},"="),t("span",{class:"token punctuation"},'"'),n("https://antdv.com"),t("span",{class:"token punctuation"},'"')]),n(),t("span",{class:"token attr-name"},"target"),t("span",{class:"token attr-value"},[t("span",{class:"token punctuation attr-equals"},"="),t("span",{class:"token punctuation"},'"'),n("_blank"),t("span",{class:"token punctuation"},'"')]),t("span",{class:"token punctuation"},">")]),n(` Ant Design Vue (Link) `),t("span",{class:"token tag"},[t("span",{class:"token tag"},[t("span",{class:"token punctuation"},"")]),n(` `),t("span",{class:"token tag"},[t("span",{class:"token tag"},[t("span",{class:"token punctuation"},"")]),n(` `),t("span",{class:"token tag"},[t("span",{class:"token tag"},[t("span",{class:"token punctuation"},"")]),n(` `)])],-1)])),_:1})}const M=m(q,[["render",_]]),$={};function tt(o,a){const l=p("a-typography-title"),k=p("demo-box");return r(),y(k,{jsfiddle:{us:"Display title in different level.",cn:"\u5C55\u793A\u4E0D\u540C\u7EA7\u522B\u7684\u6807\u9898\u3002",docHtml:`

zh-CN

\u5C55\u793A\u4E0D\u540C\u7EA7\u522B\u7684\u6807\u9898\u3002

en-US

Display title in different level.

`,order:1,title:{"zh-CN":"\u6807\u9898\u7EC4\u4EF6","en-US":"Title Component"},relativePath:"components/typography/demo/title.vue",sourceCode:"PHRlbXBsYXRlPgogIDxhLXR5cG9ncmFwaHktdGl0bGU+aDEuIEFudCBEZXNpZ24gVnVlPC9hLXR5cG9ncmFwaHktdGl0bGU+CiAgPGEtdHlwb2dyYXBoeS10aXRsZSA6bGV2ZWw9IjIiPmgyLiBBbnQgRGVzaWduIFZ1ZTwvYS10eXBvZ3JhcGh5LXRpdGxlPgogIDxhLXR5cG9ncmFwaHktdGl0bGUgOmxldmVsPSIzIj5oMy4gQW50IERlc2lnbiBWdWU8L2EtdHlwb2dyYXBoeS10aXRsZT4KICA8YS10eXBvZ3JhcGh5LXRpdGxlIDpsZXZlbD0iNCI+aDQuIEFudCBEZXNpZ24gVnVlPC9hLXR5cG9ncmFwaHktdGl0bGU+CiAgPGEtdHlwb2dyYXBoeS10aXRsZSA6bGV2ZWw9IjUiPmg1LiBBbnQgRGVzaWduIFZ1ZTwvYS10eXBvZ3JhcGh5LXRpdGxlPgo8L3RlbXBsYXRlPgoKCg==",jsSourceCode:"PHRlbXBsYXRlPgogIDxhLXR5cG9ncmFwaHktdGl0bGU+aDEuIEFudCBEZXNpZ24gVnVlPC9hLXR5cG9ncmFwaHktdGl0bGU+CiAgPGEtdHlwb2dyYXBoeS10aXRsZSA6bGV2ZWw9IjIiPmgyLiBBbnQgRGVzaWduIFZ1ZTwvYS10eXBvZ3JhcGh5LXRpdGxlPgogIDxhLXR5cG9ncmFwaHktdGl0bGUgOmxldmVsPSIzIj5oMy4gQW50IERlc2lnbiBWdWU8L2EtdHlwb2dyYXBoeS10aXRsZT4KICA8YS10eXBvZ3JhcGh5LXRpdGxlIDpsZXZlbD0iNCI+aDQuIEFudCBEZXNpZ24gVnVlPC9hLXR5cG9ncmFwaHktdGl0bGU+CiAgPGEtdHlwb2dyYXBoeS10aXRsZSA6bGV2ZWw9IjUiPmg1LiBBbnQgRGVzaWduIFZ1ZTwvYS10eXBvZ3JhcGh5LXRpdGxlPgo8L3RlbXBsYXRlPg=="}},{default:s(()=>[e(l,null,{default:s(()=>a[0]||(a[0]=[n("h1. Ant Design Vue")])),_:1,__:[0]}),e(l,{level:2},{default:s(()=>a[1]||(a[1]=[n("h2. Ant Design Vue")])),_:1,__:[1]}),e(l,{level:3},{default:s(()=>a[2]||(a[2]=[n("h3. Ant Design Vue")])),_:1,__:[2]}),e(l,{level:4},{default:s(()=>a[3]||(a[3]=[n("h4. Ant Design Vue")])),_:1,__:[3]}),e(l,{level:5},{default:s(()=>a[4]||(a[4]=[n("h5. Ant Design Vue")])),_:1,__:[4]})]),htmlCode:s(()=>a[5]||(a[5]=[t("pre",{class:"language-vue"},[t("code",null,[t("span",{class:"token tag"},[t("span",{class:"token tag"},[t("span",{class:"token punctuation"},"<"),n("template")]),t("span",{class:"token punctuation"},">")]),n(` `),t("span",{class:"token tag"},[t("span",{class:"token tag"},[t("span",{class:"token punctuation"},"<"),n("a-typography-title")]),t("span",{class:"token punctuation"},">")]),n("h1. Ant Design Vue"),t("span",{class:"token tag"},[t("span",{class:"token tag"},[t("span",{class:"token punctuation"},"")]),n(` `),t("span",{class:"token tag"},[t("span",{class:"token tag"},[t("span",{class:"token punctuation"},"<"),n("a-typography-title")]),n(),t("span",{class:"token attr-name"},":level"),t("span",{class:"token attr-value"},[t("span",{class:"token punctuation attr-equals"},"="),t("span",{class:"token punctuation"},'"'),n("2"),t("span",{class:"token punctuation"},'"')]),t("span",{class:"token punctuation"},">")]),n("h2. Ant Design Vue"),t("span",{class:"token tag"},[t("span",{class:"token tag"},[t("span",{class:"token punctuation"},"")]),n(` `),t("span",{class:"token tag"},[t("span",{class:"token tag"},[t("span",{class:"token punctuation"},"<"),n("a-typography-title")]),n(),t("span",{class:"token attr-name"},":level"),t("span",{class:"token attr-value"},[t("span",{class:"token punctuation attr-equals"},"="),t("span",{class:"token punctuation"},'"'),n("3"),t("span",{class:"token punctuation"},'"')]),t("span",{class:"token punctuation"},">")]),n("h3. Ant Design Vue"),t("span",{class:"token tag"},[t("span",{class:"token tag"},[t("span",{class:"token punctuation"},"")]),n(` `),t("span",{class:"token tag"},[t("span",{class:"token tag"},[t("span",{class:"token punctuation"},"<"),n("a-typography-title")]),n(),t("span",{class:"token attr-name"},":level"),t("span",{class:"token attr-value"},[t("span",{class:"token punctuation attr-equals"},"="),t("span",{class:"token punctuation"},'"'),n("4"),t("span",{class:"token punctuation"},'"')]),t("span",{class:"token punctuation"},">")]),n("h4. Ant Design Vue"),t("span",{class:"token tag"},[t("span",{class:"token tag"},[t("span",{class:"token punctuation"},"")]),n(` `),t("span",{class:"token tag"},[t("span",{class:"token tag"},[t("span",{class:"token punctuation"},"<"),n("a-typography-title")]),n(),t("span",{class:"token attr-name"},":level"),t("span",{class:"token attr-value"},[t("span",{class:"token punctuation attr-equals"},"="),t("span",{class:"token punctuation"},'"'),n("5"),t("span",{class:"token punctuation"},'"')]),t("span",{class:"token punctuation"},">")]),n("h5. Ant Design Vue"),t("span",{class:"token tag"},[t("span",{class:"token tag"},[t("span",{class:"token punctuation"},"")]),n(` `),t("span",{class:"token tag"},[t("span",{class:"token tag"},[t("span",{class:"token punctuation"},"")]),n(` `)])],-1)])),jsVersionHtml:s(()=>a[6]||(a[6]=[t("pre",{class:"language-vue"},[t("code",null,[t("span",{class:"token tag"},[t("span",{class:"token tag"},[t("span",{class:"token punctuation"},"<"),n("template")]),t("span",{class:"token punctuation"},">")]),n(` `),t("span",{class:"token tag"},[t("span",{class:"token tag"},[t("span",{class:"token punctuation"},"<"),n("a-typography-title")]),t("span",{class:"token punctuation"},">")]),n("h1. Ant Design Vue"),t("span",{class:"token tag"},[t("span",{class:"token tag"},[t("span",{class:"token punctuation"},"")]),n(` `),t("span",{class:"token tag"},[t("span",{class:"token tag"},[t("span",{class:"token punctuation"},"<"),n("a-typography-title")]),n(),t("span",{class:"token attr-name"},":level"),t("span",{class:"token attr-value"},[t("span",{class:"token punctuation attr-equals"},"="),t("span",{class:"token punctuation"},'"'),n("2"),t("span",{class:"token punctuation"},'"')]),t("span",{class:"token punctuation"},">")]),n("h2. Ant Design Vue"),t("span",{class:"token tag"},[t("span",{class:"token tag"},[t("span",{class:"token punctuation"},"")]),n(` `),t("span",{class:"token tag"},[t("span",{class:"token tag"},[t("span",{class:"token punctuation"},"<"),n("a-typography-title")]),n(),t("span",{class:"token attr-name"},":level"),t("span",{class:"token attr-value"},[t("span",{class:"token punctuation attr-equals"},"="),t("span",{class:"token punctuation"},'"'),n("3"),t("span",{class:"token punctuation"},'"')]),t("span",{class:"token punctuation"},">")]),n("h3. Ant Design Vue"),t("span",{class:"token tag"},[t("span",{class:"token tag"},[t("span",{class:"token punctuation"},"")]),n(` `),t("span",{class:"token tag"},[t("span",{class:"token tag"},[t("span",{class:"token punctuation"},"<"),n("a-typography-title")]),n(),t("span",{class:"token attr-name"},":level"),t("span",{class:"token attr-value"},[t("span",{class:"token punctuation attr-equals"},"="),t("span",{class:"token punctuation"},'"'),n("4"),t("span",{class:"token punctuation"},'"')]),t("span",{class:"token punctuation"},">")]),n("h4. Ant Design Vue"),t("span",{class:"token tag"},[t("span",{class:"token tag"},[t("span",{class:"token punctuation"},"")]),n(` `),t("span",{class:"token tag"},[t("span",{class:"token tag"},[t("span",{class:"token punctuation"},"<"),n("a-typography-title")]),n(),t("span",{class:"token attr-name"},":level"),t("span",{class:"token attr-value"},[t("span",{class:"token punctuation attr-equals"},"="),t("span",{class:"token punctuation"},'"'),n("5"),t("span",{class:"token punctuation"},'"')]),t("span",{class:"token punctuation"},">")]),n("h5. Ant Design Vue"),t("span",{class:"token tag"},[t("span",{class:"token tag"},[t("span",{class:"token punctuation"},"")]),n(` `),t("span",{class:"token tag"},[t("span",{class:"token tag"},[t("span",{class:"token punctuation"},"")]),n(` `)])],-1)])),_:1})}const nt=m($,[["render",tt]]),at={pageData:{title:"Typography",description:"",frontmatter:{category:"Components",subtitle:"\u6392\u7248",type:"\u901A\u7528",title:"Typography",cols:1,cover:"https://gw.alipayobjects.com/zos/alicdn/GOM1KQ24O/Typography.svg"},headers:[{level:2,title:"\u4F55\u65F6\u4F7F\u7528",slug:"\u4F55\u65F6\u4F7F\u7528",content:""},{level:2,title:"API",slug:"API",content:"Typography.Text"},{level:3,title:"Typography.Text",slug:"Typography-Text",content:""},{level:3,title:"Typography.Title",slug:"Typography-Title",content:""},{level:3,title:"Typography.Paragraph",slug:"Typography-Paragraph",content:""},{level:3,title:"slots",slug:"slots",content:""},{level:3,title:"copyable",slug:"copyable",content:""},{level:3,title:"editable",slug:"editable",content:""},{level:3,title:"ellipsis",slug:"ellipsis",content:""}],relativePath:"components/typography/index.zh-CN.md",content:` \u6587\u672C\u7684\u57FA\u672C\u683C\u5F0F\u3002 ## \u4F55\u65F6\u4F7F\u7528 - \u5F53\u9700\u8981\u5C55\u793A\u6807\u9898\u3001\u6BB5\u843D\u3001\u5217\u8868\u5185\u5BB9\u65F6\u4F7F\u7528\uFF0C\u5982\u6587\u7AE0/\u535A\u5BA2/\u65E5\u5FD7\u7684\u6587\u672C\u6837\u5F0F\u3002 - \u5F53\u9700\u8981\u4E00\u5217\u57FA\u4E8E\u6587\u672C\u7684\u57FA\u7840\u64CD\u4F5C\u65F6\uFF0C\u5982\u62F7\u8D1D/\u7701\u7565/\u53EF\u7F16\u8F91\u3002 ## API ### Typography.Text | \u53C2\u6570 | \u8BF4\u660E | \u7C7B\u578B | \u9ED8\u8BA4\u503C | \u7248\u672C | | --- | --- | --- | --- | --- | | code | \u6DFB\u52A0\u4EE3\u7801\u6837\u5F0F | boolean | false | | | content(v-model) | \u5F53\u4F7F\u7528 ellipsis \u6216 editable \u65F6\uFF0C\u4F7F\u7528 content \u4EE3\u66FF children | string | - | | | copyable | \u662F\u5426\u53EF\u62F7\u8D1D\uFF0C\u4E3A\u5BF9\u8C61\u65F6\u53EF\u8FDB\u884C\u5404\u79CD\u81EA\u5B9A\u4E49 | boolean \\| [copyable](#copyable) | false | [copyable](#copyable) | | delete | \u6DFB\u52A0\u5220\u9664\u7EBF\u6837\u5F0F | boolean | false | | | disabled | \u7981\u7528\u6587\u672C | boolean | false | | | editable | \u662F\u5426\u53EF\u7F16\u8F91\uFF0C\u4E3A\u5BF9\u8C61\u65F6\u53EF\u5BF9\u7F16\u8F91\u8FDB\u884C\u63A7\u5236 | boolean \\| [editable](#editable) | false | [editable](#editable) | | ellipsis | \u81EA\u52A8\u6EA2\u51FA\u7701\u7565 | boolean | false | | | keyboard | \u6DFB\u52A0\u952E\u76D8\u6837\u5F0F | boolean | false | | | mark | \u6DFB\u52A0\u6807\u8BB0\u6837\u5F0F | boolean | false | | | strong | \u662F\u5426\u52A0\u7C97 | boolean | false | | | type | \u6587\u672C\u7C7B\u578B | \`secondary\` \\| \`success\` \\| \`warning\` \\| \`danger\` | - | | | underline | \u6DFB\u52A0\u4E0B\u5212\u7EBF\u6837\u5F0F | boolean | false | | ### Typography.Title | \u53C2\u6570 | \u8BF4\u660E | \u7C7B\u578B | \u9ED8\u8BA4\u503C | \u7248\u672C | | --- | --- | --- | --- | --- | | code | \u6DFB\u52A0\u4EE3\u7801\u6837\u5F0F | boolean | false | | | content(v-model) | \u5F53\u4F7F\u7528 ellipsis \u6216 editable \u65F6\uFF0C\u4F7F\u7528 content \u4EE3\u66FF children | string | - | | | copyable | \u662F\u5426\u53EF\u62F7\u8D1D\uFF0C\u4E3A\u5BF9\u8C61\u65F6\u53EF\u8FDB\u884C\u5404\u79CD\u81EA\u5B9A\u4E49 | boolean \\| [copyable](#copyable) | false | [copyable](#copyable) | | delete | \u6DFB\u52A0\u5220\u9664\u7EBF\u6837\u5F0F | boolean | false | | | disabled | \u7981\u7528\u6587\u672C | boolean | false | | | editable | \u662F\u5426\u53EF\u7F16\u8F91\uFF0C\u4E3A\u5BF9\u8C61\u65F6\u53EF\u5BF9\u7F16\u8F91\u8FDB\u884C\u63A7\u5236 | boolean \\| [editable](#editable) | false | [editable](#editable) | | ellipsis | \u81EA\u52A8\u6EA2\u51FA\u7701\u7565\uFF0C\u4E3A\u5BF9\u8C61\u65F6\u53EF\u8BBE\u7F6E\u7701\u7565\u884C\u6570\u3001\u662F\u5426\u53EF\u5C55\u5F00\u3001\u6DFB\u52A0\u540E\u7F00\u7B49 | boolean \\| [ellipsis](#ellipsis) | false | [ellipsis](#ellipsis) | | level | \u91CD\u8981\u7A0B\u5EA6\uFF0C\u76F8\u5F53\u4E8E \`h1\`\u3001\`h2\`\u3001\`h3\`\u3001\`h4\`\u3001\`h5\` | number: 1, 2, 3, 4, 5 | 1 | | | mark | \u6DFB\u52A0\u6807\u8BB0\u6837\u5F0F | boolean | false | | | type | \u6587\u672C\u7C7B\u578B | \`secondary\` \\| \`success\` \\| \`warning\` \\| \`danger\` | - | | | underline | \u6DFB\u52A0\u4E0B\u5212\u7EBF\u6837\u5F0F | boolean | false | | ### Typography.Paragraph | \u53C2\u6570 | \u8BF4\u660E | \u7C7B\u578B | \u9ED8\u8BA4\u503C | \u7248\u672C | | --- | --- | --- | --- | --- | | code | \u6DFB\u52A0\u4EE3\u7801\u6837\u5F0F | boolean | false | | | content(v-model) | \u5F53\u4F7F\u7528 ellipsis \u6216 editable \u65F6\uFF0C\u4F7F\u7528 content \u4EE3\u66FF children | string | - | | | copyable | \u662F\u5426\u53EF\u62F7\u8D1D\uFF0C\u4E3A\u5BF9\u8C61\u65F6\u53EF\u8FDB\u884C\u5404\u79CD\u81EA\u5B9A\u4E49 | boolean \\| [copyable](#copyable) | false | [copyable](#copyable) | | delete | \u6DFB\u52A0\u5220\u9664\u7EBF\u6837\u5F0F | boolean | false | | | disabled | \u7981\u7528\u6587\u672C | boolean | false | | | editable | \u662F\u5426\u53EF\u7F16\u8F91\uFF0C\u4E3A\u5BF9\u8C61\u65F6\u53EF\u5BF9\u7F16\u8F91\u8FDB\u884C\u63A7\u5236 | boolean \\| [editable](#editable) | false | [editable](#editable) | | ellipsis | \u81EA\u52A8\u6EA2\u51FA\u7701\u7565\uFF0C\u4E3A\u5BF9\u8C61\u65F6\u53EF\u8BBE\u7F6E\u7701\u7565\u884C\u6570\u3001\u662F\u5426\u53EF\u5C55\u5F00\u3001\u6DFB\u52A0\u540E\u7F00\u7B49 | boolean \\| [ellipsis](#ellipsis) | false | [ellipsis](#ellipsis) | | mark | \u6DFB\u52A0\u6807\u8BB0\u6837\u5F0F | boolean | false | | | strong | \u662F\u5426\u52A0\u7C97 | boolean | false | | | type | \u6587\u672C\u7C7B\u578B | \`secondary\` \\| \`success\` \\| \`warning\` \\| \`danger\` | - | | | underline | \u6DFB\u52A0\u4E0B\u5212\u7EBF\u6837\u5F0F | boolean | false | | ### slots | \u540D\u79F0 | \u8BF4\u660E | \u53C2\u6570 | \u9ED8\u8BA4\u503C | \u7248\u672C | | --- | --- | --- | --- | --- | | copyableIcon | \u81EA\u5B9A\u4E49\u62F7\u8D1D\u56FE\u6807 | \`{ copied: boolean }\` | \`copied ? <CheckOutlined /> : <CopyOutlined />\` | | | copyableTooltip | \u81EA\u5B9A\u4E49\u63D0\u793A\u6587\u6848\uFF0C\u5F53 \`copyable.tooltip = false\` \u65F6\u5173\u95ED | \`{ copied: boolean }\` | \`copied ? '\u590D\u5236\u6210\u529F' : '\u590D\u5236'\` | | | editableIcon | \u81EA\u5B9A\u4E49\u7F16\u8F91\u56FE\u6807 | - | &lt;EditOutlined /> | | | editableTooltip | \u81EA\u5B9A\u4E49\u63D0\u793A\u6587\u672C\uFF0C\u5F53 \`editable.tooltip = false\` \u65F6\u5173\u95ED | - | \`\u7F16\u8F91\` | | | ellipsisSymbol | \u81EA\u5B9A\u4E49\u5C55\u5F00\u63CF\u8FF0\u6587\u6848 | - | - | | | ellipsisTooltip | \u7701\u7565\u65F6\uFF0C\u5C55\u793A\u63D0\u793A\u4FE1\u606F | - | - | | | enterEnterIcon | \u5728\u7F16\u8F91\u6BB5\u4E2D\u81EA\u5B9A\u4E49\u201Center\u201D\u56FE\u6807 | \`{className: string}\` | \`<EnterOutlined />\` | 3.0 | ### copyable \`\`\`json { text: string, onCopy: function, tooltip: false, } \`\`\` | \u53C2\u6570 | \u8BF4\u660E | \u7C7B\u578B | \u9ED8\u8BA4\u503C | \u7248\u672C | | ------- | -------------------- | -------- | ------ | ---- | | text | \u62F7\u8D1D\u5230\u526A\u5207\u677F\u91CC\u7684\u6587\u672C | string | - | | | tooltip | \u662F\u5426\u5C55\u793A\u63D0\u793A\u6587\u672C | boolean | true | | | onCopy | \u62F7\u8D1D\u6210\u529F\u7684\u56DE\u8C03\u51FD\u6570 | function | - | | ### editable \`\`\`json { tooltip: boolean, editing: boolean, maxlength: number, autoSize: boolean | { minRows: number, maxRows: number }, onStart: function, onChange: function(string), onCancel: function, onEnd: function, triggerType: ('icon' | 'text')[], } \`\`\` | \u53C2\u6570 | \u8BF4\u660E | \u7C7B\u578B | \u9ED8\u8BA4\u503C | \u7248\u672C | | --- | --- | --- | --- | --- | | autoSize | \u81EA\u52A8 resize \u6587\u672C\u57DF | boolean \\| { minRows: number, maxRows: number } | - | | | editing | \u63A7\u5236\u662F\u5426\u662F\u7F16\u8F91\u4E2D\u72B6\u6001 | boolean | false | | | maxlength | \u7F16\u8F91\u4E2D\u6587\u672C\u57DF\u6700\u5927\u957F\u5EA6 | number | - | | | tooltip | \u662F\u5426\u5C55\u793A\u63D0\u793A\u6587\u672C | boolean | true | | | triggerType | Edit mode trigger - icon, text or both (not specifying icon as trigger hides it) | Array&lt;\`icon\`\\|\`text\`> | \\[\`icon\`] | | | onCancel | \u6309 ESC \u9000\u51FA\u7F16\u8F91\u72B6\u6001\u65F6\u89E6\u53D1 | function | - | | | onChange | \u6587\u672C\u57DF\u7F16\u8F91\u65F6\u89E6\u53D1 | function(event) | - | | | onEnd | \u6309 ENTER \u7ED3\u675F\u7F16\u8F91\u72B6\u6001\u65F6\u89E6\u53D1 | function | - | | | onStart | \u8FDB\u5165\u7F16\u8F91\u4E2D\u72B6\u6001\u65F6\u89E6\u53D1 | function | - | | ### ellipsis \`\`\`json { rows: number, expandable: boolean, suffix: string, symbol: string, tooltip: boolean, onExpand: function(event), onEllipsis: function(ellipsis), } \`\`\` | \u53C2\u6570 | \u8BF4\u660E | \u7C7B\u578B | \u9ED8\u8BA4\u503C | \u7248\u672C | | ---------- | -------------------- | ------------------ | ------ | ---- | | expandable | \u662F\u5426\u53EF\u5C55\u5F00 | boolean | - | | | rows | \u6700\u591A\u663E\u793A\u7684\u884C\u6570 | number | - | | | suffix | \u81EA\u5B9A\u4E49\u7701\u7565\u5185\u5BB9\u540E\u7F00 | string | - | | | symbol | \u81EA\u5B9A\u4E49\u5C55\u5F00\u63CF\u8FF0\u6587\u6848 | string | \`\u5C55\u5F00\` | | | tooltip | \u7701\u7565\u65F6\uFF0C\u5C55\u793A\u63D0\u793A\u4FE1\u606F | boolean \\| string | - | | | onEllipsis | \u89E6\u53D1\u7701\u7565\u65F6\u7684\u56DE\u8C03 | function(ellipsis) | - | | | onExpand | \u70B9\u51FB\u5C55\u5F00\u65F6\u7684\u56DE\u8C03 | function(event) | - | | `,html:`

\u6587\u672C\u7684\u57FA\u672C\u683C\u5F0F\u3002

\u4F55\u65F6\u4F7F\u7528

API

Typography.Text

\u53C2\u6570 \u8BF4\u660E \u7C7B\u578B \u9ED8\u8BA4\u503C \u7248\u672C
code \u6DFB\u52A0\u4EE3\u7801\u6837\u5F0F boolean false
content(v-model) \u5F53\u4F7F\u7528 ellipsis \u6216 editable \u65F6\uFF0C\u4F7F\u7528 content \u4EE3\u66FF children string -
copyable \u662F\u5426\u53EF\u62F7\u8D1D\uFF0C\u4E3A\u5BF9\u8C61\u65F6\u53EF\u8FDB\u884C\u5404\u79CD\u81EA\u5B9A\u4E49 boolean | copyable false copyable
delete \u6DFB\u52A0\u5220\u9664\u7EBF\u6837\u5F0F boolean false
disabled \u7981\u7528\u6587\u672C boolean false
editable \u662F\u5426\u53EF\u7F16\u8F91\uFF0C\u4E3A\u5BF9\u8C61\u65F6\u53EF\u5BF9\u7F16\u8F91\u8FDB\u884C\u63A7\u5236 boolean | editable false editable
ellipsis \u81EA\u52A8\u6EA2\u51FA\u7701\u7565 boolean false
keyboard \u6DFB\u52A0\u952E\u76D8\u6837\u5F0F boolean false
mark \u6DFB\u52A0\u6807\u8BB0\u6837\u5F0F boolean false
strong \u662F\u5426\u52A0\u7C97 boolean false
type \u6587\u672C\u7C7B\u578B secondary | success | warning | danger -
underline \u6DFB\u52A0\u4E0B\u5212\u7EBF\u6837\u5F0F boolean false

Typography.Title

\u53C2\u6570 \u8BF4\u660E \u7C7B\u578B \u9ED8\u8BA4\u503C \u7248\u672C
code \u6DFB\u52A0\u4EE3\u7801\u6837\u5F0F boolean false
content(v-model) \u5F53\u4F7F\u7528 ellipsis \u6216 editable \u65F6\uFF0C\u4F7F\u7528 content \u4EE3\u66FF children string -
copyable \u662F\u5426\u53EF\u62F7\u8D1D\uFF0C\u4E3A\u5BF9\u8C61\u65F6\u53EF\u8FDB\u884C\u5404\u79CD\u81EA\u5B9A\u4E49 boolean | copyable false copyable
delete \u6DFB\u52A0\u5220\u9664\u7EBF\u6837\u5F0F boolean false
disabled \u7981\u7528\u6587\u672C boolean false
editable \u662F\u5426\u53EF\u7F16\u8F91\uFF0C\u4E3A\u5BF9\u8C61\u65F6\u53EF\u5BF9\u7F16\u8F91\u8FDB\u884C\u63A7\u5236 boolean | editable false editable
ellipsis \u81EA\u52A8\u6EA2\u51FA\u7701\u7565\uFF0C\u4E3A\u5BF9\u8C61\u65F6\u53EF\u8BBE\u7F6E\u7701\u7565\u884C\u6570\u3001\u662F\u5426\u53EF\u5C55\u5F00\u3001\u6DFB\u52A0\u540E\u7F00\u7B49 boolean | ellipsis false ellipsis
level \u91CD\u8981\u7A0B\u5EA6\uFF0C\u76F8\u5F53\u4E8E h1\u3001h2\u3001h3\u3001h4\u3001h5 number: 1, 2, 3, 4, 5 1
mark \u6DFB\u52A0\u6807\u8BB0\u6837\u5F0F boolean false
type \u6587\u672C\u7C7B\u578B secondary | success | warning | danger -
underline \u6DFB\u52A0\u4E0B\u5212\u7EBF\u6837\u5F0F boolean false

Typography.Paragraph

\u53C2\u6570 \u8BF4\u660E \u7C7B\u578B \u9ED8\u8BA4\u503C \u7248\u672C
code \u6DFB\u52A0\u4EE3\u7801\u6837\u5F0F boolean false
content(v-model) \u5F53\u4F7F\u7528 ellipsis \u6216 editable \u65F6\uFF0C\u4F7F\u7528 content \u4EE3\u66FF children string -
copyable \u662F\u5426\u53EF\u62F7\u8D1D\uFF0C\u4E3A\u5BF9\u8C61\u65F6\u53EF\u8FDB\u884C\u5404\u79CD\u81EA\u5B9A\u4E49 boolean | copyable false copyable
delete \u6DFB\u52A0\u5220\u9664\u7EBF\u6837\u5F0F boolean false
disabled \u7981\u7528\u6587\u672C boolean false
editable \u662F\u5426\u53EF\u7F16\u8F91\uFF0C\u4E3A\u5BF9\u8C61\u65F6\u53EF\u5BF9\u7F16\u8F91\u8FDB\u884C\u63A7\u5236 boolean | editable false editable
ellipsis \u81EA\u52A8\u6EA2\u51FA\u7701\u7565\uFF0C\u4E3A\u5BF9\u8C61\u65F6\u53EF\u8BBE\u7F6E\u7701\u7565\u884C\u6570\u3001\u662F\u5426\u53EF\u5C55\u5F00\u3001\u6DFB\u52A0\u540E\u7F00\u7B49 boolean | ellipsis false ellipsis
mark \u6DFB\u52A0\u6807\u8BB0\u6837\u5F0F boolean false
strong \u662F\u5426\u52A0\u7C97 boolean false
type \u6587\u672C\u7C7B\u578B secondary | success | warning | danger -
underline \u6DFB\u52A0\u4E0B\u5212\u7EBF\u6837\u5F0F boolean false

slots

\u540D\u79F0 \u8BF4\u660E \u53C2\u6570 \u9ED8\u8BA4\u503C \u7248\u672C
copyableIcon \u81EA\u5B9A\u4E49\u62F7\u8D1D\u56FE\u6807 { copied: boolean } copied ? <CheckOutlined /> : <CopyOutlined />
copyableTooltip \u81EA\u5B9A\u4E49\u63D0\u793A\u6587\u6848\uFF0C\u5F53 copyable.tooltip = false \u65F6\u5173\u95ED { copied: boolean } copied ? '\u590D\u5236\u6210\u529F' : '\u590D\u5236'
editableIcon \u81EA\u5B9A\u4E49\u7F16\u8F91\u56FE\u6807 - <EditOutlined />
editableTooltip \u81EA\u5B9A\u4E49\u63D0\u793A\u6587\u672C\uFF0C\u5F53 editable.tooltip = false \u65F6\u5173\u95ED - \u7F16\u8F91
ellipsisSymbol \u81EA\u5B9A\u4E49\u5C55\u5F00\u63CF\u8FF0\u6587\u6848 - -
ellipsisTooltip \u7701\u7565\u65F6\uFF0C\u5C55\u793A\u63D0\u793A\u4FE1\u606F - -
enterEnterIcon \u5728\u7F16\u8F91\u6BB5\u4E2D\u81EA\u5B9A\u4E49\u201Center\u201D\u56FE\u6807 {className: string} <EnterOutlined /> 3.0

copyable

  {
    text: string,
    onCopy: function,
    tooltip: false,
  }
\u53C2\u6570 \u8BF4\u660E \u7C7B\u578B \u9ED8\u8BA4\u503C \u7248\u672C
text \u62F7\u8D1D\u5230\u526A\u5207\u677F\u91CC\u7684\u6587\u672C string -
tooltip \u662F\u5426\u5C55\u793A\u63D0\u793A\u6587\u672C boolean true
onCopy \u62F7\u8D1D\u6210\u529F\u7684\u56DE\u8C03\u51FD\u6570 function -

editable

  {
    tooltip: boolean,
    editing: boolean,
    maxlength: number,
    autoSize: boolean | { minRows: number, maxRows: number },
    onStart: function,
    onChange: function(string),
    onCancel: function,
    onEnd: function,
    triggerType: ('icon' | 'text')[],
  }
\u53C2\u6570 \u8BF4\u660E \u7C7B\u578B \u9ED8\u8BA4\u503C \u7248\u672C
autoSize \u81EA\u52A8 resize \u6587\u672C\u57DF boolean | { minRows: number, maxRows: number } -
editing \u63A7\u5236\u662F\u5426\u662F\u7F16\u8F91\u4E2D\u72B6\u6001 boolean false
maxlength \u7F16\u8F91\u4E2D\u6587\u672C\u57DF\u6700\u5927\u957F\u5EA6 number -
tooltip \u662F\u5426\u5C55\u793A\u63D0\u793A\u6587\u672C boolean true
triggerType Edit mode trigger - icon, text or both (not specifying icon as trigger hides it) Array<icon|text> [icon]
onCancel \u6309 ESC \u9000\u51FA\u7F16\u8F91\u72B6\u6001\u65F6\u89E6\u53D1 function -
onChange \u6587\u672C\u57DF\u7F16\u8F91\u65F6\u89E6\u53D1 function(event) -
onEnd \u6309 ENTER \u7ED3\u675F\u7F16\u8F91\u72B6\u6001\u65F6\u89E6\u53D1 function -
onStart \u8FDB\u5165\u7F16\u8F91\u4E2D\u72B6\u6001\u65F6\u89E6\u53D1 function -

ellipsis

  {
    rows: number,
    expandable: boolean,
    suffix: string,
    symbol: string,
    tooltip: boolean,
    onExpand: function(event),
    onEllipsis: function(ellipsis),
  }
\u53C2\u6570 \u8BF4\u660E \u7C7B\u578B \u9ED8\u8BA4\u503C \u7248\u672C
expandable \u662F\u5426\u53EF\u5C55\u5F00 boolean -
rows \u6700\u591A\u663E\u793A\u7684\u884C\u6570 number -
suffix \u81EA\u5B9A\u4E49\u7701\u7565\u5185\u5BB9\u540E\u7F00 string -
symbol \u81EA\u5B9A\u4E49\u5C55\u5F00\u63CF\u8FF0\u6587\u6848 string \u5C55\u5F00
tooltip \u7701\u7565\u65F6\uFF0C\u5C55\u793A\u63D0\u793A\u4FE1\u606F boolean | string -
onEllipsis \u89E6\u53D1\u7701\u7565\u65F6\u7684\u56DE\u8C03 function(ellipsis) -
onExpand \u70B9\u51FB\u5C55\u5F00\u65F6\u7684\u56DE\u8C03 function(event) -
`,lastUpdated:1748060301502}},st={class:"markdown"};function et(o,a,l,k,g,I){return r(),Z("article",st,a[0]||(a[0]=[f(`

\u6587\u672C\u7684\u57FA\u672C\u683C\u5F0F\u3002

\u4F55\u65F6\u4F7F\u7528

API

Typography.Text

\u53C2\u6570\u8BF4\u660E\u7C7B\u578B\u9ED8\u8BA4\u503C\u7248\u672C
code\u6DFB\u52A0\u4EE3\u7801\u6837\u5F0Fbooleanfalse
content(v-model)\u5F53\u4F7F\u7528 ellipsis \u6216 editable \u65F6\uFF0C\u4F7F\u7528 content \u4EE3\u66FF childrenstring-
copyable\u662F\u5426\u53EF\u62F7\u8D1D\uFF0C\u4E3A\u5BF9\u8C61\u65F6\u53EF\u8FDB\u884C\u5404\u79CD\u81EA\u5B9A\u4E49boolean | copyablefalsecopyable
delete\u6DFB\u52A0\u5220\u9664\u7EBF\u6837\u5F0Fbooleanfalse
disabled\u7981\u7528\u6587\u672Cbooleanfalse
editable\u662F\u5426\u53EF\u7F16\u8F91\uFF0C\u4E3A\u5BF9\u8C61\u65F6\u53EF\u5BF9\u7F16\u8F91\u8FDB\u884C\u63A7\u5236boolean | editablefalseeditable
ellipsis\u81EA\u52A8\u6EA2\u51FA\u7701\u7565booleanfalse
keyboard\u6DFB\u52A0\u952E\u76D8\u6837\u5F0Fbooleanfalse
mark\u6DFB\u52A0\u6807\u8BB0\u6837\u5F0Fbooleanfalse
strong\u662F\u5426\u52A0\u7C97booleanfalse
type\u6587\u672C\u7C7B\u578Bsecondary | success | warning | danger-
underline\u6DFB\u52A0\u4E0B\u5212\u7EBF\u6837\u5F0Fbooleanfalse

Typography.Title

\u53C2\u6570\u8BF4\u660E\u7C7B\u578B\u9ED8\u8BA4\u503C\u7248\u672C
code\u6DFB\u52A0\u4EE3\u7801\u6837\u5F0Fbooleanfalse
content(v-model)\u5F53\u4F7F\u7528 ellipsis \u6216 editable \u65F6\uFF0C\u4F7F\u7528 content \u4EE3\u66FF childrenstring-
copyable\u662F\u5426\u53EF\u62F7\u8D1D\uFF0C\u4E3A\u5BF9\u8C61\u65F6\u53EF\u8FDB\u884C\u5404\u79CD\u81EA\u5B9A\u4E49boolean | copyablefalsecopyable
delete\u6DFB\u52A0\u5220\u9664\u7EBF\u6837\u5F0Fbooleanfalse
disabled\u7981\u7528\u6587\u672Cbooleanfalse
editable\u662F\u5426\u53EF\u7F16\u8F91\uFF0C\u4E3A\u5BF9\u8C61\u65F6\u53EF\u5BF9\u7F16\u8F91\u8FDB\u884C\u63A7\u5236boolean | editablefalseeditable
ellipsis\u81EA\u52A8\u6EA2\u51FA\u7701\u7565\uFF0C\u4E3A\u5BF9\u8C61\u65F6\u53EF\u8BBE\u7F6E\u7701\u7565\u884C\u6570\u3001\u662F\u5426\u53EF\u5C55\u5F00\u3001\u6DFB\u52A0\u540E\u7F00\u7B49boolean | ellipsisfalseellipsis
level\u91CD\u8981\u7A0B\u5EA6\uFF0C\u76F8\u5F53\u4E8E h1\u3001h2\u3001h3\u3001h4\u3001h5number: 1, 2, 3, 4, 51
mark\u6DFB\u52A0\u6807\u8BB0\u6837\u5F0Fbooleanfalse
type\u6587\u672C\u7C7B\u578Bsecondary | success | warning | danger-
underline\u6DFB\u52A0\u4E0B\u5212\u7EBF\u6837\u5F0Fbooleanfalse

Typography.Paragraph

\u53C2\u6570\u8BF4\u660E\u7C7B\u578B\u9ED8\u8BA4\u503C\u7248\u672C
code\u6DFB\u52A0\u4EE3\u7801\u6837\u5F0Fbooleanfalse
content(v-model)\u5F53\u4F7F\u7528 ellipsis \u6216 editable \u65F6\uFF0C\u4F7F\u7528 content \u4EE3\u66FF childrenstring-
copyable\u662F\u5426\u53EF\u62F7\u8D1D\uFF0C\u4E3A\u5BF9\u8C61\u65F6\u53EF\u8FDB\u884C\u5404\u79CD\u81EA\u5B9A\u4E49boolean | copyablefalsecopyable
delete\u6DFB\u52A0\u5220\u9664\u7EBF\u6837\u5F0Fbooleanfalse
disabled\u7981\u7528\u6587\u672Cbooleanfalse
editable\u662F\u5426\u53EF\u7F16\u8F91\uFF0C\u4E3A\u5BF9\u8C61\u65F6\u53EF\u5BF9\u7F16\u8F91\u8FDB\u884C\u63A7\u5236boolean | editablefalseeditable
ellipsis\u81EA\u52A8\u6EA2\u51FA\u7701\u7565\uFF0C\u4E3A\u5BF9\u8C61\u65F6\u53EF\u8BBE\u7F6E\u7701\u7565\u884C\u6570\u3001\u662F\u5426\u53EF\u5C55\u5F00\u3001\u6DFB\u52A0\u540E\u7F00\u7B49boolean | ellipsisfalseellipsis
mark\u6DFB\u52A0\u6807\u8BB0\u6837\u5F0Fbooleanfalse
strong\u662F\u5426\u52A0\u7C97booleanfalse
type\u6587\u672C\u7C7B\u578Bsecondary | success | warning | danger-
underline\u6DFB\u52A0\u4E0B\u5212\u7EBF\u6837\u5F0Fbooleanfalse

slots

\u540D\u79F0\u8BF4\u660E\u53C2\u6570\u9ED8\u8BA4\u503C\u7248\u672C
copyableIcon\u81EA\u5B9A\u4E49\u62F7\u8D1D\u56FE\u6807{ copied: boolean }copied ? <CheckOutlined /> : <CopyOutlined />
copyableTooltip\u81EA\u5B9A\u4E49\u63D0\u793A\u6587\u6848\uFF0C\u5F53 copyable.tooltip = false \u65F6\u5173\u95ED{ copied: boolean }copied ? '\u590D\u5236\u6210\u529F' : '\u590D\u5236'
editableIcon\u81EA\u5B9A\u4E49\u7F16\u8F91\u56FE\u6807-<EditOutlined />
editableTooltip\u81EA\u5B9A\u4E49\u63D0\u793A\u6587\u672C\uFF0C\u5F53 editable.tooltip = false \u65F6\u5173\u95ED-\u7F16\u8F91
ellipsisSymbol\u81EA\u5B9A\u4E49\u5C55\u5F00\u63CF\u8FF0\u6587\u6848--
ellipsisTooltip\u7701\u7565\u65F6\uFF0C\u5C55\u793A\u63D0\u793A\u4FE1\u606F--
enterEnterIcon\u5728\u7F16\u8F91\u6BB5\u4E2D\u81EA\u5B9A\u4E49\u201Center\u201D\u56FE\u6807{className: string}<EnterOutlined />3.0

copyable

  {
    text: string,
    onCopy: function,
    tooltip: false,
  }
\u53C2\u6570\u8BF4\u660E\u7C7B\u578B\u9ED8\u8BA4\u503C\u7248\u672C
text\u62F7\u8D1D\u5230\u526A\u5207\u677F\u91CC\u7684\u6587\u672Cstring-
tooltip\u662F\u5426\u5C55\u793A\u63D0\u793A\u6587\u672Cbooleantrue
onCopy\u62F7\u8D1D\u6210\u529F\u7684\u56DE\u8C03\u51FD\u6570function-

editable

  {
    tooltip: boolean,
    editing: boolean,
    maxlength: number,
    autoSize: boolean | { minRows: number, maxRows: number },
    onStart: function,
    onChange: function(string),
    onCancel: function,
    onEnd: function,
    triggerType: ('icon' | 'text')[],
  }
\u53C2\u6570\u8BF4\u660E\u7C7B\u578B\u9ED8\u8BA4\u503C\u7248\u672C
autoSize\u81EA\u52A8 resize \u6587\u672C\u57DFboolean | { minRows: number, maxRows: number }-
editing\u63A7\u5236\u662F\u5426\u662F\u7F16\u8F91\u4E2D\u72B6\u6001booleanfalse
maxlength\u7F16\u8F91\u4E2D\u6587\u672C\u57DF\u6700\u5927\u957F\u5EA6number-
tooltip\u662F\u5426\u5C55\u793A\u63D0\u793A\u6587\u672Cbooleantrue
triggerTypeEdit mode trigger - icon, text or both (not specifying icon as trigger hides it)Array<icon|text>[icon]
onCancel\u6309 ESC \u9000\u51FA\u7F16\u8F91\u72B6\u6001\u65F6\u89E6\u53D1function-
onChange\u6587\u672C\u57DF\u7F16\u8F91\u65F6\u89E6\u53D1function(event)-
onEnd\u6309 ENTER \u7ED3\u675F\u7F16\u8F91\u72B6\u6001\u65F6\u89E6\u53D1function-
onStart\u8FDB\u5165\u7F16\u8F91\u4E2D\u72B6\u6001\u65F6\u89E6\u53D1function-

ellipsis

  {
    rows: number,
    expandable: boolean,
    suffix: string,
    symbol: string,
    tooltip: boolean,
    onExpand: function(event),
    onEllipsis: function(ellipsis),
  }
\u53C2\u6570\u8BF4\u660E\u7C7B\u578B\u9ED8\u8BA4\u503C\u7248\u672C
expandable\u662F\u5426\u53EF\u5C55\u5F00boolean-
rows\u6700\u591A\u663E\u793A\u7684\u884C\u6570number-
suffix\u81EA\u5B9A\u4E49\u7701\u7565\u5185\u5BB9\u540E\u7F00string-
symbol\u81EA\u5B9A\u4E49\u5C55\u5F00\u63CF\u8FF0\u6587\u6848string\u5C55\u5F00
tooltip\u7701\u7565\u65F6\uFF0C\u5C55\u793A\u63D0\u793A\u4FE1\u606Fboolean | string-
onEllipsis\u89E6\u53D1\u7701\u7565\u65F6\u7684\u56DE\u8C03function(ellipsis)-
onExpand\u70B9\u51FB\u5C55\u5F00\u65F6\u7684\u56DE\u8C03function(event)-
`,21)]))}const ot=m(at,[["render",et]]),pt={pageData:{title:"Typography",description:"",frontmatter:{category:"Components",type:"General",title:"Typography",cols:1,cover:"https://gw.alipayobjects.com/zos/alicdn/GOM1KQ24O/Typography.svg"},headers:[{level:2,title:"When To Use",slug:"When-To-Use",content:""},{level:2,title:"API",slug:"API",content:"Typography.Text"},{level:3,title:"Typography.Text",slug:"Typography-Text",content:""},{level:3,title:"Typography.Title",slug:"Typography-Title",content:""},{level:3,title:"Typography.Paragraph",slug:"Typography-Paragraph",content:""},{level:3,title:"slots",slug:"slots",content:""},{level:3,title:"copyable",slug:"copyable",content:""},{level:3,title:"editable",slug:"editable",content:""},{level:3,title:"ellipsis",slug:"ellipsis",content:""}],relativePath:"components/typography/index.en-US.md",content:` Basic text writing, including headings, body text, lists, and more. ## When To Use - When need to display a title or paragraph contents in Articles/Blogs/Notes. - When you need copyable/editable/ellipsis texts. ## API ### Typography.Text | Property | Description | Type | Default | Version | | --- | --- | --- | --- | --- | | code | Code style | boolean | false | | | content(v-model) | When using ellipsis or editable, use content instead of children | string | - | | | copyable | Whether to be copyable, customize it via setting an object | boolean \\| [copyable](#copyable) | false | [copyable](#copyable) | | delete | Deleted line style | boolean | false | | | disabled | Disabled content | boolean | false | | | editable | If editable. Can control edit state when is object | boolean \\| [editable](#editable) | false | [editable](#editable) | | ellipsis | Display ellipsis when text overflows | boolean | false | | | keyboard | Keyboard style | boolean | false | | | mark | Marked style | boolean | false | | | strong | Bold style | boolean | false | | | type | Content type | \`secondary\` \\| \`success\` \\| \`warning\` \\| \`danger\` | - | | | underline | Underlined style | boolean | false | | ### Typography.Title | Property | Description | Type | Default | Version | | --- | --- | --- | --- | --- | | code | Code style | boolean | false | | | content(v-model) | When using ellipsis or editable, use content instead of children | string | - | | | copyable | Whether to be copyable, customize it via setting an object | boolean \\| [copyable](#copyable) | false | [copyable](#copyable) | | delete | Deleted line style | boolean | false | | | disabled | Disabled content | boolean | false | | | editable | If editable. Can control edit state when is object | boolean \\| [editable](#editable) | false | [editable](#editable) | | ellipsis | Display ellipsis when text overflows, can configure rows and expandable by using object | boolean \\| [ellipsis](#ellipsis) | false | [ellipsis](#ellipsis) | | level | Set content importance. Match with \`h1\`, \`h2\`, \`h3\`, \`h4\`, \`h5\` | number: 1, 2, 3, 4, 5 | 1 | | | mark | Marked style | boolean | false | | | type | Content type | \`secondary\` \\| \`success\` \\| \`warning\` \\| \`danger\` | - | | | underline | Underlined style | boolean | false | | ### Typography.Paragraph | Property | Description | Type | Default | Version | | --- | --- | --- | --- | --- | | code | Code style | boolean | false | | | content(v-model) | When using ellipsis or editable, use content instead of children | string | - | | | copyable | Whether to be copyable, customize it via setting an object | boolean \\| [copyable](#copyable) | false | [copyable](#copyable) | | delete | Deleted line style | boolean | false | | | disabled | Disabled content | boolean | false | | | editable | If editable. Can control edit state when is object | boolean \\| [editable](#editable) | false | [editable](#editable) | | ellipsis | Display ellipsis when text overflows, can configure rows and expandable by using object | boolean \\| [ellipsis](#ellipsis) | false | [ellipsis](#ellipsis) | | mark | Marked style | boolean | false | | | strong | Bold style | boolean | false | | | type | Content type | \`secondary\` \\| \`success\` \\| \`warning\` \\| \`danger\` | - | | | underline | Underlined style | boolean | false | | ### slots | Name | Description | Property | Default | Version | | --- | --- | --- | --- | --- | | copyableIcon | Custom copy icon | \`{ copied: boolean }\` | \`copied ? <CheckOutlined /> : <CopyOutlined />\` | | | copyableTooltip | Custom tooltip text, hide when \`copyable.tooltip = false\` | \`{ copied: boolean }\` | \`copied ? 'Copied' : 'Copy'\` | | | editableEnterIcon | Custom "enter" icon in the edit field | \`{className: string}\` | \`<EnterOutlined />\` | 3.0 | | editableIcon | Custom editable icon | - | &lt;EditOutlined /> | | | editableTooltip | Custom tooltip text, hide when \`editable.tooltip = false\` | - | \`Edit\` | | | ellipsisSymbol | Custom description of ellipsis | - | - | | | ellipsisTooltip | Show tooltip when ellipsis | - | - | | ### copyable \`\`\`json { text: string, onCopy: function, tooltip: false, } \`\`\` | Property | Description | Type | Default | Version | | -------- | ----------------------- | -------- | ------- | ------- | | text | The text to copy | string | - | | | tooltip | Whether to show tooltip | boolean | true | | | onCopy | Called when copied text | function | - | | ### editable \`\`\`json { tooltip: boolean, editing: boolean, maxlength: number, autoSize: boolean | { minRows: number, maxRows: number }, onStart: function, onChange: function(string), onCancel: function, onEnd: function, triggerType: ('icon' | 'text')[], } \`\`\` | Property | Description | Type | Default | Version | | --- | --- | --- | --- | --- | | autoSize | \`autoSize\` attribute of textarea | boolean \\| { minRows: number, maxRows: number } | - | | | editing | Whether to be editable | boolean | false | | | maxlength | \`maxlength\` attribute of textarea | number | - | | | tooltip | Whether to show tooltip | boolean | true | | | triggerType | Edit mode trigger - icon, text or both (not specifying icon as trigger hides it) | Array&lt;\`icon\`\\|\`text\`> | \\[\`icon\`] | | | onCancel | Called when type ESC to exit editable state | function | - | | | onChange | Called when input at textarea | function(event) | - | | | onEnd | Called when type ENTER to exit editable state | function | - | | | onStart | Called when enter editable state | function | - | | ### ellipsis \`\`\`json { rows: number, expandable: boolean, suffix: string, symbol: string, tooltip: boolean | string, onExpand: function(event), onEllipsis: function(ellipsis), } \`\`\` | Property | Description | Type | Default | Version | | ---------- | ----------------------------------------- | ------------------ | -------- | ------- | | expandable | Whether to be expandable | boolean | - | | | rows | Max rows of content | number | - | | | suffix | Suffix of ellipsis content | string | - | | | symbol | Custom description of ellipsis | string | \`Expand\` | | | tooltip | Show tooltip when ellipsis | boolean \\| string | - | | | onEllipsis | Called when enter or leave ellipsis state | function(ellipsis) | - | | | onExpand | Called when expand content | function(event) | - | | `,html:`

Basic text writing, including headings, body text, lists, and more.

When To Use

API

Typography.Text

Property Description Type Default Version
code Code style boolean false
content(v-model) When using ellipsis or editable, use content instead of children string -
copyable Whether to be copyable, customize it via setting an object boolean | copyable false copyable
delete Deleted line style boolean false
disabled Disabled content boolean false
editable If editable. Can control edit state when is object boolean | editable false editable
ellipsis Display ellipsis when text overflows boolean false
keyboard Keyboard style boolean false
mark Marked style boolean false
strong Bold style boolean false
type Content type secondary | success | warning | danger -
underline Underlined style boolean false

Typography.Title

Property Description Type Default Version
code Code style boolean false
content(v-model) When using ellipsis or editable, use content instead of children string -
copyable Whether to be copyable, customize it via setting an object boolean | copyable false copyable
delete Deleted line style boolean false
disabled Disabled content boolean false
editable If editable. Can control edit state when is object boolean | editable false editable
ellipsis Display ellipsis when text overflows, can configure rows and expandable by using object boolean | ellipsis false ellipsis
level Set content importance. Match with h1, h2, h3, h4, h5 number: 1, 2, 3, 4, 5 1
mark Marked style boolean false
type Content type secondary | success | warning | danger -
underline Underlined style boolean false

Typography.Paragraph

Property Description Type Default Version
code Code style boolean false
content(v-model) When using ellipsis or editable, use content instead of children string -
copyable Whether to be copyable, customize it via setting an object boolean | copyable false copyable
delete Deleted line style boolean false
disabled Disabled content boolean false
editable If editable. Can control edit state when is object boolean | editable false editable
ellipsis Display ellipsis when text overflows, can configure rows and expandable by using object boolean | ellipsis false ellipsis
mark Marked style boolean false
strong Bold style boolean false
type Content type secondary | success | warning | danger -
underline Underlined style boolean false

slots

Name Description Property Default Version
copyableIcon Custom copy icon { copied: boolean } copied ? <CheckOutlined /> : <CopyOutlined />
copyableTooltip Custom tooltip text, hide when copyable.tooltip = false { copied: boolean } copied ? 'Copied' : 'Copy'
editableEnterIcon Custom "enter" icon in the edit field {className: string} <EnterOutlined /> 3.0
editableIcon Custom editable icon - <EditOutlined />
editableTooltip Custom tooltip text, hide when editable.tooltip = false - Edit
ellipsisSymbol Custom description of ellipsis - -
ellipsisTooltip Show tooltip when ellipsis - -

copyable

  {
    text: string,
    onCopy: function,
    tooltip: false,
  }
Property Description Type Default Version
text The text to copy string -
tooltip Whether to show tooltip boolean true
onCopy Called when copied text function -

editable

  {
    tooltip: boolean,
    editing: boolean,
    maxlength: number,
    autoSize: boolean | { minRows: number, maxRows: number },
    onStart: function,
    onChange: function(string),
    onCancel: function,
    onEnd: function,
    triggerType: ('icon' | 'text')[],
  }
Property Description Type Default Version
autoSize autoSize attribute of textarea boolean | { minRows: number, maxRows: number } -
editing Whether to be editable boolean false
maxlength maxlength attribute of textarea number -
tooltip Whether to show tooltip boolean true
triggerType Edit mode trigger - icon, text or both (not specifying icon as trigger hides it) Array<icon|text> [icon]
onCancel Called when type ESC to exit editable state function -
onChange Called when input at textarea function(event) -
onEnd Called when type ENTER to exit editable state function -
onStart Called when enter editable state function -

ellipsis

  {
    rows: number,
    expandable: boolean,
    suffix: string,
    symbol: string,
    tooltip: boolean | string,
    onExpand: function(event),
    onEllipsis: function(ellipsis),
  }
Property Description Type Default Version
expandable Whether to be expandable boolean -
rows Max rows of content number -
suffix Suffix of ellipsis content string -
symbol Custom description of ellipsis string Expand
tooltip Show tooltip when ellipsis boolean | string -
onEllipsis Called when enter or leave ellipsis state function(ellipsis) -
onExpand Called when expand content function(event) -
`,lastUpdated:1748060301502}},lt={class:"markdown"};function ct(o,a,l,k,g,I){return r(),Z("article",lt,a[0]||(a[0]=[f(`

Basic text writing, including headings, body text, lists, and more.

When To Use

API

Typography.Text

PropertyDescriptionTypeDefaultVersion
codeCode stylebooleanfalse
content(v-model)When using ellipsis or editable, use content instead of childrenstring-
copyableWhether to be copyable, customize it via setting an objectboolean | copyablefalsecopyable
deleteDeleted line stylebooleanfalse
disabledDisabled contentbooleanfalse
editableIf editable. Can control edit state when is objectboolean | editablefalseeditable
ellipsisDisplay ellipsis when text overflowsbooleanfalse
keyboardKeyboard stylebooleanfalse
markMarked stylebooleanfalse
strongBold stylebooleanfalse
typeContent typesecondary | success | warning | danger-
underlineUnderlined stylebooleanfalse

Typography.Title

PropertyDescriptionTypeDefaultVersion
codeCode stylebooleanfalse
content(v-model)When using ellipsis or editable, use content instead of childrenstring-
copyableWhether to be copyable, customize it via setting an objectboolean | copyablefalsecopyable
deleteDeleted line stylebooleanfalse
disabledDisabled contentbooleanfalse
editableIf editable. Can control edit state when is objectboolean | editablefalseeditable
ellipsisDisplay ellipsis when text overflows, can configure rows and expandable by using objectboolean | ellipsisfalseellipsis
levelSet content importance. Match with h1, h2, h3, h4, h5number: 1, 2, 3, 4, 51
markMarked stylebooleanfalse
typeContent typesecondary | success | warning | danger-
underlineUnderlined stylebooleanfalse

Typography.Paragraph

PropertyDescriptionTypeDefaultVersion
codeCode stylebooleanfalse
content(v-model)When using ellipsis or editable, use content instead of childrenstring-
copyableWhether to be copyable, customize it via setting an objectboolean | copyablefalsecopyable
deleteDeleted line stylebooleanfalse
disabledDisabled contentbooleanfalse
editableIf editable. Can control edit state when is objectboolean | editablefalseeditable
ellipsisDisplay ellipsis when text overflows, can configure rows and expandable by using objectboolean | ellipsisfalseellipsis
markMarked stylebooleanfalse
strongBold stylebooleanfalse
typeContent typesecondary | success | warning | danger-
underlineUnderlined stylebooleanfalse

slots

NameDescriptionPropertyDefaultVersion
copyableIconCustom copy icon{ copied: boolean }copied ? <CheckOutlined /> : <CopyOutlined />
copyableTooltipCustom tooltip text, hide when copyable.tooltip = false{ copied: boolean }copied ? 'Copied' : 'Copy'
editableEnterIconCustom "enter" icon in the edit field{className: string}<EnterOutlined />3.0
editableIconCustom editable icon-<EditOutlined />
editableTooltipCustom tooltip text, hide when editable.tooltip = false-Edit
ellipsisSymbolCustom description of ellipsis--
ellipsisTooltipShow tooltip when ellipsis--

copyable

  {
    text: string,
    onCopy: function,
    tooltip: false,
  }
PropertyDescriptionTypeDefaultVersion
textThe text to copystring-
tooltipWhether to show tooltipbooleantrue
onCopyCalled when copied textfunction-

editable

  {
    tooltip: boolean,
    editing: boolean,
    maxlength: number,
    autoSize: boolean | { minRows: number, maxRows: number },
    onStart: function,
    onChange: function(string),
    onCancel: function,
    onEnd: function,
    triggerType: ('icon' | 'text')[],
  }
PropertyDescriptionTypeDefaultVersion
autoSizeautoSize attribute of textareaboolean | { minRows: number, maxRows: number }-
editingWhether to be editablebooleanfalse
maxlengthmaxlength attribute of textareanumber-
tooltipWhether to show tooltipbooleantrue
triggerTypeEdit mode trigger - icon, text or both (not specifying icon as trigger hides it)Array<icon|text>[icon]
onCancelCalled when type ESC to exit editable statefunction-
onChangeCalled when input at textareafunction(event)-
onEndCalled when type ENTER to exit editable statefunction-
onStartCalled when enter editable statefunction-

ellipsis

  {
    rows: number,
    expandable: boolean,
    suffix: string,
    symbol: string,
    tooltip: boolean | string,
    onExpand: function(event),
    onEllipsis: function(ellipsis),
  }
PropertyDescriptionTypeDefaultVersion
expandableWhether to be expandableboolean-
rowsMax rows of contentnumber-
suffixSuffix of ellipsis contentstring-
symbolCustom description of ellipsisstringExpand
tooltipShow tooltip when ellipsisboolean | string-
onEllipsisCalled when enter or leave ellipsis statefunction(ellipsis)-
onExpandCalled when expand contentfunction(event)-
`,21)]))}const ut=m(pt,[["render",ct]]),dt=B({CN:ot,US:ut,components:{Basic:H,Ellipsis:j,Interactive:U,Text:M,Suffix:Q,Titlt:nt},setup(){return{}}});function it(o,a,l,k,g,I){const c=p("Basic"),u=p("Ellipsis"),i=p("Interactive"),h=p("Text"),C=p("Suffix"),A=p("Titlt"),G=p("demo-sort");return r(),y(G,{cols:1},{default:s(()=>[e(c),e(u),e(i),e(h),e(C),e(A)]),_:1})}const ht=m(dt,[["render",it]]);export{ht as default};