vxe-pc-ui 4.20.34 → 4.20.35

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 (367) hide show
  1. package/dist/all.esm.js +45718 -45038
  2. package/dist/all.esm.min.js +3 -3
  3. package/dist/style.css +307 -1
  4. package/dist/style.mini.css +1 -1
  5. package/es/alert/src/alert.js +117 -114
  6. package/es/anchor/src/anchor-link.js +110 -107
  7. package/es/anchor/src/anchor.js +212 -209
  8. package/es/avatar/src/avatar.js +132 -129
  9. package/es/backtop/src/backtop.js +267 -264
  10. package/es/badge/src/badge.js +102 -99
  11. package/es/breadcrumb/src/breadcrumb-item.js +104 -101
  12. package/es/breadcrumb/src/breadcrumb.js +70 -67
  13. package/es/button/src/button-group.js +88 -85
  14. package/es/calendar/src/calendar.js +1371 -1368
  15. package/es/card/src/card.js +235 -232
  16. package/es/carousel/src/carousel-item.js +78 -75
  17. package/es/carousel/src/carousel.js +392 -389
  18. package/es/cascader/src/cascader.js +1667 -1664
  19. package/es/checkbox/src/button.js +198 -195
  20. package/es/checkbox/src/checkbox.js +181 -178
  21. package/es/checkbox/src/group.js +210 -207
  22. package/es/collapse/src/collapse-pane.js +98 -95
  23. package/es/collapse/src/collapse.js +340 -337
  24. package/es/color-picker/src/color-picker.js +1116 -1113
  25. package/es/components.d.ts +1 -0
  26. package/es/components.js +3 -0
  27. package/es/context-menu/src/context-menu.js +601 -598
  28. package/es/countdown/src/countdown.js +224 -221
  29. package/es/date-panel/src/date-panel.js +1905 -1902
  30. package/es/date-picker/src/date-picker.js +1537 -1534
  31. package/es/date-range-picker/src/date-range-picker.js +1412 -1409
  32. package/es/divider/src/divider.js +80 -77
  33. package/es/drawer/src/drawer.js +778 -775
  34. package/es/empty/src/empty.js +100 -97
  35. package/es/form/src/form-group.js +74 -71
  36. package/es/form/src/form-item.js +76 -73
  37. package/es/form/src/form.js +789 -786
  38. package/es/icon/src/icon.js +59 -56
  39. package/es/icon/style.css +1 -1
  40. package/es/icon/style.mini.css +1 -1
  41. package/es/icon-picker/src/icon-picker.js +719 -716
  42. package/es/image/src/group.js +130 -127
  43. package/es/image/src/image.js +243 -240
  44. package/es/image/src/preview.js +627 -624
  45. package/es/index.esm.js +2 -0
  46. package/es/index.js +2 -0
  47. package/es/input/src/input.js +2700 -2697
  48. package/es/layout-aside/src/layout-aside.js +138 -135
  49. package/es/layout-body/src/layout-body.js +145 -142
  50. package/es/layout-container/src/layout-container.js +71 -68
  51. package/es/layout-footer/src/layout-footer.js +60 -57
  52. package/es/layout-header/src/layout-header.js +58 -55
  53. package/es/link/src/link.js +131 -128
  54. package/es/list/src/list.js +2174 -2171
  55. package/es/loading/src/loading.js +141 -138
  56. package/es/mention/src/mention.js +49 -46
  57. package/es/menu/src/menu.js +799 -796
  58. package/es/modal/src/modal.js +1519 -1527
  59. package/es/notice-bar/src/notice-bar.js +168 -165
  60. package/es/number-input/src/number-input.js +1094 -1091
  61. package/es/pager/src/pager.js +767 -764
  62. package/es/password-input/src/password-input.js +431 -428
  63. package/es/print/src/page-break.js +63 -60
  64. package/es/print/src/print.js +303 -300
  65. package/es/pulldown/src/pulldown.js +403 -400
  66. package/es/radio/src/button.js +214 -211
  67. package/es/radio/src/group.js +195 -192
  68. package/es/radio/src/radio.js +194 -191
  69. package/es/rate/src/rate.js +164 -161
  70. package/es/result/src/result.js +116 -113
  71. package/es/row/src/col.js +133 -130
  72. package/es/row/src/row.js +111 -108
  73. package/es/scrollbar/src/scrollbar.js +518 -515
  74. package/es/segmented/src/segmented.js +240 -237
  75. package/es/select/src/optgroup.js +44 -41
  76. package/es/select/src/option.js +39 -36
  77. package/es/select/src/select.js +1914 -1896
  78. package/es/slider/src/slider.js +419 -416
  79. package/es/space/src/space.js +190 -187
  80. package/es/splitter/src/splitter-panel.js +146 -143
  81. package/es/splitter/src/splitter.js +917 -914
  82. package/es/step-item/index.d.ts +76 -0
  83. package/es/step-item/index.js +17 -0
  84. package/es/steps/index.d.ts +288 -34
  85. package/es/steps/src/step-info.d.ts +6 -0
  86. package/es/steps/src/step-info.js +20 -0
  87. package/es/steps/src/step-item.d.ts +14 -0
  88. package/es/steps/src/step-item.js +39 -0
  89. package/es/steps/src/steps.d.ts +68 -8
  90. package/es/steps/src/steps.js +299 -47
  91. package/es/steps/src/util.d.ts +7 -0
  92. package/es/steps/src/util.js +44 -0
  93. package/es/steps/style.css +297 -0
  94. package/es/steps/style.mini.css +1 -0
  95. package/es/style.css +307 -1
  96. package/es/style.mini.css +1 -1
  97. package/es/switch/src/switch.js +228 -225
  98. package/es/table-select/src/table-select.js +865 -862
  99. package/es/table-transfer/src/table-transfer.js +61 -58
  100. package/es/tabs/src/tab-pane.js +102 -99
  101. package/es/tabs/src/tabs.js +936 -933
  102. package/es/tag/src/tag.js +163 -160
  103. package/es/text/src/text.js +232 -229
  104. package/es/text-ellipsis/src/text-ellipsis.js +252 -249
  105. package/es/textarea/src/textarea.js +434 -431
  106. package/es/timeline/src/timeline.js +74 -36
  107. package/es/timeline/src/util.js +7 -4
  108. package/es/tip/src/tip.js +117 -114
  109. package/es/tooltip/src/tooltip.js +552 -549
  110. package/es/tour/src/tour.js +49 -46
  111. package/es/transfer/src/transfer.js +95 -92
  112. package/es/tree/src/tree.js +3379 -3376
  113. package/es/tree-select/src/tree-select.js +969 -966
  114. package/es/ui/index.js +8 -2
  115. package/es/ui/src/log.js +1 -1
  116. package/es/upload/src/upload.js +1791 -1788
  117. package/es/vxe-icon/style.css +1 -1
  118. package/es/vxe-icon/style.mini.css +1 -1
  119. package/es/vxe-steps/style.css +297 -0
  120. package/es/vxe-steps/style.mini.css +1 -0
  121. package/es/watermark/src/watermark.js +158 -155
  122. package/lib/alert/src/alert.js +117 -114
  123. package/lib/anchor/src/anchor-link.js +110 -107
  124. package/lib/anchor/src/anchor.js +212 -209
  125. package/lib/avatar/src/avatar.js +132 -129
  126. package/lib/backtop/src/backtop.js +267 -264
  127. package/lib/badge/src/badge.js +102 -99
  128. package/lib/breadcrumb/src/breadcrumb-item.js +104 -101
  129. package/lib/breadcrumb/src/breadcrumb.js +70 -67
  130. package/lib/button/src/button-group.js +88 -85
  131. package/lib/calendar/src/calendar.js +1371 -1368
  132. package/lib/card/src/card.js +235 -232
  133. package/lib/carousel/src/carousel-item.js +78 -75
  134. package/lib/carousel/src/carousel.js +392 -389
  135. package/lib/cascader/src/cascader.js +1665 -1662
  136. package/lib/checkbox/src/button.js +198 -195
  137. package/lib/checkbox/src/checkbox.js +181 -178
  138. package/lib/checkbox/src/group.js +210 -207
  139. package/lib/collapse/src/collapse-pane.js +98 -95
  140. package/lib/collapse/src/collapse.js +340 -337
  141. package/lib/color-picker/src/color-picker.js +1116 -1113
  142. package/lib/components.js +3 -0
  143. package/lib/context-menu/src/context-menu.js +601 -598
  144. package/lib/countdown/src/countdown.js +224 -221
  145. package/lib/date-panel/src/date-panel.js +1905 -1902
  146. package/lib/date-picker/src/date-picker.js +1537 -1534
  147. package/lib/date-range-picker/src/date-range-picker.js +1412 -1409
  148. package/lib/divider/src/divider.js +80 -77
  149. package/lib/drawer/src/drawer.js +778 -775
  150. package/lib/empty/src/empty.js +100 -97
  151. package/lib/form/src/form-group.js +74 -71
  152. package/lib/form/src/form-item.js +76 -73
  153. package/lib/form/src/form.js +789 -786
  154. package/lib/icon/src/icon.js +59 -56
  155. package/lib/icon/style/style.css +1 -1
  156. package/lib/icon/style/style.mini.css +1 -1
  157. package/lib/icon-picker/src/icon-picker.js +719 -716
  158. package/lib/image/src/group.js +130 -127
  159. package/lib/image/src/image.js +243 -240
  160. package/lib/image/src/preview.js +627 -624
  161. package/lib/index.common.js +2 -0
  162. package/lib/index.js +2 -0
  163. package/lib/index.umd.js +47411 -46732
  164. package/lib/index.umd.min.js +3 -3
  165. package/lib/input/src/input.js +2700 -2697
  166. package/lib/layout-aside/src/layout-aside.js +138 -135
  167. package/lib/layout-body/src/layout-body.js +145 -142
  168. package/lib/layout-container/src/layout-container.js +71 -68
  169. package/lib/layout-footer/src/layout-footer.js +60 -57
  170. package/lib/layout-header/src/layout-header.js +58 -55
  171. package/lib/link/src/link.js +131 -128
  172. package/lib/list/src/list.js +2173 -2170
  173. package/lib/loading/src/loading.js +141 -138
  174. package/lib/mention/src/mention.js +49 -46
  175. package/lib/menu/src/menu.js +799 -796
  176. package/lib/modal/src/modal.js +1519 -1527
  177. package/lib/notice-bar/src/notice-bar.js +168 -165
  178. package/lib/number-input/src/number-input.js +1094 -1091
  179. package/lib/pager/src/pager.js +767 -764
  180. package/lib/password-input/src/password-input.js +431 -428
  181. package/lib/print/src/page-break.js +63 -60
  182. package/lib/print/src/print.js +303 -300
  183. package/lib/pulldown/src/pulldown.js +403 -400
  184. package/lib/radio/src/button.js +214 -211
  185. package/lib/radio/src/group.js +195 -192
  186. package/lib/radio/src/radio.js +194 -191
  187. package/lib/rate/src/rate.js +164 -161
  188. package/lib/result/src/result.js +116 -113
  189. package/lib/row/src/col.js +133 -130
  190. package/lib/row/src/row.js +111 -108
  191. package/lib/scrollbar/src/scrollbar.js +518 -515
  192. package/lib/segmented/src/segmented.js +240 -237
  193. package/lib/select/src/optgroup.js +44 -41
  194. package/lib/select/src/option.js +39 -36
  195. package/lib/select/src/select.js +1915 -1897
  196. package/lib/slider/src/slider.js +419 -416
  197. package/lib/space/src/space.js +190 -187
  198. package/lib/splitter/src/splitter-panel.js +146 -143
  199. package/lib/splitter/src/splitter.js +917 -914
  200. package/lib/step-item/index.js +47 -0
  201. package/lib/steps/src/step-info.js +49 -0
  202. package/lib/steps/src/step-item.js +59 -0
  203. package/lib/steps/src/steps.js +298 -46
  204. package/lib/steps/src/util.js +74 -0
  205. package/lib/steps/style/style.css +297 -0
  206. package/lib/steps/style/style.mini.css +1 -0
  207. package/lib/style.css +307 -1
  208. package/lib/style.mini.css +1 -1
  209. package/lib/switch/src/switch.js +228 -225
  210. package/lib/table-select/src/table-select.js +865 -862
  211. package/lib/table-transfer/src/table-transfer.js +61 -58
  212. package/lib/tabs/src/tab-pane.js +102 -99
  213. package/lib/tabs/src/tabs.js +936 -933
  214. package/lib/tag/src/tag.js +163 -160
  215. package/lib/text/src/text.js +232 -229
  216. package/lib/text-ellipsis/src/text-ellipsis.js +252 -249
  217. package/lib/textarea/src/textarea.js +434 -431
  218. package/lib/timeline/src/timeline.js +74 -36
  219. package/lib/timeline/src/util.js +7 -4
  220. package/lib/tip/src/tip.js +117 -114
  221. package/lib/tooltip/src/tooltip.js +552 -549
  222. package/lib/tour/src/tour.js +49 -46
  223. package/lib/transfer/src/transfer.js +95 -92
  224. package/lib/tree/src/tree.js +3379 -3376
  225. package/lib/tree-select/src/tree-select.js +969 -966
  226. package/lib/ui/index.js +8 -2
  227. package/lib/ui/src/log.js +1 -1
  228. package/lib/upload/src/upload.js +1788 -1785
  229. package/lib/vxe-icon/style/style.css +1 -1
  230. package/lib/vxe-icon/style/style.mini.css +1 -1
  231. package/lib/vxe-steps/style/style.css +297 -0
  232. package/lib/vxe-steps/style/style.mini.css +1 -0
  233. package/lib/watermark/src/watermark.js +158 -155
  234. package/package.json +1 -1
  235. package/packages/alert/src/alert.ts +2 -2
  236. package/packages/anchor/src/anchor-link.ts +2 -2
  237. package/packages/anchor/src/anchor.ts +2 -2
  238. package/packages/avatar/src/avatar.ts +2 -2
  239. package/packages/backtop/src/backtop.ts +2 -2
  240. package/packages/badge/src/badge.ts +2 -2
  241. package/packages/breadcrumb/src/breadcrumb-item.ts +2 -2
  242. package/packages/breadcrumb/src/breadcrumb.ts +2 -2
  243. package/packages/button/src/button-group.ts +2 -2
  244. package/packages/calendar/src/calendar.ts +2 -2
  245. package/packages/card/src/card.ts +2 -2
  246. package/packages/carousel/src/carousel-item.ts +2 -2
  247. package/packages/carousel/src/carousel.ts +2 -2
  248. package/packages/cascader/src/cascader.ts +2 -2
  249. package/packages/checkbox/src/button.ts +3 -15
  250. package/packages/checkbox/src/checkbox.ts +2 -2
  251. package/packages/checkbox/src/group.ts +2 -2
  252. package/packages/collapse/src/collapse-pane.ts +2 -2
  253. package/packages/collapse/src/collapse.ts +2 -2
  254. package/packages/color-picker/src/color-picker.ts +2 -2
  255. package/packages/components.ts +3 -0
  256. package/packages/context-menu/src/context-menu.ts +3 -16
  257. package/packages/countdown/src/countdown.ts +2 -2
  258. package/packages/date-panel/src/date-panel.ts +2 -2
  259. package/packages/date-picker/src/date-picker.ts +2 -2
  260. package/packages/date-range-picker/src/date-range-picker.ts +2 -2
  261. package/packages/divider/src/divider.ts +2 -2
  262. package/packages/drawer/src/drawer.ts +2 -2
  263. package/packages/empty/src/empty.ts +2 -2
  264. package/packages/form/src/form-group.ts +2 -2
  265. package/packages/form/src/form-item.ts +2 -2
  266. package/packages/form/src/form.ts +2 -2
  267. package/packages/icon/src/icon.ts +2 -2
  268. package/packages/icon-picker/src/icon-picker.ts +2 -2
  269. package/packages/image/src/group.ts +2 -2
  270. package/packages/image/src/image.ts +2 -2
  271. package/packages/image/src/preview.ts +3 -16
  272. package/packages/index.ts +2 -2
  273. package/packages/input/src/input.ts +2 -2
  274. package/packages/layout-aside/src/layout-aside.ts +2 -2
  275. package/packages/layout-body/src/layout-body.ts +2 -2
  276. package/packages/layout-container/src/layout-container.ts +3 -14
  277. package/packages/layout-footer/src/layout-footer.ts +2 -2
  278. package/packages/layout-header/src/layout-header.ts +2 -2
  279. package/packages/link/src/link.ts +2 -2
  280. package/packages/list/src/list.ts +2 -2
  281. package/packages/loading/src/loading.ts +2 -2
  282. package/packages/mention/src/mention.ts +2 -2
  283. package/packages/menu/src/menu.ts +2 -2
  284. package/packages/modal/src/modal.ts +5 -20
  285. package/packages/notice-bar/src/notice-bar.ts +2 -2
  286. package/packages/number-input/src/number-input.ts +3 -17
  287. package/packages/pager/src/pager.ts +2 -2
  288. package/packages/password-input/src/password-input.ts +2 -2
  289. package/packages/print/src/page-break.ts +2 -2
  290. package/packages/print/src/print.ts +2 -2
  291. package/packages/pulldown/src/pulldown.ts +2 -2
  292. package/packages/radio/src/button.ts +3 -16
  293. package/packages/radio/src/group.ts +3 -17
  294. package/packages/radio/src/radio.ts +2 -2
  295. package/packages/rate/src/rate.ts +2 -2
  296. package/packages/result/src/result.ts +2 -2
  297. package/packages/row/src/col.ts +2 -2
  298. package/packages/row/src/row.ts +2 -2
  299. package/packages/scrollbar/src/scrollbar.ts +3 -4
  300. package/packages/segmented/src/segmented.ts +2 -2
  301. package/packages/select/src/optgroup.ts +2 -2
  302. package/packages/select/src/option.ts +2 -2
  303. package/packages/select/src/select.ts +33 -19
  304. package/packages/slider/src/slider.ts +2 -2
  305. package/packages/space/src/space.ts +2 -2
  306. package/packages/splitter/src/splitter-panel.ts +2 -2
  307. package/packages/splitter/src/splitter.ts +2 -2
  308. package/packages/step-item/index.ts +16 -0
  309. package/packages/steps/src/step-info.ts +18 -0
  310. package/packages/steps/src/step-item.ts +41 -0
  311. package/packages/steps/src/steps.ts +273 -13
  312. package/packages/steps/src/util.ts +44 -0
  313. package/packages/switch/src/switch.ts +2 -2
  314. package/packages/table-select/src/table-select.ts +2 -2
  315. package/packages/table-transfer/src/table-transfer.ts +3 -15
  316. package/packages/tabs/src/tab-pane.ts +2 -2
  317. package/packages/tabs/src/tabs.ts +2 -2
  318. package/packages/tag/src/tag.ts +2 -2
  319. package/packages/text/src/text.ts +2 -2
  320. package/packages/text-ellipsis/src/text-ellipsis.ts +2 -2
  321. package/packages/textarea/src/textarea.ts +2 -2
  322. package/packages/timeline/src/timeline-info.ts +17 -17
  323. package/packages/timeline/src/timeline.ts +93 -49
  324. package/packages/timeline/src/util.ts +44 -41
  325. package/packages/tip/src/tip.ts +2 -2
  326. package/packages/tooltip/src/tooltip.ts +2 -2
  327. package/packages/tour/src/tour.ts +2 -2
  328. package/packages/transfer/src/transfer.ts +2 -2
  329. package/packages/tree/src/tree.ts +2 -2
  330. package/packages/tree-select/src/tree-select.ts +2 -2
  331. package/packages/ui/index.ts +8 -1
  332. package/packages/upload/src/upload.ts +2 -2
  333. package/packages/watermark/src/watermark.ts +2 -2
  334. package/styles/all.scss +1 -0
  335. package/styles/components/step-item.scss +0 -0
  336. package/styles/components/steps.scss +354 -0
  337. package/styles/theme/base.scss +9 -0
  338. package/types/all.d.ts +3 -0
  339. package/types/components/gantt.d.ts +1 -3
  340. package/types/components/select.d.ts +1 -13
  341. package/types/components/step-item.d.ts +72 -0
  342. package/types/components/steps.d.ts +67 -8
  343. package/types/components/table.d.ts +7 -66
  344. package/types/handles/form-design.d.ts +1 -4
  345. package/types/ui/global-config.d.ts +2 -0
  346. package/types/ui/global-icon.d.ts +7 -0
  347. /package/dist/{iconfont.1793330162657.ttf → iconfont.1793359478136.ttf} +0 -0
  348. /package/dist/{iconfont.1793330162657.woff → iconfont.1793359478136.woff} +0 -0
  349. /package/dist/{iconfont.1793330162657.woff2 → iconfont.1793359478136.woff2} +0 -0
  350. /package/es/icon/{iconfont.1793330162657.ttf → iconfont.1793359478136.ttf} +0 -0
  351. /package/es/icon/{iconfont.1793330162657.woff → iconfont.1793359478136.woff} +0 -0
  352. /package/es/icon/{iconfont.1793330162657.woff2 → iconfont.1793359478136.woff2} +0 -0
  353. /package/es/{iconfont.1793330162657.ttf → iconfont.1793359478136.ttf} +0 -0
  354. /package/es/{iconfont.1793330162657.woff → iconfont.1793359478136.woff} +0 -0
  355. /package/es/{iconfont.1793330162657.woff2 → iconfont.1793359478136.woff2} +0 -0
  356. /package/es/vxe-icon/{iconfont.1793330162657.ttf → iconfont.1793359478136.ttf} +0 -0
  357. /package/es/vxe-icon/{iconfont.1793330162657.woff → iconfont.1793359478136.woff} +0 -0
  358. /package/es/vxe-icon/{iconfont.1793330162657.woff2 → iconfont.1793359478136.woff2} +0 -0
  359. /package/lib/icon/style/{iconfont.1793330162657.ttf → iconfont.1793359478136.ttf} +0 -0
  360. /package/lib/icon/style/{iconfont.1793330162657.woff → iconfont.1793359478136.woff} +0 -0
  361. /package/lib/icon/style/{iconfont.1793330162657.woff2 → iconfont.1793359478136.woff2} +0 -0
  362. /package/lib/{iconfont.1793330162657.ttf → iconfont.1793359478136.ttf} +0 -0
  363. /package/lib/{iconfont.1793330162657.woff → iconfont.1793359478136.woff} +0 -0
  364. /package/lib/{iconfont.1793330162657.woff2 → iconfont.1793359478136.woff2} +0 -0
  365. /package/lib/vxe-icon/style/{iconfont.1793330162657.ttf → iconfont.1793359478136.ttf} +0 -0
  366. /package/lib/vxe-icon/style/{iconfont.1793330162657.woff → iconfont.1793359478136.woff} +0 -0
  367. /package/lib/vxe-icon/style/{iconfont.1793330162657.woff2 → iconfont.1793359478136.woff2} +0 -0
