@nutui/nutui-react-taro 2.0.0-alpha.5 → 2.0.0-alpha.7
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.
- package/CHANGELOG.md +18 -0
- package/dist/esm/ActionSheet.js +15 -16
- package/dist/esm/Address.js +19 -20
- package/dist/esm/Animate.js +7 -8
- package/dist/esm/AnimatingNumbers.js +8 -9
- package/dist/esm/Audio.js +17 -19
- package/dist/esm/Avatar.js +11 -13
- package/dist/esm/AvatarGroup.js +8 -9
- package/dist/esm/BackTop.js +9 -10
- package/dist/esm/Badge.js +7 -8
- package/dist/esm/Barrage.js +9 -10
- package/dist/esm/Button.js +8 -9
- package/dist/esm/Calendar.js +18 -20
- package/dist/esm/CalendarItem.js +11 -13
- package/dist/esm/Card.js +12 -13
- package/dist/esm/Cascader.js +16 -19
- package/dist/esm/Cell.js +7 -8
- package/dist/esm/CellGroup.js +7 -8
- package/dist/esm/Checkbox.js +9 -10
- package/dist/esm/CheckboxGroup.js +9 -10
- package/dist/esm/CircleProgress.js +8 -9
- package/dist/esm/Col.js +8 -9
- package/dist/esm/Collapse.js +8 -9
- package/dist/esm/CollapseItem.js +7 -8
- package/dist/esm/ConfigProvider.js +9 -8
- package/dist/esm/CountDown.js +8 -10
- package/dist/esm/DatePicker.js +21 -23
- package/dist/esm/Dialog.js +13 -15
- package/dist/esm/Divider.js +7 -8
- package/dist/esm/Drag.js +7 -8
- package/dist/esm/Elevator.js +9 -10
- package/dist/esm/Ellipsis.js +9 -10
- package/dist/esm/Empty.js +7 -9
- package/dist/esm/FixedNav.js +11 -13
- package/dist/esm/Form.js +10 -11
- package/dist/esm/FormItem.js +8 -9
- package/dist/esm/Grid.js +8 -10
- package/dist/esm/GridItem.js +7 -9
- package/dist/esm/Image.js +7 -9
- package/dist/esm/ImagePreview.js +19 -20
- package/dist/esm/Indicator.js +6 -7
- package/dist/esm/Infiniteloading.js +12 -14
- package/dist/esm/Input.js +11 -13
- package/dist/esm/InputNumber.js +9 -10
- package/dist/esm/Layout.js +5 -6
- package/dist/esm/Menu.js +8 -9
- package/dist/esm/MenuItem.js +13 -14
- package/dist/esm/NavBar.js +7 -8
- package/dist/esm/NoticeBar.js +11 -12
- package/dist/esm/Notify.js +9 -10
- package/dist/esm/NumberKeyboard.js +16 -18
- package/dist/esm/Overlay.js +8 -9
- package/dist/esm/Pagination.js +9 -11
- package/dist/esm/Picker.js +20 -22
- package/dist/esm/Popover.js +10 -11
- package/dist/esm/Popup.js +12 -13
- package/dist/esm/Price.js +7 -8
- package/dist/esm/Progress.js +7 -8
- package/dist/esm/PullToRefresh.js +11 -13
- package/dist/esm/Radio.js +9 -10
- package/dist/esm/RadioGroup.js +9 -10
- package/dist/esm/Range.js +13 -15
- package/dist/esm/Rate.js +9 -10
- package/dist/esm/Row.js +8 -9
- package/dist/esm/SearchBar.js +11 -13
- package/dist/esm/ShortPassword.js +16 -18
- package/dist/esm/SideNavBar.js +14 -15
- package/dist/esm/SideNavBarItem.js +5 -6
- package/dist/esm/Signature.js +13 -15
- package/dist/esm/Skeleton.js +14 -16
- package/dist/esm/Step.js +10 -11
- package/dist/esm/Steps.js +9 -10
- package/dist/esm/Sticky.js +11 -12
- package/dist/esm/SubSideNavBar.js +6 -7
- package/dist/esm/Swipe.js +11 -12
- package/dist/esm/Swiper.js +10 -11
- package/dist/esm/SwiperItem.js +9 -10
- package/dist/esm/Switch.js +7 -8
- package/dist/esm/TabPane.js +6 -7
- package/dist/esm/Tabbar.js +10 -11
- package/dist/esm/TabbarItem.js +8 -9
- package/dist/esm/Table.js +9 -13
- package/dist/esm/Tabs.js +11 -12
- package/dist/esm/Tag.js +8 -9
- package/dist/esm/TextArea.js +11 -10
- package/dist/esm/TimeDetail.js +8 -10
- package/dist/esm/TimePannel.js +8 -10
- package/dist/esm/TimeSelect.js +18 -20
- package/dist/esm/Toast.js +9 -10
- package/dist/esm/TrendArrow.js +8 -9
- package/dist/esm/Uploader.js +14 -16
- package/dist/esm/UserContext-735db09f.js +5 -0
- package/dist/esm/UserContext-ab42ba7f.js +5 -0
- package/dist/esm/UserContext-fde5badc.js +5 -0
- package/dist/esm/Video.js +8 -9
- package/dist/esm/VirtualList.js +8 -10
- package/dist/esm/WaterMark.js +10 -12
- package/dist/esm/actionsheet.taro-d2217152.js +61 -0
- package/dist/esm/address.taro-1c534feb.js +470 -0
- package/dist/esm/animate.taro-c8b29242.js +44 -0
- package/dist/esm/animatingnumbers.taro-c2a52dbd.js +103 -0
- package/dist/esm/audio.taro-ec96ef80.js +185 -0
- package/dist/esm/avatar.taro-01536aff.js +100 -0
- package/dist/esm/avatargroup-ad5ffb46.js +34 -0
- package/dist/esm/backtop.taro-7de36464.js +48 -0
- package/dist/esm/badge.taro-872605bf.js +48 -0
- package/dist/esm/barrage.taro-c8cb9864.js +91 -0
- package/dist/esm/bem-cdccae08.js +5 -0
- package/dist/esm/button.taro-01eae688.js +72 -0
- package/dist/esm/calendar.taro-10a6cb11.js +70 -0
- package/dist/esm/calendaritem.taro-3e5f114e.js +732 -0
- package/dist/esm/can-use-dom-0e539bd3.js +4 -0
- package/dist/esm/card.taro-a46fdf25.js +51 -0
- package/dist/esm/cascader.taro-0a2694ed.js +463 -0
- package/dist/esm/cell.taro-4e31d1fa.js +48 -0
- package/dist/esm/cellgroup.taro-a790d91b.js +28 -0
- package/dist/esm/checkbox.taro-016074da.js +177 -0
- package/dist/esm/circleprogress.taro-7149e09d.js +104 -0
- package/dist/esm/col.taro-d6a46a7d.js +41 -0
- package/dist/esm/collapse.taro-3d997680.js +70 -0
- package/dist/esm/collapseitem-f4571575.js +76 -0
- package/dist/esm/configprovider.taro-25758d9f.js +462 -0
- package/dist/esm/context-d0fccf11.js +5 -0
- package/dist/esm/countdown.taro-22200811.js +210 -0
- package/dist/esm/datepicker.taro-3f718964.js +260 -0
- package/dist/esm/dialog.taro-290eb9a6.js +128 -0
- package/dist/esm/divider.taro-0cb5f894.js +31 -0
- package/dist/esm/drag.taro-48e1ff38.js +111 -0
- package/dist/esm/elevator.taro-bc162e4f.js +201 -0
- package/dist/esm/ellipsis.taro-f9688dd7.js +242 -0
- package/dist/esm/empty.taro-ca792f57.js +59 -0
- package/dist/esm/fixednav.taro-28e5f776.js +61 -0
- package/dist/esm/form.taro-b06754e8.js +182 -0
- package/dist/esm/formitem.taro-b326809d.js +108 -0
- package/dist/esm/get-scroll-parent-8da04f2e.js +24 -0
- package/dist/esm/grid.taro-fbbd8618.js +52 -0
- package/dist/esm/griditem.taro-b0c37077.js +85 -0
- package/dist/esm/image.taro-767aa000.js +65 -0
- package/dist/esm/imagepreview.taro-8832dc01.js +163 -0
- package/dist/esm/index-e3184f19.js +9 -0
- package/dist/esm/indicator.taro-f2bd212f.js +30 -0
- package/dist/esm/infiniteloading.taro-f8f23ac6.js +143 -0
- package/dist/esm/input.taro-27d686c9.js +164 -0
- package/dist/esm/inputnumber.taro-877dc947.js +197 -0
- package/dist/esm/layout.taro-9659a928.js +11 -0
- package/dist/esm/menu.taro-cd0fef41.js +122 -0
- package/dist/esm/menuitem.taro-6076bffa.js +142 -0
- package/dist/esm/navbar.taro-5e1a0835.js +61 -0
- package/dist/esm/noticebar.taro-b3bfd4fe.js +408 -0
- package/dist/esm/notify.taro-6b6eb6bf.js +82 -0
- package/dist/esm/numberkeyboard.taro-0a0e866a.js +183 -0
- package/dist/esm/nutui-react.es.js +211 -116
- package/dist/esm/offsetContext-f32a9246.js +5 -0
- package/dist/esm/overlay.taro-75012bd3.js +77 -0
- package/dist/esm/pagination.taro-63607c3b.js +94 -0
- package/dist/esm/picker.taro-a5603921.js +468 -0
- package/dist/esm/popover.taro-ad483372.js +162 -0
- package/dist/esm/popup.taro-e756f3fc.js +150 -0
- package/dist/esm/price.taro-c4f45310.js +80 -0
- package/dist/esm/progress.taro-ff63be75.js +49 -0
- package/dist/esm/pulltorefresh.taro-c611fd92.js +179 -0
- package/dist/esm/radio.taro-3a54f4c8.js +152 -0
- package/dist/esm/range.taro-52cda918.js +325 -0
- package/dist/esm/rate.taro-78c66969.js +77 -0
- package/dist/esm/row.taro-8b7febd4.js +48 -0
- package/dist/esm/searchbar.taro-37ade36e.js +159 -0
- package/dist/esm/shortpassword.taro-f7292032.js +146 -0
- package/dist/esm/sidenavbar.taro-9f210df4.js +51 -0
- package/dist/esm/sidenavbaritem.taro-32a45ce6.js +12 -0
- package/dist/esm/signature.taro-c57469aa.js +146 -0
- package/dist/esm/skeleton.taro-9ff9baf4.js +71 -0
- package/dist/esm/step.taro-3bc01c0c.js +66 -0
- package/dist/esm/steps.taro-77e301ab.js +30 -0
- package/dist/esm/sticky.taro-3c03eb0a.js +134 -0
- package/dist/esm/subsidenavbar.taro-abe07673.js +64 -0
- package/dist/esm/supports-passive-aaaf0eff.js +17 -0
- package/dist/esm/swipe.taro-de80fcd8.js +180 -0
- package/dist/esm/swiper.taro-74cf9306.js +430 -0
- package/dist/esm/swiperitem-80df464a.js +29 -0
- package/dist/esm/switch.taro-f0da73a3.js +44 -0
- package/dist/esm/tabbar.taro-18eee41f.js +55 -0
- package/dist/esm/tabbaritem.taro-89646ca1.js +47 -0
- package/dist/esm/table.taro-15a55c5d.js +100 -0
- package/dist/esm/tabpane.taro-f8d92ece.js +21 -0
- package/dist/esm/tabs.taro-b75f20ff.js +139 -0
- package/dist/esm/tag.taro-1b4134a5.js +92 -0
- package/dist/esm/textarea.taro-c110565e.js +102 -0
- package/dist/esm/timedetail.taro-8d2acbbf.js +41 -0
- package/dist/esm/timepannel.taro-ee4c5dfa.js +22 -0
- package/dist/esm/timeselect.taro-069deedd.js +133 -0
- package/dist/esm/toast.taro-92c10e1d.js +114 -0
- package/dist/esm/trendarrow.taro-0cf43935.js +72 -0
- package/dist/esm/typings-11d83a22.js +7 -0
- package/dist/esm/uploader.taro-92977813.js +519 -0
- package/dist/esm/use-client-rect-f317804e.js +10 -0
- package/dist/esm/use-props-value-7ac1b1b5.js +16 -0
- package/dist/esm/use-touch-ff43512c.js +69 -0
- package/dist/esm/video-5d106e33.js +73 -0
- package/dist/esm/virtuallist.taro-99f03769.js +195 -0
- package/dist/esm/watermark.taro-cef29c03.js +109 -0
- package/dist/locales/base.js +1 -1
- package/dist/locales/en-US.js +1 -1
- package/dist/locales/id-ID.js +1 -1
- package/dist/locales/zh-CN.js +1 -1
- package/dist/locales/zh-TW.js +1 -1
- package/dist/locales/zh-UG.js +1 -1
- package/dist/nutui.react.mjs +507 -447
- package/dist/nutui.react.umd.js +506 -446
- package/dist/packages/cascader/cascader.scss +0 -26
- package/dist/packages/picker/picker.scss +66 -137
- package/dist/packages/table/table.scss +0 -56
- package/dist/packages/textarea/textarea.scss +5 -12
- package/dist/style.css +1 -1
- package/dist/style.mjs +1 -1
- package/dist/styles/variables-jmapp.scss +1 -4
- package/dist/styles/variables.scss +2 -6
- package/dist/types/index.d.ts +42 -46
- package/package.json +1 -1
- package/dist/esm/UserContext-0aac9a82.js +0 -5
- package/dist/esm/UserContext-e402e1a6.js +0 -5
- package/dist/esm/UserContext-e8176108.js +0 -5
- package/dist/esm/actionsheet.taro-12cf5a3e.js +0 -53
- package/dist/esm/address.taro-cab0ea22.js +0 -475
- package/dist/esm/animate.taro-485331bb.js +0 -41
- package/dist/esm/animatingnumbers.taro-f6eaffef.js +0 -104
- package/dist/esm/audio.taro-ff280f5e.js +0 -162
- package/dist/esm/avatar.taro-6e8f1f5c.js +0 -107
- package/dist/esm/avatargroup-f4375806.js +0 -31
- package/dist/esm/backtop.taro-8ec80d02.js +0 -52
- package/dist/esm/badge.taro-e2169fbe.js +0 -45
- package/dist/esm/barrage.taro-aa08da6c.js +0 -94
- package/dist/esm/bem-350c1702.js +0 -5
- package/dist/esm/button.taro-b50bc217.js +0 -65
- package/dist/esm/calendar.taro-2fc9b899.js +0 -65
- package/dist/esm/calendaritem.taro-2d4a8c34.js +0 -791
- package/dist/esm/can-use-dom-3eeb5af4.js +0 -6
- package/dist/esm/card.taro-0e849e94.js +0 -33
- package/dist/esm/cascader.taro-467910b2.js +0 -447
- package/dist/esm/cell.taro-ea725a95.js +0 -43
- package/dist/esm/cellgroup.taro-e05ea802.js +0 -25
- package/dist/esm/checkbox.taro-9d02f86c.js +0 -175
- package/dist/esm/circleprogress.taro-d4943109.js +0 -103
- package/dist/esm/col.taro-4477c9f7.js +0 -43
- package/dist/esm/collapse.taro-89bcadf2.js +0 -79
- package/dist/esm/collapseitem-0e228cec.js +0 -68
- package/dist/esm/configprovider.taro-ce34d482.js +0 -174
- package/dist/esm/context-c96afdcc.js +0 -5
- package/dist/esm/countdown.taro-3118ba23.js +0 -225
- package/dist/esm/datepicker.taro-2e3e955b.js +0 -275
- package/dist/esm/dialog.taro-eab19eab.js +0 -107
- package/dist/esm/divider.taro-3993d7d5.js +0 -33
- package/dist/esm/drag.taro-347dfb84.js +0 -111
- package/dist/esm/elevator.taro-1a4e3356.js +0 -193
- package/dist/esm/ellipsis.taro-e1ac99a1.js +0 -244
- package/dist/esm/empty.taro-26363c66.js +0 -56
- package/dist/esm/fixednav.taro-ddb21e87.js +0 -54
- package/dist/esm/form.taro-423b0f0a.js +0 -179
- package/dist/esm/formitem.taro-b550d29c.js +0 -89
- package/dist/esm/get-scroll-parent-b4a07e65.js +0 -25
- package/dist/esm/grid.taro-883a9c35.js +0 -49
- package/dist/esm/griditem.taro-16c7055b.js +0 -80
- package/dist/esm/image.taro-3025e659.js +0 -64
- package/dist/esm/imagepreview.taro-d511342c.js +0 -167
- package/dist/esm/index-5bcb0ff8.js +0 -7
- package/dist/esm/indicator.taro-bfb21d45.js +0 -30
- package/dist/esm/infiniteloading.taro-721bca1f.js +0 -141
- package/dist/esm/input.taro-06c1e4d5.js +0 -167
- package/dist/esm/inputnumber.taro-1f893d42.js +0 -199
- package/dist/esm/layout.taro-e4bf83cb.js +0 -11
- package/dist/esm/menu.taro-e5c68cb8.js +0 -111
- package/dist/esm/menuitem.taro-37c18382.js +0 -129
- package/dist/esm/navbar.taro-92bab9c4.js +0 -57
- package/dist/esm/noticebar.taro-cbe93c9e.js +0 -427
- package/dist/esm/notify.taro-f1079218.js +0 -75
- package/dist/esm/numberkeyboard.taro-d9b1721b.js +0 -159
- package/dist/esm/offsetContext-c2a746fa.js +0 -5
- package/dist/esm/overlay.taro-067b7202.js +0 -73
- package/dist/esm/pagination.taro-94f9be5e.js +0 -91
- package/dist/esm/picker.taro-e16b4312.js +0 -423
- package/dist/esm/popover.taro-84a55ff9.js +0 -153
- package/dist/esm/popup.taro-89cc342a.js +0 -139
- package/dist/esm/price.taro-959d82f2.js +0 -83
- package/dist/esm/progress.taro-1a7ac8a4.js +0 -40
- package/dist/esm/pulltorefresh.taro-016d0079.js +0 -181
- package/dist/esm/radio.taro-36438449.js +0 -177
- package/dist/esm/range.taro-8953e8c3.js +0 -332
- package/dist/esm/rate.taro-895bb41c.js +0 -77
- package/dist/esm/row.taro-e929ec5c.js +0 -48
- package/dist/esm/searchbar.taro-4467040f.js +0 -152
- package/dist/esm/shortpassword.taro-433b86a4.js +0 -119
- package/dist/esm/sidenavbar.taro-f8ffb7dc.js +0 -33
- package/dist/esm/sidenavbaritem.taro-6cb0821e.js +0 -12
- package/dist/esm/signature.taro-a4d9b5c9.js +0 -143
- package/dist/esm/skeleton.taro-8ec11af9.js +0 -62
- package/dist/esm/step.taro-7ea33a76.js +0 -58
- package/dist/esm/steps.taro-86753d36.js +0 -30
- package/dist/esm/sticky.taro-a142a5f2.js +0 -136
- package/dist/esm/subsidenavbar.taro-85c03291.js +0 -63
- package/dist/esm/supports-passive-c85ef996.js +0 -18
- package/dist/esm/swipe.taro-0b8cc872.js +0 -175
- package/dist/esm/swiper.taro-c0e9a56b.js +0 -451
- package/dist/esm/swiperitem-abab7606.js +0 -29
- package/dist/esm/switch.taro-e82809f6.js +0 -38
- package/dist/esm/tabbar.taro-48413fb8.js +0 -51
- package/dist/esm/tabbaritem.taro-5afa3562.js +0 -37
- package/dist/esm/table.taro-327b4248.js +0 -95
- package/dist/esm/tabpane.taro-406cc0d3.js +0 -21
- package/dist/esm/tabs.taro-d47ccfc5.js +0 -120
- package/dist/esm/tag.taro-846ee805.js +0 -92
- package/dist/esm/textarea.taro-add72cf3.js +0 -94
- package/dist/esm/timedetail.taro-82a2900b.js +0 -44
- package/dist/esm/timepannel.taro-0573bb65.js +0 -22
- package/dist/esm/timeselect.taro-29124a34.js +0 -133
- package/dist/esm/toast.taro-c509a870.js +0 -108
- package/dist/esm/trendarrow.taro-dd83ec94.js +0 -70
- package/dist/esm/typings-d8491423.js +0 -6
- package/dist/esm/uploader.taro-c70d00de.js +0 -494
- package/dist/esm/use-client-rect-1f8ed1fe.js +0 -18
- package/dist/esm/use-props-value-ae7ee726.js +0 -15
- package/dist/esm/use-touch-db24bb5c.js +0 -69
- package/dist/esm/video-1c6405b4.js +0 -67
- package/dist/esm/virtuallist.taro-ba8e1f21.js +0 -214
- package/dist/esm/watermark.taro-168cdac5.js +0 -114
|
@@ -0,0 +1,73 @@
|
|
|
1
|
+
import React, { useRef, useEffect } from "react";
|
|
2
|
+
import classNames from "classnames";
|
|
3
|
+
import { c as cn } from "./bem-cdccae08.js";
|
|
4
|
+
const defaultProps = {
|
|
5
|
+
source: {
|
|
6
|
+
type: {},
|
|
7
|
+
src: ""
|
|
8
|
+
},
|
|
9
|
+
options: {
|
|
10
|
+
controls: true,
|
|
11
|
+
muted: false,
|
|
12
|
+
autoplay: false,
|
|
13
|
+
poster: "",
|
|
14
|
+
playsinline: false,
|
|
15
|
+
loop: false
|
|
16
|
+
}
|
|
17
|
+
};
|
|
18
|
+
const Video = (props) => {
|
|
19
|
+
const { children, source, options, className, play, pause, playend, onPlay, onPause, onPlayEnd, ...restProps } = {
|
|
20
|
+
...defaultProps,
|
|
21
|
+
...props
|
|
22
|
+
};
|
|
23
|
+
const rootRef = useRef(null);
|
|
24
|
+
const b = cn("video");
|
|
25
|
+
const classes = classNames(className, b(""));
|
|
26
|
+
useEffect(() => {
|
|
27
|
+
init();
|
|
28
|
+
}, []);
|
|
29
|
+
const init = () => {
|
|
30
|
+
if (rootRef.current) {
|
|
31
|
+
const videoRef = rootRef.current;
|
|
32
|
+
if (options.autoplay) {
|
|
33
|
+
setTimeout(() => {
|
|
34
|
+
videoRef.play();
|
|
35
|
+
}, 200);
|
|
36
|
+
}
|
|
37
|
+
if (options.playsinline) {
|
|
38
|
+
videoRef.setAttribute("playsinline", String(options.playsinline));
|
|
39
|
+
videoRef.setAttribute("webkit-playsinline", String(options.playsinline));
|
|
40
|
+
videoRef.setAttribute("x5-video-player-type", "h5-page");
|
|
41
|
+
videoRef.setAttribute("x5-video-player-fullscreen", "false");
|
|
42
|
+
}
|
|
43
|
+
videoRef.addEventListener("play", () => {
|
|
44
|
+
onPlay && onPlay(videoRef);
|
|
45
|
+
play && play(videoRef);
|
|
46
|
+
});
|
|
47
|
+
videoRef.addEventListener("pause", () => {
|
|
48
|
+
onPause && onPause(videoRef);
|
|
49
|
+
pause && pause(videoRef);
|
|
50
|
+
});
|
|
51
|
+
videoRef.addEventListener("ended", () => {
|
|
52
|
+
videoRef.currentTime = 0;
|
|
53
|
+
onPlayEnd && onPlayEnd(videoRef);
|
|
54
|
+
playend && playend(videoRef);
|
|
55
|
+
});
|
|
56
|
+
}
|
|
57
|
+
};
|
|
58
|
+
return React.createElement(
|
|
59
|
+
"div",
|
|
60
|
+
{ className: classes, ...restProps },
|
|
61
|
+
React.createElement(
|
|
62
|
+
"video",
|
|
63
|
+
{ className: "nut-video-player", muted: options.muted, autoPlay: options.autoplay, loop: options.loop, poster: options.poster, controls: options.controls, ref: rootRef, src: source.src },
|
|
64
|
+
React.createElement("source", { src: source.src, type: source.type }),
|
|
65
|
+
React.createElement("track", { kind: "captions" })
|
|
66
|
+
)
|
|
67
|
+
);
|
|
68
|
+
};
|
|
69
|
+
Video.defaultProps = defaultProps;
|
|
70
|
+
Video.displayName = "NutVideo";
|
|
71
|
+
export {
|
|
72
|
+
Video as V
|
|
73
|
+
};
|
|
@@ -0,0 +1,195 @@
|
|
|
1
|
+
import React, { useState, useRef, useEffect, useCallback } from "react";
|
|
2
|
+
import { ScrollView } from "@tarojs/components";
|
|
3
|
+
import { getSystemInfoSync } from "@tarojs/taro";
|
|
4
|
+
import { u as useConfig } from "./configprovider.taro-25758d9f.js";
|
|
5
|
+
const initPositinoCache = (reaItemSize, length = 0) => {
|
|
6
|
+
let index = 0;
|
|
7
|
+
const positions = Array(length);
|
|
8
|
+
while (index < length) {
|
|
9
|
+
positions[index] = {
|
|
10
|
+
index,
|
|
11
|
+
height: reaItemSize,
|
|
12
|
+
width: reaItemSize,
|
|
13
|
+
top: index * reaItemSize,
|
|
14
|
+
bottom: (index + 1) * reaItemSize,
|
|
15
|
+
left: index * reaItemSize,
|
|
16
|
+
right: (index + 1) * reaItemSize
|
|
17
|
+
};
|
|
18
|
+
index++;
|
|
19
|
+
}
|
|
20
|
+
return positions;
|
|
21
|
+
};
|
|
22
|
+
const binarySearch = (positionsList, value = 0, horizontal) => {
|
|
23
|
+
let start = 0;
|
|
24
|
+
let end = positionsList.length - 1;
|
|
25
|
+
let tempIndex = null;
|
|
26
|
+
const key = horizontal ? "right" : "bottom";
|
|
27
|
+
while (start <= end) {
|
|
28
|
+
const midIndex = Math.floor((start + end) / 2);
|
|
29
|
+
const midValue = positionsList[midIndex][key];
|
|
30
|
+
if (midValue === value) {
|
|
31
|
+
return midIndex + 1;
|
|
32
|
+
}
|
|
33
|
+
if (midValue < value) {
|
|
34
|
+
start = midIndex + 1;
|
|
35
|
+
} else if (midValue > value) {
|
|
36
|
+
if (tempIndex === null || tempIndex > midIndex) {
|
|
37
|
+
tempIndex = midIndex;
|
|
38
|
+
}
|
|
39
|
+
end = midIndex - 1;
|
|
40
|
+
}
|
|
41
|
+
}
|
|
42
|
+
tempIndex = tempIndex || 0;
|
|
43
|
+
return tempIndex;
|
|
44
|
+
};
|
|
45
|
+
const updateItemSize = (positions, items, sizeKey) => {
|
|
46
|
+
const newPos = positions.concat();
|
|
47
|
+
Array.from(items).forEach((item) => {
|
|
48
|
+
const index = Number(item.getAttribute("data-index"));
|
|
49
|
+
const styleVal = item.getAttribute("style");
|
|
50
|
+
if (styleVal && styleVal.includes("none"))
|
|
51
|
+
return;
|
|
52
|
+
const nowSize = item.getBoundingClientRect()[sizeKey];
|
|
53
|
+
const oldSize = positions[index][sizeKey];
|
|
54
|
+
const dValue = oldSize - nowSize;
|
|
55
|
+
if (dValue) {
|
|
56
|
+
if (sizeKey === "width") {
|
|
57
|
+
newPos[index].right -= dValue;
|
|
58
|
+
newPos[index][sizeKey] = nowSize;
|
|
59
|
+
for (let k = index + 1; k < positions.length; k++) {
|
|
60
|
+
newPos[k].left = positions[k - 1].right;
|
|
61
|
+
newPos[k].right -= dValue;
|
|
62
|
+
}
|
|
63
|
+
} else if (sizeKey === "height") {
|
|
64
|
+
newPos[index].bottom -= dValue;
|
|
65
|
+
newPos[index][sizeKey] = nowSize;
|
|
66
|
+
for (let k = index + 1; k < positions.length; k++) {
|
|
67
|
+
newPos[k].top = positions[k - 1].bottom;
|
|
68
|
+
newPos[k].bottom -= dValue;
|
|
69
|
+
}
|
|
70
|
+
}
|
|
71
|
+
}
|
|
72
|
+
});
|
|
73
|
+
};
|
|
74
|
+
const defaultProps = {
|
|
75
|
+
sourceData: [],
|
|
76
|
+
itemSize: 66,
|
|
77
|
+
itemEqualSize: true,
|
|
78
|
+
overscan: 2
|
|
79
|
+
};
|
|
80
|
+
const clientHeight = getSystemInfoSync().windowHeight - 5 || 667;
|
|
81
|
+
getSystemInfoSync().windowWidth || 375;
|
|
82
|
+
const VirtualList = (props) => {
|
|
83
|
+
const { sourceData = [], ItemRender, itemSize = 66, itemEqualSize = true, overscan = 2, key, onScroll, className, containerSize = clientHeight, ...rest } = props;
|
|
84
|
+
const [startOffset, setStartOffset] = useState(0);
|
|
85
|
+
const [start, setStart] = useState(0);
|
|
86
|
+
const [list, setList] = useState(sourceData.slice());
|
|
87
|
+
useConfig();
|
|
88
|
+
const scrollRef = useRef(null);
|
|
89
|
+
const itemsRef = useRef(null);
|
|
90
|
+
const firstItemRef = useRef(null);
|
|
91
|
+
const [positions, setPositions] = useState([
|
|
92
|
+
{
|
|
93
|
+
index: 0,
|
|
94
|
+
left: 0,
|
|
95
|
+
top: 0,
|
|
96
|
+
bottom: 0,
|
|
97
|
+
width: 0,
|
|
98
|
+
height: 0,
|
|
99
|
+
right: 0
|
|
100
|
+
}
|
|
101
|
+
]);
|
|
102
|
+
const [offSetSize, setOffSetSize] = useState(containerSize || 0);
|
|
103
|
+
const [options, setOptions] = useState({
|
|
104
|
+
startOffset: 0,
|
|
105
|
+
startIndex: 0,
|
|
106
|
+
overStart: 0,
|
|
107
|
+
endIndex: 10
|
|
108
|
+
// 可视区域结束索引
|
|
109
|
+
});
|
|
110
|
+
useEffect(() => {
|
|
111
|
+
if (sourceData.length) {
|
|
112
|
+
setList(sourceData.slice());
|
|
113
|
+
}
|
|
114
|
+
}, [sourceData]);
|
|
115
|
+
useEffect(() => {
|
|
116
|
+
setPositions((options2) => {
|
|
117
|
+
return { ...options2, endIndex: visibleCount() };
|
|
118
|
+
});
|
|
119
|
+
}, [itemSize, overscan, offSetSize]);
|
|
120
|
+
useEffect(() => {
|
|
121
|
+
if (containerSize)
|
|
122
|
+
return;
|
|
123
|
+
setOffSetSize(getContainerHeight());
|
|
124
|
+
}, [containerSize]);
|
|
125
|
+
useEffect(() => {
|
|
126
|
+
const pos = initPositinoCache(itemSize, sourceData.length);
|
|
127
|
+
setPositions(pos);
|
|
128
|
+
}, [itemSize, sourceData]);
|
|
129
|
+
const getContainerHeight = () => {
|
|
130
|
+
const initH = itemSize * sourceData.length;
|
|
131
|
+
return initH < clientHeight ? initH + overscan * itemSize - 5 : Math.min(containerSize, clientHeight);
|
|
132
|
+
};
|
|
133
|
+
const visibleCount = () => {
|
|
134
|
+
return Math.ceil(getContainerHeight() / itemSize) + overscan;
|
|
135
|
+
};
|
|
136
|
+
const end = () => {
|
|
137
|
+
return start + visibleCount();
|
|
138
|
+
};
|
|
139
|
+
const listHeight = () => {
|
|
140
|
+
return list.length * itemSize;
|
|
141
|
+
};
|
|
142
|
+
const visibleData = () => {
|
|
143
|
+
return list.slice(start, Math.min(end(), list.length));
|
|
144
|
+
};
|
|
145
|
+
const updateTotalSize = useCallback(() => {
|
|
146
|
+
if (!itemsRef.current)
|
|
147
|
+
return;
|
|
148
|
+
const items = itemsRef.current.children;
|
|
149
|
+
if (!items.length)
|
|
150
|
+
return;
|
|
151
|
+
updateItemSize(positions, items, "height");
|
|
152
|
+
}, [positions]);
|
|
153
|
+
const listScroll = (e) => {
|
|
154
|
+
const scrollTop = e.detail ? e.detail.scrollTop : e.target.scrollTop;
|
|
155
|
+
const scrollSize = Math.floor(scrollTop);
|
|
156
|
+
const startIndex = binarySearch(positions, scrollSize, false);
|
|
157
|
+
const overStart = startIndex - overscan > -1 ? startIndex - overscan : 0;
|
|
158
|
+
const endIndex = end();
|
|
159
|
+
if (!itemEqualSize) {
|
|
160
|
+
updateTotalSize();
|
|
161
|
+
}
|
|
162
|
+
setStart(Math.floor(scrollTop / itemSize));
|
|
163
|
+
setOptions({ startOffset, startIndex, overStart, endIndex });
|
|
164
|
+
if (end() > list.length - 1) {
|
|
165
|
+
onScroll && onScroll();
|
|
166
|
+
}
|
|
167
|
+
setStartOffset(scrollTop - scrollTop % itemSize);
|
|
168
|
+
};
|
|
169
|
+
return React.createElement(
|
|
170
|
+
"div",
|
|
171
|
+
{ className: className ? `${className} nut-virtualList-box` : "nut-virtualList-box", ...rest, style: {
|
|
172
|
+
height: containerSize ? `${offSetSize}px` : ""
|
|
173
|
+
} },
|
|
174
|
+
React.createElement(
|
|
175
|
+
ScrollView,
|
|
176
|
+
{ scrollTop: 0, scrollY: true, type: "list", ref: scrollRef, className: "nut-virtuallist", style: {
|
|
177
|
+
height: `${getContainerHeight()}px`
|
|
178
|
+
}, onScroll: listScroll },
|
|
179
|
+
React.createElement("div", { className: "nut-virtuallist-phantom", style: { height: `${listHeight()}px` } }),
|
|
180
|
+
React.createElement("div", { className: "nut-virtuallist-container", ref: itemsRef, style: { transform: `translate3d(0, ${startOffset}px, 0)` } }, visibleData().map((data, index) => {
|
|
181
|
+
const { overStart } = options;
|
|
182
|
+
const dataIndex = overStart + index;
|
|
183
|
+
key && data[key] ? data[key] : dataIndex;
|
|
184
|
+
return React.createElement("div", { ref: dataIndex === 0 ? firstItemRef : null, "data-index": `${dataIndex}`, className: "nut-virtuallist-item", key: `${data}`, style: {
|
|
185
|
+
height: `${itemEqualSize ? `${itemSize}px` : "auto"}`
|
|
186
|
+
} }, ItemRender ? React.createElement(ItemRender, { data, index: `${index}` }) : data);
|
|
187
|
+
}))
|
|
188
|
+
)
|
|
189
|
+
);
|
|
190
|
+
};
|
|
191
|
+
VirtualList.defaultProps = defaultProps;
|
|
192
|
+
VirtualList.displayName = "NutVirtualList";
|
|
193
|
+
export {
|
|
194
|
+
VirtualList as V
|
|
195
|
+
};
|
|
@@ -0,0 +1,109 @@
|
|
|
1
|
+
import React, { useState, useEffect } from "react";
|
|
2
|
+
import { getSystemInfo, createOffscreenCanvas } from "@tarojs/taro";
|
|
3
|
+
import classNames from "classnames";
|
|
4
|
+
import { u as useConfig } from "./configprovider.taro-25758d9f.js";
|
|
5
|
+
import { c as cn } from "./bem-cdccae08.js";
|
|
6
|
+
const defaultProps = {
|
|
7
|
+
content: "",
|
|
8
|
+
fullPage: true,
|
|
9
|
+
zIndex: 2e3,
|
|
10
|
+
gapX: 24,
|
|
11
|
+
gapY: 48,
|
|
12
|
+
width: 120,
|
|
13
|
+
height: 64,
|
|
14
|
+
image: "",
|
|
15
|
+
imageWidth: 120,
|
|
16
|
+
imageHeight: 64,
|
|
17
|
+
rotate: -22,
|
|
18
|
+
fontColor: "rgba(0,0,0,.15)",
|
|
19
|
+
fontStyle: "normal",
|
|
20
|
+
fontFamily: "PingFang SC",
|
|
21
|
+
fontWeight: "normal",
|
|
22
|
+
fontSize: 14
|
|
23
|
+
};
|
|
24
|
+
const WaterMark = (props) => {
|
|
25
|
+
const { locale } = useConfig();
|
|
26
|
+
const { content, fullPage, zIndex, className, gapX, gapY, width, height, image, imageWidth, imageHeight, rotate, fontColor, fontStyle, fontFamily, fontWeight, fontSize, style, children } = {
|
|
27
|
+
...defaultProps,
|
|
28
|
+
...props
|
|
29
|
+
};
|
|
30
|
+
const [base64Url, setBase64Url] = useState("");
|
|
31
|
+
const b = cn("watermark");
|
|
32
|
+
const classes = classNames({
|
|
33
|
+
[`${b("")}`]: true,
|
|
34
|
+
[`${b("")}-full-page`]: fullPage
|
|
35
|
+
});
|
|
36
|
+
const cls = classNames(classes, className);
|
|
37
|
+
useEffect(() => {
|
|
38
|
+
init();
|
|
39
|
+
}, []);
|
|
40
|
+
const init = () => {
|
|
41
|
+
let ratio = 1;
|
|
42
|
+
getSystemInfo().then((res) => {
|
|
43
|
+
ratio = res.pixelRatio;
|
|
44
|
+
const canvasWidth = `${(gapX + width) * ratio}px`;
|
|
45
|
+
const canvasHeight = `${(gapY + height) * ratio}px`;
|
|
46
|
+
const markWidth = width * ratio;
|
|
47
|
+
const markHeight = height * ratio;
|
|
48
|
+
let ctx;
|
|
49
|
+
let canvas;
|
|
50
|
+
if (process.env.TARO_ENV === "h5") {
|
|
51
|
+
canvas = document.createElement("canvas");
|
|
52
|
+
ctx = canvas.getContext("2d");
|
|
53
|
+
canvas.setAttribute("width", canvasWidth);
|
|
54
|
+
canvas.setAttribute("height", canvasHeight);
|
|
55
|
+
} else {
|
|
56
|
+
canvas = createOffscreenCanvas({
|
|
57
|
+
type: "2d",
|
|
58
|
+
width: Number(canvasWidth),
|
|
59
|
+
height: Number(canvasHeight)
|
|
60
|
+
});
|
|
61
|
+
ctx = canvas.getContext("2d");
|
|
62
|
+
}
|
|
63
|
+
if (ctx) {
|
|
64
|
+
if (image) {
|
|
65
|
+
ctx.translate(markWidth / 2, markHeight / 2);
|
|
66
|
+
ctx.rotate(Math.PI / 180 * Number(rotate));
|
|
67
|
+
let img;
|
|
68
|
+
if (process.env.TARO_ENV === "h5") {
|
|
69
|
+
img = new Image();
|
|
70
|
+
} else {
|
|
71
|
+
img = canvas.createImage();
|
|
72
|
+
}
|
|
73
|
+
img.crossOrigin = "anonymous";
|
|
74
|
+
img.referrerPolicy = "no-referrer";
|
|
75
|
+
img.src = image;
|
|
76
|
+
img.onload = () => {
|
|
77
|
+
ctx.drawImage(img, -imageWidth * ratio / 2, -imageHeight * ratio / 2, imageWidth * ratio, imageHeight * ratio);
|
|
78
|
+
ctx.restore();
|
|
79
|
+
setBase64Url(canvas.toDataURL());
|
|
80
|
+
};
|
|
81
|
+
} else if (content) {
|
|
82
|
+
ctx.textBaseline = "middle";
|
|
83
|
+
ctx.textAlign = "center";
|
|
84
|
+
ctx.translate(markWidth / 2, markHeight / 2);
|
|
85
|
+
ctx.rotate(Math.PI / 180 * Number(rotate));
|
|
86
|
+
const markSize = Number(fontSize) * ratio;
|
|
87
|
+
ctx.font = `${fontStyle} normal ${fontWeight} ${markSize}px/${markHeight}px ${fontFamily}`;
|
|
88
|
+
ctx.fillStyle = fontColor;
|
|
89
|
+
ctx.fillText(content, 0, 0);
|
|
90
|
+
ctx.restore();
|
|
91
|
+
setBase64Url(canvas.toDataURL());
|
|
92
|
+
}
|
|
93
|
+
} else {
|
|
94
|
+
throw new Error(locale.watermark.errorCanvasTips);
|
|
95
|
+
}
|
|
96
|
+
});
|
|
97
|
+
};
|
|
98
|
+
return React.createElement("div", { className: cls, style: {
|
|
99
|
+
zIndex,
|
|
100
|
+
backgroundSize: `${gapX + width}px`,
|
|
101
|
+
backgroundImage: `url('${base64Url}')`,
|
|
102
|
+
...style
|
|
103
|
+
} });
|
|
104
|
+
};
|
|
105
|
+
WaterMark.defaultProps = defaultProps;
|
|
106
|
+
WaterMark.displayName = "NutWaterMark";
|
|
107
|
+
export {
|
|
108
|
+
WaterMark as W
|
|
109
|
+
};
|
package/dist/locales/base.js
CHANGED
package/dist/locales/en-US.js
CHANGED
package/dist/locales/id-ID.js
CHANGED
package/dist/locales/zh-CN.js
CHANGED
package/dist/locales/zh-TW.js
CHANGED
package/dist/locales/zh-UG.js
CHANGED