@nutui/nutui 3.2.6-beta.1 → 3.2.6

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 (241) hide show
  1. package/CHANGELOG.md +31 -0
  2. package/README.md +18 -4
  3. package/dist/nutui.es.js +4461 -4135
  4. package/dist/nutui.umd.js +4559 -4133
  5. package/dist/packages/_es/ActionSheet.js +19 -18
  6. package/dist/packages/_es/Address.js +85 -94
  7. package/dist/packages/_es/AddressList.js +12 -25
  8. package/dist/packages/_es/Animate.js +3 -3
  9. package/dist/packages/_es/Audio.js +2 -9
  10. package/dist/packages/_es/AudioOperate.js +1 -5
  11. package/dist/packages/_es/Avatar.js +10 -10
  12. package/dist/packages/_es/AvatarGroup.js +5 -5
  13. package/dist/packages/_es/BackTop.js +108 -55
  14. package/dist/packages/_es/Badge.js +12 -10
  15. package/dist/packages/_es/Barrage.js +103 -79
  16. package/dist/packages/_es/Button.js +3 -5
  17. package/dist/packages/_es/Calendar.js +23 -36
  18. package/dist/packages/_es/CalendarItem.js +3 -4
  19. package/dist/packages/_es/Card.js +5 -15
  20. package/dist/packages/_es/Cascader.js +11 -12
  21. package/dist/packages/_es/Category.js +12 -13
  22. package/dist/packages/_es/CategoryPane.js +13 -17
  23. package/dist/packages/_es/Cell.js +12 -9
  24. package/dist/packages/_es/CellGroup.js +2 -4
  25. package/dist/packages/_es/Checkbox.js +1 -1
  26. package/dist/packages/_es/CheckboxGroup.js +2 -2
  27. package/dist/packages/_es/CircleProgress.js +82 -98
  28. package/dist/packages/_es/Col.js +1 -1
  29. package/dist/packages/_es/Collapse.js +34 -65
  30. package/dist/packages/_es/CollapseItem.js +60 -93
  31. package/dist/packages/_es/Comment.js +19 -43
  32. package/dist/packages/_es/ConfigProvider.js +1 -1
  33. package/dist/packages/_es/CountDown.js +3 -3
  34. package/dist/packages/_es/CountUp.js +52 -47
  35. package/dist/packages/_es/DatePicker.js +54 -37
  36. package/dist/packages/_es/Dialog.js +88 -9
  37. package/dist/packages/_es/Divider.js +3 -3
  38. package/dist/packages/_es/Drag.js +49 -75
  39. package/dist/packages/_es/Ecard.js +18 -20
  40. package/dist/packages/_es/Elevator.js +76 -101
  41. package/dist/packages/_es/Ellipsis.js +100 -140
  42. package/dist/packages/_es/Empty.js +4 -6
  43. package/dist/packages/_es/FixedNav.js +6 -11
  44. package/dist/packages/_es/Form.js +4 -4
  45. package/dist/packages/_es/FormItem.js +1 -3
  46. package/dist/packages/_es/Grid.js +1 -1
  47. package/dist/packages/_es/GridItem.js +27 -10
  48. package/dist/packages/_es/Icon.js +1 -1
  49. package/dist/packages/_es/Image.js +114 -13
  50. package/dist/packages/_es/ImagePreview.js +411 -149
  51. package/dist/packages/_es/Indicator.js +3 -3
  52. package/dist/packages/_es/InfiniteLoading.js +115 -103
  53. package/dist/packages/_es/Input.js +32 -56
  54. package/dist/packages/_es/InputNumber.js +16 -25
  55. package/dist/packages/_es/Invoice.js +5 -6
  56. package/dist/packages/_es/Layout.js +1 -1
  57. package/dist/packages/_es/List.js +34 -47
  58. package/dist/packages/_es/Menu.js +35 -35
  59. package/dist/packages/_es/MenuItem.js +29 -56
  60. package/dist/packages/_es/Navbar.js +39 -49
  61. package/dist/packages/_es/NoticeBar.js +45 -54
  62. package/dist/packages/_es/Notify.js +162 -44
  63. package/dist/packages/_es/NumberKeyboard.js +20 -15
  64. package/dist/packages/_es/OldPicker.js +116 -130
  65. package/dist/packages/_es/OverLay.js +28 -5
  66. package/dist/packages/_es/Pagination.js +5 -8
  67. package/dist/packages/_es/Picker.js +74 -198
  68. package/dist/packages/_es/Popover.js +881 -201
  69. package/dist/packages/_es/Popup.js +84 -28
  70. package/dist/packages/_es/Price.js +6 -22
  71. package/dist/packages/_es/Progress.js +11 -18
  72. package/dist/packages/_es/PullRefresh.js +2 -4
  73. package/dist/packages/_es/Radio.js +3 -3
  74. package/dist/packages/_es/RadioGroup.js +1 -1
  75. package/dist/packages/_es/Range.js +34 -48
  76. package/dist/packages/_es/Rate.js +14 -15
  77. package/dist/packages/_es/Row.js +1 -1
  78. package/dist/packages/_es/SearchBar.js +36 -39
  79. package/dist/packages/_es/ShortPassword.js +66 -97
  80. package/dist/packages/_es/SideNavBar.js +18 -7
  81. package/dist/packages/_es/SideNavBarItem.js +1 -1
  82. package/dist/packages/_es/Signature.js +80 -113
  83. package/dist/packages/_es/Skeleton.js +11 -12
  84. package/dist/packages/_es/Sku.js +38 -63
  85. package/dist/packages/_es/Step.js +2 -7
  86. package/dist/packages/_es/Steps.js +1 -1
  87. package/dist/packages/_es/Sticky.js +23 -33
  88. package/dist/packages/_es/SubSideNavBar.js +2 -4
  89. package/dist/packages/_es/Swipe.js +26 -41
  90. package/dist/packages/_es/Swiper.js +21 -38
  91. package/dist/packages/_es/SwiperItem.js +2 -2
  92. package/dist/packages/_es/Switch.js +8 -8
  93. package/dist/packages/_es/TabPane.js +1 -1
  94. package/dist/packages/_es/Tabbar.js +13 -15
  95. package/dist/packages/_es/TabbarItem.js +30 -24
  96. package/dist/packages/_es/Table.js +17 -22
  97. package/dist/packages/_es/Tabs.js +16 -49
  98. package/dist/packages/_es/Tag.js +5 -6
  99. package/dist/packages/_es/TextArea.js +49 -114
  100. package/dist/packages/_es/TimeDetail.js +3 -4
  101. package/dist/packages/_es/TimePannel.js +3 -3
  102. package/dist/packages/_es/TimeSelect.js +10 -12
  103. package/dist/packages/_es/Toast.js +164 -53
  104. package/dist/packages/_es/TrendArrow.js +4 -6
  105. package/dist/packages/_es/Uploader.js +140 -141
  106. package/dist/packages/_es/Video.js +18 -39
  107. package/dist/packages/_es/WaterMark.js +14 -22
  108. package/dist/packages/_es/common.js +1 -1
  109. package/dist/packages/_es/component.js +1 -1
  110. package/dist/packages/_es/index.js +6 -44
  111. package/dist/packages/_es/index2.js +31 -8
  112. package/dist/packages/_es/index3.js +7 -64
  113. package/dist/packages/_es/index4.js +62 -424
  114. package/dist/packages/_es/{index.taro.js → index5.js} +154 -167
  115. package/dist/packages/_es/plugin-vue_export-helper.js +1 -1
  116. package/dist/packages/_es/pxCheck.js +1 -1
  117. package/dist/packages/_es/raf.js +1 -1
  118. package/dist/packages/_es/style.css +3 -21
  119. package/dist/packages/checkbox/index.scss +1 -0
  120. package/dist/packages/locale/lang/baseLang.js +1 -1
  121. package/dist/packages/locale/lang/en-US.js +1 -1
  122. package/dist/packages/locale/lang/id-ID.js +1 -1
  123. package/dist/packages/locale/lang/index.js +1 -1
  124. package/dist/packages/locale/lang/zh-CN.js +1 -1
  125. package/dist/packages/locale/lang/zh-TW.js +1 -1
  126. package/dist/packages/menuitem/index.scss +12 -3
  127. package/dist/smartips/attributes.json +5 -1
  128. package/dist/smartips/tags.json +1 -0
  129. package/dist/smartips/web-types.json +11 -2
  130. package/dist/style.css +1 -1
  131. package/dist/styles/themes/default.scss +49 -49
  132. package/dist/styles/themes/jdb.scss +49 -49
  133. package/dist/styles/themes/jddkh.scss +49 -49
  134. package/dist/styles/themes/jdt.scss +49 -49
  135. package/dist/types/__VUE/actionsheet/{index.taro.vue.d.ts → index.vue.d.ts} +9 -9
  136. package/dist/types/__VUE/address/{index.taro.vue.d.ts → index.vue.d.ts} +32 -72
  137. package/dist/types/__VUE/addresslist/{index.taro.vue.d.ts → index.vue.d.ts} +0 -0
  138. package/dist/types/__VUE/animate/{index.taro.vue.d.ts → index.vue.d.ts} +0 -0
  139. package/dist/types/__VUE/avatar/{index.taro.vue.d.ts → index.vue.d.ts} +6 -6
  140. package/dist/types/__VUE/avatargroup/{index.taro.vue.d.ts → index.vue.d.ts} +0 -0
  141. package/dist/types/__VUE/backtop/{index.taro.vue.d.ts → index.vue.d.ts} +37 -15
  142. package/dist/types/__VUE/badge/{index.taro.vue.d.ts → index.vue.d.ts} +0 -0
  143. package/dist/types/__VUE/barrage/{index.taro.vue.d.ts → index.vue.d.ts} +2 -2
  144. package/dist/types/__VUE/button/index.vue.d.ts +1 -1
  145. package/dist/types/__VUE/calendar/{index.taro.vue.d.ts → index.vue.d.ts} +1 -13
  146. package/dist/types/__VUE/calendaritem/{index.taro.vue.d.ts → index.vue.d.ts} +17 -17
  147. package/dist/types/__VUE/card/{index.taro.vue.d.ts → index.vue.d.ts} +0 -0
  148. package/dist/types/__VUE/cascader/{index.taro.vue.d.ts → index.vue.d.ts} +1 -1
  149. package/dist/types/__VUE/category/{index.taro.vue.d.ts → index.vue.d.ts} +0 -0
  150. package/dist/types/__VUE/categorypane/{index.taro.vue.d.ts → index.vue.d.ts} +0 -0
  151. package/dist/types/__VUE/cell/{index.taro.vue.d.ts → index.vue.d.ts} +6 -13
  152. package/dist/types/__VUE/checkbox/{index.taro.vue.d.ts → index.vue.d.ts} +0 -0
  153. package/dist/types/__VUE/circleprogress/{index.taro.vue.d.ts → index.vue.d.ts} +15 -14
  154. package/dist/types/__VUE/collapse/{index.taro.vue.d.ts → index.vue.d.ts} +1 -1
  155. package/dist/types/__VUE/collapseitem/{index.taro.vue.d.ts → index.vue.d.ts} +10 -2
  156. package/dist/types/__VUE/comment/{index.taro.vue.d.ts → index.vue.d.ts} +2 -1
  157. package/dist/types/__VUE/configprovider/{index.taro.vue.d.ts → index.vue.d.ts} +0 -0
  158. package/dist/types/__VUE/countdown/{index.taro.vue.d.ts → index.vue.d.ts} +0 -0
  159. package/dist/types/__VUE/countup/{index.taro.vue.d.ts → index.vue.d.ts} +7 -5
  160. package/dist/types/__VUE/datepicker/{index.taro.vue.d.ts → index.vue.d.ts} +5 -5
  161. package/dist/types/__VUE/dialog/index.d.ts +48 -0
  162. package/dist/types/__VUE/dialog/{index.taro.vue.d.ts → index.vue.d.ts} +12 -9
  163. package/dist/types/__VUE/divider/{index.taro.vue.d.ts → index.vue.d.ts} +0 -0
  164. package/dist/types/__VUE/drag/{index.taro.vue.d.ts → index.vue.d.ts} +1 -2
  165. package/dist/types/__VUE/ecard/{index.taro.vue.d.ts → index.vue.d.ts} +3 -3
  166. package/dist/types/__VUE/elevator/{index.taro.vue.d.ts → index.vue.d.ts} +2 -11
  167. package/dist/types/__VUE/ellipsis/{index.taro.vue.d.ts → index.vue.d.ts} +0 -4
  168. package/dist/types/__VUE/empty/{index.taro.vue.d.ts → index.vue.d.ts} +0 -0
  169. package/dist/types/__VUE/fixednav/{index.taro.vue.d.ts → index.vue.d.ts} +0 -0
  170. package/dist/types/__VUE/form/{index.taro.vue.d.ts → index.vue.d.ts} +0 -0
  171. package/dist/types/__VUE/grid/{index.taro.vue.d.ts → index.vue.d.ts} +1 -1
  172. package/dist/types/__VUE/griditem/{index.taro.vue.d.ts → index.vue.d.ts} +27 -2
  173. package/dist/types/__VUE/image/index.vue.d.ts +117 -0
  174. package/dist/types/__VUE/image/type.d.ts +6 -0
  175. package/dist/types/__VUE/imagepreview/imagePreviewItem.vue.d.ts +109 -0
  176. package/dist/types/__VUE/imagepreview/index.d.ts +25 -0
  177. package/dist/types/__VUE/imagepreview/{index.taro.vue.d.ts → index.vue.d.ts} +44 -33
  178. package/dist/types/__VUE/indicator/{index.taro.vue.d.ts → index.vue.d.ts} +0 -0
  179. package/dist/types/__VUE/infiniteloading/{index.taro.vue.d.ts → index.vue.d.ts} +8 -15
  180. package/dist/types/__VUE/input/{index.taro.vue.d.ts → index.vue.d.ts} +16 -34
  181. package/dist/types/__VUE/inputnumber/{index.taro.vue.d.ts → index.vue.d.ts} +2 -2
  182. package/dist/types/__VUE/invoice/{index.taro.vue.d.ts → index.vue.d.ts} +0 -0
  183. package/dist/types/__VUE/layout/{index.taro.vue.d.ts → index.vue.d.ts} +0 -0
  184. package/dist/types/__VUE/list/{index.taro.vue.d.ts → index.vue.d.ts} +2 -2
  185. package/dist/types/__VUE/menu/{index.taro.vue.d.ts → index.vue.d.ts} +0 -1
  186. package/dist/types/__VUE/menuitem/{index.taro.vue.d.ts → index.vue.d.ts} +0 -0
  187. package/dist/types/__VUE/navbar/{index.taro.vue.d.ts → index.vue.d.ts} +2 -1
  188. package/dist/types/__VUE/noticebar/{index.taro.vue.d.ts → index.vue.d.ts} +4 -4
  189. package/dist/types/__VUE/notify/index.d.ts +26 -0
  190. package/dist/types/__VUE/notify/{index.taro.vue.d.ts → index.vue.d.ts} +18 -5
  191. package/dist/types/__VUE/numberkeyboard/{index.taro.vue.d.ts → index.vue.d.ts} +29 -5
  192. package/dist/types/__VUE/oldpicker/{ColumnTaro.vue.d.ts → Column.vue.d.ts} +17 -28
  193. package/dist/types/__VUE/oldpicker/{index.taro.vue.d.ts → index.vue.d.ts} +44 -64
  194. package/dist/types/__VUE/pagination/{index.taro.vue.d.ts → index.vue.d.ts} +0 -0
  195. package/dist/types/__VUE/picker/{ColumnTaro.vue.d.ts → Column.vue.d.ts} +4 -16
  196. package/dist/types/__VUE/picker/{index.taro.vue.d.ts → index.vue.d.ts} +28 -53
  197. package/dist/types/__VUE/popover/{index.taro.vue.d.ts → index.vue.d.ts} +12 -14
  198. package/dist/types/__VUE/popup/index.vue.d.ts +1 -1
  199. package/dist/types/__VUE/price/{index.taro.vue.d.ts → index.vue.d.ts} +0 -1
  200. package/dist/types/__VUE/progress/{index.taro.vue.d.ts → index.vue.d.ts} +1 -1
  201. package/dist/types/__VUE/radio/{index.taro.vue.d.ts → index.vue.d.ts} +0 -0
  202. package/dist/types/__VUE/range/{index.taro.vue.d.ts → index.vue.d.ts} +6 -7
  203. package/dist/types/__VUE/rate/{index.taro.vue.d.ts → index.vue.d.ts} +0 -0
  204. package/dist/types/__VUE/searchbar/{index.taro.vue.d.ts → index.vue.d.ts} +19 -19
  205. package/dist/types/__VUE/shortpassword/{index.taro.vue.d.ts → index.vue.d.ts} +21 -6
  206. package/dist/types/__VUE/sidenavbar/{index.taro.vue.d.ts → index.vue.d.ts} +5 -0
  207. package/dist/types/__VUE/signature/{index.taro.vue.d.ts → index.vue.d.ts} +5 -8
  208. package/dist/types/__VUE/skeleton/{index.taro.vue.d.ts → index.vue.d.ts} +0 -0
  209. package/dist/types/__VUE/sku/index.vue.d.ts +310 -0
  210. package/dist/types/__VUE/step/index.vue.d.ts +1 -1
  211. package/dist/types/__VUE/steps/{index.taro.vue.d.ts → index.vue.d.ts} +0 -0
  212. package/dist/types/__VUE/sticky/{index.taro.vue.d.ts → index.vue.d.ts} +0 -0
  213. package/dist/types/__VUE/swipe/{index.taro.vue.d.ts → index.vue.d.ts} +1 -2
  214. package/dist/types/__VUE/swiper/{index.taro.vue.d.ts → index.vue.d.ts} +1 -2
  215. package/dist/types/__VUE/swiperitem/{index.taro.vue.d.ts → index.vue.d.ts} +0 -0
  216. package/dist/types/__VUE/switch/{index.taro.vue.d.ts → index.vue.d.ts} +0 -0
  217. package/dist/types/__VUE/tabbar/{index.taro.vue.d.ts → index.vue.d.ts} +2 -1
  218. package/dist/types/__VUE/tabbaritem/{index.taro.vue.d.ts → index.vue.d.ts} +9 -9
  219. package/dist/types/__VUE/table/{index.taro.vue.d.ts → index.vue.d.ts} +0 -0
  220. package/dist/types/__VUE/tabs/{index.taro.vue.d.ts → index.vue.d.ts} +0 -0
  221. package/dist/types/__VUE/tag/{index.taro.vue.d.ts → index.vue.d.ts} +4 -4
  222. package/dist/types/__VUE/tag/type.d.ts +5 -0
  223. package/dist/types/__VUE/textarea/{index.taro.vue.d.ts → index.vue.d.ts} +3 -5
  224. package/dist/types/__VUE/timedetail/{index.taro.vue.d.ts → index.vue.d.ts} +0 -0
  225. package/dist/types/__VUE/timepannel/{index.taro.vue.d.ts → index.vue.d.ts} +0 -0
  226. package/dist/types/__VUE/timeselect/{index.taro.vue.d.ts → index.vue.d.ts} +8 -7
  227. package/dist/types/__VUE/toast/index.d.ts +16 -0
  228. package/dist/types/__VUE/toast/{index.taro.vue.d.ts → index.vue.d.ts} +22 -44
  229. package/dist/types/__VUE/trendarrow/{index.taro.vue.d.ts → index.vue.d.ts} +0 -0
  230. package/dist/types/__VUE/uploader/{index.taro.vue.d.ts → index.vue.d.ts} +11 -20
  231. package/dist/types/__VUE/watermark/{index.taro.vue.d.ts → index.vue.d.ts} +1 -1
  232. package/dist/types/index.d.ts +1 -1
  233. package/dist/types/nutui.d.ts +89 -89
  234. package/package.json +3 -2
  235. package/dist/packages/_es/use-lock-scroll.js +0 -23
  236. package/dist/types/__VUE/button/index.taro.vue.d.ts +0 -116
  237. package/dist/types/__VUE/icon/index.taro.vue.d.ts +0 -74
  238. package/dist/types/__VUE/image/index.taro.vue.d.ts +0 -33
  239. package/dist/types/__VUE/overlay/index.taro.vue.d.ts +0 -85
  240. package/dist/types/__VUE/popup/index.taro.vue.d.ts +0 -1728
  241. package/dist/types/__VUE/sku/index.taro.vue.d.ts +0 -182