package/es/vxe-steps/style.css CHANGED
@@ -0,0 +1,297 @@
1
+ .vxe-steps {
2
+ --vxe-ui-steps-current-font-size: var(--vxe-ui-font-size-default);
3
+ --vxe-ui-steps-current-padding: var(--vxe-ui-form-item-padding-default);
4
+ }
5
+ .vxe-steps.size--xlarge {
6
+ --vxe-ui-steps-current-font-size: var(--vxe-ui-font-size-xlarge);
7
+ --vxe-ui-steps-current-padding: var(--vxe-ui-form-item-padding-xlarge);
8
+ }
9
+ .vxe-steps.size--large {
10
+ --vxe-ui-steps-current-font-size: var(--vxe-ui-font-size-large);
11
+ --vxe-ui-steps-current-padding: var(--vxe-ui-form-item-padding-large);
12
+ }
13
+ .vxe-steps.size--medium {
14
+ --vxe-ui-steps-current-font-size: var(--vxe-ui-font-size-medium);
15
+ --vxe-ui-steps-current-padding: var(--vxe-ui-form-item-padding-medium);
16
+ }
17
+ .vxe-steps.size--small {
18
+ --vxe-ui-steps-current-font-size: var(--vxe-ui-font-size-small);
19
+ --vxe-ui-steps-current-padding: var(--vxe-ui-form-item-padding-small);
20
+ }
21
+ .vxe-steps.size--mini {
22
+ --vxe-ui-steps-current-font-size: var(--vxe-ui-font-size-mini);
23
+ --vxe-ui-steps-current-padding: var(--vxe-ui-form-item-padding-mini);
24
+ }
25
+
26
+ .vxe-steps {
27
+ --vxe-ui-steps-current-icon-size: var(--vxe-ui-steps-icon-dot-size);
28
+ }
29
+ .vxe-steps.is--number {
30
+ --vxe-ui-steps-current-icon-size: var(--vxe-ui-steps-icon-num-size);
31
+ }
32
+
33
+ .vxe-steps {
34
+ display: flex;
35
+ flex-direction: column;
36
+ padding: var(--vxe-ui-steps-current-padding) 0;
37
+ font-size: var(--vxe-ui-steps-current-font-size);
38
+ color: var(--vxe-ui-font-color);
39
+ }
40
+ .vxe-steps .vxe-steps--body {
41
+ display: flex;
42
+ flex-direction: column;
43
+ }
44
+ .vxe-steps .vxe-steps--item {
45
+ position: relative;
46
+ display: flex;
47
+ padding-bottom: calc(var(--vxe-ui-steps-current-icon-size) + 0.5em);
48
+ }
49
+ .vxe-steps .vxe-steps--item:last-child {
50
+ padding-bottom: 0;
51
+ }
52
+ .vxe-steps .vxe-steps--item.is--last .vxe-steps--item-line {
53
+ display: none;
54
+ }
55
+ .vxe-steps .vxe-steps--item-line {
56
+ position: absolute;
57
+ left: calc(var(--vxe-ui-steps-current-icon-size) / 2 - var(--vxe-ui-steps-line-width) / 2);
58
+ top: var(--vxe-ui-steps-current-icon-size);
59
+ bottom: 0;
60
+ width: var(--vxe-ui-steps-line-width);
61
+ background-color: var(--vxe-ui-base-border-color);
62
+ }
63
+ .vxe-steps .vxe-steps--item-icon {
64
+ position: relative;
65
+ z-index: 1;
66
+ display: flex;
67
+ align-items: center;
68
+ justify-content: center;
69
+ flex-shrink: 0;
70
+ width: var(--vxe-ui-steps-current-icon-size);
71
+ height: var(--vxe-ui-steps-current-icon-size);
72
+ margin-right: 0.75em;
73
+ }
74
+ .vxe-steps .vxe-steps--item-icon-dot {
75
+ width: var(--vxe-ui-steps-icon-dot-size);
76
+ height: var(--vxe-ui-steps-icon-dot-size);
77
+ border: var(--vxe-ui-steps-line-width) solid currentColor;
78
+ border-radius: 50%;
79
+ background-color: var(--vxe-ui-layout-background-color);
80
+ box-sizing: border-box;
81
+ }
82
+ .vxe-steps .vxe-steps--item-icon-num {
83
+ display: flex;
84
+ align-items: center;
85
+ justify-content: center;
86
+ width: var(--vxe-ui-steps-icon-num-size);
87
+ height: var(--vxe-ui-steps-icon-num-size);
88
+ border-radius: 50%;
89
+ border: var(--vxe-ui-steps-line-width) solid currentColor;
90
+ background-color: var(--vxe-ui-layout-background-color);
91
+ box-sizing: border-box;
92
+ font-size: 0.875em;
93
+ font-weight: 600;
94
+ line-height: 1;
95
+ }
96
+ .vxe-steps .vxe-steps--item-icon-status {
97
+ line-height: 1;
98
+ background-color: var(--vxe-ui-layout-background-color);
99
+ }
100
+ .vxe-steps .vxe-steps--item-icon-status i {
101
+ font-size: var(--vxe-ui-steps-icon-num-size);
102
+ }
103
+ .vxe-steps .vxe-steps--item-wrapper {
104
+ flex: 1;
105
+ min-width: 0;
106
+ padding-top: 0.125em;
107
+ }
108
+ .vxe-steps .vxe-steps--item-title {
109
+ font-weight: 600;
110
+ line-height: 1.4;
111
+ }
112
+ .vxe-steps .vxe-steps--item-content {
113
+ margin-top: 0.25em;
114
+ line-height: 1.5;
115
+ word-break: break-word;
116
+ color: var(--vxe-ui-font-lighten-color);
117
+ }
118
+ .vxe-steps.is--horizontal .vxe-steps--body {
119
+ flex-direction: row;
120
+ align-items: flex-start;
121
+ }
122
+ .vxe-steps.is--horizontal .vxe-steps--item {
123
+ --vxe-ui-steps-item-padding-x: calc(var(--vxe-ui-steps-current-icon-size) + 0.5em);
124
+ flex: 1;
125
+ flex-direction: column;
126
+ align-items: center;
127
+ padding-bottom: 0;
128
+ padding-right: var(--vxe-ui-steps-item-padding-x);
129
+ text-align: center;
130
+ }
131
+ .vxe-steps.is--horizontal .vxe-steps--item:last-child {
132
+ padding-right: 0;
133
+ }
134
+ .vxe-steps.is--horizontal .vxe-steps--item-line {
135
+ left: calc(50% - var(--vxe-ui-steps-item-padding-x) / 2);
136
+ right: calc(-50% + var(--vxe-ui-steps-item-padding-x) / 2);
137
+ top: calc(var(--vxe-ui-steps-current-icon-size) / 2 - var(--vxe-ui-steps-line-width) / 2);
138
+ bottom: auto;
139
+ width: auto;
140
+ height: var(--vxe-ui-steps-line-width);
141
+ }
142
+ .vxe-steps.is--horizontal .vxe-steps--item-icon {
143
+ margin-right: 0;
144
+ margin-bottom: 0.5em;
145
+ }
146
+ .vxe-steps.is--horizontal .vxe-steps--item-wrapper {
147
+ width: 100%;
148
+ padding-top: 0;
149
+ }
150
+ .vxe-steps.is--horizontal .vxe-steps--item-content {
151
+ margin-top: 0.125em;
152
+ }
153
+
154
+ .vxe-steps--item {
155
+ color: var(--vxe-ui-steps-status-default-color);
156
+ }
157
+ .vxe-steps--item.status--finish .vxe-steps--item-icon-num {
158
+ color: var(--vxe-ui-steps-status-finish-color);
159
+ border-color: var(--vxe-ui-steps-status-finish-color);
160
+ }
161
+ .vxe-steps--item.status--finish .vxe-steps--item-title {
162
+ color: var(--vxe-ui-steps-status-finish-color);
163
+ }
164
+ .vxe-steps--item.status--finish .vxe-steps--item-icon-status {
165
+ color: var(--vxe-ui-steps-status-finish-color);
166
+ }
167
+ .vxe-steps--item.status--error .vxe-steps--item-icon-num {
168
+ color: var(--vxe-ui-steps-status-error-color);
169
+ border-color: var(--vxe-ui-steps-status-error-color);
170
+ }
171
+ .vxe-steps--item.status--error .vxe-steps--item-title {
172
+ color: var(--vxe-ui-steps-status-error-color);
173
+ }
174
+ .vxe-steps--item.status--error .vxe-steps--item-icon-status {
175
+ color: var(--vxe-ui-steps-status-error-color);
176
+ }
177
+ .vxe-steps--item.status--process .vxe-steps--item-icon-dot {
178
+ background-color: var(--vxe-ui-steps-status-process-color);
179
+ }
180
+ .vxe-steps--item.is--finish.status--finish .vxe-steps--item-icon-num {
181
+ color: var(--vxe-ui-steps-status-finish-color);
182
+ }
183
+ .vxe-steps--item.is--finish.status--finish .vxe-steps--item-icon-status {
184
+ color: var(--vxe-ui-steps-status-finish-color);
185
+ }
186
+ .vxe-steps--item.is--finish.status--finish .vxe-steps--item-icon-dot {
187
+ border-color: var(--vxe-ui-steps-status-finish-color);
188
+ }
189
+ .vxe-steps--item.is--finish.status--error .vxe-steps--item-icon-num {
190
+ color: var(--vxe-ui-steps-status-error-color);
191
+ }
192
+ .vxe-steps--item.is--finish.status--error .vxe-steps--item-icon-status {
193
+ color: var(--vxe-ui-steps-status-error-color);
194
+ }
195
+ .vxe-steps--item.is--finish.status--error .vxe-steps--item-icon-dot {
196
+ border-color: var(--vxe-ui-steps-status-error-color);
197
+ }
198
+ .vxe-steps--item.is--finish .vxe-steps--item-icon-num {
199
+ color: var(--vxe-ui-font-primary-color);
200
+ }
201
+ .vxe-steps--item.is--finish .vxe-steps--item-icon-dot {
202
+ border-color: var(--vxe-ui-font-primary-color);
203
+ }
204
+ .vxe-steps--item.is--finish .vxe-steps--item-line {
205
+ background-color: var(--vxe-ui-font-primary-color);
206
+ }
207
+ .vxe-steps--item.is--finish .vxe-steps--item-icon-status {
208
+ color: var(--vxe-ui-font-primary-color);
209
+ }
210
+ .vxe-steps--item.is--current.status--finish .vxe-steps--item-icon-num {
211
+ background-color: var(--vxe-ui-steps-status-finish-color);
212
+ color: var(--vxe-ui-layout-background-color);
213
+ border-color: var(--vxe-ui-steps-status-finish-color);
214
+ }
215
+ .vxe-steps--item.is--current.status--finish .vxe-steps--item-title {
216
+ color: var(--vxe-ui-steps-status-finish-color);
217
+ }
218
+ .vxe-steps--item.is--current.status--finish .vxe-steps--item-icon-status {
219
+ color: var(--vxe-ui-steps-status-finish-color);
220
+ }
221
+ .vxe-steps--item.is--current.status--finish .vxe-steps--item-icon-dot {
222
+ border-color: var(--vxe-ui-steps-status-finish-color);
223
+ background-color: var(--vxe-ui-steps-status-finish-color);
224
+ }
225
+ .vxe-steps--item.is--current.status--error .vxe-steps--item-icon-num {
226
+ background-color: var(--vxe-ui-steps-status-error-color);
227
+ color: var(--vxe-ui-layout-background-color);
228
+ border-color: var(--vxe-ui-steps-status-error-color);
229
+ }
230
+ .vxe-steps--item.is--current.status--error .vxe-steps--item-title {
231
+ color: var(--vxe-ui-steps-status-error-color);
232
+ }
233
+ .vxe-steps--item.is--current.status--error .vxe-steps--item-icon-status {
234
+ color: var(--vxe-ui-steps-status-error-color);
235
+ }
236
+ .vxe-steps--item.is--current.status--error .vxe-steps--item-icon-dot {
237
+ border-color: var(--vxe-ui-steps-status-error-color);
238
+ background-color: var(--vxe-ui-steps-status-error-color);
239
+ }
240
+ .vxe-steps--item.is--current .vxe-steps--item-icon-dot {
241
+ border-color: var(--vxe-ui-font-primary-color);
242
+ background-color: var(--vxe-ui-font-primary-color);
243
+ }
244
+ .vxe-steps--item.is--current .vxe-steps--item-icon-num {
245
+ background-color: var(--vxe-ui-font-primary-color);
246
+ color: var(--vxe-ui-layout-background-color);
247
+ border-color: var(--vxe-ui-font-primary-color);
248
+ }
249
+ .vxe-steps--item.is--current .vxe-steps--item-title {
250
+ color: var(--vxe-ui-font-primary-color);
251
+ font-weight: 700;
252
+ }
253
+
254
+ .vxe-steps--item-separator {
255
+ display: flex;
256
+ align-items: center;
257
+ flex: none;
258
+ margin: 0 0.5em;
259
+ color: var(--vxe-ui-font-placeholder-color);
260
+ white-space: nowrap;
261
+ }
262
+
263
+ .vxe-steps.is--simple .vxe-steps--item-icon,
264
+ .vxe-steps.is--simple .vxe-steps--item-line,
265
+ .vxe-steps.is--simple .vxe-steps--item-content {
266
+ display: none;
267
+ }
268
+ .vxe-steps.is--simple .vxe-steps--item {
269
+ padding-bottom: 0;
270
+ }
271
+ .vxe-steps.is--simple .vxe-steps--item-wrapper {
272
+ padding-top: 0;
273
+ }
274
+ .vxe-steps.is--simple.is--horizontal .vxe-steps--body {
275
+ flex-wrap: wrap;
276
+ align-items: center;
277
+ }
278
+ .vxe-steps.is--simple.is--horizontal .vxe-steps--item {
279
+ flex: none;
280
+ flex-direction: row;
281
+ align-items: center;
282
+ padding-right: 0;
283
+ text-align: left;
284
+ }
285
+ .vxe-steps.is--simple.is--horizontal .vxe-steps--item-wrapper {
286
+ width: auto;
287
+ }
288
+ .vxe-steps.is--simple.is--vertical .vxe-steps--item {
289
+ padding-bottom: 0.5em;
290
+ }
291
+ .vxe-steps.is--simple.is--vertical .vxe-steps--item:last-child {
292
+ padding-bottom: 0;
293
+ }
294
+
295
+ .vxe-steps--slots {
296
+ display: none;
297
+ }
package/es/vxe-steps/style.mini.css CHANGED
@@ -0,0 +1 @@
1
+ .vxe-steps{--vxe-ui-steps-current-font-size: var(--vxe-ui-font-size-default);--vxe-ui-steps-current-padding: var(--vxe-ui-form-item-padding-default)}.vxe-steps.size--xlarge{--vxe-ui-steps-current-font-size: var(--vxe-ui-font-size-xlarge);--vxe-ui-steps-current-padding: var(--vxe-ui-form-item-padding-xlarge)}.vxe-steps.size--large{--vxe-ui-steps-current-font-size: var(--vxe-ui-font-size-large);--vxe-ui-steps-current-padding: var(--vxe-ui-form-item-padding-large)}.vxe-steps.size--medium{--vxe-ui-steps-current-font-size: var(--vxe-ui-font-size-medium);--vxe-ui-steps-current-padding: var(--vxe-ui-form-item-padding-medium)}.vxe-steps.size--small{--vxe-ui-steps-current-font-size: var(--vxe-ui-font-size-small);--vxe-ui-steps-current-padding: var(--vxe-ui-form-item-padding-small)}.vxe-steps.size--mini{--vxe-ui-steps-current-font-size: var(--vxe-ui-font-size-mini);--vxe-ui-steps-current-padding: var(--vxe-ui-form-item-padding-mini)}.vxe-steps{--vxe-ui-steps-current-icon-size: var(--vxe-ui-steps-icon-dot-size)}.vxe-steps.is--number{--vxe-ui-steps-current-icon-size: var(--vxe-ui-steps-icon-num-size)}.vxe-steps{display:flex;flex-direction:column;padding:var(--vxe-ui-steps-current-padding) 0;font-size:var(--vxe-ui-steps-current-font-size);color:var(--vxe-ui-font-color)}.vxe-steps .vxe-steps--body{display:flex;flex-direction:column}.vxe-steps .vxe-steps--item{position:relative;display:flex;padding-bottom:calc(var(--vxe-ui-steps-current-icon-size) + .5em)}.vxe-steps .vxe-steps--item:last-child{padding-bottom:0}.vxe-steps .vxe-steps--item.is--last .vxe-steps--item-line{display:none}.vxe-steps .vxe-steps--item-line{position:absolute;left:calc(var(--vxe-ui-steps-current-icon-size) / 2 - var(--vxe-ui-steps-line-width) / 2);top:var(--vxe-ui-steps-current-icon-size);bottom:0;width:var(--vxe-ui-steps-line-width);background-color:var(--vxe-ui-base-border-color)}.vxe-steps .vxe-steps--item-icon{position:relative;z-index:1;display:flex;align-items:center;justify-content:center;flex-shrink:0;width:var(--vxe-ui-steps-current-icon-size);height:var(--vxe-ui-steps-current-icon-size);margin-right:.75em}.vxe-steps .vxe-steps--item-icon-dot{width:var(--vxe-ui-steps-icon-dot-size);height:var(--vxe-ui-steps-icon-dot-size);border:var(--vxe-ui-steps-line-width) solid currentColor;border-radius:50%;background-color:var(--vxe-ui-layout-background-color);box-sizing:border-box}.vxe-steps .vxe-steps--item-icon-num{display:flex;align-items:center;justify-content:center;width:var(--vxe-ui-steps-icon-num-size);height:var(--vxe-ui-steps-icon-num-size);border-radius:50%;border:var(--vxe-ui-steps-line-width) solid currentColor;background-color:var(--vxe-ui-layout-background-color);box-sizing:border-box;font-size:.875em;font-weight:600;line-height:1}.vxe-steps .vxe-steps--item-icon-status{line-height:1;background-color:var(--vxe-ui-layout-background-color)}.vxe-steps .vxe-steps--item-icon-status i{font-size:var(--vxe-ui-steps-icon-num-size)}.vxe-steps .vxe-steps--item-wrapper{flex:1;min-width:0;padding-top:.125em}.vxe-steps .vxe-steps--item-title{font-weight:600;line-height:1.4}.vxe-steps .vxe-steps--item-content{margin-top:.25em;line-height:1.5;word-break:break-word;color:var(--vxe-ui-font-lighten-color)}.vxe-steps.is--horizontal .vxe-steps--body{flex-direction:row;align-items:flex-start}.vxe-steps.is--horizontal .vxe-steps--item{--vxe-ui-steps-item-padding-x: calc(var(--vxe-ui-steps-current-icon-size) + .5em);flex:1;flex-direction:column;align-items:center;padding-bottom:0;padding-right:var(--vxe-ui-steps-item-padding-x);text-align:center}.vxe-steps.is--horizontal .vxe-steps--item:last-child{padding-right:0}.vxe-steps.is--horizontal .vxe-steps--item-line{left:calc(50% - var(--vxe-ui-steps-item-padding-x) / 2);right:calc(-50% + var(--vxe-ui-steps-item-padding-x) / 2);top:calc(var(--vxe-ui-steps-current-icon-size) / 2 - var(--vxe-ui-steps-line-width) / 2);bottom:auto;width:auto;height:var(--vxe-ui-steps-line-width)}.vxe-steps.is--horizontal .vxe-steps--item-icon{margin-right:0;margin-bottom:.5em}.vxe-steps.is--horizontal .vxe-steps--item-wrapper{width:100%;padding-top:0}.vxe-steps.is--horizontal .vxe-steps--item-content{margin-top:.125em}.vxe-steps--item{color:var(--vxe-ui-steps-status-default-color)}.vxe-steps--item.status--finish .vxe-steps--item-icon-num{color:var(--vxe-ui-steps-status-finish-color);border-color:var(--vxe-ui-steps-status-finish-color)}.vxe-steps--item.status--finish .vxe-steps--item-title,.vxe-steps--item.status--finish .vxe-steps--item-icon-status{color:var(--vxe-ui-steps-status-finish-color)}.vxe-steps--item.status--error .vxe-steps--item-icon-num{color:var(--vxe-ui-steps-status-error-color);border-color:var(--vxe-ui-steps-status-error-color)}.vxe-steps--item.status--error .vxe-steps--item-title,.vxe-steps--item.status--error .vxe-steps--item-icon-status{color:var(--vxe-ui-steps-status-error-color)}.vxe-steps--item.status--process .vxe-steps--item-icon-dot{background-color:var(--vxe-ui-steps-status-process-color)}.vxe-steps--item.is--finish.status--finish .vxe-steps--item-icon-num,.vxe-steps--item.is--finish.status--finish .vxe-steps--item-icon-status{color:var(--vxe-ui-steps-status-finish-color)}.vxe-steps--item.is--finish.status--finish .vxe-steps--item-icon-dot{border-color:var(--vxe-ui-steps-status-finish-color)}.vxe-steps--item.is--finish.status--error .vxe-steps--item-icon-num,.vxe-steps--item.is--finish.status--error .vxe-steps--item-icon-status{color:var(--vxe-ui-steps-status-error-color)}.vxe-steps--item.is--finish.status--error .vxe-steps--item-icon-dot{border-color:var(--vxe-ui-steps-status-error-color)}.vxe-steps--item.is--finish .vxe-steps--item-icon-num{color:var(--vxe-ui-font-primary-color)}.vxe-steps--item.is--finish .vxe-steps--item-icon-dot{border-color:var(--vxe-ui-font-primary-color)}.vxe-steps--item.is--finish .vxe-steps--item-line{background-color:var(--vxe-ui-font-primary-color)}.vxe-steps--item.is--finish .vxe-steps--item-icon-status{color:var(--vxe-ui-font-primary-color)}.vxe-steps--item.is--current.status--finish .vxe-steps--item-icon-num{background-color:var(--vxe-ui-steps-status-finish-color);color:var(--vxe-ui-layout-background-color);border-color:var(--vxe-ui-steps-status-finish-color)}.vxe-steps--item.is--current.status--finish .vxe-steps--item-title,.vxe-steps--item.is--current.status--finish .vxe-steps--item-icon-status{color:var(--vxe-ui-steps-status-finish-color)}.vxe-steps--item.is--current.status--finish .vxe-steps--item-icon-dot{border-color:var(--vxe-ui-steps-status-finish-color);background-color:var(--vxe-ui-steps-status-finish-color)}.vxe-steps--item.is--current.status--error .vxe-steps--item-icon-num{background-color:var(--vxe-ui-steps-status-error-color);color:var(--vxe-ui-layout-background-color);border-color:var(--vxe-ui-steps-status-error-color)}.vxe-steps--item.is--current.status--error .vxe-steps--item-title,.vxe-steps--item.is--current.status--error .vxe-steps--item-icon-status{color:var(--vxe-ui-steps-status-error-color)}.vxe-steps--item.is--current.status--error .vxe-steps--item-icon-dot{border-color:var(--vxe-ui-steps-status-error-color);background-color:var(--vxe-ui-steps-status-error-color)}.vxe-steps--item.is--current .vxe-steps--item-icon-dot{border-color:var(--vxe-ui-font-primary-color);background-color:var(--vxe-ui-font-primary-color)}.vxe-steps--item.is--current .vxe-steps--item-icon-num{background-color:var(--vxe-ui-font-primary-color);color:var(--vxe-ui-layout-background-color);border-color:var(--vxe-ui-font-primary-color)}.vxe-steps--item.is--current .vxe-steps--item-title{color:var(--vxe-ui-font-primary-color);font-weight:700}.vxe-steps--item-separator{display:flex;align-items:center;flex:none;margin:0 .5em;color:var(--vxe-ui-font-placeholder-color);white-space:nowrap}.vxe-steps.is--simple .vxe-steps--item-icon,.vxe-steps.is--simple .vxe-steps--item-line,.vxe-steps.is--simple .vxe-steps--item-content{display:none}.vxe-steps.is--simple .vxe-steps--item{padding-bottom:0}.vxe-steps.is--simple .vxe-steps--item-wrapper{padding-top:0}.vxe-steps.is--simple.is--horizontal .vxe-steps--body{flex-wrap:wrap;align-items:center}.vxe-steps.is--simple.is--horizontal .vxe-steps--item{flex:none;flex-direction:row;align-items:center;padding-right:0;text-align:left}.vxe-steps.is--simple.is--horizontal .vxe-steps--item-wrapper{width:auto}.vxe-steps.is--simple.is--vertical .vxe-steps--item{padding-bottom:.5em}.vxe-steps.is--simple.is--vertical .vxe-steps--item:last-child{padding-bottom:0}.vxe-steps--slots{display:none}
package/es/watermark/src/watermark.js CHANGED
@@ -5,165 +5,168 @@ import { VxeUI } from "@vxe-ui/core";
5
5
  import { toCssUnit } from "../../ui/src/dom";
