@nutui/nutui-react 1.5.2-beta.0 → 1.5.2-beta.1
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/dist/esm/ActionSheet/style/index.js +2 -0
- package/dist/esm/ActionSheet.js +92 -0
- package/dist/esm/Address/style/index.js +4 -0
- package/dist/esm/Address.js +622 -0
- package/dist/esm/Animate/style/index.js +2 -0
- package/dist/esm/Animate.js +55 -0
- package/dist/esm/AnimatingNumbers/style/index.js +3 -0
- package/dist/esm/AnimatingNumbers.js +127 -0
- package/dist/esm/Audio/style/index.js +4 -0
- package/dist/esm/Audio.js +266 -0
- package/dist/esm/Avatar/style/index.js +2 -0
- package/dist/esm/Avatar.js +132 -0
- package/dist/esm/AvatarContext-15733596.js +3 -0
- package/dist/esm/AvatarGroup/style/index.js +2 -0
- package/dist/esm/AvatarGroup.js +43 -0
- package/dist/esm/BackTop/style/index.js +2 -0
- package/dist/esm/BackTop.js +139 -0
- package/dist/esm/Badge/style/index.js +2 -0
- package/dist/esm/Badge.js +73 -0
- package/dist/esm/Barrage/style/index.js +2 -0
- package/dist/esm/Barrage.js +99 -0
- package/dist/esm/Button/style/index.js +2 -0
- package/dist/esm/Button.js +109 -0
- package/dist/esm/Calendar/style/index.js +2 -0
- package/dist/esm/Calendar.js +129 -0
- package/dist/esm/CalendarItem/style/index.js +2 -0
- package/dist/esm/CalendarItem.js +676 -0
- package/dist/esm/Card/style/index.js +4 -0
- package/dist/esm/Card.js +63 -0
- package/dist/esm/Cascader/style/index.js +3 -0
- package/dist/esm/Cascader.js +673 -0
- package/dist/esm/Cell/style/index.js +2 -0
- package/dist/esm/Cell.js +103 -0
- package/dist/esm/CellGroup/style/index.js +2 -0
- package/dist/esm/CellGroup.js +5 -0
- package/dist/esm/Checkbox/style/index.js +3 -0
- package/dist/esm/Checkbox.js +8 -0
- package/dist/esm/CheckboxGroup/style/index.js +2 -0
- package/dist/esm/CheckboxGroup.js +113 -0
- package/dist/esm/CircleProgress/style/index.js +2 -0
- package/dist/esm/CircleProgress.js +116 -0
- package/dist/esm/Col/style/index.js +2 -0
- package/dist/esm/Col.js +58 -0
- package/dist/esm/Collapse/style/index.js +2 -0
- package/dist/esm/Collapse.js +99 -0
- package/dist/esm/CollapseItem/style/index.js +2 -0
- package/dist/esm/CollapseItem.js +148 -0
- package/dist/esm/ConfigProvider/style/index.js +2 -0
- package/dist/esm/ConfigProvider.js +187 -0
- package/dist/esm/CountDown/style/index.js +2 -0
- package/dist/esm/CountDown.js +249 -0
- package/dist/esm/DatePicker/style/index.js +2 -0
- package/dist/esm/DatePicker.js +310 -0
- package/dist/esm/Dialog/style/index.js +3 -0
- package/dist/esm/Dialog.js +296 -0
- package/dist/esm/Divider/style/index.js +2 -0
- package/dist/esm/Divider.js +36 -0
- package/dist/esm/Drag/style/index.js +2 -0
- package/dist/esm/Drag.js +120 -0
- package/dist/esm/Elevator/style/index.js +2 -0
- package/dist/esm/Elevator.js +236 -0
- package/dist/esm/Ellipsis/style/index.js +2 -0
- package/dist/esm/Ellipsis.js +177 -0
- package/dist/esm/Empty/style/index.js +2 -0
- package/dist/esm/Empty.js +82 -0
- package/dist/esm/FixedNav/style/index.js +3 -0
- package/dist/esm/FixedNav.js +105 -0
- package/dist/esm/Form/style/index.js +2 -0
- package/dist/esm/Form.js +219 -0
- package/dist/esm/FormItem/style/index.js +2 -0
- package/dist/esm/FormItem.js +5 -0
- package/dist/esm/Grid/style/index.js +2 -0
- package/dist/esm/Grid.js +83 -0
- package/dist/esm/GridItem/style/index.js +2 -0
- package/dist/esm/GridItem.js +125 -0
- package/dist/esm/Icon/style/index.js +4 -0
- package/dist/esm/Icon.js +5 -0
- package/dist/esm/Image/style/index.js +2 -0
- package/dist/esm/Image.js +170 -0
- package/dist/esm/ImagePreview/style/index.js +4 -0
- package/dist/esm/ImagePreview.js +226 -0
- package/dist/esm/Indicator/style/index.js +2 -0
- package/dist/esm/Indicator.js +52 -0
- package/dist/esm/Infiniteloading/style/index.js +2 -0
- package/dist/esm/Infiniteloading.js +217 -0
- package/dist/esm/Input/style/index.js +2 -0
- package/dist/esm/Input.js +363 -0
- package/dist/esm/InputNumber/style/index.js +2 -0
- package/dist/esm/InputNumber.js +277 -0
- package/dist/esm/Layout/style/index.js +2 -0
- package/dist/esm/Layout.js +14 -0
- package/dist/esm/Menu/style/index.js +3 -0
- package/dist/esm/Menu.js +154 -0
- package/dist/esm/MenuItem/style/index.js +3 -0
- package/dist/esm/MenuItem.js +177 -0
- package/dist/esm/NavBar/style/index.js +2 -0
- package/dist/esm/NavBar.js +116 -0
- package/dist/esm/NoticeBar/style/index.js +2 -0
- package/dist/esm/NoticeBar.js +570 -0
- package/dist/esm/Notify/style/index.js +2 -0
- package/dist/esm/Notify.js +236 -0
- package/dist/esm/NumberKeyboard/style/index.js +2 -0
- package/dist/esm/NumberKeyboard.js +249 -0
- package/dist/esm/Overlay/style/index.js +2 -0
- package/dist/esm/Overlay.js +6 -0
- package/dist/esm/Pagination/style/index.js +2 -0
- package/dist/esm/Pagination.js +170 -0
- package/dist/esm/Picker/style/index.js +2 -0
- package/dist/esm/Picker.js +496 -0
- package/dist/esm/Popover/style/index.js +3 -0
- package/dist/esm/Popover.js +225 -0
- package/dist/esm/Popup/style/index.js +3 -0
- package/dist/esm/Popup.js +195 -0
- package/dist/esm/Price/style/index.js +2 -0
- package/dist/esm/Price.js +86 -0
- package/dist/esm/Progress/style/index.js +2 -0
- package/dist/esm/Progress.js +124 -0
- package/dist/esm/PullToRefresh/style/index.js +2 -0
- package/dist/esm/PullToRefresh.js +277 -0
- package/dist/esm/Radio/style/index.js +3 -0
- package/dist/esm/Radio.js +6 -0
- package/dist/esm/RadioGroup/style/index.js +2 -0
- package/dist/esm/RadioGroup.js +123 -0
- package/dist/esm/Range/style/index.js +2 -0
- package/dist/esm/Range.js +407 -0
- package/dist/esm/Rate/style/index.js +2 -0
- package/dist/esm/Rate.js +123 -0
- package/dist/esm/Row/style/index.js +2 -0
- package/dist/esm/Row.js +50 -0
- package/dist/esm/SearchBar/style/index.js +2 -0
- package/dist/esm/SearchBar.js +237 -0
- package/dist/esm/ShortPassword/style/index.js +3 -0
- package/dist/esm/ShortPassword.js +193 -0
- package/dist/esm/SideNavBar/style/index.js +2 -0
- package/dist/esm/SideNavBar.js +58 -0
- package/dist/esm/SideNavBarItem/style/index.js +2 -0
- package/dist/esm/SideNavBarItem.js +25 -0
- package/dist/esm/Signature/style/index.js +2 -0
- package/dist/esm/Signature.js +155 -0
- package/dist/esm/Skeleton/style/index.js +2 -0
- package/dist/esm/Skeleton.js +100 -0
- package/dist/esm/Step/style/index.js +2 -0
- package/dist/esm/Step.js +89 -0
- package/dist/esm/Steps/style/index.js +2 -0
- package/dist/esm/Steps.js +40 -0
- package/dist/esm/Sticky/style/index.js +2 -0
- package/dist/esm/Sticky.js +192 -0
- package/dist/esm/SubSideNavBar/style/index.js +2 -0
- package/dist/esm/SubSideNavBar.js +79 -0
- package/dist/esm/Swipe/style/index.js +2 -0
- package/dist/esm/Swipe.js +232 -0
- package/dist/esm/Swiper/style/index.js +2 -0
- package/dist/esm/Swiper.js +492 -0
- package/dist/esm/SwiperItem/style/index.js +2 -0
- package/dist/esm/SwiperItem.js +38 -0
- package/dist/esm/Switch/style/index.js +2 -0
- package/dist/esm/Switch.js +73 -0
- package/dist/esm/TabPane/style/index.js +2 -0
- package/dist/esm/TabPane.js +6 -0
- package/dist/esm/Tabbar/style/index.js +2 -0
- package/dist/esm/Tabbar.js +70 -0
- package/dist/esm/TabbarItem/style/index.js +2 -0
- package/dist/esm/TabbarItem.js +80 -0
- package/dist/esm/Table/style/index.js +2 -0
- package/dist/esm/Table.js +142 -0
- package/dist/esm/Tabs/style/index.js +4 -0
- package/dist/esm/Tabs.js +9 -0
- package/dist/esm/Tag/style/index.js +2 -0
- package/dist/esm/Tag.js +111 -0
- package/dist/esm/TextArea/style/index.js +2 -0
- package/dist/esm/TextArea.js +150 -0
- package/dist/esm/TimeDetail/style/index.js +2 -0
- package/dist/esm/TimeDetail.js +69 -0
- package/dist/esm/TimePannel/style/index.js +2 -0
- package/dist/esm/TimePannel.js +31 -0
- package/dist/esm/TimeSelect/style/index.js +4 -0
- package/dist/esm/TimeSelect.js +173 -0
- package/dist/esm/Toast/style/index.js +2 -0
- package/dist/esm/Toast.js +271 -0
- package/dist/esm/TrendArrow/style/index.js +2 -0
- package/dist/esm/TrendArrow.js +101 -0
- package/dist/esm/Uploader/style/index.js +4 -0
- package/dist/esm/Uploader.js +568 -0
- package/dist/esm/UserContext-101ad4a4.js +3 -0
- package/dist/esm/UserContext-2629d479.js +3 -0
- package/dist/esm/UserContext-b33bcf21.js +3 -0
- package/dist/esm/Video/style/index.js +2 -0
- package/dist/esm/Video.js +92 -0
- package/dist/esm/VirtualList/style/index.js +2 -0
- package/dist/esm/VirtualList.js +315 -0
- package/dist/esm/WaterMark/style/index.js +2 -0
- package/dist/esm/WaterMark.js +113 -0
- package/dist/esm/bem-3b438e61.js +8 -0
- package/dist/esm/cellgroup-fcc72767.js +34 -0
- package/dist/esm/checkbox-44e13cd0.js +137 -0
- package/dist/esm/date-c7aad4c0.js +97 -0
- package/dist/esm/formitem-8a73a5fb.js +157 -0
- package/dist/esm/get-scroll-parent-5f85dee8.js +24 -0
- package/dist/esm/grid.context-2ee27d95.js +6 -0
- package/dist/esm/icon-4ef1581c.js +70 -0
- package/dist/esm/index-030b7245.js +11 -0
- package/dist/esm/nutui-react.es.js +94 -0
- package/dist/esm/offsetContext-3ab00d40.js +16 -0
- package/dist/esm/overlay-de6c79d5.js +83 -0
- package/dist/esm/radio-9f141e6b.js +118 -0
- package/dist/esm/render-bbebb760.js +79 -0
- package/dist/esm/tabpane-01075e6c.js +29 -0
- package/dist/esm/tabs-e1b4e4b1.js +181 -0
- package/dist/esm/typings-f27b58f4.js +8 -0
- package/dist/esm/useClientRect-56bb675b.js +39 -0
- package/dist/esm/useTouch-cf73a407.js +99 -0
- package/dist/locales/base.d.ts +129 -0
- package/dist/locales/base.js +5 -0
- package/dist/locales/en-US.d.ts +3 -0
- package/dist/locales/en-US.js +135 -0
- package/dist/locales/id-ID.d.ts +3 -0
- package/dist/locales/id-ID.js +135 -0
- package/dist/locales/zh-CN.d.ts +3 -0
- package/dist/locales/zh-CN.js +137 -0
- package/dist/locales/zh-TW.d.ts +3 -0
- package/dist/locales/zh-TW.js +135 -0
- package/dist/locales/zh-UG.d.ts +3 -0
- package/dist/locales/zh-UG.js +135 -0
- package/dist/nutui.react.mjs +1 -1
- package/dist/nutui.react.umd.js +1 -1
- package/dist/packages/actionsheet/actionsheet.scss +103 -0
- package/dist/packages/address/address.scss +243 -0
- package/dist/packages/animate/animate.scss +284 -0
- package/dist/packages/animatingnumbers/animatingnumbers.scss +0 -0
- package/dist/packages/animatingnumbers/countup.scss +45 -0
- package/dist/packages/audio/audio.scss +93 -0
- package/dist/packages/avatar/avatar.scss +58 -0
- package/dist/packages/avatargroup/avatargroup.scss +14 -0
- package/dist/packages/backtop/backtop.scss +29 -0
- package/dist/packages/badge/badge.scss +53 -0
- package/dist/packages/barrage/barrage.scss +60 -0
- package/dist/packages/button/button.scss +245 -0
- package/dist/packages/calendar/calendar.scss +265 -0
- package/dist/packages/calendaritem/calendaritem.scss +0 -0
- package/dist/packages/card/card.scss +83 -0
- package/dist/packages/cascader/cascader.scss +108 -0
- package/dist/packages/cell/cell.scss +107 -0
- package/dist/packages/cellgroup/cellgroup.scss +46 -0
- package/dist/packages/checkbox/checkbox.scss +49 -0
- package/dist/packages/checkboxgroup/checkboxgroup.scss +33 -0
- package/dist/packages/circleprogress/circleprogress.scss +33 -0
- package/dist/packages/col/col.scss +24 -0
- package/dist/packages/collapse/collapse.scss +0 -0
- package/dist/packages/collapseitem/collapseitem.scss +161 -0
- package/dist/packages/configprovider/configprovider.scss +0 -0
- package/dist/packages/countdown/countdown.scss +3 -0
- package/dist/packages/datepicker/datepicker.scss +0 -0
- package/dist/packages/dialog/dialog.scss +135 -0
- package/dist/packages/divider/divider.scss +73 -0
- package/dist/packages/drag/drag.scss +10 -0
- package/dist/packages/elevator/elevator.scss +124 -0
- package/dist/packages/ellipsis/ellipsis.scss +17 -0
- package/dist/packages/empty/empty.scss +42 -0
- package/dist/packages/fixednav/fixednav.scss +141 -0
- package/dist/packages/form/form.scss +31 -0
- package/dist/packages/formitem/formitem.scss +100 -0
- package/dist/packages/grid/grid.scss +10 -0
- package/dist/packages/griditem/griditem.scss +108 -0
- package/dist/packages/icon/icon.scss +132 -0
- package/dist/packages/image/image.scss +53 -0
- package/dist/packages/imagepreview/imagepreview.scss +51 -0
- package/dist/packages/indicator/indicator.scss +70 -0
- package/dist/packages/infiniteloading/infiniteloading.scss +69 -0
- package/dist/packages/input/input.scss +203 -0
- package/dist/packages/inputnumber/inputnumber.scss +79 -0
- package/dist/packages/layout/layout.scss +2 -0
- package/dist/packages/menu/menu.scss +75 -0
- package/dist/packages/menuitem/menuitem.scss +120 -0
- package/dist/packages/navbar/navbar.scss +185 -0
- package/dist/packages/noticebar/noticebar.scss +156 -0
- package/dist/packages/notify/notify.scss +93 -0
- package/dist/packages/numberkeyboard/numberkeyboard.scss +147 -0
- package/dist/packages/overlay/overlay.scss +75 -0
- package/dist/packages/pagination/pagination.scss +81 -0
- package/dist/packages/picker/picker.scss +225 -0
- package/dist/packages/popover/popover.scss +288 -0
- package/dist/packages/popup/popup.scss +201 -0
- package/dist/packages/price/price.scss +37 -0
- package/dist/packages/progress/progress.scss +114 -0
- package/dist/packages/pulltorefresh/pulltorefresh.scss +26 -0
- package/dist/packages/radio/radio.scss +84 -0
- package/dist/packages/radiogroup/radiogroup.scss +86 -0
- package/dist/packages/range/range.scss +224 -0
- package/dist/packages/rate/rate.scss +36 -0
- package/dist/packages/row/row.scss +83 -0
- package/dist/packages/searchbar/searchbar.scss +146 -0
- package/dist/packages/shortpassword/shortpassword.scss +203 -0
- package/dist/packages/sidenavbar/sidenavbar.scss +100 -0
- package/dist/packages/sidenavbaritem/sidenavbaritem.scss +25 -0
- package/dist/packages/signature/signature.scss +39 -0
- package/dist/packages/skeleton/skeleton.scss +70 -0
- package/dist/packages/step/step.scss +274 -0
- package/dist/packages/steps/steps.scss +7 -0
- package/dist/packages/sticky/sticky.scss +3 -0
- package/dist/packages/subsidenavbar/subsidenavbar.scss +35 -0
- package/dist/packages/swipe/swipe.scss +33 -0
- package/dist/packages/swiper/swiper.scss +45 -0
- package/dist/packages/swiperitem/swiperitem.scss +3 -0
- package/dist/packages/switch/switch.scss +87 -0
- package/dist/packages/tabbar/tabbar.scss +46 -0
- package/dist/packages/tabbaritem/tabbaritem.scss +97 -0
- package/dist/packages/table/table.scss +152 -0
- package/dist/packages/tabpane/tabpane.scss +23 -0
- package/dist/packages/tabs/tabs.scss +284 -0
- package/dist/packages/tag/tag.scss +67 -0
- package/dist/packages/textarea/textarea.scss +60 -0
- package/dist/packages/timedetail/timedetail.scss +45 -0
- package/dist/packages/timepannel/timepannel.scss +17 -0
- package/dist/packages/timeselect/timeselect.scss +73 -0
- package/dist/packages/toast/toast.scss +98 -0
- package/dist/packages/trendarrow/trendarrow.scss +17 -0
- package/dist/packages/uploader/uploader.scss +237 -0
- package/dist/packages/video/video.scss +18 -0
- package/dist/packages/virtuallist/virtuallist.scss +87 -0
- package/dist/packages/watermark/watermark.scss +13 -0
- package/dist/style.css +1 -0
- package/dist/style.mjs +9 -0
- package/dist/styles/animation/drop.scss +24 -0
- package/dist/styles/animation/ease.scss +23 -0
- package/dist/styles/animation/fade.scss +20 -0
- package/dist/styles/animation/icon.scss +245 -0
- package/dist/styles/animation/index.scss +7 -0
- package/dist/styles/animation/rotate.scss +10 -0
- package/dist/styles/animation/zoom.scss +26 -0
- package/dist/styles/font/config.json +175 -0
- package/dist/styles/font/demo.css +539 -0
- package/dist/styles/font/demo_index.html +3063 -0
- package/dist/styles/font/iconfont.css +515 -0
- package/dist/styles/font/iconfont.eot +0 -0
- package/dist/styles/font/iconfont.js +68 -0
- package/dist/styles/font/iconfont.json +884 -0
- package/dist/styles/font/iconfont.svg +356 -0
- package/dist/styles/font/iconfont.ttf +0 -0
- package/dist/styles/font/iconfont.woff +0 -0
- package/dist/styles/font/iconfont.woff2 +0 -0
- package/dist/styles/mixins/index.scss +2 -0
- package/dist/styles/mixins/make-animation.scss +24 -0
- package/dist/styles/mixins/text-ellipsis.scss +20 -0
- package/dist/styles/theme-dark.scss +26 -0
- package/dist/styles/theme-default.scss +40 -0
- package/dist/styles/themes/default.scss +97 -0
- package/dist/styles/variables.scss +2610 -0
- package/dist/types/index.d.ts +2201 -0
- package/package.json +1 -1
|
@@ -0,0 +1,315 @@
|
|
|
1
|
+
import _defineProperty from "@babel/runtime/helpers/defineProperty";
|
|
2
|
+
import _slicedToArray from "@babel/runtime/helpers/slicedToArray";
|
|
3
|
+
import _objectWithoutProperties from "@babel/runtime/helpers/objectWithoutProperties";
|
|
4
|
+
var _excluded = ["sourceData", "ItemRender", "itemEqualSize", "itemSize", "horizontal", "overscan", "key", "handleScroll", "onScroll", "className", "containerSize"];
|
|
5
|
+
function ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); enumerableOnly && (symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; })), keys.push.apply(keys, symbols); } return keys; }
|
|
6
|
+
function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = null != arguments[i] ? arguments[i] : {}; i % 2 ? ownKeys(Object(source), !0).forEach(function (key) { _defineProperty(target, key, source[key]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)) : ownKeys(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } return target; }
|
|
7
|
+
import React__default, { useRef, useState, useEffect, useCallback } from 'react';
|
|
8
|
+
import { useConfig } from './ConfigProvider.js';
|
|
9
|
+
|
|
10
|
+
// 缓存列表初始化信息
|
|
11
|
+
var initPositinoCache = function initPositinoCache(reaItemSize) {
|
|
12
|
+
var length = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : 0;
|
|
13
|
+
var index = 0;
|
|
14
|
+
var positions = Array(length);
|
|
15
|
+
while (index < length) {
|
|
16
|
+
positions[index] = {
|
|
17
|
+
index: index,
|
|
18
|
+
height: reaItemSize,
|
|
19
|
+
width: reaItemSize,
|
|
20
|
+
top: index * reaItemSize,
|
|
21
|
+
bottom: (index + 1) * reaItemSize,
|
|
22
|
+
left: index * reaItemSize,
|
|
23
|
+
right: (index + 1) * reaItemSize
|
|
24
|
+
};
|
|
25
|
+
index++;
|
|
26
|
+
}
|
|
27
|
+
return positions;
|
|
28
|
+
};
|
|
29
|
+
// 获取列表总高度
|
|
30
|
+
var getListTotalSize = function getListTotalSize(positions, horizontal) {
|
|
31
|
+
var index = positions.length - 1;
|
|
32
|
+
var size = 0;
|
|
33
|
+
if (index < 0) {
|
|
34
|
+
size = 0;
|
|
35
|
+
} else {
|
|
36
|
+
size = horizontal ? positions[index].right : positions[index].bottom;
|
|
37
|
+
}
|
|
38
|
+
return size;
|
|
39
|
+
};
|
|
40
|
+
// 通过二分法找到 scrollOffset 对应的值
|
|
41
|
+
var binarySearch = function binarySearch(positionsList) {
|
|
42
|
+
var value = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : 0;
|
|
43
|
+
var horizontal = arguments.length > 2 ? arguments[2] : undefined;
|
|
44
|
+
var start = 0;
|
|
45
|
+
var end = positionsList.length - 1;
|
|
46
|
+
var tempIndex = null;
|
|
47
|
+
var key = horizontal ? 'right' : 'bottom';
|
|
48
|
+
while (start <= end) {
|
|
49
|
+
var midIndex = Math.floor((start + end) / 2);
|
|
50
|
+
var midValue = positionsList[midIndex][key];
|
|
51
|
+
// 相等则直接返回(因为是bottom, 因此startIndex应该是下一个节点)
|
|
52
|
+
if (midValue === value) {
|
|
53
|
+
return midIndex + 1;
|
|
54
|
+
}
|
|
55
|
+
// 中间值 < 传入值,则说明 value对应的节点 大于 start, start往后移动一位
|
|
56
|
+
if (midValue < value) {
|
|
57
|
+
start = midIndex + 1;
|
|
58
|
+
}
|
|
59
|
+
// 中间值 > 传入值,则说明 value 在 中间值之前,end 节点移动到 mid - 1
|
|
60
|
+
else if (midValue > value) {
|
|
61
|
+
// tempIndex存放最靠近值为value的所有
|
|
62
|
+
if (tempIndex === null || tempIndex > midIndex) {
|
|
63
|
+
tempIndex = midIndex;
|
|
64
|
+
}
|
|
65
|
+
end = midIndex - 1;
|
|
66
|
+
}
|
|
67
|
+
}
|
|
68
|
+
tempIndex = tempIndex || 0;
|
|
69
|
+
return tempIndex;
|
|
70
|
+
};
|
|
71
|
+
var getEndIndex = function getEndIndex(_ref) {
|
|
72
|
+
var sourceData = _ref.sourceData,
|
|
73
|
+
startIndex = _ref.startIndex,
|
|
74
|
+
visibleCount = _ref.visibleCount,
|
|
75
|
+
_ref$itemEqualSize = _ref.itemEqualSize,
|
|
76
|
+
itemEqualSize = _ref$itemEqualSize === void 0 ? true : _ref$itemEqualSize,
|
|
77
|
+
positions = _ref.positions,
|
|
78
|
+
offSetSize = _ref.offSetSize,
|
|
79
|
+
overscan = _ref.overscan,
|
|
80
|
+
_ref$sizeKey = _ref.sizeKey,
|
|
81
|
+
sizeKey = _ref$sizeKey === void 0 ? 'width' : _ref$sizeKey;
|
|
82
|
+
var dataLength = sourceData.length;
|
|
83
|
+
var tempIndex = null;
|
|
84
|
+
if (itemEqualSize) {
|
|
85
|
+
var endIndex = startIndex + visibleCount;
|
|
86
|
+
tempIndex = dataLength > 0 ? Math.min(dataLength, endIndex) : endIndex;
|
|
87
|
+
} else {
|
|
88
|
+
var sizeNum = 0;
|
|
89
|
+
for (var i = startIndex; i < dataLength; i++) {
|
|
90
|
+
sizeNum += positions[i][sizeKey] || 0;
|
|
91
|
+
if (sizeNum > offSetSize) {
|
|
92
|
+
var _endIndex = i + overscan;
|
|
93
|
+
tempIndex = dataLength > 0 ? Math.min(dataLength, _endIndex) : _endIndex;
|
|
94
|
+
break;
|
|
95
|
+
}
|
|
96
|
+
}
|
|
97
|
+
if (sizeNum < offSetSize) {
|
|
98
|
+
tempIndex = dataLength;
|
|
99
|
+
}
|
|
100
|
+
}
|
|
101
|
+
tempIndex = tempIndex || 0;
|
|
102
|
+
return tempIndex;
|
|
103
|
+
};
|
|
104
|
+
// 更新Item大小
|
|
105
|
+
var updateItemSize = function updateItemSize(positions, items, sizeKey) {
|
|
106
|
+
var newPos = positions.concat();
|
|
107
|
+
Array.from(items).forEach(function (item) {
|
|
108
|
+
var index = Number(item.getAttribute('data-index'));
|
|
109
|
+
var styleVal = item.getAttribute('style');
|
|
110
|
+
if (styleVal && styleVal.includes('none')) return;
|
|
111
|
+
var nowSize = item.getBoundingClientRect()[sizeKey];
|
|
112
|
+
var oldSize = positions[index][sizeKey];
|
|
113
|
+
// 存在差值, 更新该节点以后所有的节点
|
|
114
|
+
var dValue = oldSize - nowSize;
|
|
115
|
+
if (dValue) {
|
|
116
|
+
if (sizeKey === 'width') {
|
|
117
|
+
newPos[index].right -= dValue;
|
|
118
|
+
newPos[index][sizeKey] = nowSize;
|
|
119
|
+
for (var k = index + 1; k < positions.length; k++) {
|
|
120
|
+
newPos[k].left = positions[k - 1].right;
|
|
121
|
+
newPos[k].right -= dValue;
|
|
122
|
+
}
|
|
123
|
+
} else if (sizeKey === 'height') {
|
|
124
|
+
newPos[index].bottom -= dValue;
|
|
125
|
+
newPos[index][sizeKey] = nowSize;
|
|
126
|
+
for (var _k = index + 1; _k < positions.length; _k++) {
|
|
127
|
+
newPos[_k].top = positions[_k - 1].bottom;
|
|
128
|
+
newPos[_k].bottom -= dValue;
|
|
129
|
+
}
|
|
130
|
+
}
|
|
131
|
+
}
|
|
132
|
+
});
|
|
133
|
+
};
|
|
134
|
+
var defaultProps = {};
|
|
135
|
+
var VirtualList = function VirtualList(props) {
|
|
136
|
+
var _props$sourceData = props.sourceData,
|
|
137
|
+
sourceData = _props$sourceData === void 0 ? [] : _props$sourceData,
|
|
138
|
+
ItemRender = props.ItemRender,
|
|
139
|
+
_props$itemEqualSize = props.itemEqualSize,
|
|
140
|
+
itemEqualSize = _props$itemEqualSize === void 0 ? true : _props$itemEqualSize,
|
|
141
|
+
_props$itemSize = props.itemSize,
|
|
142
|
+
itemSize = _props$itemSize === void 0 ? 200 : _props$itemSize,
|
|
143
|
+
_props$horizontal = props.horizontal,
|
|
144
|
+
horizontal = _props$horizontal === void 0 ? false : _props$horizontal,
|
|
145
|
+
_props$overscan = props.overscan,
|
|
146
|
+
overscan = _props$overscan === void 0 ? 2 : _props$overscan,
|
|
147
|
+
key = props.key,
|
|
148
|
+
handleScroll = props.handleScroll,
|
|
149
|
+
onScroll = props.onScroll,
|
|
150
|
+
className = props.className,
|
|
151
|
+
containerSize = props.containerSize,
|
|
152
|
+
rest = _objectWithoutProperties(props, _excluded);
|
|
153
|
+
var sizeKey = horizontal ? 'width' : 'height';
|
|
154
|
+
var scrollKey = horizontal ? 'scrollLeft' : 'scrollTop';
|
|
155
|
+
var offsetKey = horizontal ? 'left' : 'top';
|
|
156
|
+
useConfig();
|
|
157
|
+
// 虚拟列表容器ref
|
|
158
|
+
var scrollRef = useRef(null);
|
|
159
|
+
// 虚拟列表显示区域ref
|
|
160
|
+
var itemsRef = useRef(null);
|
|
161
|
+
var firstItemRef = useRef(null);
|
|
162
|
+
// 列表位置信息
|
|
163
|
+
var _useState = useState([{
|
|
164
|
+
index: 0,
|
|
165
|
+
left: 0,
|
|
166
|
+
top: 0,
|
|
167
|
+
bottom: 0,
|
|
168
|
+
width: 0,
|
|
169
|
+
height: 0,
|
|
170
|
+
right: 0
|
|
171
|
+
}]),
|
|
172
|
+
_useState2 = _slicedToArray(_useState, 2),
|
|
173
|
+
positions = _useState2[0],
|
|
174
|
+
setPositions = _useState2[1];
|
|
175
|
+
// 列表总大小
|
|
176
|
+
var _useState3 = useState(99999999),
|
|
177
|
+
_useState4 = _slicedToArray(_useState3, 2),
|
|
178
|
+
listTotalSize = _useState4[0],
|
|
179
|
+
setListTotalSize = _useState4[1];
|
|
180
|
+
// 可视区域条数
|
|
181
|
+
var _useState5 = useState(0),
|
|
182
|
+
_useState6 = _slicedToArray(_useState5, 2),
|
|
183
|
+
visibleCount = _useState6[0],
|
|
184
|
+
setVisibleCount = _useState6[1];
|
|
185
|
+
var _useState7 = useState(containerSize || 0),
|
|
186
|
+
_useState8 = _slicedToArray(_useState7, 2),
|
|
187
|
+
offSetSize = _useState8[0],
|
|
188
|
+
setOffSetSize = _useState8[1];
|
|
189
|
+
var _useState9 = useState({
|
|
190
|
+
startOffset: 0,
|
|
191
|
+
startIndex: 0,
|
|
192
|
+
overStart: 0,
|
|
193
|
+
endIndex: 10 // 可视区域结束索引
|
|
194
|
+
}),
|
|
195
|
+
_useState10 = _slicedToArray(_useState9, 2),
|
|
196
|
+
options = _useState10[0],
|
|
197
|
+
setOptions = _useState10[1];
|
|
198
|
+
// 列表位置信息
|
|
199
|
+
useEffect(function () {
|
|
200
|
+
var pos = initPositinoCache(itemSize, sourceData.length);
|
|
201
|
+
setPositions(pos);
|
|
202
|
+
var totalSize = getListTotalSize(pos, horizontal);
|
|
203
|
+
setListTotalSize(totalSize);
|
|
204
|
+
}, [sourceData, itemSize, horizontal]);
|
|
205
|
+
var getElement = useCallback(function () {
|
|
206
|
+
var _scrollRef$current;
|
|
207
|
+
return ((_scrollRef$current = scrollRef.current) === null || _scrollRef$current === void 0 ? void 0 : _scrollRef$current.parentElement) || document.body;
|
|
208
|
+
}, []);
|
|
209
|
+
useEffect(function () {
|
|
210
|
+
if (containerSize) return;
|
|
211
|
+
var size = horizontal ? getElement().offsetWidth : getElement().offsetHeight;
|
|
212
|
+
setOffSetSize(size);
|
|
213
|
+
}, [getElement, horizontal, containerSize]);
|
|
214
|
+
useEffect(function () {
|
|
215
|
+
// 初始-计算visibleCount
|
|
216
|
+
if (offSetSize === 0) return;
|
|
217
|
+
var count = Math.ceil(offSetSize / itemSize) + overscan;
|
|
218
|
+
setVisibleCount(count);
|
|
219
|
+
setOptions(function (options) {
|
|
220
|
+
return _objectSpread(_objectSpread({}, options), {}, {
|
|
221
|
+
endIndex: count
|
|
222
|
+
});
|
|
223
|
+
});
|
|
224
|
+
}, [getElement, horizontal, itemSize, overscan, offSetSize]);
|
|
225
|
+
var updateTotalSize = useCallback(function () {
|
|
226
|
+
if (!itemsRef.current) return;
|
|
227
|
+
var items = itemsRef.current.children;
|
|
228
|
+
if (!items.length) return;
|
|
229
|
+
// 更新缓存
|
|
230
|
+
updateItemSize(positions, items, sizeKey);
|
|
231
|
+
var totalSize = getListTotalSize(positions, horizontal);
|
|
232
|
+
setListTotalSize(totalSize);
|
|
233
|
+
}, [positions, sizeKey, horizontal]);
|
|
234
|
+
var scroll = useCallback(function () {
|
|
235
|
+
requestAnimationFrame(function (e) {
|
|
236
|
+
var scrollSize = getElement()[scrollKey];
|
|
237
|
+
var startIndex = binarySearch(positions, scrollSize, horizontal);
|
|
238
|
+
var overStart = startIndex - overscan > -1 ? startIndex - overscan : 0;
|
|
239
|
+
// const offSetSize = horizontal ? getElement().offsetWidth : getElement().offsetHeight
|
|
240
|
+
if (!itemEqualSize) {
|
|
241
|
+
updateTotalSize();
|
|
242
|
+
}
|
|
243
|
+
var endIndex = getEndIndex({
|
|
244
|
+
sourceData: sourceData,
|
|
245
|
+
startIndex: startIndex,
|
|
246
|
+
visibleCount: visibleCount,
|
|
247
|
+
itemEqualSize: itemEqualSize,
|
|
248
|
+
positions: positions,
|
|
249
|
+
offSetSize: offSetSize,
|
|
250
|
+
sizeKey: sizeKey,
|
|
251
|
+
overscan: overscan
|
|
252
|
+
});
|
|
253
|
+
var startOffset = positions[startIndex][offsetKey];
|
|
254
|
+
setOptions({
|
|
255
|
+
startOffset: startOffset,
|
|
256
|
+
startIndex: startIndex,
|
|
257
|
+
overStart: overStart,
|
|
258
|
+
endIndex: endIndex
|
|
259
|
+
});
|
|
260
|
+
// 无限下滑
|
|
261
|
+
if (endIndex > sourceData.length - 1) {
|
|
262
|
+
if (onScroll) {
|
|
263
|
+
onScroll();
|
|
264
|
+
} else if (handleScroll) {
|
|
265
|
+
handleScroll();
|
|
266
|
+
}
|
|
267
|
+
}
|
|
268
|
+
});
|
|
269
|
+
}, [positions, getElement, sourceData, visibleCount, itemEqualSize, updateTotalSize, offsetKey, sizeKey, scrollKey, horizontal, overscan, handleScroll, offSetSize]);
|
|
270
|
+
useEffect(function () {
|
|
271
|
+
var element = getElement();
|
|
272
|
+
element.addEventListener('scroll', scroll, false);
|
|
273
|
+
return function () {
|
|
274
|
+
element.removeEventListener('scroll', scroll, false);
|
|
275
|
+
};
|
|
276
|
+
}, [getElement, scroll]);
|
|
277
|
+
return React__default.createElement("div", _objectSpread(_objectSpread({
|
|
278
|
+
className: className ? "".concat(className, " nut-virtualList-box") : 'nut-virtualList-box'
|
|
279
|
+
}, rest), {}, {
|
|
280
|
+
style: _defineProperty({}, sizeKey, containerSize ? "".concat(offSetSize, "px") : '')
|
|
281
|
+
}), React__default.createElement("div", {
|
|
282
|
+
ref: scrollRef,
|
|
283
|
+
className: horizontal ? 'nut-horizontal-box' : 'nut-vertical-box',
|
|
284
|
+
style: _defineProperty({
|
|
285
|
+
position: 'relative'
|
|
286
|
+
}, sizeKey, "".concat(listTotalSize, "px"))
|
|
287
|
+
}, React__default.createElement("ul", {
|
|
288
|
+
className: horizontal ? 'nut-virtuallist-items nut-horizontal-items' : 'nut-virtuallist-items nut-vertical-items',
|
|
289
|
+
ref: itemsRef,
|
|
290
|
+
style: {
|
|
291
|
+
transform: horizontal ? "translate3d(".concat(options.startOffset, "px,0,0)") : "translate3d(0,".concat(options.startOffset, "px,0)")
|
|
292
|
+
}
|
|
293
|
+
}, sourceData.slice(options.overStart, options.endIndex).map(function (data, index) {
|
|
294
|
+
var startIndex = options.startIndex,
|
|
295
|
+
overStart = options.overStart;
|
|
296
|
+
var dataIndex = overStart + index;
|
|
297
|
+
var styleVal = dataIndex < startIndex ? 'none' : 'block';
|
|
298
|
+
var keyVal = key && data[key] ? data[key] : dataIndex;
|
|
299
|
+
return React__default.createElement("li", {
|
|
300
|
+
ref: dataIndex === 0 ? firstItemRef : null,
|
|
301
|
+
"data-index": "".concat(dataIndex),
|
|
302
|
+
className: dataIndex % 2 === 0 ? 'nut-virtuallist-item even' : 'nut-virtuallist-item odd',
|
|
303
|
+
key: "".concat(keyVal),
|
|
304
|
+
style: {
|
|
305
|
+
display: styleVal
|
|
306
|
+
}
|
|
307
|
+
}, ItemRender ? React__default.createElement(ItemRender, {
|
|
308
|
+
data: data,
|
|
309
|
+
index: "".concat(dataIndex)
|
|
310
|
+
}) : data);
|
|
311
|
+
}))));
|
|
312
|
+
};
|
|
313
|
+
VirtualList.defaultProps = defaultProps;
|
|
314
|
+
VirtualList.displayName = 'NutVirtualList';
|
|
315
|
+
export { VirtualList as default };
|
|
@@ -0,0 +1,113 @@
|
|
|
1
|
+
import _slicedToArray from "@babel/runtime/helpers/slicedToArray";
|
|
2
|
+
import _defineProperty from "@babel/runtime/helpers/defineProperty";
|
|
3
|
+
function ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); enumerableOnly && (symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; })), keys.push.apply(keys, symbols); } return keys; }
|
|
4
|
+
function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = null != arguments[i] ? arguments[i] : {}; i % 2 ? ownKeys(Object(source), !0).forEach(function (key) { _defineProperty(target, key, source[key]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)) : ownKeys(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } return target; }
|
|
5
|
+
import React__default, { useState, useEffect } from 'react';
|
|
6
|
+
import classNames from 'classnames';
|
|
7
|
+
import { useConfig } from './ConfigProvider.js';
|
|
8
|
+
import { c as cn } from './bem-3b438e61.js';
|
|
9
|
+
import '@bem-react/classname';
|
|
10
|
+
var defaultProps = {
|
|
11
|
+
content: '',
|
|
12
|
+
fullPage: true,
|
|
13
|
+
zIndex: 2000,
|
|
14
|
+
gapX: 24,
|
|
15
|
+
gapY: 48,
|
|
16
|
+
width: 120,
|
|
17
|
+
height: 64,
|
|
18
|
+
image: '',
|
|
19
|
+
imageWidth: 120,
|
|
20
|
+
imageHeight: 64,
|
|
21
|
+
rotate: -22,
|
|
22
|
+
fontColor: 'rgba(0,0,0,.15)',
|
|
23
|
+
fontStyle: 'normal',
|
|
24
|
+
fontFamily: 'PingFang SC',
|
|
25
|
+
fontWeight: 'normal',
|
|
26
|
+
fontSize: 14
|
|
27
|
+
};
|
|
28
|
+
var WaterMark = function WaterMark(props) {
|
|
29
|
+
var _classNames;
|
|
30
|
+
var _useConfig = useConfig(),
|
|
31
|
+
locale = _useConfig.locale;
|
|
32
|
+
var _defaultProps$props = _objectSpread(_objectSpread({}, defaultProps), props),
|
|
33
|
+
content = _defaultProps$props.content,
|
|
34
|
+
fullPage = _defaultProps$props.fullPage,
|
|
35
|
+
zIndex = _defaultProps$props.zIndex,
|
|
36
|
+
className = _defaultProps$props.className,
|
|
37
|
+
gapX = _defaultProps$props.gapX,
|
|
38
|
+
gapY = _defaultProps$props.gapY,
|
|
39
|
+
width = _defaultProps$props.width,
|
|
40
|
+
height = _defaultProps$props.height,
|
|
41
|
+
image = _defaultProps$props.image,
|
|
42
|
+
imageWidth = _defaultProps$props.imageWidth,
|
|
43
|
+
imageHeight = _defaultProps$props.imageHeight,
|
|
44
|
+
rotate = _defaultProps$props.rotate,
|
|
45
|
+
fontColor = _defaultProps$props.fontColor,
|
|
46
|
+
fontStyle = _defaultProps$props.fontStyle,
|
|
47
|
+
fontFamily = _defaultProps$props.fontFamily,
|
|
48
|
+
fontWeight = _defaultProps$props.fontWeight,
|
|
49
|
+
fontSize = _defaultProps$props.fontSize,
|
|
50
|
+
style = _defaultProps$props.style,
|
|
51
|
+
children = _defaultProps$props.children;
|
|
52
|
+
var _useState = useState(''),
|
|
53
|
+
_useState2 = _slicedToArray(_useState, 2),
|
|
54
|
+
base64Url = _useState2[0],
|
|
55
|
+
setBase64Url = _useState2[1];
|
|
56
|
+
var b = cn('watermark');
|
|
57
|
+
var classes = classNames((_classNames = {}, _defineProperty(_classNames, "".concat(b('')), true), _defineProperty(_classNames, "".concat(b(''), "-full-page"), fullPage), _classNames));
|
|
58
|
+
var cls = classNames(classes, className);
|
|
59
|
+
useEffect(function () {
|
|
60
|
+
init();
|
|
61
|
+
}, []);
|
|
62
|
+
var init = function init() {
|
|
63
|
+
var canvas = document.createElement('canvas');
|
|
64
|
+
var ratio = window.devicePixelRatio;
|
|
65
|
+
var ctx = canvas.getContext('2d');
|
|
66
|
+
var canvasWidth = "".concat((gapX + width) * ratio, "px");
|
|
67
|
+
var canvasHeight = "".concat((gapY + height) * ratio, "px");
|
|
68
|
+
var markWidth = width * ratio;
|
|
69
|
+
var markHeight = height * ratio;
|
|
70
|
+
canvas.setAttribute('width', canvasWidth);
|
|
71
|
+
canvas.setAttribute('height', canvasHeight);
|
|
72
|
+
if (ctx) {
|
|
73
|
+
if (image) {
|
|
74
|
+
ctx.translate(markWidth / 2, markHeight / 2);
|
|
75
|
+
ctx.rotate(Math.PI / 180 * Number(rotate));
|
|
76
|
+
var img = new Image();
|
|
77
|
+
img.crossOrigin = 'anonymous';
|
|
78
|
+
img.referrerPolicy = 'no-referrer';
|
|
79
|
+
img.src = image;
|
|
80
|
+
img.onload = function () {
|
|
81
|
+
ctx.drawImage(img, -imageWidth * ratio / 2, -imageHeight * ratio / 2, imageWidth * ratio, imageHeight * ratio);
|
|
82
|
+
ctx.restore();
|
|
83
|
+
setBase64Url(canvas.toDataURL());
|
|
84
|
+
};
|
|
85
|
+
} else if (content) {
|
|
86
|
+
ctx.textBaseline = 'middle'; // 设置或返回在绘制文本时使用的当前文本基线。(正中)
|
|
87
|
+
ctx.textAlign = 'center'; // 设置或返回文本内容的当前对齐方式。
|
|
88
|
+
// 文字绕中间旋转
|
|
89
|
+
ctx.translate(markWidth / 2, markHeight / 2);
|
|
90
|
+
ctx.rotate(Math.PI / 180 * Number(rotate));
|
|
91
|
+
var markSize = Number(fontSize) * ratio;
|
|
92
|
+
ctx.font = "".concat(fontStyle, " normal ").concat(fontWeight, " ").concat(markSize, "px/").concat(markHeight, "px ").concat(fontFamily);
|
|
93
|
+
ctx.fillStyle = fontColor;
|
|
94
|
+
ctx.fillText(content, 0, 0); // 在画布上绘制"被填充的"文本。
|
|
95
|
+
ctx.restore(); // 返回之前保存过的路径状态和属性。
|
|
96
|
+
setBase64Url(canvas.toDataURL());
|
|
97
|
+
}
|
|
98
|
+
} else {
|
|
99
|
+
throw new Error(locale.watermark.errorCanvasTips);
|
|
100
|
+
}
|
|
101
|
+
};
|
|
102
|
+
return React__default.createElement("div", {
|
|
103
|
+
className: cls,
|
|
104
|
+
style: _objectSpread({
|
|
105
|
+
zIndex: zIndex,
|
|
106
|
+
backgroundSize: "".concat(gapX + width, "px"),
|
|
107
|
+
backgroundImage: "url('".concat(base64Url, "')")
|
|
108
|
+
}, style)
|
|
109
|
+
});
|
|
110
|
+
};
|
|
111
|
+
WaterMark.defaultProps = defaultProps;
|
|
112
|
+
WaterMark.displayName = 'NutWaterMark';
|
|
113
|
+
export { WaterMark as default };
|
|
@@ -0,0 +1,34 @@
|
|
|
1
|
+
import _defineProperty from "@babel/runtime/helpers/defineProperty";
|
|
2
|
+
function ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); enumerableOnly && (symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; })), keys.push.apply(keys, symbols); } return keys; }
|
|
3
|
+
function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = null != arguments[i] ? arguments[i] : {}; i % 2 ? ownKeys(Object(source), !0).forEach(function (key) { _defineProperty(target, key, source[key]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)) : ownKeys(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } return target; }
|
|
4
|
+
import React__default from 'react';
|
|
5
|
+
import { c as cn } from './bem-3b438e61.js';
|
|
6
|
+
var defaultProps = {
|
|
7
|
+
title: '',
|
|
8
|
+
desc: '',
|
|
9
|
+
className: '',
|
|
10
|
+
titleSlot: null,
|
|
11
|
+
descSlot: null
|
|
12
|
+
};
|
|
13
|
+
var CellGroup = function CellGroup(props) {
|
|
14
|
+
var _defaultProps$props = _objectSpread(_objectSpread({}, defaultProps), props),
|
|
15
|
+
children = _defaultProps$props.children,
|
|
16
|
+
className = _defaultProps$props.className,
|
|
17
|
+
title = _defaultProps$props.title,
|
|
18
|
+
desc = _defaultProps$props.desc,
|
|
19
|
+
titleSlot = _defaultProps$props.titleSlot,
|
|
20
|
+
descSlot = _defaultProps$props.descSlot;
|
|
21
|
+
var b = cn('cell-group');
|
|
22
|
+
return React__default.createElement("div", {
|
|
23
|
+
className: b(null, [className])
|
|
24
|
+
}, titleSlot || React__default.createElement(React__default.Fragment, null, title ? React__default.createElement("div", {
|
|
25
|
+
className: b('title')
|
|
26
|
+
}, title) : null), descSlot || React__default.createElement(React__default.Fragment, null, desc ? React__default.createElement("div", {
|
|
27
|
+
className: b('desc')
|
|
28
|
+
}, desc) : null), React__default.createElement("div", {
|
|
29
|
+
className: b('wrap')
|
|
30
|
+
}, children));
|
|
31
|
+
};
|
|
32
|
+
CellGroup.defaultProps = defaultProps;
|
|
33
|
+
CellGroup.displayName = 'NutCellGroup';
|
|
34
|
+
export { CellGroup as C };
|
|
@@ -0,0 +1,137 @@
|
|
|
1
|
+
import _slicedToArray from "@babel/runtime/helpers/slicedToArray";
|
|
2
|
+
import _objectWithoutProperties from "@babel/runtime/helpers/objectWithoutProperties";
|
|
3
|
+
import _defineProperty from "@babel/runtime/helpers/defineProperty";
|
|
4
|
+
var _excluded = ["iconName", "iconSize", "label", "className", "iconActiveName", "checked", "disabled", "onChange", "indeterminate", "iconClassPrefix", "iconFontClassName", "iconIndeterminateName"],
|
|
5
|
+
_excluded2 = ["textPosition"];
|
|
6
|
+
function ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); enumerableOnly && (symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; })), keys.push.apply(keys, symbols); } return keys; }
|
|
7
|
+
function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = null != arguments[i] ? arguments[i] : {}; i % 2 ? ownKeys(Object(source), !0).forEach(function (key) { _defineProperty(target, key, source[key]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)) : ownKeys(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } return target; }
|
|
8
|
+
import React__default, { createContext, useContext, useState, useEffect } from 'react';
|
|
9
|
+
import Icon from './Icon.js';
|
|
10
|
+
import CheckboxGroup from './CheckboxGroup.js';
|
|
11
|
+
import { c as cn } from './bem-3b438e61.js';
|
|
12
|
+
import { C as ComponentDefaults } from './typings-f27b58f4.js';
|
|
13
|
+
var CheckboxGroupContext = createContext(null);
|
|
14
|
+
var defaultProps = _objectSpread(_objectSpread({}, ComponentDefaults), {}, {
|
|
15
|
+
checked: false,
|
|
16
|
+
disabled: false,
|
|
17
|
+
textPosition: 'right',
|
|
18
|
+
iconSize: 18,
|
|
19
|
+
iconName: 'check-normal',
|
|
20
|
+
iconActiveName: 'checked',
|
|
21
|
+
iconClassPrefix: 'nut-icon',
|
|
22
|
+
iconFontClassName: 'nutui-iconfont',
|
|
23
|
+
iconIndeterminateName: 'check-disabled',
|
|
24
|
+
onChange: function onChange(state, label) {}
|
|
25
|
+
});
|
|
26
|
+
var Checkbox = function Checkbox(props) {
|
|
27
|
+
var _defaultProps$props = _objectSpread(_objectSpread({}, defaultProps), props),
|
|
28
|
+
children = _defaultProps$props.children;
|
|
29
|
+
var b = cn('checkbox');
|
|
30
|
+
var iconName = props.iconName,
|
|
31
|
+
iconSize = props.iconSize,
|
|
32
|
+
label = props.label,
|
|
33
|
+
className = props.className,
|
|
34
|
+
iconActiveName = props.iconActiveName,
|
|
35
|
+
checked = props.checked,
|
|
36
|
+
disabled = props.disabled,
|
|
37
|
+
onChange = props.onChange,
|
|
38
|
+
indeterminate = props.indeterminate,
|
|
39
|
+
iconClassPrefix = props.iconClassPrefix,
|
|
40
|
+
iconFontClassName = props.iconFontClassName,
|
|
41
|
+
iconIndeterminateName = props.iconIndeterminateName,
|
|
42
|
+
others = _objectWithoutProperties(props, _excluded);
|
|
43
|
+
// eslint-disable-next-line prefer-const
|
|
44
|
+
var textPosition = others.textPosition,
|
|
45
|
+
rest = _objectWithoutProperties(others, _excluded2);
|
|
46
|
+
var ctx = useContext(CheckboxGroupContext);
|
|
47
|
+
var _useState = useState(checked),
|
|
48
|
+
_useState2 = _slicedToArray(_useState, 2),
|
|
49
|
+
innerChecked = _useState2[0],
|
|
50
|
+
setInnerChecked = _useState2[1];
|
|
51
|
+
// eslint-disable-next-line prefer-const
|
|
52
|
+
var _useState3 = useState(disabled),
|
|
53
|
+
_useState4 = _slicedToArray(_useState3, 2),
|
|
54
|
+
innerDisabled = _useState4[0],
|
|
55
|
+
setDisabled = _useState4[1];
|
|
56
|
+
var _useState5 = useState(indeterminate),
|
|
57
|
+
_useState6 = _slicedToArray(_useState5, 2),
|
|
58
|
+
_indeterminate = _useState6[0],
|
|
59
|
+
setIndeterminate = _useState6[1];
|
|
60
|
+
useEffect(function () {
|
|
61
|
+
!ctx && setInnerChecked(checked);
|
|
62
|
+
setDisabled(disabled);
|
|
63
|
+
setIndeterminate(indeterminate);
|
|
64
|
+
}, [disabled, checked, indeterminate]);
|
|
65
|
+
if (ctx) {
|
|
66
|
+
if (ctx.textPosition !== undefined) {
|
|
67
|
+
textPosition = ctx.textPosition;
|
|
68
|
+
}
|
|
69
|
+
innerDisabled = ctx.disabled;
|
|
70
|
+
innerChecked = ctx.checkedValue.includes(label);
|
|
71
|
+
setInnerChecked = function setInnerChecked(checked) {
|
|
72
|
+
if (ctx.disabled) return;
|
|
73
|
+
if (checked) ctx.check(label);
|
|
74
|
+
if (!checked) ctx.uncheck(label);
|
|
75
|
+
};
|
|
76
|
+
}
|
|
77
|
+
var getIconName = function getIconName() {
|
|
78
|
+
if (!innerChecked) {
|
|
79
|
+
return iconName;
|
|
80
|
+
}
|
|
81
|
+
if (_indeterminate) {
|
|
82
|
+
return iconIndeterminateName;
|
|
83
|
+
}
|
|
84
|
+
return iconActiveName;
|
|
85
|
+
};
|
|
86
|
+
var renderIcon = function renderIcon() {
|
|
87
|
+
return React__default.createElement(Icon, {
|
|
88
|
+
classPrefix: iconClassPrefix,
|
|
89
|
+
fontClassName: iconFontClassName,
|
|
90
|
+
name: getIconName(),
|
|
91
|
+
size: iconSize,
|
|
92
|
+
className: color()
|
|
93
|
+
});
|
|
94
|
+
};
|
|
95
|
+
var color = function color() {
|
|
96
|
+
if (innerDisabled) {
|
|
97
|
+
return 'nut-checkbox__icon--disable';
|
|
98
|
+
}
|
|
99
|
+
if (innerChecked) {
|
|
100
|
+
if (_indeterminate) {
|
|
101
|
+
return 'nut-checkbox__icon--indeterminate';
|
|
102
|
+
}
|
|
103
|
+
return 'nut-checkbox__icon';
|
|
104
|
+
}
|
|
105
|
+
return 'nut-checkbox__icon--unchecked';
|
|
106
|
+
};
|
|
107
|
+
var renderLabel = function renderLabel() {
|
|
108
|
+
return React__default.createElement("span", {
|
|
109
|
+
className: "".concat(b('label', {
|
|
110
|
+
disabled: innerDisabled
|
|
111
|
+
}), " ")
|
|
112
|
+
}, children || label);
|
|
113
|
+
};
|
|
114
|
+
var handleClick = function handleClick() {
|
|
115
|
+
// 禁用的时候直接返回
|
|
116
|
+
if (disabled) return;
|
|
117
|
+
// 先转换状态
|
|
118
|
+
var latestChecked = !innerChecked;
|
|
119
|
+
// 判断是不是有 context 和 max,有的话需要判断是不是超过最大限制
|
|
120
|
+
if (ctx && ctx.max !== undefined) {
|
|
121
|
+
if (latestChecked && ctx.checkedValue.length >= ctx.max) return;
|
|
122
|
+
}
|
|
123
|
+
onChange && onChange(latestChecked, label || children);
|
|
124
|
+
setInnerChecked(latestChecked);
|
|
125
|
+
};
|
|
126
|
+
return React__default.createElement("div", _objectSpread(_objectSpread({
|
|
127
|
+
className: "".concat(b({
|
|
128
|
+
reverse: textPosition === 'left'
|
|
129
|
+
}), " ").concat(className || '')
|
|
130
|
+
}, rest), {}, {
|
|
131
|
+
onClick: handleClick
|
|
132
|
+
}), renderIcon(), renderLabel());
|
|
133
|
+
};
|
|
134
|
+
Checkbox.defaultProps = defaultProps;
|
|
135
|
+
Checkbox.displayName = 'NutCheckBox';
|
|
136
|
+
Checkbox.Group = CheckboxGroup;
|
|
137
|
+
export { Checkbox as C, CheckboxGroupContext as a };
|