@@ -1,22 +1,306 @@
1
1
  /*!
2
- * @nutui/nutui v3.2.6-beta.1 Mon Oct 31 2022 19:38:22 GMT+0800 (中国标准时间)
2
+ * @nutui/nutui v3.2.6 Fri Nov 04 2022 18:06:53 GMT+0800 (中国标准时间)
3
3
  * (c) 2022 @jdf2e.
4
4
  * Released under the MIT License.
5
5
  */
6
- import { reactive, computed, watch, onMounted, toRefs, resolveComponent, openBlock, createBlock, withCtx, createElementVNode, createElementBlock, Fragment, renderList, createCommentVNode, createTextVNode, toDisplayString, normalizeStyle, createVNode, mergeProps } from "vue";
6
+ import { reactive, computed, watch, toRefs, resolveComponent, openBlock, createBlock, withCtx, createElementBlock, normalizeStyle, createElementVNode, createCommentVNode, createVNode, ref, onMounted, Fragment, renderList, toDisplayString, mergeProps, render, h } from "vue";
7
7
  import { c as createComponent, i as isPromise } from "./component.js";
8
8
  import Popup from "./Popup.js";
9
+ import Video from "./Video.js";
9
10
  import Swiper from "./Swiper.js";
10
11
  import SwiperItem from "./SwiperItem.js";