6
6
  import { getContentUrl } from "./util";
7
7
  const { getConfig, createEvent, globalEvents } = VxeUI;
8
- var watermark_default = defineVxeComponent({
9
- name: "VxeWatermark",
10
- props: {
11
- width: String,
12
- height: String,
13
- imageUrl: String,
14
- rotate: {
15
- type: [Number, String],
16
- default: () => getConfig().watermark.rotate
8
+ var watermark_default = (
9
+ /* define-vxe-component start */
10
+ defineVxeComponent({
11
+ name: "VxeWatermark",
12
+ props: {
13
+ width: String,
14
+ height: String,
15
+ imageUrl: String,
16
+ rotate: {
17
+ type: [Number, String],
18
+ default: () => getConfig().watermark.rotate
19
+ },
20
+ gap: {
21
+ type: [Array, Number, String],
22
+ default: () => XEUtils.clone(getConfig().watermark.gap, true)
23
+ },
24
+ content: [String, Array],
25
+ font: Object,
26
+ offset: Object,
27
+ zIndex: [String, Number]
17
28
  },
18
- gap: {
19
- type: [Array, Number, String],
20
- default: () => XEUtils.clone(getConfig().watermark.gap, true)
21
- },
22
- content: [String, Array],
23
- font: Object,
24
- offset: Object,
25
- zIndex: [String, Number]
26
- },
27
- emits: [],
28
- setup(props, context) {
29
- const { emit } = context;
30
- const xID = XEUtils.uniqueId();
31
- const refElem = ref();
32
- const reactData = reactive({
33
- markUrl: ""
34
- });
35
- const refMaps = {
36
- refElem
37
- };
38
- const computeFontOpts = computed(() => {
39
- return XEUtils.assign({}, XEUtils.clone(getConfig().watermark.font, true), props.font);
40
- });
41
- const computeWrapperStyle = computed(() => {
42
- const { width, height, zIndex } = props;
43
- const { markUrl } = reactData;
44
- const stys = {};
45
- if (width) {
46
- stys.width = toCssUnit(width);
47
- }
48
- if (height) {
49
- stys.height = toCssUnit(height);
50
- }
51
- if (markUrl) {
52
- stys.backgroundImage = `url(${markUrl})`;
53
- }
54
- if (zIndex) {
55
- stys.zIndex = zIndex;
56
- }
57
- return stys;
58
- });
59
- const computeMaps = {};
60
- const $xeWatermark = {
61
- xID,
62
- props,
63
- context,
64
- reactData,
65
- getRefMaps: () => refMaps,
66
- getComputeMaps: () => computeMaps
67
- };
68
- const dispatchEvent = (type, params, evnt) => {
69
- emit(type, createEvent(evnt, { $watermark: $xeWatermark }, params));
70
- };
71
- const watermarkMethods = {
72
- dispatchEvent
73
- };
74
- const updateMarkStyle = () => {
75
- const { content, gap, rotate, offset } = props;
76
- const el = refElem.value;
77
- const fontOpts = computeFontOpts.value;
78
- if (el) {
79
- if (content) {
80
- getContentUrl(content, getComputedStyle(el).fontSize, {
81
- font: fontOpts,
82
- rotate,
83
- gap,
84
- offset
85
- }).then((url) => {
86
- reactData.markUrl = url;
87
- });
29
+ emits: [],
30
+ setup(props, context) {
31
+ const { emit } = context;
32
+ const xID = XEUtils.uniqueId();
33
+ const refElem = ref();
34
+ const reactData = reactive({
35
+ markUrl: ""
36
+ });
37
+ const refMaps = {
38
+ refElem
39
+ };
40
+ const computeFontOpts = computed(() => {
41
+ return XEUtils.assign({}, XEUtils.clone(getConfig().watermark.font, true), props.font);
42
+ });
43
+ const computeWrapperStyle = computed(() => {
44
+ const { width, height, zIndex } = props;
45
+ const { markUrl } = reactData;
46
+ const stys = {};
47
+ if (width) {
48
+ stys.width = toCssUnit(width);
49
+ }
50
+ if (height) {
51
+ stys.height = toCssUnit(height);
88
52
  }
89
- }
90
- };
91
- const watermarkPrivateMethods = {};
92
- Object.assign($xeWatermark, watermarkMethods, watermarkPrivateMethods);
93
- const renderVN = () => {
94
- const wrapperStyle = computeWrapperStyle.value;
95
- return h("div", {
96
- ref: refElem,
97
- class: "vxe-watermark",
98
- style: wrapperStyle
53
+ if (markUrl) {
54
+ stys.backgroundImage = `url(${markUrl})`;
55
+ }
56
+ if (zIndex) {
57
+ stys.zIndex = zIndex;
58
+ }
59
+ return stys;
99
60
  });
100
- };
101
- watch(
102
- () => props.imageUrl,
103
- () => {
104
- updateMarkStyle();
105
- }
106
- );
107
- watch(
108
- () => props.content,
109
- () => {
110
- updateMarkStyle();
111
- }
112
- );
113
- watch(
114
- () => props.gap,
115
- () => {
116
- updateMarkStyle();
117
- }
118
- );
119
- watch(
120
- () => props.rotate,
121
- () => {
122
- updateMarkStyle();
123
- }
124
- );
125
- watch(
126
- () => props.width,
127
- () => {
128
- updateMarkStyle();
129
- }
130
- );
131
- watch(
132
- () => props.height,
133
- () => {
134
- updateMarkStyle();
135
- }
136
- );
137
- watch(
138
- () => props.font,
139
- () => {
140
- updateMarkStyle();
141
- }
142
- );
143
- onMounted(() => {
144
- updateMarkStyle();
145
- globalEvents.on(
146
- $xeWatermark,
147
- "resize",
148
- XEUtils.throttle(
149
- () => {
150
- updateMarkStyle();
151
- },
152
- 300,
153
- { trailing: true, leading: true }
154
- )
61
+ const computeMaps = {};
62
+ const $xeWatermark = {
63
+ xID,
64
+ props,
65
+ context,
66
+ reactData,
67
+ getRefMaps: () => refMaps,
68
+ getComputeMaps: () => computeMaps
69
+ };
70
+ const dispatchEvent = (type, params, evnt) => {
71
+ emit(type, createEvent(evnt, { $watermark: $xeWatermark }, params));
72
+ };
73
+ const watermarkMethods = {
74
+ dispatchEvent
75
+ };
76
+ const updateMarkStyle = () => {
77
+ const { content, gap, rotate, offset } = props;
78
+ const el = refElem.value;
79
+ const fontOpts = computeFontOpts.value;
80
+ if (el) {
81
+ if (content) {
82
+ getContentUrl(content, getComputedStyle(el).fontSize, {
83
+ font: fontOpts,
84
+ rotate,
85
+ gap,
86
+ offset
87
+ }).then((url) => {
88
+ reactData.markUrl = url;
89
+ });
90
+ }
91
+ }
92
+ };
93
+ const watermarkPrivateMethods = {};
94
+ Object.assign($xeWatermark, watermarkMethods, watermarkPrivateMethods);
95
+ const renderVN = () => {
96
+ const wrapperStyle = computeWrapperStyle.value;
97
+ return h("div", {
98
+ ref: refElem,
99
+ class: "vxe-watermark",
100
+ style: wrapperStyle
101
+ });
102
+ };
103
+ watch(
104
+ () => props.imageUrl,
105
+ () => {
106
+ updateMarkStyle();
107
+ }
155
108
  );
156
- });
157
- onUnmounted(() => {
158
- globalEvents.off($xeWatermark, "resize");
159
- });
160
- $xeWatermark.renderVN = renderVN;
161
- return $xeWatermark;
162
- },
163
- render() {
164
- return this.renderVN();
165
- }
166
- });
109
+ watch(
110
+ () => props.content,
111
+ () => {
112
+ updateMarkStyle();
113
+ }
114
+ );
115
+ watch(
116
+ () => props.gap,
117
+ () => {
118
+ updateMarkStyle();
119
+ }
120
+ );
121
+ watch(
122
+ () => props.rotate,
123
+ () => {
124
+ updateMarkStyle();
125
+ }
126
+ );
127
+ watch(
128
+ () => props.width,
129
+ () => {
130
+ updateMarkStyle();
131
+ }
132
+ );
133
+ watch(
134
+ () => props.height,
135
+ () => {
136
+ updateMarkStyle();
137
+ }
138
+ );
139
+ watch(
140
+ () => props.font,
141
+ () => {
142
+ updateMarkStyle();
143
+ }
144
+ );
145
+ onMounted(() => {
146
+ updateMarkStyle();
147
+ globalEvents.on(
148
+ $xeWatermark,
149
+ "resize",
150
+ XEUtils.throttle(
151
+ () => {
152
+ updateMarkStyle();
153
+ },
154
+ 300,
155
+ { trailing: true, leading: true }
156
+ )
157
+ );
158
+ });
159
+ onUnmounted(() => {
160
+ globalEvents.off($xeWatermark, "resize");
161
+ });
162
+ $xeWatermark.renderVN = renderVN;
163
+ return $xeWatermark;
164
+ },
165
+ render() {
166
+ return this.renderVN();
167
+ }
168
+ })
169
+ );
167
170
  export {
168
171
  watermark_default as default
169
172
  };