@element-plus/nightly 0.0.20231009 → 0.0.20231011

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (376) hide show
  1. package/attributes.json +1 -1
  2. package/dist/index.css +1 -1
  3. package/dist/index.full.js +1016 -538
  4. package/dist/index.full.min.js +25 -25
  5. package/dist/index.full.min.js.map +1 -1
  6. package/dist/index.full.min.mjs +23 -23
  7. package/dist/index.full.min.mjs.map +1 -1
  8. package/dist/index.full.mjs +1016 -538
  9. package/dist/locale/af.js +1 -1
  10. package/dist/locale/af.min.js +1 -1
  11. package/dist/locale/af.min.mjs +1 -1
  12. package/dist/locale/af.mjs +1 -1
  13. package/dist/locale/ar.js +1 -1
  14. package/dist/locale/ar.min.js +1 -1
  15. package/dist/locale/ar.min.mjs +1 -1
  16. package/dist/locale/ar.mjs +1 -1
  17. package/dist/locale/az.js +1 -1
  18. package/dist/locale/az.min.js +1 -1
  19. package/dist/locale/az.min.mjs +1 -1
  20. package/dist/locale/az.mjs +1 -1
  21. package/dist/locale/bg.js +1 -1
  22. package/dist/locale/bg.min.js +1 -1
  23. package/dist/locale/bg.min.mjs +1 -1
  24. package/dist/locale/bg.mjs +1 -1
  25. package/dist/locale/bn.js +1 -1
  26. package/dist/locale/bn.min.js +1 -1
  27. package/dist/locale/bn.min.mjs +1 -1
  28. package/dist/locale/bn.mjs +1 -1
  29. package/dist/locale/ca.js +1 -1
  30. package/dist/locale/ca.min.js +1 -1
  31. package/dist/locale/ca.min.mjs +1 -1
  32. package/dist/locale/ca.mjs +1 -1
  33. package/dist/locale/ckb.js +1 -1
  34. package/dist/locale/ckb.min.js +1 -1
  35. package/dist/locale/ckb.min.mjs +1 -1
  36. package/dist/locale/ckb.mjs +1 -1
  37. package/dist/locale/cs.js +1 -1
  38. package/dist/locale/cs.min.js +1 -1
  39. package/dist/locale/cs.min.mjs +1 -1
  40. package/dist/locale/cs.mjs +1 -1
  41. package/dist/locale/da.js +1 -1
  42. package/dist/locale/da.min.js +1 -1
  43. package/dist/locale/da.min.mjs +1 -1
  44. package/dist/locale/da.mjs +1 -1
  45. package/dist/locale/de.js +1 -1
  46. package/dist/locale/de.min.js +1 -1
  47. package/dist/locale/de.min.mjs +1 -1
  48. package/dist/locale/de.mjs +1 -1
  49. package/dist/locale/el.js +1 -1
  50. package/dist/locale/el.min.js +1 -1
  51. package/dist/locale/el.min.mjs +1 -1
  52. package/dist/locale/el.mjs +1 -1
  53. package/dist/locale/en.js +1 -1
  54. package/dist/locale/en.min.js +1 -1
  55. package/dist/locale/en.min.mjs +1 -1
  56. package/dist/locale/en.mjs +1 -1
  57. package/dist/locale/eo.js +1 -1
  58. package/dist/locale/eo.min.js +1 -1
  59. package/dist/locale/eo.min.mjs +1 -1
  60. package/dist/locale/eo.mjs +1 -1
  61. package/dist/locale/es.js +1 -1
  62. package/dist/locale/es.min.js +1 -1
  63. package/dist/locale/es.min.mjs +1 -1
  64. package/dist/locale/es.mjs +1 -1
  65. package/dist/locale/et.js +1 -1
  66. package/dist/locale/et.min.js +1 -1
  67. package/dist/locale/et.min.mjs +1 -1
  68. package/dist/locale/et.mjs +1 -1
  69. package/dist/locale/eu.js +1 -1
  70. package/dist/locale/eu.min.js +1 -1
  71. package/dist/locale/eu.min.mjs +1 -1
  72. package/dist/locale/eu.mjs +1 -1
  73. package/dist/locale/fa.js +1 -1
  74. package/dist/locale/fa.min.js +1 -1
  75. package/dist/locale/fa.min.mjs +1 -1
  76. package/dist/locale/fa.mjs +1 -1
  77. package/dist/locale/fi.js +1 -1
  78. package/dist/locale/fi.min.js +1 -1
  79. package/dist/locale/fi.min.mjs +1 -1
  80. package/dist/locale/fi.mjs +1 -1
  81. package/dist/locale/fr.js +1 -1
  82. package/dist/locale/fr.min.js +1 -1
  83. package/dist/locale/fr.min.mjs +1 -1
  84. package/dist/locale/fr.mjs +1 -1
  85. package/dist/locale/he.js +1 -1
  86. package/dist/locale/he.min.js +1 -1
  87. package/dist/locale/he.min.mjs +1 -1
  88. package/dist/locale/he.mjs +1 -1
  89. package/dist/locale/hr.js +1 -1
  90. package/dist/locale/hr.min.js +1 -1
  91. package/dist/locale/hr.min.mjs +1 -1
  92. package/dist/locale/hr.mjs +1 -1
  93. package/dist/locale/hu.js +1 -1
  94. package/dist/locale/hu.min.js +1 -1
  95. package/dist/locale/hu.min.mjs +1 -1
  96. package/dist/locale/hu.mjs +1 -1
  97. package/dist/locale/hy-am.js +1 -1
  98. package/dist/locale/hy-am.min.js +1 -1
  99. package/dist/locale/hy-am.min.mjs +1 -1
  100. package/dist/locale/hy-am.mjs +1 -1
  101. package/dist/locale/id.js +1 -1
  102. package/dist/locale/id.min.js +1 -1
  103. package/dist/locale/id.min.mjs +1 -1
  104. package/dist/locale/id.mjs +1 -1
  105. package/dist/locale/it.js +1 -1
  106. package/dist/locale/it.min.js +1 -1
  107. package/dist/locale/it.min.mjs +1 -1
  108. package/dist/locale/it.mjs +1 -1
  109. package/dist/locale/ja.js +1 -1
  110. package/dist/locale/ja.min.js +1 -1
  111. package/dist/locale/ja.min.mjs +1 -1
  112. package/dist/locale/ja.mjs +1 -1
  113. package/dist/locale/kk.js +1 -1
  114. package/dist/locale/kk.min.js +1 -1
  115. package/dist/locale/kk.min.mjs +1 -1
  116. package/dist/locale/kk.mjs +1 -1
  117. package/dist/locale/km.js +1 -1
  118. package/dist/locale/km.min.js +1 -1
  119. package/dist/locale/km.min.mjs +1 -1
  120. package/dist/locale/km.mjs +1 -1
  121. package/dist/locale/ko.js +1 -1
  122. package/dist/locale/ko.min.js +1 -1
  123. package/dist/locale/ko.min.mjs +1 -1
  124. package/dist/locale/ko.mjs +1 -1
  125. package/dist/locale/ku.js +1 -1
  126. package/dist/locale/ku.min.js +1 -1
  127. package/dist/locale/ku.min.mjs +1 -1
  128. package/dist/locale/ku.mjs +1 -1
  129. package/dist/locale/ky.js +1 -1
  130. package/dist/locale/ky.min.js +1 -1
  131. package/dist/locale/ky.min.mjs +1 -1
  132. package/dist/locale/ky.mjs +1 -1
  133. package/dist/locale/lt.js +1 -1
  134. package/dist/locale/lt.min.js +1 -1
  135. package/dist/locale/lt.min.mjs +1 -1
  136. package/dist/locale/lt.mjs +1 -1
  137. package/dist/locale/lv.js +1 -1
  138. package/dist/locale/lv.min.js +1 -1
  139. package/dist/locale/lv.min.mjs +1 -1
  140. package/dist/locale/lv.mjs +1 -1
  141. package/dist/locale/mg.js +1 -1
  142. package/dist/locale/mg.min.js +1 -1
  143. package/dist/locale/mg.min.mjs +1 -1
  144. package/dist/locale/mg.mjs +1 -1
  145. package/dist/locale/mn.js +1 -1
  146. package/dist/locale/mn.min.js +1 -1
  147. package/dist/locale/mn.min.mjs +1 -1
  148. package/dist/locale/mn.mjs +1 -1
  149. package/dist/locale/nb-no.js +1 -1
  150. package/dist/locale/nb-no.min.js +1 -1
  151. package/dist/locale/nb-no.min.mjs +1 -1
  152. package/dist/locale/nb-no.mjs +1 -1
  153. package/dist/locale/nl.js +1 -1
  154. package/dist/locale/nl.min.js +1 -1
  155. package/dist/locale/nl.min.mjs +1 -1
  156. package/dist/locale/nl.mjs +1 -1
  157. package/dist/locale/pa.js +1 -1
  158. package/dist/locale/pa.min.js +1 -1
  159. package/dist/locale/pa.min.mjs +1 -1
  160. package/dist/locale/pa.mjs +1 -1
  161. package/dist/locale/pl.js +1 -1
  162. package/dist/locale/pl.min.js +1 -1
  163. package/dist/locale/pl.min.mjs +1 -1
  164. package/dist/locale/pl.mjs +1 -1
  165. package/dist/locale/pt-br.js +1 -1
  166. package/dist/locale/pt-br.min.js +1 -1
  167. package/dist/locale/pt-br.min.mjs +1 -1
  168. package/dist/locale/pt-br.mjs +1 -1
  169. package/dist/locale/pt.js +1 -1
  170. package/dist/locale/pt.min.js +1 -1
  171. package/dist/locale/pt.min.mjs +1 -1
  172. package/dist/locale/pt.mjs +1 -1
  173. package/dist/locale/ro.js +1 -1
  174. package/dist/locale/ro.min.js +1 -1
  175. package/dist/locale/ro.min.mjs +1 -1
  176. package/dist/locale/ro.mjs +1 -1
  177. package/dist/locale/ru.js +1 -1
  178. package/dist/locale/ru.min.js +1 -1
  179. package/dist/locale/ru.min.mjs +1 -1
  180. package/dist/locale/ru.mjs +1 -1
  181. package/dist/locale/sk.js +1 -1
  182. package/dist/locale/sk.min.js +1 -1
  183. package/dist/locale/sk.min.mjs +1 -1
  184. package/dist/locale/sk.mjs +1 -1
  185. package/dist/locale/sl.js +1 -1
  186. package/dist/locale/sl.min.js +1 -1
  187. package/dist/locale/sl.min.mjs +1 -1
  188. package/dist/locale/sl.mjs +1 -1
  189. package/dist/locale/sr.js +1 -1
  190. package/dist/locale/sr.min.js +1 -1
  191. package/dist/locale/sr.min.mjs +1 -1
  192. package/dist/locale/sr.mjs +1 -1
  193. package/dist/locale/sv.js +1 -1
  194. package/dist/locale/sv.min.js +1 -1
  195. package/dist/locale/sv.min.mjs +1 -1
  196. package/dist/locale/sv.mjs +1 -1
  197. package/dist/locale/ta.js +1 -1
  198. package/dist/locale/ta.min.js +1 -1
  199. package/dist/locale/ta.min.mjs +1 -1
  200. package/dist/locale/ta.mjs +1 -1
  201. package/dist/locale/th.js +1 -1
  202. package/dist/locale/th.min.js +1 -1
  203. package/dist/locale/th.min.mjs +1 -1
  204. package/dist/locale/th.mjs +1 -1
  205. package/dist/locale/tk.js +1 -1
  206. package/dist/locale/tk.min.js +1 -1
  207. package/dist/locale/tk.min.mjs +1 -1
  208. package/dist/locale/tk.mjs +1 -1
  209. package/dist/locale/tr.js +1 -1
  210. package/dist/locale/tr.min.js +1 -1
  211. package/dist/locale/tr.min.mjs +1 -1
  212. package/dist/locale/tr.mjs +1 -1
  213. package/dist/locale/ug-cn.js +1 -1
  214. package/dist/locale/ug-cn.min.js +1 -1
  215. package/dist/locale/ug-cn.min.mjs +1 -1
  216. package/dist/locale/ug-cn.mjs +1 -1
  217. package/dist/locale/uk.js +1 -1
  218. package/dist/locale/uk.min.js +1 -1
  219. package/dist/locale/uk.min.mjs +1 -1
  220. package/dist/locale/uk.mjs +1 -1
  221. package/dist/locale/uz-uz.js +1 -1
  222. package/dist/locale/uz-uz.min.js +1 -1
  223. package/dist/locale/uz-uz.min.mjs +1 -1
  224. package/dist/locale/uz-uz.mjs +1 -1
  225. package/dist/locale/vi.js +1 -1
  226. package/dist/locale/vi.min.js +1 -1
  227. package/dist/locale/vi.min.mjs +1 -1
  228. package/dist/locale/vi.mjs +1 -1
  229. package/dist/locale/zh-cn.js +1 -1
  230. package/dist/locale/zh-cn.min.js +1 -1
  231. package/dist/locale/zh-cn.min.mjs +1 -1
  232. package/dist/locale/zh-cn.mjs +1 -1
  233. package/dist/locale/zh-tw.js +1 -1
  234. package/dist/locale/zh-tw.min.js +1 -1
  235. package/dist/locale/zh-tw.min.mjs +1 -1
  236. package/dist/locale/zh-tw.mjs +1 -1
  237. package/es/component.mjs +3 -1
  238. package/es/component.mjs.map +1 -1
  239. package/es/components/carousel/index.d.ts +5 -0
  240. package/es/components/carousel/src/carousel.vue.d.ts +5 -0
  241. package/es/components/carousel/src/carousel2.mjs +7 -2
  242. package/es/components/carousel/src/carousel2.mjs.map +1 -1
  243. package/es/components/carousel/src/use-carousel.d.ts +6 -0
  244. package/es/components/carousel/src/use-carousel.mjs +33 -1
  245. package/es/components/carousel/src/use-carousel.mjs.map +1 -1
  246. package/es/components/checkbox/index.d.ts +12 -0
  247. package/es/components/checkbox/src/checkbox-button.vue.d.ts +4 -0
  248. package/es/components/checkbox/src/checkbox.d.ts +1 -0
  249. package/es/components/checkbox/src/checkbox.mjs +2 -1
  250. package/es/components/checkbox/src/checkbox.mjs.map +1 -1
  251. package/es/components/checkbox/src/checkbox.vue.d.ts +4 -0
  252. package/es/components/checkbox/src/composables/use-checkbox-status.mjs +2 -2
  253. package/es/components/checkbox/src/composables/use-checkbox-status.mjs.map +1 -1
  254. package/es/components/color-picker/index.d.ts +18 -1
  255. package/es/components/color-picker/src/color-picker.d.ts +2 -0
  256. package/es/components/color-picker/src/color-picker.mjs +3 -1
  257. package/es/components/color-picker/src/color-picker.mjs.map +1 -1
  258. package/es/components/color-picker/src/color-picker.vue.d.ts +18 -1
  259. package/es/components/color-picker/src/color-picker2.mjs +83 -11
  260. package/es/components/color-picker/src/color-picker2.mjs.map +1 -1
  261. package/es/components/descriptions/src/description-item.mjs.map +1 -1
  262. package/es/components/descriptions/src/description.mjs.map +1 -1
  263. package/es/components/drawer/index.mjs +2 -2
  264. package/es/components/drawer/src/drawer.mjs +26 -176
  265. package/es/components/drawer/src/drawer.mjs.map +1 -1
  266. package/es/components/drawer/src/drawer2.mjs +176 -26
  267. package/es/components/drawer/src/drawer2.mjs.map +1 -1
  268. package/es/components/index.mjs +1 -1
  269. package/es/components/table/src/table.mjs +2 -1
  270. package/es/components/table/src/table.mjs.map +1 -1
  271. package/es/components/transfer/index.d.ts +40 -0
  272. package/es/components/transfer/src/transfer-panel.vue.d.ts +8 -0
  273. package/es/components/transfer/src/transfer.vue.d.ts +40 -0
  274. package/es/components/tree-v2/index.d.ts +8 -0
  275. package/es/components/tree-v2/src/tree-node.vue.d.ts +8 -0
  276. package/es/components/tree-v2/src/tree.vue.d.ts +8 -0
  277. package/es/components/watermark/index.d.ts +94 -0
  278. package/es/components/watermark/index.mjs +9 -0
  279. package/es/components/watermark/index.mjs.map +1 -0
  280. package/es/components/watermark/src/useClips.d.ts +7 -0
  281. package/es/components/watermark/src/useClips.mjs +82 -0
  282. package/es/components/watermark/src/useClips.mjs.map +1 -0
  283. package/es/components/watermark/src/utils.d.ts +8 -0
  284. package/es/components/watermark/src/utils.mjs +22 -0
  285. package/es/components/watermark/src/utils.mjs.map +1 -0
  286. package/es/components/watermark/src/watermark.d.ts +32 -0
  287. package/es/components/watermark/src/watermark.mjs +33 -0
  288. package/es/components/watermark/src/watermark.mjs.map +1 -0
  289. package/es/components/watermark/src/watermark.vue.d.ts +94 -0
  290. package/es/components/watermark/src/watermark2.mjs +202 -0
  291. package/es/components/watermark/src/watermark2.mjs.map +1 -0
  292. package/es/components/watermark/style/index.d.ts +0 -0
  293. package/es/components/watermark/style/index.mjs +2 -0
  294. package/es/components/watermark/style/index.mjs.map +1 -0
  295. package/es/hooks/use-focus-controller/index.d.ts +6 -1
  296. package/es/hooks/use-focus-controller/index.mjs +5 -2
  297. package/es/hooks/use-focus-controller/index.mjs.map +1 -1
  298. package/es/index.mjs +1 -1
  299. package/es/version.d.ts +1 -1
  300. package/es/version.mjs +1 -1
  301. package/es/version.mjs.map +1 -1
  302. package/lib/component.js +3 -1
  303. package/lib/component.js.map +1 -1
  304. package/lib/components/carousel/index.d.ts +5 -0
  305. package/lib/components/carousel/src/carousel.vue.d.ts +5 -0
  306. package/lib/components/carousel/src/carousel2.js +7 -2
  307. package/lib/components/carousel/src/carousel2.js.map +1 -1
  308. package/lib/components/carousel/src/use-carousel.d.ts +6 -0
  309. package/lib/components/carousel/src/use-carousel.js +32 -0
  310. package/lib/components/carousel/src/use-carousel.js.map +1 -1
  311. package/lib/components/checkbox/index.d.ts +12 -0
  312. package/lib/components/checkbox/src/checkbox-button.vue.d.ts +4 -0
  313. package/lib/components/checkbox/src/checkbox.d.ts +1 -0
  314. package/lib/components/checkbox/src/checkbox.js +2 -1
  315. package/lib/components/checkbox/src/checkbox.js.map +1 -1
  316. package/lib/components/checkbox/src/checkbox.vue.d.ts +4 -0
  317. package/lib/components/checkbox/src/composables/use-checkbox-status.js +1 -1
  318. package/lib/components/checkbox/src/composables/use-checkbox-status.js.map +1 -1
  319. package/lib/components/color-picker/index.d.ts +18 -1
  320. package/lib/components/color-picker/src/color-picker.d.ts +2 -0
  321. package/lib/components/color-picker/src/color-picker.js +3 -1
  322. package/lib/components/color-picker/src/color-picker.js.map +1 -1
  323. package/lib/components/color-picker/src/color-picker.vue.d.ts +18 -1
  324. package/lib/components/color-picker/src/color-picker2.js +93 -21
  325. package/lib/components/color-picker/src/color-picker2.js.map +1 -1
  326. package/lib/components/descriptions/src/description-item.js.map +1 -1
  327. package/lib/components/descriptions/src/description.js.map +1 -1
  328. package/lib/components/drawer/index.js +2 -2
  329. package/lib/components/drawer/src/drawer.js +27 -176
  330. package/lib/components/drawer/src/drawer.js.map +1 -1
  331. package/lib/components/drawer/src/drawer2.js +176 -27
  332. package/lib/components/drawer/src/drawer2.js.map +1 -1
  333. package/lib/components/index.js +1 -1
  334. package/lib/components/table/src/table.js +2 -1
  335. package/lib/components/table/src/table.js.map +1 -1
  336. package/lib/components/transfer/index.d.ts +40 -0
  337. package/lib/components/transfer/src/transfer-panel.vue.d.ts +8 -0
  338. package/lib/components/transfer/src/transfer.vue.d.ts +40 -0
  339. package/lib/components/tree-v2/index.d.ts +8 -0
  340. package/lib/components/tree-v2/src/tree-node.vue.d.ts +8 -0
  341. package/lib/components/tree-v2/src/tree.vue.d.ts +8 -0
  342. package/lib/components/watermark/index.d.ts +94 -0
  343. package/lib/components/watermark/index.js +15 -0
  344. package/lib/components/watermark/index.js.map +1 -0
  345. package/lib/components/watermark/src/useClips.d.ts +7 -0
  346. package/lib/components/watermark/src/useClips.js +87 -0
  347. package/lib/components/watermark/src/useClips.js.map +1 -0
  348. package/lib/components/watermark/src/utils.d.ts +8 -0
  349. package/lib/components/watermark/src/utils.js +29 -0
  350. package/lib/components/watermark/src/utils.js.map +1 -0
  351. package/lib/components/watermark/src/watermark.d.ts +32 -0
  352. package/lib/components/watermark/src/watermark.js +37 -0
  353. package/lib/components/watermark/src/watermark.js.map +1 -0
  354. package/lib/components/watermark/src/watermark.vue.d.ts +94 -0
  355. package/lib/components/watermark/src/watermark2.js +206 -0
  356. package/lib/components/watermark/src/watermark2.js.map +1 -0
  357. package/lib/components/watermark/style/index.d.ts +0 -0
  358. package/lib/components/watermark/style/index.js +3 -0
  359. package/lib/components/watermark/style/index.js.map +1 -0
  360. package/lib/hooks/use-focus-controller/index.d.ts +6 -1
  361. package/lib/hooks/use-focus-controller/index.js +5 -2
  362. package/lib/hooks/use-focus-controller/index.js.map +1 -1
  363. package/lib/index.js +1 -1
  364. package/lib/version.d.ts +1 -1
  365. package/lib/version.js +1 -1
  366. package/lib/version.js.map +1 -1
  367. package/package.json +2 -2
  368. package/tags.json +1 -1
  369. package/theme-chalk/el-color-picker.css +1 -1
  370. package/theme-chalk/el-table-v2.css +1 -1
  371. package/theme-chalk/el-table.css +1 -1
  372. package/theme-chalk/index.css +1 -1
  373. package/theme-chalk/src/color-picker.scss +8 -2
  374. package/theme-chalk/src/common/var.scss +1 -0
  375. package/theme-chalk/src/table.scss +16 -9
  376. package/web-types.json +1 -1