11
- import _sfc_main$1 from "./Icon.js";
12
+ import _sfc_main$2 from "./Icon.js";
13
+ import { u as useTouch } from "./index4.js";
12
14
  import { _ as _export_sfc } from "./plugin-vue_export-helper.js";
13
15
  import "../locale/lang";
14
- import "./use-lock-scroll.js";
15
16
  import "./OverLay.js";
16
17
  import "./pxCheck.js";
17
- import "./index.js";
18
- import "./index2.js";
19
- import "@tarojs/taro";
18
+ import "./index3.js";
19
+ const { create: create$1 } = createComponent("imagepreviewitem");
20
+ const _sfc_main$1 = create$1({
21
+ props: {
22
+ show: {
23
+ type: Boolean,
24
+ default: false
25
+ },
26
+ initNo: Number,
27
+ image: {
28
+ type: Object,
29
+ default: () => ({})
30
+ },
31
+ video: {
32
+ type: Object,
33
+ default: () => ({})
34
+ },
35
+ showIndex: {
36
+ type: Boolean,
37
+ default: true
38
+ },
39
+ rootWidth: {
40
+ type: Number,
41
+ default: 0
42
+ },
43
+ rootHeight: {
44
+ type: Number,
45
+ default: 0
46
+ },
47
+ minZoom: {
48
+ type: Number,
49
+ default: 1 / 3
50
+ },
51
+ maxZoom: {
52
+ type: Number,
53
+ default: 3
54
+ }
55
+ },
56
+ emits: ["close", "scale"],
57
+ components: {
58
+ [Popup.name]: Popup,
59
+ [Video.name]: Video,
60
+ [Swiper.name]: Swiper,
61
+ [SwiperItem.name]: SwiperItem,
62
+ [_sfc_main$2.name]: _sfc_main$2
63
+ },
64
+ setup(props, { emit }) {
65
+ const state = reactive({
66
+ scale: 1,
67
+ moveX: 0,
68
+ moveY: 0,
69
+ moving: false,
70
+ zooming: false,
71
+ imageRatio: 0,
72
+ displayWidth: 0,
73
+ displayHeight: 0
74
+ });
75
+ const touch = useTouch();
76
+ const vertical = computed(() => {
77
+ const { rootWidth, rootHeight } = props;
78
+ const rootRatio = rootHeight / rootWidth;
79
+ return state.imageRatio > rootRatio;
80
+ });
81
+ const imageStyle = computed(() => {
82
+ const { scale, moveX, moveY, moving, zooming } = state;
83
+ const style = {
84
+ transitionDuration: zooming || moving ? "0s" : ".3s"
85
+ };
86
+ if (scale !== 1) {
87
+ const offsetX = moveX / scale;
88
+ const offsetY = moveY / scale;
89
+ style.transform = `scale(${scale}, ${scale}) translate(${offsetX}px, ${offsetY}px)`;
90
+ }
91
+ return style;
92
+ });
93
+ const maxMoveX = computed(() => {
94
+ if (state.imageRatio) {
95
+ const { rootWidth, rootHeight } = props;
96
+ const displayWidth = vertical.value ? rootHeight / state.imageRatio : rootWidth;
97
+ return Math.max(0, (state.scale * displayWidth - rootWidth) / 2);
98
+ }
99
+ return 0;
100
+ });
101
+ const maxMoveY = computed(() => {
102
+ if (state.imageRatio) {
103
+ const { rootWidth, rootHeight } = props;
104
+ const displayHeight = vertical.value ? rootHeight : rootWidth * state.imageRatio;
105
+ return Math.max(0, (state.scale * displayHeight - rootHeight) / 2);
106
+ }
107
+ return 0;
108
+ });
109
+ const imageLoad = (event) => {
110
+ const { naturalWidth, naturalHeight } = event.target;
111
+ state.imageRatio = naturalHeight / naturalWidth;
112
+ };
113
+ const resetScale = () => {
114
+ setScale(1);
115
+ state.moveX = 0;
116
+ state.moveY = 0;
117
+ };
118
+ const setScale = (scale) => {
119
+ scale = clamp(scale, +props.minZoom, +props.maxZoom + 1);
120
+ if (scale !== state.scale) {
121
+ state.scale = scale;
122
+ emit("scale", {
123
+ scale,
124
+ index: props.initNo
125
+ });
126
+ }
127
+ };
128
+ const toggleScale = () => {
129
+ const scale = state.scale > 1 ? 1 : 2;
130
+ setScale(scale);
131
+ state.moveX = 0;
132
+ state.moveY = 0;
133
+ };
134
+ const getDistance = (touches) => Math.sqrt((touches[0].clientX - touches[1].clientX) ** 2 + (touches[0].clientY - touches[1].clientY) ** 2);
135
+ let startMoveX;
136
+ let startMoveY;
137
+ let startScale;
138
+ let startDistance;
139
+ let doubleTapTimer;
140
+ let touchStartTime;
141
+ let fingerNum;
142
+ const onTouchStart = (event) => {
143
+ const { touches } = event;
144
+ const { offsetX } = touch;
145
+ touch.start(event);
146
+ fingerNum = touches.length;
147
+ startMoveX = state.moveX;
148
+ startMoveY = state.moveY;
149
+ touchStartTime = Date.now();
150
+ state.moving = fingerNum === 1 && state.scale !== 1;
151
+ state.zooming = fingerNum === 2 && !offsetX.value;
152
+ if (state.zooming) {
153
+ startScale = state.scale;
154
+ startDistance = getDistance(event.touches);
155
+ }
156
+ };
157
+ const onTouchMove = (event) => {
158
+ const { touches } = event;
159
+ touch.move(event);
160
+ if (state.moving || state.zooming) {
161
+ preventDefault(event, true);
162
+ }
163
+ if (state.moving) {
164
+ const { deltaX, deltaY } = touch;
165
+ const moveX = deltaX.value + startMoveX;
166
+ const moveY = deltaY.value + startMoveY;
167
+ state.moveX = clamp(moveX, -maxMoveX.value, maxMoveX.value);
168
+ state.moveY = clamp(moveY, -maxMoveY.value, maxMoveY.value);
169
+ }
170
+ if (state.zooming && touches.length === 2) {
171
+ const distance = getDistance(touches);
172
+ const scale = startScale * distance / startDistance;
173
+ setScale(scale);
174
+ }
175
+ };
176
+ const checkTap = () => {
177
+ if (fingerNum == 1 && props.video && props.video.source) {
178
+ return;
179
+ }
180
+ if (fingerNum > 1) {
181
+ return;
182
+ }
183
+ const { offsetX, offsetY } = touch;
184
+ const deltaTime = Date.now() - touchStartTime;
185
+ const TAP_TIME = 250;
186
+ const TAP_OFFSET = 5;
187
+ if (offsetX.value < TAP_OFFSET && offsetY.value < TAP_OFFSET && deltaTime < TAP_TIME) {
188
+ if (doubleTapTimer) {
189
+ clearTimeout(doubleTapTimer);
190
+ doubleTapTimer = null;
191
+ toggleScale();
192
+ } else {
193
+ doubleTapTimer = setTimeout(() => {
194
+ emit("close");
195
+ doubleTapTimer = null;
196
+ }, TAP_TIME);
197
+ }
198
+ }
199
+ };
200
+ const onTouchEnd = (event) => {
201
+ console.log("ontauchend");
202
+ let stopPropagation = false;
203
+ if (state.moving || state.zooming) {
204
+ stopPropagation = true;
205
+ if (state.moving && startMoveX === state.moveX && startMoveY === state.moveY) {
206
+ stopPropagation = false;
207
+ }
208
+ if (!event.touches.length) {
209
+ if (state.zooming) {
210
+ state.moveX = clamp(state.moveX, -maxMoveX.value, maxMoveX.value);
211
+ state.moveY = clamp(state.moveY, -maxMoveY.value, maxMoveY.value);
212
+ state.zooming = false;
213
+ }
214
+ state.moving = false;
215
+ startMoveX = 0;
216
+ startMoveY = 0;
217
+ startScale = 1;
218
+ if (state.scale < 1) {
219
+ resetScale();
220
+ }
221
+ if (state.scale > props.maxZoom) {
222
+ state.scale = +props.maxZoom;
223
+ }
224
+ }
225
+ }
226
+ preventDefault(event, stopPropagation);
227
+ checkTap();
228
+ touch.reset();
229
+ };
230
+ const preventDefault = (event, isStopPropagation) => {
231
+ if (typeof event.cancelable !== "boolean" || event.cancelable) {
232
+ event.preventDefault();
233
+ }
234
+ if (isStopPropagation) {
235
+ event.stopPropagation();
236
+ }
237
+ };
238
+ const clamp = (num, min, max) => Math.min(Math.max(num, min), max);
239
+ const closeSwiper = (event) => {
240
+ console.log("\u5173\u95ED\u89C6\u9891");
241
+ emit("close");
242
+ };
243
+ watch(() => props.initNo, resetScale);
244
+ watch(
245
+ () => props.show,
246
+ (value) => {
247
+ if (!value) {
248
+ resetScale();
249
+ }
250
+ }
251
+ );
252
+ return {
253
+ ...toRefs(state),
254
+ onTouchStart,
255
+ onTouchMove,
256
+ onTouchEnd,
257
+ getDistance,
258
+ imageStyle,
259
+ imageLoad,
260
+ closeSwiper
261
+ };
262
+ }
263
+ });
264
+ const _hoisted_1$1 = ["src"];
265
+ function _sfc_render$1(_ctx, _cache, $props, $setup, $data, $options) {
266
+ const _component_nut_video = resolveComponent("nut-video");
267
+ const _component_nut_swiper_item = resolveComponent("nut-swiper-item");
268
+ return openBlock(), createBlock(_component_nut_swiper_item, { onClick: _ctx.closeSwiper }, {
269
+ default: withCtx(() => [
270
+ _ctx.image && _ctx.image.src ? (openBlock(), createElementBlock("view", {
271
+ key: 0,
272
+ style: normalizeStyle(_ctx.imageStyle),
273
+ class: "nut-imagepreview-box",
274
+ onTouchstart: _cache[1] || (_cache[1] = (...args) => _ctx.onTouchStart && _ctx.onTouchStart(...args)),
275
+ onTouchmove: _cache[2] || (_cache[2] = (...args) => _ctx.onTouchMove && _ctx.onTouchMove(...args)),
276
+ onTouchend: _cache[3] || (_cache[3] = (...args) => _ctx.onTouchEnd && _ctx.onTouchEnd(...args)),
277
+ onTouchcancel: _cache[4] || (_cache[4] = (...args) => _ctx.onTouchEnd && _ctx.onTouchEnd(...args))
278
+ }, [
279
+ createElementVNode("img", {
280
+ src: _ctx.image.src,
281
+ class: "nut-imagepreview-img",
282
+ onLoad: _cache[0] || (_cache[0] = (...args) => _ctx.imageLoad && _ctx.imageLoad(...args))
283
+ }, null, 40, _hoisted_1$1)
284
+ ], 36)) : createCommentVNode("", true),
285
+ _ctx.video && _ctx.video.source ? (openBlock(), createElementBlock("view", {
286
+ key: 1,
287
+ class: "nut-imagepreview-box",
288
+ onClick: _cache[5] || (_cache[5] = (...args) => _ctx.videoClick && _ctx.videoClick(...args)),
289
+ onTouchstart: _cache[6] || (_cache[6] = (...args) => _ctx.onTouchStart && _ctx.onTouchStart(...args)),
290
+ onTouchmove: _cache[7] || (_cache[7] = (...args) => _ctx.onTouchMove && _ctx.onTouchMove(...args)),
291
+ onTouchend: _cache[8] || (_cache[8] = (...args) => _ctx.onTouchEnd && _ctx.onTouchEnd(...args)),
292
+ onTouchcancel: _cache[9] || (_cache[9] = (...args) => _ctx.onTouchEnd && _ctx.onTouchEnd(...args))
293
+ }, [
294
+ createVNode(_component_nut_video, {
295
+ source: _ctx.video.source,
296
+ options: _ctx.video.options
297
+ }, null, 8, ["source", "options"])
298
+ ], 32)) : createCommentVNode("", true)
299
+ ]),
300
+ _: 1
301
+ }, 8, ["onClick"]);
302
+ }
303
+ var ImagePreviewItem = /* @__PURE__ */ _export_sfc(_sfc_main$1, [["render", _sfc_render$1]]);
20
304
  const { create } = createComponent("imagepreview");