@@ -0,0 +1,206 @@
1
+ 'use strict';
2
+
3
+ Object.defineProperty(exports, '__esModule', { value: true });
4
+
5
+ var vue = require('vue');
6
+ var core = require('@vueuse/core');
7
+ var watermark = require('./watermark.js');
8
+ var utils = require('./utils.js');
9
+ var useClips = require('./useClips.js');
10
+ var pluginVue_exportHelper = require('../../../_virtual/plugin-vue_export-helper.js');
11
+
12
+ const __default__ = vue.defineComponent({
13
+ name: "ElWatermark"
14
+ });
15
+ const _sfc_main = /* @__PURE__ */ vue.defineComponent({
16
+ ...__default__,
17
+ props: watermark.watermarkProps,
18
+ setup(__props) {
19
+ const props = __props;
20
+ const style = {
21
+ position: "relative"
22
+ };
23
+ const color = vue.computed(() => {
24
+ var _a, _b;
25
+ return (_b = (_a = props.font) == null ? void 0 : _a.color) != null ? _b : "rgba(0,0,0,.15)";
26
+ });
27
+ const fontSize = vue.computed(() => {
28
+ var _a, _b;
29
+ return (_b = (_a = props.font) == null ? void 0 : _a.fontSize) != null ? _b : 16;
30
+ });
31
+ const fontWeight = vue.computed(() => {
32
+ var _a, _b;
33
+ return (_b = (_a = props.font) == null ? void 0 : _a.fontWeight) != null ? _b : "normal";
34
+ });
35
+ const fontStyle = vue.computed(() => {
36
+ var _a, _b;
37
+ return (_b = (_a = props.font) == null ? void 0 : _a.fontStyle) != null ? _b : "normal";
38
+ });
39
+ const fontFamily = vue.computed(() => {
40
+ var _a, _b;
41
+ return (_b = (_a = props.font) == null ? void 0 : _a.fontFamily) != null ? _b : "sans-serif";
42
+ });
43
+ const gapX = vue.computed(() => props.gap[0]);
44
+ const gapY = vue.computed(() => props.gap[1]);
45
+ const gapXCenter = vue.computed(() => gapX.value / 2);
46
+ const gapYCenter = vue.computed(() => gapY.value / 2);
47
+ const offsetLeft = vue.computed(() => {
48
+ var _a, _b;
49
+ return (_b = (_a = props.offset) == null ? void 0 : _a[0]) != null ? _b : gapXCenter.value;
50
+ });
51
+ const offsetTop = vue.computed(() => {
52
+ var _a, _b;
53
+ return (_b = (_a = props.offset) == null ? void 0 : _a[1]) != null ? _b : gapYCenter.value;
54
+ });
55
+ const getMarkStyle = () => {
56
+ const markStyle = {
57
+ zIndex: props.zIndex,
58
+ position: "absolute",
59
+ left: 0,
60
+ top: 0,
61
+ width: "100%",
62
+ height: "100%",
63
+ pointerEvents: "none",
64
+ backgroundRepeat: "repeat"
65
+ };
66
+ let positionLeft = offsetLeft.value - gapXCenter.value;
67
+ let positionTop = offsetTop.value - gapYCenter.value;
68
+ if (positionLeft > 0) {
69
+ markStyle.left = `${positionLeft}px`;
70
+ markStyle.width = `calc(100% - ${positionLeft}px)`;
71
+ positionLeft = 0;
72
+ }
73
+ if (positionTop > 0) {
74
+ markStyle.top = `${positionTop}px`;
75
+ markStyle.height = `calc(100% - ${positionTop}px)`;
76
+ positionTop = 0;
77
+ }
78
+ markStyle.backgroundPosition = `${positionLeft}px ${positionTop}px`;
79
+ return markStyle;
80
+ };
81
+ const containerRef = vue.shallowRef(null);
82
+ const watermarkRef = vue.shallowRef();
83
+ const stopObservation = vue.ref(false);
84
+ const destroyWatermark = () => {
85
+ if (watermarkRef.value) {
86
+ watermarkRef.value.remove();
87
+ watermarkRef.value = void 0;
88
+ }
89
+ };
90
+ const appendWatermark = (base64Url, markWidth) => {
91
+ var _a;
92
+ if (containerRef.value && watermarkRef.value) {
93
+ stopObservation.value = true;
94
+ watermarkRef.value.setAttribute("style", utils.getStyleStr({
95
+ ...getMarkStyle(),
96
+ backgroundImage: `url('${base64Url}')`,
97
+ backgroundSize: `${Math.floor(markWidth)}px`
98
+ }));
99
+ (_a = containerRef.value) == null ? void 0 : _a.append(watermarkRef.value);
100
+ setTimeout(() => {
101
+ stopObservation.value = false;
102
+ });
103
+ }
104
+ };
105
+ const getMarkSize = (ctx) => {
106
+ let defaultWidth = 120;
107
+ let defaultHeight = 64;
108
+ const image = props.image;
109
+ const content = props.content;
110
+ const width = props.width;
111
+ const height = props.height;
112
+ if (!image && ctx.measureText) {
113
+ ctx.font = `${Number(fontSize.value)}px ${fontFamily.value}`;
114
+ const contents = Array.isArray(content) ? content : [content];
115
+ const sizes = contents.map((item) => {
116
+ const metrics = ctx.measureText(item);
117
+ return [
118
+ metrics.width,
119
+ metrics.fontBoundingBoxAscent + metrics.fontBoundingBoxDescent
120
+ ];
121
+ });
122
+ defaultWidth = Math.ceil(Math.max(...sizes.map((size) => size[0])));
123
+ defaultHeight = Math.ceil(Math.max(...sizes.map((size) => size[1]))) * contents.length + (contents.length - 1) * useClips.FontGap;
124
+ }
125
+ return [width != null ? width : defaultWidth, height != null ? height : defaultHeight];
126
+ };
127
+ const getClips = useClips["default"]();
128
+ const renderWatermark = () => {
129
+ const canvas = document.createElement("canvas");
130
+ const ctx = canvas.getContext("2d");
131
+ const image = props.image;
132
+ const content = props.content;
133
+ const rotate = props.rotate;
134
+ if (ctx) {
135
+ if (!watermarkRef.value) {
136
+ watermarkRef.value = document.createElement("div");
137
+ }
138
+ const ratio = utils.getPixelRatio();
139
+ const [markWidth, markHeight] = getMarkSize(ctx);
140
+ const drawCanvas = (drawContent) => {
141
+ const [textClips, clipWidth] = getClips(drawContent || "", rotate, ratio, markWidth, markHeight, {
142
+ color: color.value,
143
+ fontSize: fontSize.value,
144
+ fontStyle: fontStyle.value,
145
+ fontWeight: fontWeight.value,
146
+ fontFamily: fontFamily.value
147
+ }, gapX.value, gapY.value);
148
+ appendWatermark(textClips, clipWidth);
149
+ };
150
+ if (image) {
151
+ const img = new Image();
152
+ img.onload = () => {
153
+ drawCanvas(img);
154
+ };
155
+ img.onerror = () => {
156
+ drawCanvas(content);
157
+ };
158
+ img.crossOrigin = "anonymous";
159
+ img.referrerPolicy = "no-referrer";
160
+ img.src = image;
161
+ } else {
162
+ drawCanvas(content);
163
+ }
164
+ }
165
+ };
166
+ vue.onMounted(() => {
167
+ renderWatermark();
168
+ });
169
+ vue.watch(() => props, () => {
170
+ renderWatermark();
171
+ }, {
172
+ deep: true,
173
+ flush: "post"
174
+ });
175
+ vue.onBeforeUnmount(() => {
176
+ destroyWatermark();
177
+ });
178
+ const onMutate = (mutations) => {
179
+ if (stopObservation.value) {
180
+ return;
181
+ }
182
+ mutations.forEach((mutation) => {
183
+ if (utils.reRendering(mutation, watermarkRef.value)) {
184
+ destroyWatermark();
185
+ renderWatermark();
186
+ }
187
+ });
188
+ };
189
+ core.useMutationObserver(containerRef, onMutate, {
190
+ attributes: true
191
+ });
192
+ return (_ctx, _cache) => {
193
+ return vue.openBlock(), vue.createElementBlock("div", {
194
+ ref_key: "containerRef",
195
+ ref: containerRef,
196
+ style: vue.normalizeStyle([style])
197
+ }, [
198
+ vue.renderSlot(_ctx.$slots, "default")
199
+ ], 4);
200
+ };
201
+ }
202
+ });
203
+ var Watermark = /* @__PURE__ */ pluginVue_exportHelper["default"](_sfc_main, [["__file", "/home/runner/work/element-plus/element-plus/packages/components/watermark/src/watermark.vue"]]);
204
+
205
+ exports["default"] = Watermark;
206
+ //# sourceMappingURL=watermark2.js.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"watermark2.js","sources":["../../../../../../packages/components/watermark/src/watermark.vue"],"sourcesContent":["<template>\n <div ref=\"containerRef\" :style=\"[style]\">\n <slot />\n </div>\n</template>\n\n<script lang=\"ts\" setup>\nimport {\n computed,\n onBeforeUnmount,\n onMounted,\n ref,\n shallowRef,\n watch,\n} from 'vue'\nimport { useMutationObserver } from '@vueuse/core'\nimport { watermarkProps } from './watermark'\nimport { getPixelRatio, getStyleStr, reRendering } from './utils'\nimport useClips, { FontGap } from './useClips'\nimport type { WatermarkProps } from './watermark'\nimport type { CSSProperties } from 'vue'\n\ndefineOptions({\n name: 'ElWatermark',\n})\n\nconst style: CSSProperties = {\n position: 'relative',\n}\n\nconst props = defineProps(watermarkProps)\nconst color = computed(() => props.font?.color ?? 'rgba(0,0,0,.15)')\nconst fontSize = computed(() => props.font?.fontSize ?? 16)\nconst fontWeight = computed(() => props.font?.fontWeight ?? 'normal')\nconst fontStyle = computed(() => props.font?.fontStyle ?? 'normal')\nconst fontFamily = computed(() => props.font?.fontFamily ?? 'sans-serif')\n\nconst gapX = computed(() => props.gap[0])\nconst gapY = computed(() => props.gap[1])\nconst gapXCenter = computed(() => gapX.value / 2)\nconst gapYCenter = computed(() => gapY.value / 2)\nconst offsetLeft = computed(() => props.offset?.[0] ?? gapXCenter.value)\nconst offsetTop = computed(() => props.offset?.[1] ?? gapYCenter.value)\n\nconst getMarkStyle = () => {\n const markStyle: CSSProperties = {\n zIndex: props.zIndex,\n position: 'absolute',\n left: 0,\n top: 0,\n width: '100%',\n height: '100%',\n pointerEvents: 'none',\n backgroundRepeat: 'repeat',\n }\n\n /** Calculate the style of the offset */\n let positionLeft = offsetLeft.value - gapXCenter.value\n let positionTop = offsetTop.value - gapYCenter.value\n if (positionLeft > 0) {\n markStyle.left = `${positionLeft}px`\n markStyle.width = `calc(100% - ${positionLeft}px)`\n positionLeft = 0\n }\n if (positionTop > 0) {\n markStyle.top = `${positionTop}px`\n markStyle.height = `calc(100% - ${positionTop}px)`\n positionTop = 0\n }\n markStyle.backgroundPosition = `${positionLeft}px ${positionTop}px`\n\n return markStyle\n}\n\nconst containerRef = shallowRef<HTMLDivElement | null>(null)\nconst watermarkRef = shallowRef<HTMLDivElement>()\nconst stopObservation = ref(false)\n\nconst destroyWatermark = () => {\n if (watermarkRef.value) {\n watermarkRef.value.remove()\n watermarkRef.value = undefined\n }\n}\nconst appendWatermark = (base64Url: string, markWidth: number) => {\n if (containerRef.value && watermarkRef.value) {\n stopObservation.value = true\n watermarkRef.value.setAttribute(\n 'style',\n getStyleStr({\n ...getMarkStyle(),\n backgroundImage: `url('${base64Url}')`,\n backgroundSize: `${Math.floor(markWidth)}px`,\n })\n )\n containerRef.value?.append(watermarkRef.value)\n // Delayed execution\n setTimeout(() => {\n stopObservation.value = false\n })\n }\n}\n\n/**\n * Get the width and height of the watermark. The default values are as follows\n * Image: [120, 64]; Content: It's calculated by content;\n */\nconst getMarkSize = (ctx: CanvasRenderingContext2D) => {\n let defaultWidth = 120\n let defaultHeight = 64\n const image = props.image\n const content = props.content\n const width = props.width\n const height = props.height\n if (!image && ctx.measureText) {\n ctx.font = `${Number(fontSize.value)}px ${fontFamily.value}`\n const contents = Array.isArray(content) ? content : [content]\n const sizes = contents.map((item) => {\n const metrics = ctx.measureText(item!)\n\n return [\n metrics.width,\n metrics.fontBoundingBoxAscent + metrics.fontBoundingBoxDescent,\n ]\n })\n defaultWidth = Math.ceil(Math.max(...sizes.map((size) => size[0])))\n defaultHeight =\n Math.ceil(Math.max(...sizes.map((size) => size[1]))) * contents.length +\n (contents.length - 1) * FontGap\n }\n return [width ?? defaultWidth, height ?? defaultHeight] as const\n}\n\nconst getClips = useClips()\n\nconst renderWatermark = () => {\n const canvas = document.createElement('canvas')\n const ctx = canvas.getContext('2d')\n const image = props.image\n const content = props.content\n const rotate = props.rotate\n\n if (ctx) {\n if (!watermarkRef.value) {\n watermarkRef.value = document.createElement('div')\n }\n\n const ratio = getPixelRatio()\n const [markWidth, markHeight] = getMarkSize(ctx)\n\n const drawCanvas = (\n drawContent?: NonNullable<WatermarkProps['content']> | HTMLImageElement\n ) => {\n const [textClips, clipWidth] = getClips(\n drawContent || '',\n rotate,\n ratio,\n markWidth,\n markHeight,\n {\n color: color.value,\n fontSize: fontSize.value,\n fontStyle: fontStyle.value,\n fontWeight: fontWeight.value,\n fontFamily: fontFamily.value,\n },\n gapX.value,\n gapY.value\n )\n\n appendWatermark(textClips, clipWidth)\n }\n\n if (image) {\n const img = new Image()\n img.onload = () => {\n drawCanvas(img)\n }\n img.onerror = () => {\n drawCanvas(content)\n }\n img.crossOrigin = 'anonymous'\n img.referrerPolicy = 'no-referrer'\n img.src = image\n } else {\n drawCanvas(content)\n }\n }\n}\n\nonMounted(() => {\n renderWatermark()\n})\n\nwatch(\n () => props,\n () => {\n renderWatermark()\n },\n {\n deep: true,\n flush: 'post',\n }\n)\n\nonBeforeUnmount(() => {\n destroyWatermark()\n})\n\nconst onMutate = (mutations: MutationRecord[]) => {\n if (stopObservation.value) {\n return\n }\n mutations.forEach((mutation) => {\n if (reRendering(mutation, watermarkRef.value)) {\n destroyWatermark()\n renderWatermark()\n }\n })\n}\n\nuseMutationObserver(containerRef, onMutate, {\n attributes: true,\n})\n</script>\n"],"names":["computed","shallowRef","ref","getStyleStr","FontGap","useClips","getPixelRatio","onMounted","watch"],"mappings":"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"}
File without changes
@@ -0,0 +1,3 @@
1
+ 'use strict';
2
+
3
+ //# sourceMappingURL=index.js.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"index.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;"}
@@ -1,9 +1,14 @@
1
1
  import type { ShallowRef } from 'vue';