21
305
  const _sfc_main = create({
22
306
  props: {
@@ -28,9 +312,13 @@ const _sfc_main = create({
28
312
  type: Array,
29
313
  default: () => []
30
314
  },
315
+ videos: {
316
+ type: Array,
317
+ default: () => []
318
+ },
31
319
  contentClose: {
32
320
  type: Boolean,
33
- default: false
321
+ default: true
34
322
  },
35
323
  initNo: {
36
324
  type: Number,
@@ -46,7 +334,11 @@ const _sfc_main = create({
46
334
  },
47
335
  autoplay: {
48
336
  type: [Number, String],
49
- default: 3e3
337
+ default: 0
338
+ },
339
+ isWrapTeleport: {
340
+ type: Boolean,
341
+ default: false
50
342
  },
51
343
  showIndex: {
52
344
  type: Boolean,
@@ -65,6 +357,14 @@ const _sfc_main = create({
65
357
  default: "top-right"
66
358
  },
67
359
  beforeClose: Function,
360
+ minZoom: {
361
+ type: Number,
362
+ default: 1 / 3
363
+ },
364
+ maxZoom: {
365
+ type: Number,
366
+ default: 3
367
+ },
68
368
  isLoop: {
69
369
  type: Boolean,
70
370
  default: true
@@ -73,31 +373,20 @@ const _sfc_main = create({
73
373
  emits: ["close", "change"],
74
374
  components: {
75
375
  [Popup.name]: Popup,
376
+ [Video.name]: Video,
76
377
  [Swiper.name]: Swiper,
77
378
  [SwiperItem.name]: SwiperItem,
78
- [_sfc_main$1.name]: _sfc_main$1
379
+ [_sfc_main$2.name]: _sfc_main$2,
380
+ ImagePreviewItem
79
381
  },
80
382
  setup(props, { emit }) {
383
+ const swipeRef = ref();
81
384
  const state = reactive({
82
385
  showPop: false,
83
386
  active: 1,
84
387
  maxNo: 1,
85
- source: {
86
- src: "https://storage.jd.com/about/big-final.mp4?Expires=3730193075&AccessKey=3LoYX1dQWa6ZXzQl&Signature=ViMFjz%2BOkBxS%2FY1rjtUVqbopbJI%3D",
87
- type: "video/mp4"
88
- },
89
- options: {
90
- muted: true,
91
- controls: true
92
- },
93
- eleImg: null,
94
- store: {
95
- scale: 1,
96
- moveable: false,
97
- originScale: 1,
98
- oriDistance: 1
99
- },
100
- lastTouchEndTime: 0
388
+ rootWidth: 0,
389
+ rootHeight: 0
101
390
  });
102
391
  const styles = computed(() => {
103
392
  let style = {};
@@ -112,11 +401,6 @@ const _sfc_main = create({
112
401
  state.active = page + 1;
113
402
  emit("change", state.active);
114
403
  };
115
- const closeOnImg = () => {
116
- if (props.contentClose) {
117
- onClose();
118
- }
119
- };
120
404
  const onClose = () => {
121
405
  if (props.beforeClose) {
122
406
  const returnVal = props.beforeClose.apply(null, state.active);
@@ -135,90 +419,17 @@ const _sfc_main = create({
135
419
  };
136
420
  const closeDone = () => {
137
421
  state.showPop = false;
138
- state.store.scale = 1;
139
- scaleNow();
140
422
  state.active = 1;
141
423
  emit("close");
142
424
  };
143
- const getDistance = (first, second) => {
144
- return Math.hypot(Math.abs(second.x - first.x), Math.abs(second.y - first.y));
145
- };
146
- const scaleNow = () => {
147
- if (state.eleImg != null) {
148
- state.eleImg.style.transform = "scale(" + state.store.scale + ")";
149
- }
150
- };
151
- const onTouchStart = (event) => {
152
- const curTouchTime = new Date().getTime();
153
- if (curTouchTime - state.lastTouchEndTime < 300) {
154
- const store2 = state.store;
155
- if (store2.scale > 1) {
156
- store2.scale = 1;
157
- } else if (store2.scale == 1) {
158
- store2.scale = 2;
159
- }
160
- scaleNow();
161
- }
162
- var touches = event.touches;
163
- var events = touches[0];
164
- var events2 = touches[1];
165
- const store = state.store;
166
- store.moveable = true;
167
- if (events2) {
168
- store.oriDistance = getDistance(
169
- {
170
- x: events.pageX,
171
- y: events.pageY
172
- },
173
- {
174
- x: events2.pageX,
175
- y: events2.pageY
176
- }
177
- );
178
- }
179
- store.originScale = store.scale || 1;
180
- };
181
- const onTouchMove = (event) => {
182
- if (!state.store.moveable) {
183
- return;
184
- }
185
- const store = state.store;
186
- var touches = event.touches;
187
- var events = touches[0];
188
- var events2 = touches[1];
189
- if (events2) {
190
- const curDistance = getDistance(
191
- {
192
- x: events.pageX,
193
- y: events.pageY
194
- },
195
- {
196
- x: events2.pageX,
197
- y: events2.pageY
198
- }
199
- );
200
- const curScale = curDistance / store.oriDistance;
201
- store.scale = store.originScale * curScale;
202
- if (store.scale > 3) {
203
- store.scale = 3;
204
- }
205
- scaleNow();
206
- }
207
- };
208
- const onTouchEnd = () => {
209
- state.lastTouchEndTime = new Date().getTime();
210
- const store = state.store;
211
- store.moveable = false;
212
- if (store.scale < 1.1 && store.scale > 1 || store.scale < 1) {
213
- store.scale = 1;
214
- scaleNow();
215
- }
425
+ const handleCloseIcon = () => {
426
+ onClose();
216
427
  };
217
428
  const init = () => {
218
- state.eleImg = document.querySelector(".nut-imagepreview");
219
- document.addEventListener("touchmove", onTouchMove);
220
- document.addEventListener("touchend", onTouchEnd);
221
- document.addEventListener("touchcancel", onTouchEnd);
429
+ setTimeout(() => {
430
+ state.rootHeight = swipeRef.value.offsetHeight;
431
+ state.rootWidth = swipeRef.value.offsetWidth;
432
+ }, 100);
222
433
  };
223
434
  watch(
224
435
  () => props.show,
@@ -227,51 +438,45 @@ const _sfc_main = create({
227
438
  init();
228
439
  }
229
440
  );
230
- const handleCloseIcon = () => {
231
- onClose();
232
- };
233
441
  onMounted(() => {
234
442
  state.active = props.initNo;
235
443
  state.showPop = props.show;
236
- state.maxNo = props.images.length;
444
+ state.maxNo = props.images.length + props.videos.length;
237
445
  });
238
446
  return {
447
+ swipeRef,
239
448
  ...toRefs(state),
240
449
  slideChangeEnd,
241
450
  onClose,
242
- closeOnImg,
243
- onTouchStart,
244
- onTouchMove,
245
- onTouchEnd,
246
- getDistance,
247
- scaleNow,
248
- styles,
249
- handleCloseIcon
451
+ handleCloseIcon,
452
+ styles
250
453
  };
251
454
  }
252
455
  });
253
- const _hoisted_1 = ["src"];
456
+ const _hoisted_1 = {
457
+ class: "nut-imagepreview",
458
+ ref: "swipeRef"
459
+ };
254
460
  const _hoisted_2 = {
255
461
  key: 0,
256
462
  class: "nut-imagepreview-index"
257
463
  };
258
464
  function _sfc_render(_ctx, _cache, $props, $setup, $data, $options) {
259
- const _component_nut_swiper_item = resolveComponent("nut-swiper-item");
465
+ const _component_image_preview_item = resolveComponent("image-preview-item");
260
466
  const _component_nut_swiper = resolveComponent("nut-swiper");
261
467
  const _component_nut_icon = resolveComponent("nut-icon");
262
468
  const _component_nut_popup = resolveComponent("nut-popup");
263
469
  return openBlock(), createBlock(_component_nut_popup, {
264
470
  "pop-class": "custom-pop",
265
471
  visible: _ctx.showPop,
266
- "onUpdate:visible": _cache[2] || (_cache[2] = ($event) => _ctx.showPop = $event),
267
- onClick: _ctx.onClose,
268
- style: { "width": "100%" }
472
+ "onUpdate:visible": _cache[1] || (_cache[1] = ($event) => _ctx.showPop = $event),
473
+ isWrapTeleport: _ctx.isWrapTeleport,
474
+ onClosed: _ctx.onClose,
475
+ style: { "width": "100%" },
476
+ "lock-scroll": ""
269
477
  }, {
270
478
  default: withCtx(() => [
271
- createElementVNode("view", {
272
- class: "nut-imagepreview",
273
- onTouchstartCapture: _cache[0] || (_cache[0] = (...args) => _ctx.onTouchStart && _ctx.onTouchStart(...args))
274
- }, [
479
+ createElementVNode("view", _hoisted_1, [
275
480
  _ctx.showPop ? (openBlock(), createBlock(_component_nut_swiper, {
276
481
  key: 0,
277
482
  "auto-play": _ctx.autoplay,
@@ -285,36 +490,93 @@ function _sfc_render(_ctx, _cache, $props, $setup, $data, $options) {
285
490
  "pagination-color": _ctx.paginationColor
286
491
  }, {
287
492
  default: withCtx(() => [
493
+ _ctx.videos.length ? (openBlock(true), createElementBlock(Fragment, { key: 0 }, renderList(_ctx.videos, (item, index) => {
494
+ return openBlock(), createBlock(_component_image_preview_item, {
495
+ key: index,
496
+ video: item,
497
+ rootHeight: _ctx.rootHeight,
498
+ rootWidth: _ctx.rootWidth,
499
+ show: _ctx.showPop,
500
+ "init-no": _ctx.active,
501
+ onClose: _ctx.onClose,
502
+ maxZoom: _ctx.maxZoom,
503
+ minZoom: _ctx.minZoom
504
+ }, null, 8, ["video", "rootHeight", "rootWidth", "show", "init-no", "onClose", "maxZoom", "minZoom"]);
505
+ }), 128)) : createCommentVNode("", true),
288
506
  (openBlock(true), createElementBlock(Fragment, null, renderList(_ctx.images, (item, index) => {
289
- return openBlock(), createBlock(_component_nut_swiper_item, { key: index }, {
290
- default: withCtx(() => [
291
- createElementVNode("img", {
292
- src: item.src,
293
- mode: "aspectFit",
294
- class: "nut-imagepreview-img"
295
- }, null, 8, _hoisted_1)
296
- ]),
297
- _: 2
298
- }, 1024);
507
+ return openBlock(), createBlock(_component_image_preview_item, {
508
+ key: index,
509
+ image: item,
510
+ rootHeight: _ctx.rootHeight,
511
+ rootWidth: _ctx.rootWidth,
512
+ show: _ctx.showPop,
513
+ "init-no": _ctx.active,
514
+ onClose: _ctx.onClose
515
+ }, null, 8, ["image", "rootHeight", "rootWidth", "show", "init-no", "onClose"]);
299
516
  }), 128))
300
517
  ]),
301
518
  _: 1
302
519
  }, 8, ["auto-play", "loop", "onChange", "init-page", "pagination-visible", "pagination-color"])) : createCommentVNode("", true)
303
- ], 32),
304
- createTextVNode(),
305
- _ctx.showIndex ? (openBlock(), createElementBlock("view", _hoisted_2, toDisplayString(_ctx.active) + " / " + toDisplayString(_ctx.images.length), 1)) : createCommentVNode("", true),
306
- createTextVNode(),
520
+ ], 512),
521
+ _ctx.showIndex ? (openBlock(), createElementBlock("view", _hoisted_2, toDisplayString(_ctx.active) + " / " + toDisplayString(_ctx.images.length + _ctx.videos.length), 1)) : createCommentVNode("", true),
307
522
  _ctx.closeable ? (openBlock(), createElementBlock("view", {
308
523
  key: 1,
309
524
  class: "nut-imagepreview-close-icon",
310
- onClick: _cache[1] || (_cache[1] = (...args) => _ctx.handleCloseIcon && _ctx.handleCloseIcon(...args)),
525
+ onClick: _cache[0] || (_cache[0] = (...args) => _ctx.handleCloseIcon && _ctx.handleCloseIcon(...args)),
311
526
  style: normalizeStyle(_ctx.styles)
312
527
  }, [
313
528
  createVNode(_component_nut_icon, mergeProps({ name: _ctx.closeIcon }, _ctx.$attrs, { color: "#ffffff" }), null, 16, ["name"])
314
529
  ], 4)) : createCommentVNode("", true)
315
530
  ]),
316
531
  _: 1
317
- }, 8, ["visible", "onClick"]);
532
+ }, 8, ["visible", "isWrapTeleport", "onClosed"]);
533
+ }
534
+ var ImagePreview = /* @__PURE__ */ _export_sfc(_sfc_main, [["render", _sfc_render]]);
535
+ class ImagePreviewOptions {
536
+ constructor() {
537
+ this.show = false;
538
+ this.images = [];
539
+ this.initNo = 1;
540
+ this.paginationVisible = false;
541
+ this.paginationColor = "";
542
+ this.teleport = "body";
543
+ this.onClose = () => {
544
+ };
545
+ }
318
546
  }
319
- var index_taro = /* @__PURE__ */ _export_sfc(_sfc_main, [["render", _sfc_render]]);
320
- export { index_taro as default };
547
+ class ImagePreviewFunction {
548
+ constructor(_options) {
549
+ this.options = new ImagePreviewOptions();
550
+ const options = Object.assign(this.options, _options);
551
+ let elWarp = document.body;
552
+ const teleport = options.teleport;
553
+ if (teleport != "body") {
554
+ if (typeof teleport == "string") {
555
+ elWarp = document.querySelector(teleport);
556
+ } else {
557
+ elWarp = options.teleport;
558
+ }
559
+ }
560
+ const root = document.createElement("view");
561
+ root.id = "imagepreview-" + new Date().getTime();
562
+ const Wrapper = {
563
+ setup() {
564
+ options.teleport = `#${root.id}`;
565
+ return () => {
566
+ return h(ImagePreview, options);
567
+ };
568
+ }
569
+ };
570
+ const instance = createVNode(Wrapper);
571
+ elWarp.appendChild(root);
572
+ render(instance, root);
573
+ }
574
+ }
575
+ const _ImagePreview = (options) => {
576
+ return new ImagePreviewFunction(options);
577
+ };
578
+ _ImagePreview.install = (app) => {
579
+ app.use(ImagePreview);
580
+ app.config.globalProperties.$imagepreview = _ImagePreview;
581
+ };
582
+ export { ImagePreview, ImagePreviewOptions, _ImagePreview as default };
@@ -1,5 +1,5 @@
1
1
  /*!
2
- * @nutui/nutui v3.2.6-beta.1 Mon Oct 31 2022 19:38:22 GMT+0800 (中国标准时间)
2
+ * @nutui/nutui v3.2.6 Fri Nov 04 2022 18:06:53 GMT+0800 (中国标准时间)
3
3
  * (c) 2022 @jdf2e.
4
4
  * Released under the MIT License.
5
5
  */
@@ -63,5 +63,5 @@ function _sfc_render(_ctx, _cache, $props, $setup, $data, $options) {
63
63
  }), 128))
64
64
  ], 2);
65
65
  }
66
- var index_taro = /* @__PURE__ */ _export_sfc(_sfc_main, [["render", _sfc_render]]);
67
- export { index_taro as default };
66
+ var index = /* @__PURE__ */ _export_sfc(_sfc_main, [["render", _sfc_render]]);
67
+ export { index as default };