2
2
  interface UseFocusControllerOptions {
3
3
  afterFocus?: () => void;
4
+ /**
5
+ * return true to cancel blur
6
+ * @param event FocusEvent
7
+ */
8
+ beforeBlur?: (event: FocusEvent) => boolean | undefined;
4
9
  afterBlur?: () => void;
5
10
  }
6
- export declare function useFocusController<T extends HTMLElement>(target: ShallowRef<T | undefined>, { afterFocus, afterBlur }?: UseFocusControllerOptions): {
11
+ export declare function useFocusController<T extends HTMLElement>(target: ShallowRef<T | undefined>, { afterFocus, beforeBlur, afterBlur }?: UseFocusControllerOptions): {
7
12
  wrapperRef: ShallowRef<HTMLElement | undefined>;
8
13
  isFocused: import("vue").Ref<boolean>;
9
14
  handleFocus: (event: FocusEvent) => void;
@@ -4,8 +4,10 @@ Object.defineProperty(exports, '__esModule', { value: true });
4
4
 
5
5
  var vue = require('vue');
6
6
  var core = require('@vueuse/core');
7
+ require('../../utils/index.js');
8
+ var shared = require('@vue/shared');
7
9
 
8
- function useFocusController(target, { afterFocus, afterBlur } = {}) {
10
+ function useFocusController(target, { afterFocus, beforeBlur, afterBlur } = {}) {
9
11
  const instance = vue.getCurrentInstance();
10
12
  const { emit } = instance;
11
13
  const wrapperRef = vue.shallowRef();
@@ -19,7 +21,8 @@ function useFocusController(target, { afterFocus, afterBlur } = {}) {
19
21
  };
20
22
  const handleBlur = (event) => {
21
23
  var _a;
22
- if (event.relatedTarget && ((_a = wrapperRef.value) == null ? void 0 : _a.contains(event.relatedTarget)))
24
+ const cancelBlur = shared.isFunction(beforeBlur) ? beforeBlur(event) : false;
25
+ if (cancelBlur || event.relatedTarget && ((_a = wrapperRef.value) == null ? void 0 : _a.contains(event.relatedTarget)))
23
26
  return;
24
27
  isFocused.value = false;
25
28
  emit("blur", event);
@@ -1 +1 @@
1
- {"version":3,"file":"index.js","sources":["../../../../../packages/hooks/use-focus-controller/index.ts"],"sourcesContent":["import { getCurrentInstance, ref, shallowRef, watch } from 'vue'\nimport { useEventListener } from '@vueuse/core'\nimport type { ShallowRef } from 'vue'\n\ninterface UseFocusControllerOptions {\n afterFocus?: () => void\n afterBlur?: () => void\n}\n\nexport function useFocusController<T extends HTMLElement>(\n target: ShallowRef<T | undefined>,\n { afterFocus, afterBlur }: UseFocusControllerOptions = {}\n) {\n const instance = getCurrentInstance()!\n const { emit } = instance\n const wrapperRef = shallowRef<HTMLElement>()\n const isFocused = ref(false)\n\n const handleFocus = (event: FocusEvent) => {\n if (isFocused.value) return\n isFocused.value = true\n emit('focus', event)\n afterFocus?.()\n }\n\n const handleBlur = (event: FocusEvent) => {\n if (\n event.relatedTarget &&\n wrapperRef.value?.contains(event.relatedTarget as Node)\n )\n return\n\n isFocused.value = false\n emit('blur', event)\n afterBlur?.()\n }\n\n const handleClick = () => {\n target.value?.focus()\n }\n\n watch(wrapperRef, (el) => {\n if (el) {\n el.setAttribute('tabindex', '-1')\n }\n })\n\n // TODO: using useEventListener will fail the test\n // useEventListener(target, 'focus', handleFocus)\n // useEventListener(target, 'blur', handleBlur)\n useEventListener(wrapperRef, 'click', handleClick)\n\n return {\n wrapperRef,\n isFocused,\n handleFocus,\n handleBlur,\n }\n}\n"],"names":["getCurrentInstance","shallowRef","ref","watch","useEventListener"],"mappings":";;;;;;;AAEO,SAAS,kBAAkB,CAAC,MAAM,EAAE,EAAE,UAAU,EAAE,SAAS,EAAE,GAAG,EAAE,EAAE;AAC3E,EAAE,MAAM,QAAQ,GAAGA,sBAAkB,EAAE,CAAC;AACxC,EAAE,MAAM,EAAE,IAAI,EAAE,GAAG,QAAQ,CAAC;AAC5B,EAAE,MAAM,UAAU,GAAGC,cAAU,EAAE,CAAC;AAClC,EAAE,MAAM,SAAS,GAAGC,OAAG,CAAC,KAAK,CAAC,CAAC;AAC/B,EAAE,MAAM,WAAW,GAAG,CAAC,KAAK,KAAK;AACjC,IAAI,IAAI,SAAS,CAAC,KAAK;AACvB,MAAM,OAAO;AACb,IAAI,SAAS,CAAC,KAAK,GAAG,IAAI,CAAC;AAC3B,IAAI,IAAI,CAAC,OAAO,EAAE,KAAK,CAAC,CAAC;AACzB,IAAI,UAAU,IAAI,IAAI,GAAG,KAAK,CAAC,GAAG,UAAU,EAAE,CAAC;AAC/C,GAAG,CAAC;AACJ,EAAE,MAAM,UAAU,GAAG,CAAC,KAAK,KAAK;AAChC,IAAI,IAAI,EAAE,CAAC;AACX,IAAI,IAAI,KAAK,CAAC,aAAa,KAAK,CAAC,EAAE,GAAG,UAAU,CAAC,KAAK,KAAK,IAAI,GAAG,KAAK,CAAC,GAAG,EAAE,CAAC,QAAQ,CAAC,KAAK,CAAC,aAAa,CAAC,CAAC;AAC5G,MAAM,OAAO;AACb,IAAI,SAAS,CAAC,KAAK,GAAG,KAAK,CAAC;AAC5B,IAAI,IAAI,CAAC,MAAM,EAAE,KAAK,CAAC,CAAC;AACxB,IAAI,SAAS,IAAI,IAAI,GAAG,KAAK,CAAC,GAAG,SAAS,EAAE,CAAC;AAC7C,GAAG,CAAC;AACJ,EAAE,MAAM,WAAW,GAAG,MAAM;AAC5B,IAAI,IAAI,EAAE,CAAC;AACX,IAAI,CAAC,EAAE,GAAG,MAAM,CAAC,KAAK,KAAK,IAAI,GAAG,KAAK,CAAC,GAAG,EAAE,CAAC,KAAK,EAAE,CAAC;AACtD,GAAG,CAAC;AACJ,EAAEC,SAAK,CAAC,UAAU,EAAE,CAAC,EAAE,KAAK;AAC5B,IAAI,IAAI,EAAE,EAAE;AACZ,MAAM,EAAE,CAAC,YAAY,CAAC,UAAU,EAAE,IAAI,CAAC,CAAC;AACxC,KAAK;AACL,GAAG,CAAC,CAAC;AACL,EAAEC,qBAAgB,CAAC,UAAU,EAAE,OAAO,EAAE,WAAW,CAAC,CAAC;AACrD,EAAE,OAAO;AACT,IAAI,UAAU;AACd,IAAI,SAAS;AACb,IAAI,WAAW;AACf,IAAI,UAAU;AACd,GAAG,CAAC;AACJ;;;;"}
1
+ {"version":3,"file":"index.js","sources":["../../../../../packages/hooks/use-focus-controller/index.ts"],"sourcesContent":["import { getCurrentInstance, ref, shallowRef, watch } from 'vue'\nimport { useEventListener } from '@vueuse/core'\nimport { isFunction } from '@element-plus/utils'\nimport type { ShallowRef } from 'vue'\n\ninterface UseFocusControllerOptions {\n afterFocus?: () => void\n /**\n * return true to cancel blur\n * @param event FocusEvent\n */\n beforeBlur?: (event: FocusEvent) => boolean | undefined\n afterBlur?: () => void\n}\n\nexport function useFocusController<T extends HTMLElement>(\n target: ShallowRef<T | undefined>,\n { afterFocus, beforeBlur, afterBlur }: UseFocusControllerOptions = {}\n) {\n const instance = getCurrentInstance()!\n const { emit } = instance\n const wrapperRef = shallowRef<HTMLElement>()\n const isFocused = ref(false)\n\n const handleFocus = (event: FocusEvent) => {\n if (isFocused.value) return\n isFocused.value = true\n emit('focus', event)\n afterFocus?.()\n }\n\n const handleBlur = (event: FocusEvent) => {\n const cancelBlur = isFunction(beforeBlur) ? beforeBlur(event) : false\n if (\n cancelBlur ||\n (event.relatedTarget &&\n wrapperRef.value?.contains(event.relatedTarget as Node))\n )\n return\n\n isFocused.value = false\n emit('blur', event)\n afterBlur?.()\n }\n\n const handleClick = () => {\n target.value?.focus()\n }\n\n watch(wrapperRef, (el) => {\n if (el) {\n el.setAttribute('tabindex', '-1')\n }\n })\n\n // TODO: using useEventListener will fail the test\n // useEventListener(target, 'focus', handleFocus)\n // useEventListener(target, 'blur', handleBlur)\n useEventListener(wrapperRef, 'click', handleClick)\n\n return {\n wrapperRef,\n isFocused,\n handleFocus,\n handleBlur,\n }\n}\n"],"names":["getCurrentInstance","shallowRef","ref","isFunction","watch","useEventListener"],"mappings":";;;;;;;;;AAGO,SAAS,kBAAkB,CAAC,MAAM,EAAE,EAAE,UAAU,EAAE,UAAU,EAAE,SAAS,EAAE,GAAG,EAAE,EAAE;AACvF,EAAE,MAAM,QAAQ,GAAGA,sBAAkB,EAAE,CAAC;AACxC,EAAE,MAAM,EAAE,IAAI,EAAE,GAAG,QAAQ,CAAC;AAC5B,EAAE,MAAM,UAAU,GAAGC,cAAU,EAAE,CAAC;AAClC,EAAE,MAAM,SAAS,GAAGC,OAAG,CAAC,KAAK,CAAC,CAAC;AAC/B,EAAE,MAAM,WAAW,GAAG,CAAC,KAAK,KAAK;AACjC,IAAI,IAAI,SAAS,CAAC,KAAK;AACvB,MAAM,OAAO;AACb,IAAI,SAAS,CAAC,KAAK,GAAG,IAAI,CAAC;AAC3B,IAAI,IAAI,CAAC,OAAO,EAAE,KAAK,CAAC,CAAC;AACzB,IAAI,UAAU,IAAI,IAAI,GAAG,KAAK,CAAC,GAAG,UAAU,EAAE,CAAC;AAC/C,GAAG,CAAC;AACJ,EAAE,MAAM,UAAU,GAAG,CAAC,KAAK,KAAK;AAChC,IAAI,IAAI,EAAE,CAAC;AACX,IAAI,MAAM,UAAU,GAAGC,iBAAU,CAAC,UAAU,CAAC,GAAG,UAAU,CAAC,KAAK,CAAC,GAAG,KAAK,CAAC;AAC1E,IAAI,IAAI,UAAU,IAAI,KAAK,CAAC,aAAa,KAAK,CAAC,EAAE,GAAG,UAAU,CAAC,KAAK,KAAK,IAAI,GAAG,KAAK,CAAC,GAAG,EAAE,CAAC,QAAQ,CAAC,KAAK,CAAC,aAAa,CAAC,CAAC;AAC1H,MAAM,OAAO;AACb,IAAI,SAAS,CAAC,KAAK,GAAG,KAAK,CAAC;AAC5B,IAAI,IAAI,CAAC,MAAM,EAAE,KAAK,CAAC,CAAC;AACxB,IAAI,SAAS,IAAI,IAAI,GAAG,KAAK,CAAC,GAAG,SAAS,EAAE,CAAC;AAC7C,GAAG,CAAC;AACJ,EAAE,MAAM,WAAW,GAAG,MAAM;AAC5B,IAAI,IAAI,EAAE,CAAC;AACX,IAAI,CAAC,EAAE,GAAG,MAAM,CAAC,KAAK,KAAK,IAAI,GAAG,KAAK,CAAC,GAAG,EAAE,CAAC,KAAK,EAAE,CAAC;AACtD,GAAG,CAAC;AACJ,EAAEC,SAAK,CAAC,UAAU,EAAE,CAAC,EAAE,KAAK;AAC5B,IAAI,IAAI,EAAE,EAAE;AACZ,MAAM,EAAE,CAAC,YAAY,CAAC,UAAU,EAAE,IAAI,CAAC,CAAC;AACxC,KAAK;AACL,GAAG,CAAC,CAAC;AACL,EAAEC,qBAAgB,CAAC,UAAU,EAAE,OAAO,EAAE,WAAW,CAAC,CAAC;AACrD,EAAE,OAAO;AACT,IAAI,UAAU;AACd,IAAI,SAAS;AACb,IAAI,WAAW;AACf,IAAI,UAAU;AACd,GAAG,CAAC;AACJ;;;;"}
package/lib/index.js CHANGED
@@ -75,7 +75,7 @@ var constants$7 = require('./components/dialog/src/constants.js');
75
75
  var index$o = require('./components/dialog/index.js');
76
76
  var divider = require('./components/divider/src/divider.js');
77
77
  var index$p = require('./components/divider/index.js');
78
- var drawer = require('./components/drawer/src/drawer2.js');
78
+ var drawer = require('./components/drawer/src/drawer.js');
79
79
  var index$q = require('./components/drawer/index.js');
80
80
  var dropdown = require('./components/dropdown/src/dropdown.js');
81
81
  var tokens = require('./components/dropdown/src/tokens.js');
package/lib/version.d.ts CHANGED
@@ -1 +1 @@
1
- export declare const version = "0.0.20231009";
1
+ export declare const version = "0.0.20231011";
package/lib/version.js CHANGED
@@ -2,7 +2,7 @@
2
2
 
3
3
  Object.defineProperty(exports, '__esModule', { value: true });
4
4
 
5
- const version = "0.0.20231009";
5
+ const version = "0.0.20231011";
6
6
 
7
7
  exports.version = version;
8
8
  //# sourceMappingURL=version.js.map
@@ -1 +1 @@
1
- {"version":3,"file":"version.js","sources":["../../../packages/element-plus/version.ts"],"sourcesContent":["export const version = '0.0.20231009'\n"],"names":[],"mappings":";;;;AAAY,MAAC,OAAO,GAAG;;;;"}
1
+ {"version":3,"file":"version.js","sources":["../../../packages/element-plus/version.ts"],"sourcesContent":["export const version = '0.0.20231011'\n"],"names":[],"mappings":";;;;AAAY,MAAC,OAAO,GAAG;;;;"}
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@element-plus/nightly",
3
- "version": "0.0.20231009",
3
+ "version": "0.0.20231011",
4
4
  "description": "A Component Library for Vue 3",
5
5
  "keywords": [
6
6
  "element-plus",
@@ -112,5 +112,5 @@
112
112
  "not ie 11",
113
113
  "not op_mini all"
114
114
  ],
115
- "gitHead": "0a46c24da9592c15d00d74d5095657a5fd555fd9"
115
+ "gitHead": "4bfe10e682eaa84675d4c59ec9b7f82f6251fc7a"
116
116
  }
package/tags.json CHANGED
@@ -1 +1 @@
1
- {"el-affix":{"attributes":["offset","position","target","z-index","change","scroll"],"description":"Fix the element to a specific visible area.\n\n[Docs](https://element-plus.org/en-US/component/affix.html#affix)"},"el-alert":{"attributes":["title","type","description","closable","center","close-text","show-icon","effect","close"],"description":"Displays important alert messages.\n\n[Docs](https://element-plus.org/en-US/component/alert.html#alert)"},"el-autocomplete":{"attributes":["model-value","placeholder","clearable","disabled","value-key","debounce","placement","fetch-suggestions","trigger-on-focus","select-when-unmatched","name","label","hide-loading","popper-class","popper-append-to-body","teleported","highlight-first-item","fit-input-width","select","change"],"description":"Get some recommended tips based on the current input.\n\n[Docs](https://element-plus.org/en-US/component/autocomplete.html#autocomplete)"},"el-avatar":{"attributes":["icon","size","shape","src","src-set","alt","fit","error"],"description":"Avatars can be used to represent people or objects. It supports images, Icons, or characters.\n\n[Docs](https://element-plus.org/en-US/component/avatar.html#avatar)"},"el-backtop":{"attributes":["target","visibility-height","right","bottom","click"],"description":"A button to back to top.\n\n[Docs](https://element-plus.org/en-US/component/backtop.html#backtop)"},"el-badge":{"attributes":["value","max","is-dot","hidden","type"],"description":"A number or status mark on buttons and icons.\n\n[Docs](https://element-plus.org/en-US/component/badge.html#badge)"},"el-breadcrumb":{"attributes":["separator","separator-icon"],"subtags":["el-breadcrumb-item"],"description":"Displays the location of the current page, making it easier to browser back.\n\n[Docs](https://element-plus.org/en-US/component/breadcrumb.html#breadcrumb)"},"el-breadcrumb-item":{"attributes":["to","replace"],"description":"[Docs](https://element-plus.org/en-US/component/breadcrumb.html#breadcrumbitem)"},"el-button":{"attributes":["size","type","plain","text","bg","link","round","circle","loading","loading-icon","disabled","icon","autofocus","native-type","auto-insert-space","color","dark","tag"],"description":"Commonly used button.\n\n[Docs](https://element-plus.org/en-US/component/button.html#button)"},"el-button-group":{"attributes":["size","type"],"subtags":["el-button"],"description":"[Docs](https://element-plus.org/en-US/component/button.html#buttongroup)"},"el-calendar":{"attributes":["model-value","range"],"description":"Display date.\n\n[Docs](https://element-plus.org/en-US/component/calendar.html#calendar)"},"el-card":{"attributes":["header","body-style","body-class","shadow"],"description":"Integrate information in a card container.\n\n[Docs](https://element-plus.org/en-US/component/card.html#card)"},"el-carousel":{"attributes":["height","initial-index","trigger","autoplay","interval","indicator-position","arrow","type","loop","direction","pause-on-hover","change"],"subtags":["el-carousel-item"],"description":"Loop a series of images or texts in a limited space\n\n[Docs](https://element-plus.org/en-US/component/carousel.html#carousel)"},"el-carousel-item":{"attributes":["name","label"],"description":"[Docs](https://element-plus.org/en-US/component/carousel.html#carousel-item)"},"el-cascader":{"attributes":["model-value","options","props","size","placeholder","disabled","clearable","show-all-levels","collapse-tags","collapse-tags-tooltip","separator","filterable","filter-method","debounce","before-filter","popper-class","teleported","popper-append-to-body","tag-type","validate-event","max-collapse-tags","change","expand-change","blur","focus","visible-change","remove-tag"],"description":"If the options have a clear hierarchical structure, Cascader can be used to view and select them.\n\n[Docs](https://element-plus.org/en-US/component/cascader.html#cascader)"},"el-cascader-panel":{"attributes":["model-value","options","props","change","expand-change","close"],"description":"[Docs](https://element-plus.org/en-US/component/cascader.html#cascaderpanel)"},"el-checkbox":{"attributes":["model-value","label","true-label","false-label","disabled","border","size","name","checked","indeterminate","validate-event","tabindex","id","controls","change"],"description":"A group of options for multiple choices.\n\n[Docs](https://element-plus.org/en-US/component/checkbox.html#checkbox)"},"el-checkbox-group":{"attributes":["model-value","size","disabled","min","max","label","text-color","fill","tag","validate-event","change"],"subtags":["el-checkbox","el-checkbox-button"],"description":"[Docs](https://element-plus.org/en-US/component/checkbox.html#checkboxgroup)"},"el-checkbox-button":{"attributes":["label","true-label","false-label","disabled","name","checked"],"description":"[Docs](https://element-plus.org/en-US/component/checkbox.html#checkboxbutton)"},"el-collapse":{"attributes":["model-value","accordion","change"],"subtags":["el-collapse-item"],"description":"Use Collapse to store contents.\n\n[Docs](https://element-plus.org/en-US/component/collapse.html#collapse)"},"el-collapse-item":{"attributes":["name","title","disabled"],"description":"[Docs](https://element-plus.org/en-US/component/collapse.html#collapse-item)"},"el-color-picker":{"attributes":["model-value","disabled","size","show-alpha","color-format","popper-class","predefine","validate-event","tabindex","label","id","change","active-change"],"description":"ColorPicker is a color selector supporting multiple color formats.\n\n[Docs](https://element-plus.org/en-US/component/color-picker.html#colorpicker)"},"el-config-provider":{"attributes":["locale","size","z-index","namespace","button","message","experimental-features"],"description":"Config Provider is used for providing global configurations, which enables your entire application to access these configurations everywhere.\n\n[Docs](https://element-plus.org/en-US/component/config-provider.html#config-provider)"},"el-container":{"attributes":["direction"],"subtags":["el-container","el-header","el-aside","el-main","el-footer"],"description":"Container components for scaffolding basic structure of the page:\n\n[Docs](https://element-plus.org/en-US/component/container.html#container)"},"el-header":{"attributes":["height"],"description":"[Docs](https://element-plus.org/en-US/component/container.html#header)"},"el-aside":{"attributes":["width"],"description":"[Docs](https://element-plus.org/en-US/component/container.html#aside)"},"el-main":{"description":"[Docs](https://element-plus.org/en-US/component/container.html#main)"},"el-footer":{"attributes":["height"],"description":"[Docs](https://element-plus.org/en-US/component/container.html#footer)"},"el-date-picker":{"attributes":["model-value","readonly","disabled","size","editable","clearable","placeholder","start-placeholder","end-placeholder","type","format","popper-class","popper-options","range-separator","default-value","default-time","value-format","id","name","unlink-panels","prefix-icon","clear-icon","validate-event","disabled-date","shortcuts","cell-class-name","teleported","change","blur","focus","calendar-change","panel-change","visible-change"],"description":"Use Date Picker for date input.\n\n[Docs](https://element-plus.org/en-US/component/date-picker.html#datepicker)"},"el-descriptions":{"attributes":["border","column","direction","size","title","extra"],"subtags":["el-descriptions-item"],"description":"Display multiple fields in list form.\n\n[Docs](https://element-plus.org/en-US/component/descriptions.html#descriptions)"},"el-descriptions-item":{"attributes":["label","span","width","min-width","align","label-align","class-name","label-class-name"],"description":"[Docs](https://element-plus.org/en-US/component/descriptions.html#descriptions-item)"},"el-dialog":{"attributes":["model-value","title","width","fullscreen","top","modal","modal-class","append-to-body","lock-scroll","custom-class","open-delay","close-delay","close-on-click-modal","close-on-press-escape","show-close","before-close","draggable","center","align-center","destroy-on-close","close-icon","z-index","header-aria-level","open","opened","close","closed","open-auto-focus","close-auto-focus"],"description":"Informs users while preserving the current page state.\n\n[Docs](https://element-plus.org/en-US/component/dialog.html#dialog)"},"el-divider":{"attributes":["direction","border-style","content-position"],"description":"The dividing line that separates the content.\n\n[Docs](https://element-plus.org/en-US/component/divider.html#divider)"},"el-drawer":{"attributes":["model-value","append-to-body","lock-scroll","before-close","close-on-click-modal","close-on-press-escape","open-delay","close-delay","custom-class","destroy-on-close","modal","direction","show-close","size","title","with-header","modal-class","z-index","header-aria-level","open","opened","close","closed"],"description":"Sometimes, `Dialog` does not always satisfy our requirements, let's say you have a massive form, or you need space to display something like `terms & conditions`, `Drawer` has almost identical API with `Dialog`, but it introduces different user experience.\n\n[Docs](https://element-plus.org/en-US/component/drawer.html#drawer)"},"el-dropdown":{"attributes":["type","size","max-height","split-button","disabled","placement","trigger","hide-on-click","show-timeout","hide-timeout","role","tabindex","popper-class","popper-options","teleported","click","command","visible-change"],"subtags":["el-dropdown-menu"],"description":"Toggleable menu for displaying lists of links and actions.\n\n[Docs](https://element-plus.org/en-US/component/dropdown.html#dropdown)"},"el-dropdown-menu":{"subtags":["el-dropdown-item"],"description":"[Docs](https://element-plus.org/en-US/component/dropdown.html#dropdown-menu)"},"el-dropdown-item":{"attributes":["command","disabled","divided","icon"],"description":"[Docs](https://element-plus.org/en-US/component/dropdown.html#dropdown-item)"},"el-empty":{"attributes":["image","image-size","description"],"description":"Placeholder hints for empty states.\n\n[Docs](https://element-plus.org/en-US/component/empty.html#empty)"},"el-form":{"attributes":["model","rules","inline","label-position","label-width","label-suffix","hide-required-asterisk","require-asterisk-position","show-message","inline-message","status-icon","validate-on-rule-change","size","disabled","scroll-to-error","scroll-into-view-options","validate"],"subtags":["el-form-item"],"description":"Form consists of `input`, `radio`, `select`, `checkbox` and so on. With form, you can collect, verify and submit data.\n\n[Docs](https://element-plus.org/en-US/component/form.html#form)"},"el-form-item":{"attributes":["prop","label","label-width","required","rules","error","show-message","inline-message","size","for","validate-status"],"description":"[Docs](https://element-plus.org/en-US/component/form.html#formitem)"},"el-icon":{"attributes":["color","size"],"description":"Element Plus provides a set of common icons.\n\n[Docs](https://element-plus.org/en-US/component/icon.html#icon)"},"el-image":{"attributes":["src","fit","hide-on-click-modal","loading","lazy","scroll-container","alt","referrerpolicy","preview-src-list","z-index","initial-index","close-on-press-escape","preview-teleported","infinite","zoom-rate","load","error","switch","close","show"],"description":"Besides the native features of img, support lazy load, custom placeholder and load failure, etc.\n\n[Docs](https://element-plus.org/en-US/component/image.html#image)"},"el-image-viewer":{"attributes":["url-list","z-index","initial-index","infinite","hide-on-click-modal","teleported","zoom-rate","close-on-press-escape","close","switch","rotate"],"description":"[Docs](https://element-plus.org/en-US/component/image.html#image-viewer)"},"el-input-number":{"attributes":["model-value","min","max","step","step-strictly","precision","size","readonly","disabled","controls","controls-position","name","label","placeholder","id","value-on-clear","validate-event","change","blur","focus"],"description":"Input numerical values with a customizable range.\n\n[Docs](https://element-plus.org/en-US/component/input-number.html#input-number)"},"el-input":{"attributes":["type","model-value","maxlength","minlength","show-word-limit","placeholder","clearable","formatter","parser","show-password","disabled","size","prefix-icon","suffix-icon","rows","autosize","autocomplete","name","readonly","max","min","step","resize","autofocus","form","label","tabindex","validate-event","input-style","blur","focus","change","input","clear"],"description":"Input data using mouse or keyboard.\n\n[Docs](https://element-plus.org/en-US/component/input.html#input)"},"el-row":{"attributes":["gutter","justify","align","tag"],"subtags":["el-col"],"description":"[Docs](https://element-plus.org/en-US/component/layout.html#row)"},"el-col":{"attributes":["span","offset","push","pull","xs","sm","md","lg","xl","tag"],"description":"[Docs](https://element-plus.org/en-US/component/layout.html#col)"},"el-link":{"attributes":["type","underline","disabled","href","icon"],"description":"Text hyperlink\n\n[Docs](https://element-plus.org/en-US/component/link.html#link)"},"el-menu":{"attributes":["mode","collapse","ellipsis","background-color","text-color","active-text-color","default-active","default-openeds","unique-opened","menu-trigger","router","collapse-transition","popper-effect","select","open","close"],"subtags":["el-sub-menu","el-menu-item","el-menu-item-group"],"description":"Menu that provides navigation for your website.\n\n[Docs](https://element-plus.org/en-US/component/menu.html#menu)"},"el-sub-menu":{"attributes":["index","popper-class","show-timeout","hide-timeout","disabled","popper-append-to-body","teleported","popper-offset","expand-close-icon","expand-open-icon","collapse-close-icon","collapse-open-icon"],"subtags":["el-sub-menu","el-menu-item","el-menu-item-group"],"description":"[Docs](https://element-plus.org/en-US/component/menu.html#submenu)"},"el-menu-item":{"attributes":["index","route","disabled","click"],"description":"[Docs](https://element-plus.org/en-US/component/menu.html#menu-item)"},"el-menu-item-group":{"attributes":["title"],"subtags":["el-menu-item"],"description":"[Docs](https://element-plus.org/en-US/component/menu.html#menu-item-group)"},"el-page-header":{"attributes":["icon","title","content","back"],"description":"If path of the page is simple, it is recommended to use PageHeader instead of the Breadcrumb.\n\n[Docs](https://element-plus.org/en-US/component/page-header.html#page-header)"},"el-pagination":{"attributes":["small","background","page-size","default-page-size","total","page-count","pager-count","current-page","default-current-page","layout","page-sizes","popper-class","prev-text","prev-icon","next-text","next-icon","disabled","teleported","hide-on-single-page","size-change","current-change","prev-click","next-click"],"description":"If you have too much data to display in one page, use pagination.\n\n[Docs](https://element-plus.org/en-US/component/pagination.html#pagination)"},"el-popconfirm":{"attributes":["title","confirm-button-text","cancel-button-text","confirm-button-type","cancel-button-type","icon","icon-color","hide-icon","hide-after","teleported","persistent","width","confirm","cancel"],"description":"A simple confirmation dialog of an element click action.\n\n[Docs](https://element-plus.org/en-US/component/popconfirm.html#popconfirm)"},"el-popover":{"attributes":["trigger","title","effect","content","width","placement","disabled","visible","offset","transition","show-arrow","popper-options","popper-class","popper-style","show-after","hide-after","auto-close","tabindex","teleported","persistent","show","before-enter","after-enter","hide","before-leave","after-leave"],"description":":::tip\n\n[Docs](https://element-plus.org/en-US/component/popover.html#popover)"},"el-progress":{"attributes":["percentage","type","stroke-width","text-inside","status","indeterminate","duration","color","width","show-text","stroke-linecap","format","striped","striped-flow"],"description":"Progress is used to show the progress of current operation, and inform the user the current status.\n\n[Docs](https://element-plus.org/en-US/component/progress.html#progress)"},"el-radio":{"attributes":["model-value","label","disabled","border","size","name","change"],"description":"Single selection among multiple options.\n\n[Docs](https://element-plus.org/en-US/component/radio.html#radio)"},"el-radio-group":{"attributes":["model-value","size","disabled","text-color","fill","validate-event","label","name","id","change"],"subtags":["el-radio","el-radio-button"],"description":"[Docs](https://element-plus.org/en-US/component/radio.html#radiogroup)"},"el-radio-button":{"attributes":["label","disabled","name"],"description":"[Docs](https://element-plus.org/en-US/component/radio.html#radiobutton)"},"el-rate":{"attributes":["model-value","max","size","disabled","allow-half","low-threshold","high-threshold","colors","void-color","disabled-void-color","icons","void-icon","disabled-void-icon","show-text","show-score","text-color","texts","score-template","clearable","id","label","change"],"description":"Used for rating\n\n[Docs](https://element-plus.org/en-US/component/rate.html#rate)"},"el-result":{"attributes":["title","sub-title","icon"],"description":"Used to give feedback on the result of user's operation or access exception.\n\n[Docs](https://element-plus.org/en-US/component/result.html#result)"},"el-scrollbar":{"attributes":["height","max-height","native","wrap-style","wrap-class","view-style","view-class","noresize","tag","always","min-size","scroll"],"description":"Used to replace the browser's native scrollbar.\n\n[Docs](https://element-plus.org/en-US/component/scrollbar.html#scrollbar)"},"el-select-v2":{"attributes":["model-value","multiple","disabled","value-key","size","clearable","clear-icon","collapse-tags","multiple-limit","name","effect","autocomplete","placeholder","filterable","allow-create","reserve-keyword","no-data-text","popper-class","popper-append-to-body","teleported","persistent","popper-options","automatic-dropdown","height","item-height","scrollbar-always-on","remote","remote-method","validate-event","placement","collapse-tags-tooltip","max-collapse-tags","change","visible-change","remove-tag","clear","blur","focus"],"description":"[Docs](https://element-plus.org/en-US/component/select-v2.html#selectv2)"},"el-select":{"attributes":["model-value","multiple","disabled","value-key","size","clearable","collapse-tags","collapse-tags-tooltip","multiple-limit","name","effect","autocomplete","placeholder","filterable","allow-create","filter-method","remote","remote-method","remote-show-suffix","loading","loading-text","no-match-text","no-data-text","popper-class","reserve-keyword","default-first-option","teleported","persistent","automatic-dropdown","clear-icon","fit-input-width","suffix-icon","suffix-transition","tag-type","validate-event","placement","max-collapse-tags","popper-options","aria-label","change","visible-change","remove-tag","clear","blur","focus"],"subtags":["el-option-group","el-option"],"description":"When there are plenty of options, use a drop-down menu to display and select desired ones.\n\n[Docs](https://element-plus.org/en-US/component/select.html#select)"},"el-option-group":{"attributes":["label","disabled"],"subtags":["el-option"],"description":"[Docs](https://element-plus.org/en-US/component/select.html#option-group)"},"el-option":{"attributes":["value","label","disabled"],"description":"[Docs](https://element-plus.org/en-US/component/select.html#option)"},"el-skeleton":{"attributes":["animated","count","loading","rows","throttle"],"description":"When loading data, and you need a rich experience for visual and interactions for your end users, you can choose `skeleton`.\n\n[Docs](https://element-plus.org/en-US/component/skeleton.html#skeleton)"},"el-skeleton-item":{"attributes":["variant"],"description":"[Docs](https://element-plus.org/en-US/component/skeleton.html#skeletonitem)"},"el-slider":{"attributes":["model-value","min","max","disabled","step","show-input","show-input-controls","size","input-size","show-stops","show-tooltip","format-tooltip","range","vertical","height","label","range-start-label","range-end-label","format-value-text","debounce","tooltip-class","placement","marks","validate-event","change","input"],"description":"Drag the slider within a fixed range.\n\n[Docs](https://element-plus.org/en-US/component/slider.html#slider)"},"el-space":{"attributes":["alignment","class","direction","prefix-cls","style","spacer","size","wrap","fill","fill-ratio"],"description":"Even though we have [Divider]\n\n[Docs](https://element-plus.org/en-US/component/space.html#space)"},"el-statistic":{"description":"Display statistics.\n\n[Docs](https://element-plus.org/en-US/component/statistic.html#statistic)"},"el-countdown":{"description":":::demo Countdown component, support to add other components control countdown.\n\n[Docs](https://element-plus.org/en-US/component/statistic.html#countdown)"},"el-steps":{"attributes":["space","direction","active","process-status","finish-status","align-center","simple"],"subtags":["el-step"],"description":"Guide the user to complete tasks in accordance with the process. Its steps can be set according to the actual application scenario and the number of the steps can't be less than 2.\n\n[Docs](https://element-plus.org/en-US/component/steps.html#steps)"},"el-step":{"attributes":["title","description","icon","status"],"description":"[Docs](https://element-plus.org/en-US/component/steps.html#step)"},"el-switch":{"attributes":["model-value","disabled","loading","size","width","inline-prompt","active-icon","inactive-icon","active-action-icon","inactive-action-icon","active-text","inactive-text","active-value","inactive-value","active-color","inactive-color","border-color","name","validate-event","before-change","id","tabindex","change"],"description":"Switch is used for switching between two opposing states.\n\n[Docs](https://element-plus.org/en-US/component/switch.html#switch)"},"el-table-v2":{"attributes":["cache","estimated-row-height","header-class","header-props","header-cell-props","header-height","footer-height","row-class","row-key","row-props","row-height","cell-props","columns","data","data-getter","fixed-data","expand-column-key","expanded-row-keys","default-expanded-row-keys","class","fixed","width","height","max-height","h-scrollbar-size","v-scrollbar-size","scrollbar-always-on","sort-by","sort-state","column-sort","expanded-rows-change","end-reached","scroll","rows-rendered","row-expand","row-event-handlers"],"description":"[Docs](https://element-plus.org/en-US/component/table-v2.html#tablev2)"},"el-table":{"attributes":["data","height","max-height","stripe","border","size","fit","show-header","highlight-current-row","current-row-key","row-class-name","row-style","cell-class-name","cell-style","header-row-class-name","header-row-style","header-cell-class-name","header-cell-style","row-key","empty-text","default-expand-all","expand-row-keys","default-sort","tooltip-effect","tooltip-options","show-summary","sum-text","summary-method","span-method","select-on-indeterminate","indent","lazy","load","tree-props","table-layout","scrollbar-always-on","show-overflow-tooltip","flexible","select","select-all","selection-change","cell-mouse-enter","cell-mouse-leave","cell-click","cell-dblclick","cell-contextmenu","row-click","row-contextmenu","row-dblclick","header-click","header-contextmenu","sort-change","filter-change","current-change","header-dragend","expand-change"],"subtags":["el-table-column"],"description":"Display multiple data with similar format. You can sort, filter, compare your data in a table.\n\n[Docs](https://element-plus.org/en-US/component/table.html#table)"},"el-table-column":{"attributes":["type","index","label","column-key","prop","width","min-width","fixed","render-header","sortable","sort-method","sort-by","sort-orders","resizable","formatter","show-overflow-tooltip","align","header-align","class-name","label-class-name","selectable","reserve-selection","filters","filter-placement","filter-multiple","filter-method","filtered-value"],"description":"[Docs](https://element-plus.org/en-US/component/table.html#table-column)"},"el-tabs":{"attributes":["model-value","type","closable","addable","editable","tab-position","stretch","before-leave","tab-click","tab-change","tab-remove","tab-add","edit"],"subtags":["el-tab-pane"],"description":"Divide data collections which are related yet belong to different types.\n\n[Docs](https://element-plus.org/en-US/component/tabs.html#tabs)"},"el-tab-pane":{"attributes":["label","disabled","name","closable","lazy"],"description":"[Docs](https://element-plus.org/en-US/component/tabs.html#tab-pane)"},"el-tag":{"attributes":["type","closable","disable-transitions","hit","color","size","effect","round","click","close"],"description":"Used for marking and selection.\n\n[Docs](https://element-plus.org/en-US/component/tag.html#tag)"},"el-check-tag":{"attributes":["checked","change"],"description":"[Docs](https://element-plus.org/en-US/component/tag.html#checktag)"},"el-text":{"attributes":["type","size","truncated","tag"],"description":"Used for text.\n\n[Docs](https://element-plus.org/en-US/component/text.html#text)"},"el-time-picker":{"attributes":["model-value","readonly","disabled","editable","clearable","size","placeholder","start-placeholder","end-placeholder","is-range","arrow-control","popper-class","range-separator","format","default-value","id","name","label","prefix-icon","clear-icon","disabled-hours","disabled-minutes","disabled-seconds","teleported","tabindex","change","blur","focus","visible-change"],"description":"Use Time Picker for time input.\n\n[Docs](https://element-plus.org/en-US/component/time-picker.html#timepicker)"},"el-time-select":{"attributes":["model-value","disabled","editable","clearable","size","placeholder","name","effect","prefix-icon","clear-icon","start","end","step","min-time","max-time","format","change","blur","focus"],"description":"Use Time Select for time input.\n\n[Docs](https://element-plus.org/en-US/component/time-select.html#timeselect)"},"el-timeline":{"subtags":["el-timeline-item"],"description":"Visually display timeline.\n\n[Docs](https://element-plus.org/en-US/component/timeline.html#timeline)"},"el-timeline-item":{"attributes":["timestamp","hide-timestamp","center","placement","type","color","size","icon","hollow"],"description":"[Docs](https://element-plus.org/en-US/component/timeline.html#timeline-item)"},"el-tooltip":{"attributes":["append-to","effect","content","raw-content","placement","visible","disabled","offset","transition","popper-options","show-after","show-arrow","hide-after","auto-close","popper-class","enterable","teleported","trigger","virtual-triggering","virtual-ref","trigger-keys","persistent","aria-label"],"description":"Display prompt information for mouse hover.\n\n[Docs](https://element-plus.org/en-US/component/tooltip.html#tooltip)"},"el-transfer":{"attributes":["model-value","data","filterable","filter-placeholder","filter-method","target-order","titles","button-texts","render-content","format","props","left-default-checked","right-default-checked","validate-event","change","left-check-change","right-check-change"],"description":"[Docs](https://element-plus.org/en-US/component/transfer.html#transfer)"},"el-own":{"attributes":["cache-data"],"description":"[Docs](https://element-plus.org/en-US/component/tree-select.html#own)"},"el-tree-v2":{"attributes":["data","empty-text","props","highlight-current","expand-on-click-node","check-on-click-node","default-expanded-keys","show-checkbox","check-strictly","default-checked-keys","current-node-key","filter-method","indent","icon","item-size","node-click","node-contextmenu","check-change","check","current-change","node-expand","node-collapse"],"description":"[Docs](https://element-plus.org/en-US/component/tree-v2.html#treev2)"},"el-tree":{"attributes":["data","empty-text","node-key","props","render-after-expand","load","render-content","highlight-current","default-expand-all","expand-on-click-node","check-on-click-node","auto-expand-parent","default-expanded-keys","show-checkbox","check-strictly","default-checked-keys","current-node-key","filter-node-method","accordion","indent","icon","lazy","draggable","allow-drag","allow-drop","node-click","node-contextmenu","check-change","check","current-change","node-expand","node-collapse","node-drag-start","node-drag-enter","node-drag-leave","node-drag-over","node-drag-end","node-drop"],"description":"Display a set of data with hierarchies.\n\n[Docs](https://element-plus.org/en-US/component/tree.html#tree)"},"el-upload":{"attributes":["action","headers","method","multiple","data","name","with-credentials","show-file-list","drag","accept","on-preview","on-remove","on-success","on-error","on-progress","on-change","on-exceed","before-upload","before-remove","file-list","list-type","auto-upload","http-request","disabled","limit"],"description":"Upload files by clicking or drag-and-drop.\n\n[Docs](https://element-plus.org/en-US/component/upload.html#upload)"}}
1
+ {"el-affix":{"attributes":["offset","position","target","z-index","change","scroll"],"description":"Fix the element to a specific visible area.\n\n[Docs](https://element-plus.org/en-US/component/affix.html#affix)"},"el-alert":{"attributes":["title","type","description","closable","center","close-text","show-icon","effect","close"],"description":"Displays important alert messages.\n\n[Docs](https://element-plus.org/en-US/component/alert.html#alert)"},"el-autocomplete":{"attributes":["model-value","placeholder","clearable","disabled","value-key","debounce","placement","fetch-suggestions","trigger-on-focus","select-when-unmatched","name","label","hide-loading","popper-class","popper-append-to-body","teleported","highlight-first-item","fit-input-width","select","change"],"description":"Get some recommended tips based on the current input.\n\n[Docs](https://element-plus.org/en-US/component/autocomplete.html#autocomplete)"},"el-avatar":{"attributes":["icon","size","shape","src","src-set","alt","fit","error"],"description":"Avatars can be used to represent people or objects. It supports images, Icons, or characters.\n\n[Docs](https://element-plus.org/en-US/component/avatar.html#avatar)"},"el-backtop":{"attributes":["target","visibility-height","right","bottom","click"],"description":"A button to back to top.\n\n[Docs](https://element-plus.org/en-US/component/backtop.html#backtop)"},"el-badge":{"attributes":["value","max","is-dot","hidden","type"],"description":"A number or status mark on buttons and icons.\n\n[Docs](https://element-plus.org/en-US/component/badge.html#badge)"},"el-breadcrumb":{"attributes":["separator","separator-icon"],"subtags":["el-breadcrumb-item"],"description":"Displays the location of the current page, making it easier to browser back.\n\n[Docs](https://element-plus.org/en-US/component/breadcrumb.html#breadcrumb)"},"el-breadcrumb-item":{"attributes":["to","replace"],"description":"[Docs](https://element-plus.org/en-US/component/breadcrumb.html#breadcrumbitem)"},"el-button":{"attributes":["size","type","plain","text","bg","link","round","circle","loading","loading-icon","disabled","icon","autofocus","native-type","auto-insert-space","color","dark","tag"],"description":"Commonly used button.\n\n[Docs](https://element-plus.org/en-US/component/button.html#button)"},"el-button-group":{"attributes":["size","type"],"subtags":["el-button"],"description":"[Docs](https://element-plus.org/en-US/component/button.html#buttongroup)"},"el-calendar":{"attributes":["model-value","range"],"description":"Display date.\n\n[Docs](https://element-plus.org/en-US/component/calendar.html#calendar)"},"el-card":{"attributes":["header","body-style","body-class","shadow"],"description":"Integrate information in a card container.\n\n[Docs](https://element-plus.org/en-US/component/card.html#card)"},"el-carousel":{"attributes":["height","initial-index","trigger","autoplay","interval","indicator-position","arrow","type","loop","direction","pause-on-hover","change"],"subtags":["el-carousel-item"],"description":"Loop a series of images or texts in a limited space\n\n[Docs](https://element-plus.org/en-US/component/carousel.html#carousel)"},"el-carousel-item":{"attributes":["name","label"],"description":"[Docs](https://element-plus.org/en-US/component/carousel.html#carousel-item)"},"el-cascader":{"attributes":["model-value","options","props","size","placeholder","disabled","clearable","show-all-levels","collapse-tags","collapse-tags-tooltip","separator","filterable","filter-method","debounce","before-filter","popper-class","teleported","popper-append-to-body","tag-type","validate-event","max-collapse-tags","change","expand-change","blur","focus","visible-change","remove-tag"],"description":"If the options have a clear hierarchical structure, Cascader can be used to view and select them.\n\n[Docs](https://element-plus.org/en-US/component/cascader.html#cascader)"},"el-cascader-panel":{"attributes":["model-value","options","props","change","expand-change","close"],"description":"[Docs](https://element-plus.org/en-US/component/cascader.html#cascaderpanel)"},"el-checkbox":{"attributes":["model-value","label","true-label","false-label","disabled","border","size","name","checked","indeterminate","validate-event","tabindex","id","controls","change"],"description":"A group of options for multiple choices.\n\n[Docs](https://element-plus.org/en-US/component/checkbox.html#checkbox)"},"el-checkbox-group":{"attributes":["model-value","size","disabled","min","max","label","text-color","fill","tag","validate-event","change"],"subtags":["el-checkbox","el-checkbox-button"],"description":"[Docs](https://element-plus.org/en-US/component/checkbox.html#checkboxgroup)"},"el-checkbox-button":{"attributes":["label","true-label","false-label","disabled","name","checked"],"description":"[Docs](https://element-plus.org/en-US/component/checkbox.html#checkboxbutton)"},"el-collapse":{"attributes":["model-value","accordion","change"],"subtags":["el-collapse-item"],"description":"Use Collapse to store contents.\n\n[Docs](https://element-plus.org/en-US/component/collapse.html#collapse)"},"el-collapse-item":{"attributes":["name","title","disabled"],"description":"[Docs](https://element-plus.org/en-US/component/collapse.html#collapse-item)"},"el-color-picker":{"attributes":["model-value","disabled","size","show-alpha","color-format","popper-class","predefine","validate-event","tabindex","label","id","change","active-change","focus","blur"],"description":"ColorPicker is a color selector supporting multiple color formats.\n\n[Docs](https://element-plus.org/en-US/component/color-picker.html#colorpicker)"},"el-config-provider":{"attributes":["locale","size","z-index","namespace","button","message","experimental-features"],"description":"Config Provider is used for providing global configurations, which enables your entire application to access these configurations everywhere.\n\n[Docs](https://element-plus.org/en-US/component/config-provider.html#config-provider)"},"el-container":{"attributes":["direction"],"subtags":["el-container","el-header","el-aside","el-main","el-footer"],"description":"Container components for scaffolding basic structure of the page:\n\n[Docs](https://element-plus.org/en-US/component/container.html#container)"},"el-header":{"attributes":["height"],"description":"[Docs](https://element-plus.org/en-US/component/container.html#header)"},"el-aside":{"attributes":["width"],"description":"[Docs](https://element-plus.org/en-US/component/container.html#aside)"},"el-main":{"description":"[Docs](https://element-plus.org/en-US/component/container.html#main)"},"el-footer":{"attributes":["height"],"description":"[Docs](https://element-plus.org/en-US/component/container.html#footer)"},"el-date-picker":{"attributes":["model-value","readonly","disabled","size","editable","clearable","placeholder","start-placeholder","end-placeholder","type","format","popper-class","popper-options","range-separator","default-value","default-time","value-format","id","name","unlink-panels","prefix-icon","clear-icon","validate-event","disabled-date","shortcuts","cell-class-name","teleported","change","blur","focus","calendar-change","panel-change","visible-change"],"description":"Use Date Picker for date input.\n\n[Docs](https://element-plus.org/en-US/component/date-picker.html#datepicker)"},"el-descriptions":{"attributes":["border","column","direction","size","title","extra"],"subtags":["el-descriptions-item"],"description":"Display multiple fields in list form.\n\n[Docs](https://element-plus.org/en-US/component/descriptions.html#descriptions)"},"el-descriptions-item":{"attributes":["label","span","width","min-width","align","label-align","class-name","label-class-name"],"description":"[Docs](https://element-plus.org/en-US/component/descriptions.html#descriptionsitem)"},"el-dialog":{"attributes":["model-value","title","width","fullscreen","top","modal","modal-class","append-to-body","lock-scroll","custom-class","open-delay","close-delay","close-on-click-modal","close-on-press-escape","show-close","before-close","draggable","center","align-center","destroy-on-close","close-icon","z-index","header-aria-level","open","opened","close","closed","open-auto-focus","close-auto-focus"],"description":"Informs users while preserving the current page state.\n\n[Docs](https://element-plus.org/en-US/component/dialog.html#dialog)"},"el-divider":{"attributes":["direction","border-style","content-position"],"description":"The dividing line that separates the content.\n\n[Docs](https://element-plus.org/en-US/component/divider.html#divider)"},"el-drawer":{"attributes":["model-value","append-to-body","lock-scroll","before-close","close-on-click-modal","close-on-press-escape","open-delay","close-delay","custom-class","destroy-on-close","modal","direction","show-close","size","title","with-header","modal-class","z-index","header-aria-level","open","opened","close","closed"],"description":"Sometimes, `Dialog` does not always satisfy our requirements, let's say you have a massive form, or you need space to display something like `terms & conditions`, `Drawer` has almost identical API with `Dialog`, but it introduces different user experience.\n\n[Docs](https://element-plus.org/en-US/component/drawer.html#drawer)"},"el-dropdown":{"attributes":["type","size","max-height","split-button","disabled","placement","trigger","hide-on-click","show-timeout","hide-timeout","role","tabindex","popper-class","popper-options","teleported","click","command","visible-change"],"subtags":["el-dropdown-menu"],"description":"Toggleable menu for displaying lists of links and actions.\n\n[Docs](https://element-plus.org/en-US/component/dropdown.html#dropdown)"},"el-dropdown-menu":{"subtags":["el-dropdown-item"],"description":"[Docs](https://element-plus.org/en-US/component/dropdown.html#dropdown-menu)"},"el-dropdown-item":{"attributes":["command","disabled","divided","icon"],"description":"[Docs](https://element-plus.org/en-US/component/dropdown.html#dropdown-item)"},"el-empty":{"attributes":["image","image-size","description"],"description":"Placeholder hints for empty states.\n\n[Docs](https://element-plus.org/en-US/component/empty.html#empty)"},"el-form":{"attributes":["model","rules","inline","label-position","label-width","label-suffix","hide-required-asterisk","require-asterisk-position","show-message","inline-message","status-icon","validate-on-rule-change","size","disabled","scroll-to-error","scroll-into-view-options","validate"],"subtags":["el-form-item"],"description":"Form consists of `input`, `radio`, `select`, `checkbox` and so on. With form, you can collect, verify and submit data.\n\n[Docs](https://element-plus.org/en-US/component/form.html#form)"},"el-form-item":{"attributes":["prop","label","label-width","required","rules","error","show-message","inline-message","size","for","validate-status"],"description":"[Docs](https://element-plus.org/en-US/component/form.html#formitem)"},"el-icon":{"attributes":["color","size"],"description":"Element Plus provides a set of common icons.\n\n[Docs](https://element-plus.org/en-US/component/icon.html#icon)"},"el-image":{"attributes":["src","fit","hide-on-click-modal","loading","lazy","scroll-container","alt","referrerpolicy","preview-src-list","z-index","initial-index","close-on-press-escape","preview-teleported","infinite","zoom-rate","load","error","switch","close","show"],"description":"Besides the native features of img, support lazy load, custom placeholder and load failure, etc.\n\n[Docs](https://element-plus.org/en-US/component/image.html#image)"},"el-image-viewer":{"attributes":["url-list","z-index","initial-index","infinite","hide-on-click-modal","teleported","zoom-rate","close-on-press-escape","close","switch","rotate"],"description":"[Docs](https://element-plus.org/en-US/component/image.html#image-viewer)"},"el-input-number":{"attributes":["model-value","min","max","step","step-strictly","precision","size","readonly","disabled","controls","controls-position","name","label","placeholder","id","value-on-clear","validate-event","change","blur","focus"],"description":"Input numerical values with a customizable range.\n\n[Docs](https://element-plus.org/en-US/component/input-number.html#input-number)"},"el-input":{"attributes":["type","model-value","maxlength","minlength","show-word-limit","placeholder","clearable","formatter","parser","show-password","disabled","size","prefix-icon","suffix-icon","rows","autosize","autocomplete","name","readonly","max","min","step","resize","autofocus","form","label","tabindex","validate-event","input-style","blur","focus","change","input","clear"],"description":"Input data using mouse or keyboard.\n\n[Docs](https://element-plus.org/en-US/component/input.html#input)"},"el-row":{"attributes":["gutter","justify","align","tag"],"subtags":["el-col"],"description":"[Docs](https://element-plus.org/en-US/component/layout.html#row)"},"el-col":{"attributes":["span","offset","push","pull","xs","sm","md","lg","xl","tag"],"description":"[Docs](https://element-plus.org/en-US/component/layout.html#col)"},"el-link":{"attributes":["type","underline","disabled","href","icon"],"description":"Text hyperlink\n\n[Docs](https://element-plus.org/en-US/component/link.html#link)"},"el-menu":{"attributes":["mode","collapse","ellipsis","background-color","text-color","active-text-color","default-active","default-openeds","unique-opened","menu-trigger","router","collapse-transition","popper-effect","select","open","close"],"subtags":["el-sub-menu","el-menu-item","el-menu-item-group"],"description":"Menu that provides navigation for your website.\n\n[Docs](https://element-plus.org/en-US/component/menu.html#menu)"},"el-sub-menu":{"attributes":["index","popper-class","show-timeout","hide-timeout","disabled","popper-append-to-body","teleported","popper-offset","expand-close-icon","expand-open-icon","collapse-close-icon","collapse-open-icon"],"subtags":["el-sub-menu","el-menu-item","el-menu-item-group"],"description":"[Docs](https://element-plus.org/en-US/component/menu.html#submenu)"},"el-menu-item":{"attributes":["index","route","disabled","click"],"description":"[Docs](https://element-plus.org/en-US/component/menu.html#menu-item)"},"el-menu-item-group":{"attributes":["title"],"subtags":["el-menu-item"],"description":"[Docs](https://element-plus.org/en-US/component/menu.html#menu-item-group)"},"el-page-header":{"attributes":["icon","title","content","back"],"description":"If path of the page is simple, it is recommended to use PageHeader instead of the Breadcrumb.\n\n[Docs](https://element-plus.org/en-US/component/page-header.html#page-header)"},"el-pagination":{"attributes":["small","background","page-size","default-page-size","total","page-count","pager-count","current-page","default-current-page","layout","page-sizes","popper-class","prev-text","prev-icon","next-text","next-icon","disabled","teleported","hide-on-single-page","size-change","current-change","prev-click","next-click"],"description":"If you have too much data to display in one page, use pagination.\n\n[Docs](https://element-plus.org/en-US/component/pagination.html#pagination)"},"el-popconfirm":{"attributes":["title","confirm-button-text","cancel-button-text","confirm-button-type","cancel-button-type","icon","icon-color","hide-icon","hide-after","teleported","persistent","width","confirm","cancel"],"description":"A simple confirmation dialog of an element click action.\n\n[Docs](https://element-plus.org/en-US/component/popconfirm.html#popconfirm)"},"el-popover":{"attributes":["trigger","title","effect","content","width","placement","disabled","visible","offset","transition","show-arrow","popper-options","popper-class","popper-style","show-after","hide-after","auto-close","tabindex","teleported","persistent","show","before-enter","after-enter","hide","before-leave","after-leave"],"description":":::tip\n\n[Docs](https://element-plus.org/en-US/component/popover.html#popover)"},"el-progress":{"attributes":["percentage","type","stroke-width","text-inside","status","indeterminate","duration","color","width","show-text","stroke-linecap","format","striped","striped-flow"],"description":"Progress is used to show the progress of current operation, and inform the user the current status.\n\n[Docs](https://element-plus.org/en-US/component/progress.html#progress)"},"el-radio":{"attributes":["model-value","label","disabled","border","size","name","change"],"description":"Single selection among multiple options.\n\n[Docs](https://element-plus.org/en-US/component/radio.html#radio)"},"el-radio-group":{"attributes":["model-value","size","disabled","text-color","fill","validate-event","label","name","id","change"],"subtags":["el-radio","el-radio-button"],"description":"[Docs](https://element-plus.org/en-US/component/radio.html#radiogroup)"},"el-radio-button":{"attributes":["label","disabled","name"],"description":"[Docs](https://element-plus.org/en-US/component/radio.html#radiobutton)"},"el-rate":{"attributes":["model-value","max","size","disabled","allow-half","low-threshold","high-threshold","colors","void-color","disabled-void-color","icons","void-icon","disabled-void-icon","show-text","show-score","text-color","texts","score-template","clearable","id","label","change"],"description":"Used for rating\n\n[Docs](https://element-plus.org/en-US/component/rate.html#rate)"},"el-result":{"attributes":["title","sub-title","icon"],"description":"Used to give feedback on the result of user's operation or access exception.\n\n[Docs](https://element-plus.org/en-US/component/result.html#result)"},"el-scrollbar":{"attributes":["height","max-height","native","wrap-style","wrap-class","view-style","view-class","noresize","tag","always","min-size","scroll"],"description":"Used to replace the browser's native scrollbar.\n\n[Docs](https://element-plus.org/en-US/component/scrollbar.html#scrollbar)"},"el-select-v2":{"attributes":["model-value","multiple","disabled","value-key","size","clearable","clear-icon","collapse-tags","multiple-limit","name","effect","autocomplete","placeholder","filterable","allow-create","reserve-keyword","no-data-text","popper-class","popper-append-to-body","teleported","persistent","popper-options","automatic-dropdown","height","item-height","scrollbar-always-on","remote","remote-method","validate-event","placement","collapse-tags-tooltip","max-collapse-tags","change","visible-change","remove-tag","clear","blur","focus"],"description":"[Docs](https://element-plus.org/en-US/component/select-v2.html#selectv2)"},"el-select":{"attributes":["model-value","multiple","disabled","value-key","size","clearable","collapse-tags","collapse-tags-tooltip","multiple-limit","name","effect","autocomplete","placeholder","filterable","allow-create","filter-method","remote","remote-method","remote-show-suffix","loading","loading-text","no-match-text","no-data-text","popper-class","reserve-keyword","default-first-option","teleported","persistent","automatic-dropdown","clear-icon","fit-input-width","suffix-icon","suffix-transition","tag-type","validate-event","placement","max-collapse-tags","popper-options","aria-label","change","visible-change","remove-tag","clear","blur","focus"],"subtags":["el-option-group","el-option"],"description":"When there are plenty of options, use a drop-down menu to display and select desired ones.\n\n[Docs](https://element-plus.org/en-US/component/select.html#select)"},"el-option-group":{"attributes":["label","disabled"],"subtags":["el-option"],"description":"[Docs](https://element-plus.org/en-US/component/select.html#option-group)"},"el-option":{"attributes":["value","label","disabled"],"description":"[Docs](https://element-plus.org/en-US/component/select.html#option)"},"el-skeleton":{"attributes":["animated","count","loading","rows","throttle"],"description":"When loading data, and you need a rich experience for visual and interactions for your end users, you can choose `skeleton`.\n\n[Docs](https://element-plus.org/en-US/component/skeleton.html#skeleton)"},"el-skeleton-item":{"attributes":["variant"],"description":"[Docs](https://element-plus.org/en-US/component/skeleton.html#skeletonitem)"},"el-slider":{"attributes":["model-value","min","max","disabled","step","show-input","show-input-controls","size","input-size","show-stops","show-tooltip","format-tooltip","range","vertical","height","label","range-start-label","range-end-label","format-value-text","debounce","tooltip-class","placement","marks","validate-event","change","input"],"description":"Drag the slider within a fixed range.\n\n[Docs](https://element-plus.org/en-US/component/slider.html#slider)"},"el-space":{"attributes":["alignment","class","direction","prefix-cls","style","spacer","size","wrap","fill","fill-ratio"],"description":"Even though we have [Divider]\n\n[Docs](https://element-plus.org/en-US/component/space.html#space)"},"el-statistic":{"description":"Display statistics.\n\n[Docs](https://element-plus.org/en-US/component/statistic.html#statistic)"},"el-countdown":{"description":":::demo Countdown component, support to add other components control countdown.\n\n[Docs](https://element-plus.org/en-US/component/statistic.html#countdown)"},"el-steps":{"attributes":["space","direction","active","process-status","finish-status","align-center","simple"],"subtags":["el-step"],"description":"Guide the user to complete tasks in accordance with the process. Its steps can be set according to the actual application scenario and the number of the steps can't be less than 2.\n\n[Docs](https://element-plus.org/en-US/component/steps.html#steps)"},"el-step":{"attributes":["title","description","icon","status"],"description":"[Docs](https://element-plus.org/en-US/component/steps.html#step)"},"el-switch":{"attributes":["model-value","disabled","loading","size","width","inline-prompt","active-icon","inactive-icon","active-action-icon","inactive-action-icon","active-text","inactive-text","active-value","inactive-value","active-color","inactive-color","border-color","name","validate-event","before-change","id","tabindex","change"],"description":"Switch is used for switching between two opposing states.\n\n[Docs](https://element-plus.org/en-US/component/switch.html#switch)"},"el-table-v2":{"attributes":["cache","estimated-row-height","header-class","header-props","header-cell-props","header-height","footer-height","row-class","row-key","row-props","row-height","cell-props","columns","data","data-getter","fixed-data","expand-column-key","expanded-row-keys","default-expanded-row-keys","class","fixed","width","height","max-height","h-scrollbar-size","v-scrollbar-size","scrollbar-always-on","sort-by","sort-state","column-sort","expanded-rows-change","end-reached","scroll","rows-rendered","row-expand","row-event-handlers"],"description":"[Docs](https://element-plus.org/en-US/component/table-v2.html#tablev2)"},"el-table":{"attributes":["data","height","max-height","stripe","border","size","fit","show-header","highlight-current-row","current-row-key","row-class-name","row-style","cell-class-name","cell-style","header-row-class-name","header-row-style","header-cell-class-name","header-cell-style","row-key","empty-text","default-expand-all","expand-row-keys","default-sort","tooltip-effect","tooltip-options","show-summary","sum-text","summary-method","span-method","select-on-indeterminate","indent","lazy","load","tree-props","table-layout","scrollbar-always-on","show-overflow-tooltip","flexible","select","select-all","selection-change","cell-mouse-enter","cell-mouse-leave","cell-click","cell-dblclick","cell-contextmenu","row-click","row-contextmenu","row-dblclick","header-click","header-contextmenu","sort-change","filter-change","current-change","header-dragend","expand-change"],"subtags":["el-table-column"],"description":"Display multiple data with similar format. You can sort, filter, compare your data in a table.\n\n[Docs](https://element-plus.org/en-US/component/table.html#table)"},"el-table-column":{"attributes":["type","index","label","column-key","prop","width","min-width","fixed","render-header","sortable","sort-method","sort-by","sort-orders","resizable","formatter","show-overflow-tooltip","align","header-align","class-name","label-class-name","selectable","reserve-selection","filters","filter-placement","filter-multiple","filter-method","filtered-value"],"description":"[Docs](https://element-plus.org/en-US/component/table.html#table-column)"},"el-tabs":{"attributes":["model-value","type","closable","addable","editable","tab-position","stretch","before-leave","tab-click","tab-change","tab-remove","tab-add","edit"],"subtags":["el-tab-pane"],"description":"Divide data collections which are related yet belong to different types.\n\n[Docs](https://element-plus.org/en-US/component/tabs.html#tabs)"},"el-tab-pane":{"attributes":["label","disabled","name","closable","lazy"],"description":"[Docs](https://element-plus.org/en-US/component/tabs.html#tab-pane)"},"el-tag":{"attributes":["type","closable","disable-transitions","hit","color","size","effect","round","click","close"],"description":"Used for marking and selection.\n\n[Docs](https://element-plus.org/en-US/component/tag.html#tag)"},"el-check-tag":{"attributes":["checked","change"],"description":"[Docs](https://element-plus.org/en-US/component/tag.html#checktag)"},"el-text":{"attributes":["type","size","truncated","tag"],"description":"Used for text.\n\n[Docs](https://element-plus.org/en-US/component/text.html#text)"},"el-time-picker":{"attributes":["model-value","readonly","disabled","editable","clearable","size","placeholder","start-placeholder","end-placeholder","is-range","arrow-control","popper-class","range-separator","format","default-value","id","name","label","prefix-icon","clear-icon","disabled-hours","disabled-minutes","disabled-seconds","teleported","tabindex","change","blur","focus","visible-change"],"description":"Use Time Picker for time input.\n\n[Docs](https://element-plus.org/en-US/component/time-picker.html#timepicker)"},"el-time-select":{"attributes":["model-value","disabled","editable","clearable","size","placeholder","name","effect","prefix-icon","clear-icon","start","end","step","min-time","max-time","format","change","blur","focus"],"description":"Use Time Select for time input.\n\n[Docs](https://element-plus.org/en-US/component/time-select.html#timeselect)"},"el-timeline":{"subtags":["el-timeline-item"],"description":"Visually display timeline.\n\n[Docs](https://element-plus.org/en-US/component/timeline.html#timeline)"},"el-timeline-item":{"attributes":["timestamp","hide-timestamp","center","placement","type","color","size","icon","hollow"],"description":"[Docs](https://element-plus.org/en-US/component/timeline.html#timeline-item)"},"el-tooltip":{"attributes":["append-to","effect","content","raw-content","placement","visible","disabled","offset","transition","popper-options","show-after","show-arrow","hide-after","auto-close","popper-class","enterable","teleported","trigger","virtual-triggering","virtual-ref","trigger-keys","persistent","aria-label"],"description":"Display prompt information for mouse hover.\n\n[Docs](https://element-plus.org/en-US/component/tooltip.html#tooltip)"},"el-transfer":{"attributes":["model-value","data","filterable","filter-placeholder","filter-method","target-order","titles","button-texts","render-content","format","props","left-default-checked","right-default-checked","validate-event","change","left-check-change","right-check-change"],"description":"[Docs](https://element-plus.org/en-US/component/transfer.html#transfer)"},"el-own":{"attributes":["cache-data"],"description":"[Docs](https://element-plus.org/en-US/component/tree-select.html#own)"},"el-tree-v2":{"attributes":["data","empty-text","props","highlight-current","expand-on-click-node","check-on-click-node","default-expanded-keys","show-checkbox","check-strictly","default-checked-keys","current-node-key","filter-method","indent","icon","item-size","node-click","node-contextmenu","check-change","check","current-change","node-expand","node-collapse"],"description":"[Docs](https://element-plus.org/en-US/component/tree-v2.html#treev2)"},"el-tree":{"attributes":["data","empty-text","node-key","props","render-after-expand","load","render-content","highlight-current","default-expand-all","expand-on-click-node","check-on-click-node","auto-expand-parent","default-expanded-keys","show-checkbox","check-strictly","default-checked-keys","current-node-key","filter-node-method","accordion","indent","icon","lazy","draggable","allow-drag","allow-drop","node-click","node-contextmenu","check-change","check","current-change","node-expand","node-collapse","node-drag-start","node-drag-enter","node-drag-leave","node-drag-over","node-drag-end","node-drop"],"description":"Display a set of data with hierarchies.\n\n[Docs](https://element-plus.org/en-US/component/tree.html#tree)"},"el-upload":{"attributes":["action","headers","method","multiple","data","name","with-credentials","show-file-list","drag","accept","on-preview","on-remove","on-success","on-error","on-progress","on-change","on-exceed","before-upload","before-remove","file-list","list-type","auto-upload","http-request","disabled","limit"],"description":"Upload files by clicking or drag-and-drop.\n\n[Docs](https://element-plus.org/en-US/component/upload.html#upload)"},"el-watermark":{"attributes":["width","height","rotate","z-index","image","content","font","gap","offset"],"description":"Add specific text or patterns to the page.\n\n[Docs](https://element-plus.org/en-US/component/watermark.html#watermark)"}}
@@ -1 +1 @@
1
- .el-color-predefine{display:flex;font-size:12px;margin-top:8px;width:280px}.el-color-predefine__colors{display:flex;flex:1;flex-wrap:wrap}.el-color-predefine__color-selector{margin:0 0 8px 8px;width:20px;height:20px;border-radius:4px;cursor:pointer}.el-color-predefine__color-selector:nth-child(10n+1){margin-left:0}.el-color-predefine__color-selector.selected{box-shadow:0 0 3px 2px var(--el-color-primary)}.el-color-predefine__color-selector>div{display:flex;height:100%;border-radius:3px}.el-color-predefine__color-selector.is-alpha{background-image:url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAwAAAAMCAIAAADZF8uwAAAAGUlEQVQYV2M4gwH+YwCGIasIUwhT25BVBADtzYNYrHvv4gAAAABJRU5ErkJggg==)}.el-color-hue-slider{position:relative;box-sizing:border-box;width:280px;height:12px;background-color:red;padding:0 2px;float:right}.el-color-hue-slider__bar{position:relative;background:linear-gradient(to right,red 0,#ff0 17%,#0f0 33%,#0ff 50%,#00f 67%,#f0f 83%,red 100%);height:100%}.el-color-hue-slider__thumb{position:absolute;cursor:pointer;box-sizing:border-box;left:0;top:0;width:4px;height:100%;border-radius:1px;background:#fff;border:1px solid var(--el-border-color-lighter);box-shadow:0 0 2px rgba(0,0,0,.6);z-index:1}.el-color-hue-slider.is-vertical{width:12px;height:180px;padding:2px 0}.el-color-hue-slider.is-vertical .el-color-hue-slider__bar{background:linear-gradient(to bottom,red 0,#ff0 17%,#0f0 33%,#0ff 50%,#00f 67%,#f0f 83%,red 100%)}.el-color-hue-slider.is-vertical .el-color-hue-slider__thumb{left:0;top:0;width:100%;height:4px}.el-color-svpanel{position:relative;width:280px;height:180px}.el-color-svpanel__black,.el-color-svpanel__white{position:absolute;top:0;left:0;right:0;bottom:0}.el-color-svpanel__white{background:linear-gradient(to right,#fff,rgba(255,255,255,0))}.el-color-svpanel__black{background:linear-gradient(to top,#000,rgba(0,0,0,0))}.el-color-svpanel__cursor{position:absolute}.el-color-svpanel__cursor>div{cursor:head;width:4px;height:4px;box-shadow:0 0 0 1.5px #fff,inset 0 0 1px 1px rgba(0,0,0,.3),0 0 1px 2px rgba(0,0,0,.4);border-radius:50%;transform:translate(-2px,-2px)}.el-color-alpha-slider{position:relative;box-sizing:border-box;width:280px;height:12px;background-image:linear-gradient(45deg,var(--el-color-picker-alpha-bg-a) 25%,var(--el-color-picker-alpha-bg-b) 25%),linear-gradient(135deg,var(--el-color-picker-alpha-bg-a) 25%,var(--el-color-picker-alpha-bg-b) 25%),linear-gradient(45deg,var(--el-color-picker-alpha-bg-b) 75%,var(--el-color-picker-alpha-bg-a) 75%),linear-gradient(135deg,var(--el-color-picker-alpha-bg-b) 75%,var(--el-color-picker-alpha-bg-a) 75%);background-size:12px 12px;background-position:0 0,6px 0,6px -6px,0 6px}.el-color-alpha-slider__bar{position:relative;background:linear-gradient(to right,rgba(255,255,255,0) 0,var(--el-bg-color) 100%);height:100%}.el-color-alpha-slider__thumb{position:absolute;cursor:pointer;box-sizing:border-box;left:0;top:0;width:4px;height:100%;border-radius:1px;background:#fff;border:1px solid var(--el-border-color-lighter);box-shadow:0 0 2px rgba(0,0,0,.6);z-index:1}.el-color-alpha-slider.is-vertical{width:20px;height:180px}.el-color-alpha-slider.is-vertical .el-color-alpha-slider__bar{background:linear-gradient(to bottom,rgba(255,255,255,0) 0,#fff 100%)}.el-color-alpha-slider.is-vertical .el-color-alpha-slider__thumb{left:0;top:0;width:100%;height:4px}.el-color-dropdown{width:300px}.el-color-dropdown__main-wrapper{margin-bottom:6px}.el-color-dropdown__main-wrapper::after{content:"";display:table;clear:both}.el-color-dropdown__btns{margin-top:12px;text-align:right}.el-color-dropdown__value{float:left;line-height:26px;font-size:12px;color:#000;width:160px}.el-color-picker{display:inline-block;position:relative;line-height:normal;outline:0}.el-color-picker:hover:not(.is-disabled) .el-color-picker__trigger{border:1px solid var(--el-border-color-hover)}.el-color-picker:focus-visible:not(.is-disabled) .el-color-picker__trigger{outline:2px solid var(--el-color-primary);outline-offset:1px}.el-color-picker.is-disabled .el-color-picker__trigger{cursor:not-allowed}.el-color-picker--large{height:40px}.el-color-picker--large .el-color-picker__trigger{height:40px;width:40px}.el-color-picker--large .el-color-picker__mask{height:38px;width:38px}.el-color-picker--small{height:24px}.el-color-picker--small .el-color-picker__trigger{height:24px;width:24px}.el-color-picker--small .el-color-picker__mask{height:22px;width:22px}.el-color-picker--small .el-color-picker__empty,.el-color-picker--small .el-color-picker__icon{transform:scale(.8)}.el-color-picker__mask{height:30px;width:30px;border-radius:4px;position:absolute;top:1px;left:1px;z-index:1;cursor:not-allowed;background-color:rgba(255,255,255,.7)}.el-color-picker__trigger{display:inline-flex;justify-content:center;align-items:center;box-sizing:border-box;height:32px;width:32px;padding:4px;border:1px solid var(--el-border-color);border-radius:4px;font-size:0;position:relative;cursor:pointer}.el-color-picker__color{position:relative;display:block;box-sizing:border-box;border:1px solid var(--el-text-color-secondary);border-radius:var(--el-border-radius-small);width:100%;height:100%;text-align:center}.el-color-picker__color.is-alpha{background-image:linear-gradient(45deg,var(--el-color-picker-alpha-bg-a) 25%,var(--el-color-picker-alpha-bg-b) 25%),linear-gradient(135deg,var(--el-color-picker-alpha-bg-a) 25%,var(--el-color-picker-alpha-bg-b) 25%),linear-gradient(45deg,var(--el-color-picker-alpha-bg-b) 75%,var(--el-color-picker-alpha-bg-a) 75%),linear-gradient(135deg,var(--el-color-picker-alpha-bg-b) 75%,var(--el-color-picker-alpha-bg-a) 75%);background-size:12px 12px;background-position:0 0,6px 0,6px -6px,0 6px}.el-color-picker__color-inner{display:inline-flex;justify-content:center;align-items:center;width:100%;height:100%}.el-color-picker .el-color-picker__empty{font-size:12px;color:var(--el-text-color-secondary)}.el-color-picker .el-color-picker__icon{display:inline-flex;justify-content:center;align-items:center;color:#fff;font-size:12px}.el-color-picker__panel{position:absolute;z-index:10;padding:6px;box-sizing:content-box;background-color:#fff;border-radius:var(--el-border-radius-base);box-shadow:var(--el-box-shadow-light)}.el-color-picker__panel.el-popper{border:1px solid var(--el-border-color-lighter)}.el-color-picker,.el-color-picker__panel{--el-color-picker-alpha-bg-a:#ccc;--el-color-picker-alpha-bg-b:transparent}.dark .el-color-picker,.dark .el-color-picker__panel{--el-color-picker-alpha-bg-a:#333333}
1
+ .el-color-predefine{display:flex;font-size:12px;margin-top:8px;width:280px}.el-color-predefine__colors{display:flex;flex:1;flex-wrap:wrap}.el-color-predefine__color-selector{margin:0 0 8px 8px;width:20px;height:20px;border-radius:4px;cursor:pointer}.el-color-predefine__color-selector:nth-child(10n+1){margin-left:0}.el-color-predefine__color-selector.selected{box-shadow:0 0 3px 2px var(--el-color-primary)}.el-color-predefine__color-selector>div{display:flex;height:100%;border-radius:3px}.el-color-predefine__color-selector.is-alpha{background-image:url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAwAAAAMCAIAAADZF8uwAAAAGUlEQVQYV2M4gwH+YwCGIasIUwhT25BVBADtzYNYrHvv4gAAAABJRU5ErkJggg==)}.el-color-hue-slider{position:relative;box-sizing:border-box;width:280px;height:12px;background-color:red;padding:0 2px;float:right}.el-color-hue-slider__bar{position:relative;background:linear-gradient(to right,red 0,#ff0 17%,#0f0 33%,#0ff 50%,#00f 67%,#f0f 83%,red 100%);height:100%}.el-color-hue-slider__thumb{position:absolute;cursor:pointer;box-sizing:border-box;left:0;top:0;width:4px;height:100%;border-radius:1px;background:#fff;border:1px solid var(--el-border-color-lighter);box-shadow:0 0 2px rgba(0,0,0,.6);z-index:1}.el-color-hue-slider.is-vertical{width:12px;height:180px;padding:2px 0}.el-color-hue-slider.is-vertical .el-color-hue-slider__bar{background:linear-gradient(to bottom,red 0,#ff0 17%,#0f0 33%,#0ff 50%,#00f 67%,#f0f 83%,red 100%)}.el-color-hue-slider.is-vertical .el-color-hue-slider__thumb{left:0;top:0;width:100%;height:4px}.el-color-svpanel{position:relative;width:280px;height:180px}.el-color-svpanel__black,.el-color-svpanel__white{position:absolute;top:0;left:0;right:0;bottom:0}.el-color-svpanel__white{background:linear-gradient(to right,#fff,rgba(255,255,255,0))}.el-color-svpanel__black{background:linear-gradient(to top,#000,rgba(0,0,0,0))}.el-color-svpanel__cursor{position:absolute}.el-color-svpanel__cursor>div{cursor:head;width:4px;height:4px;box-shadow:0 0 0 1.5px #fff,inset 0 0 1px 1px rgba(0,0,0,.3),0 0 1px 2px rgba(0,0,0,.4);border-radius:50%;transform:translate(-2px,-2px)}.el-color-alpha-slider{position:relative;box-sizing:border-box;width:280px;height:12px;background-image:linear-gradient(45deg,var(--el-color-picker-alpha-bg-a) 25%,var(--el-color-picker-alpha-bg-b) 25%),linear-gradient(135deg,var(--el-color-picker-alpha-bg-a) 25%,var(--el-color-picker-alpha-bg-b) 25%),linear-gradient(45deg,var(--el-color-picker-alpha-bg-b) 75%,var(--el-color-picker-alpha-bg-a) 75%),linear-gradient(135deg,var(--el-color-picker-alpha-bg-b) 75%,var(--el-color-picker-alpha-bg-a) 75%);background-size:12px 12px;background-position:0 0,6px 0,6px -6px,0 6px}.el-color-alpha-slider__bar{position:relative;background:linear-gradient(to right,rgba(255,255,255,0) 0,var(--el-bg-color) 100%);height:100%}.el-color-alpha-slider__thumb{position:absolute;cursor:pointer;box-sizing:border-box;left:0;top:0;width:4px;height:100%;border-radius:1px;background:#fff;border:1px solid var(--el-border-color-lighter);box-shadow:0 0 2px rgba(0,0,0,.6);z-index:1}.el-color-alpha-slider.is-vertical{width:20px;height:180px}.el-color-alpha-slider.is-vertical .el-color-alpha-slider__bar{background:linear-gradient(to bottom,rgba(255,255,255,0) 0,#fff 100%)}.el-color-alpha-slider.is-vertical .el-color-alpha-slider__thumb{left:0;top:0;width:100%;height:4px}.el-color-dropdown{width:300px}.el-color-dropdown__main-wrapper{margin-bottom:6px}.el-color-dropdown__main-wrapper::after{content:"";display:table;clear:both}.el-color-dropdown__btns{margin-top:12px;text-align:right}.el-color-dropdown__value{float:left;line-height:26px;font-size:12px;color:#000;width:160px}.el-color-picker{display:inline-block;position:relative;line-height:normal;outline:0}.el-color-picker:hover:not(.is-disabled,.is-focused) .el-color-picker__trigger{border-color:var(--el-border-color-hover)}.el-color-picker:focus-visible:not(.is-disabled) .el-color-picker__trigger{outline:2px solid var(--el-color-primary);outline-offset:1px}.el-color-picker.is-focused .el-color-picker__trigger{border-color:var(--el-color-primary)}.el-color-picker.is-disabled .el-color-picker__trigger{cursor:not-allowed}.el-color-picker--large{height:40px}.el-color-picker--large .el-color-picker__trigger{height:40px;width:40px}.el-color-picker--large .el-color-picker__mask{height:38px;width:38px}.el-color-picker--small{height:24px}.el-color-picker--small .el-color-picker__trigger{height:24px;width:24px}.el-color-picker--small .el-color-picker__mask{height:22px;width:22px}.el-color-picker--small .el-color-picker__empty,.el-color-picker--small .el-color-picker__icon{transform:scale(.8)}.el-color-picker__mask{height:30px;width:30px;border-radius:4px;position:absolute;top:1px;left:1px;z-index:1;cursor:not-allowed;background-color:rgba(255,255,255,.7)}.el-color-picker__trigger{display:inline-flex;justify-content:center;align-items:center;box-sizing:border-box;height:32px;width:32px;padding:4px;border:1px solid var(--el-border-color);border-radius:4px;font-size:0;position:relative;cursor:pointer}.el-color-picker__color{position:relative;display:block;box-sizing:border-box;border:1px solid var(--el-text-color-secondary);border-radius:var(--el-border-radius-small);width:100%;height:100%;text-align:center}.el-color-picker__color.is-alpha{background-image:linear-gradient(45deg,var(--el-color-picker-alpha-bg-a) 25%,var(--el-color-picker-alpha-bg-b) 25%),linear-gradient(135deg,var(--el-color-picker-alpha-bg-a) 25%,var(--el-color-picker-alpha-bg-b) 25%),linear-gradient(45deg,var(--el-color-picker-alpha-bg-b) 75%,var(--el-color-picker-alpha-bg-a) 75%),linear-gradient(135deg,var(--el-color-picker-alpha-bg-b) 75%,var(--el-color-picker-alpha-bg-a) 75%);background-size:12px 12px;background-position:0 0,6px 0,6px -6px,0 6px}.el-color-picker__color-inner{display:inline-flex;justify-content:center;align-items:center;width:100%;height:100%}.el-color-picker .el-color-picker__empty{font-size:12px;color:var(--el-text-color-secondary)}.el-color-picker .el-color-picker__icon{display:inline-flex;justify-content:center;align-items:center;color:#fff;font-size:12px}.el-color-picker__panel{position:absolute;z-index:10;padding:6px;box-sizing:content-box;background-color:#fff;border-radius:var(--el-border-radius-base);box-shadow:var(--el-box-shadow-light)}.el-color-picker__panel.el-popper{border:1px solid var(--el-border-color-lighter)}.el-color-picker,.el-color-picker__panel{--el-color-picker-alpha-bg-a:#ccc;--el-color-picker-alpha-bg-b:transparent}.dark .el-color-picker,.dark .el-color-picker__panel{--el-color-picker-alpha-bg-a:#333333}