shineout 3.4.5-beta.5 → 3.4.5-beta.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.
package/cjs/index.js CHANGED
@@ -492,5 +492,5 @@ function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { de
492
492
  // 此文件由脚本自动生成,请勿直接修改。
493
493
  // This file was generated automatically by a script. Please do not modify it directly.
494
494
  var _default = exports.default = {
495
- version: '3.4.5-beta.5'
495
+ version: '3.4.5-beta.6'
496
496
  };
package/dist/shineout.js CHANGED
@@ -11984,7 +11984,7 @@ var handleStyle = function handleStyle(style) {
11984
11984
  };
11985
11985
  /* harmony default export */ var jss_style_handleStyle = (handleStyle);
11986
11986
  ;// CONCATENATED MODULE: ../shineout-style/src/version.ts
11987
- /* harmony default export */ var version = ('3.4.5-beta.5');
11987
+ /* harmony default export */ var version = ('3.4.5-beta.6');
11988
11988
  ;// CONCATENATED MODULE: ../shineout-style/src/jss-style/index.tsx
11989
11989
 
11990
11990
 
@@ -22280,7 +22280,7 @@ var selectStyle = objectSpread2_default()(objectSpread2_default()({
22280
22280
  minWidth: 12,
22281
22281
  maxWidth: '100%',
22282
22282
  // flex: 1,
22283
- width: 12,
22283
+ // width: 12,
22284
22284
  overflow: 'hidden',
22285
22285
  whiteSpace: 'nowrap',
22286
22286
  textOverflow: 'ellipsis',
@@ -32114,72 +32114,6 @@ var card_group_jssStyle = {
32114
32114
  jssStyle: card_group_jssStyle
32115
32115
  }, props));
32116
32116
  });
32117
- ;// CONCATENATED MODULE: ../hooks/src/common/use-in-view/use-in-view.ts
32118
-
32119
-
32120
- var useInView = function useInView() {
32121
- var options = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : {};
32122
- var elementRef = (0,external_root_React_commonjs2_react_commonjs_react_amd_react_.useRef)(null);
32123
- var _useState = (0,external_root_React_commonjs2_react_commonjs_react_amd_react_.useState)(false),
32124
- _useState2 = slicedToArray_default()(_useState, 2),
32125
- isInView = _useState2[0],
32126
- setIsInView = _useState2[1];
32127
- var _useState3 = (0,external_root_React_commonjs2_react_commonjs_react_amd_react_.useState)(false),
32128
- _useState4 = slicedToArray_default()(_useState3, 2),
32129
- wasInView = _useState4[0],
32130
- setWasInView = _useState4[1];
32131
- (0,external_root_React_commonjs2_react_commonjs_react_amd_react_.useEffect)(function () {
32132
- var element = elementRef.current;
32133
- if (!element) return;
32134
- if (typeof window === 'undefined' || !window.IntersectionObserver) {
32135
- setIsInView(true);
32136
- setWasInView(true);
32137
- return;
32138
- }
32139
- var observer = new IntersectionObserver(function (_ref) {
32140
- var _ref2 = slicedToArray_default()(_ref, 1),
32141
- entry = _ref2[0];
32142
- var inView = entry.isIntersecting;
32143
- setIsInView(inView);
32144
- if (inView) {
32145
- setWasInView(true);
32146
- // 如果设置了 once 选项,且元素已经出现过,则取消观察
32147
- if (options.once) {
32148
- observer.disconnect();
32149
- }
32150
- }
32151
- }, {
32152
- root: options.root || null,
32153
- rootMargin: options.rootMargin || '0px',
32154
- threshold: options.threshold || 0
32155
- });
32156
- observer.observe(element);
32157
- return function () {
32158
- observer.disconnect();
32159
- };
32160
- }, [options.root, options.rootMargin, options.threshold, options.once]);
32161
- return {
32162
- ref: elementRef,
32163
- isInView: isInView,
32164
- wasInView: wasInView
32165
- };
32166
- };
32167
- /* harmony default export */ var use_in_view = (useInView);
32168
-
32169
- // 使用示例
32170
- // const Example = () => {
32171
- // const { ref, isInView } = useInView({
32172
- // threshold: 0.5,
32173
- // rootMargin: '50px',
32174
- // once: true
32175
- // });
32176
-
32177
- // return (
32178
- // <div ref={ref}>
32179
- // {isInView ? '元素在视窗中' : '元素不在视窗中'}
32180
- // </div>
32181
- // );
32182
- // };
32183
32117
  ;// CONCATENATED MODULE: ../hooks/src/utils/uid.ts
32184
32118
  function generateUUID() {
32185
32119
  var c = crypto || typeof window !== 'undefined' && window.crypto; // 获取加密库
@@ -32266,12 +32200,15 @@ function getObserver(obj, id) {
32266
32200
  container = _obj$container === void 0 ? null : _obj$container,
32267
32201
  offset = obj.offset,
32268
32202
  render = obj.render,
32203
+ offscreen = obj.offscreen,
32269
32204
  noRemove = obj.noRemove;
32270
32205
  var observer = new IntersectionObserver(function (entries) {
32271
32206
  entries.forEach(function (en) {
32272
32207
  if (en.isIntersecting || en.intersectionRatio > 0) {
32273
32208
  render();
32274
32209
  if (!noRemove) removeStack(id);
32210
+ } else {
32211
+ offscreen && offscreen();
32275
32212
  }
32276
32213
  });
32277
32214
  }, {
@@ -32335,7 +32272,7 @@ var Lazyload = function Lazyload(props) {
32335
32272
  lazyload_removeStack(lazyId);
32336
32273
  };
32337
32274
  }, []);
32338
- if (ready && props.isInView) return /*#__PURE__*/(0,jsx_runtime.jsx)(jsx_runtime.Fragment, {
32275
+ if (ready) return /*#__PURE__*/(0,jsx_runtime.jsx)(jsx_runtime.Fragment, {
32339
32276
  children: props.children
32340
32277
  });
32341
32278
  return /*#__PURE__*/(0,jsx_runtime.jsx)("span", {
@@ -34156,25 +34093,11 @@ var CheckboxWithContext = function CheckboxWithContext(props) {
34156
34093
 
34157
34094
 
34158
34095
 
34159
-
34160
-
34161
34096
  var Item = function Item(props) {
34162
34097
  var _props$jssStyle, _props$jssStyle$cardG;
34163
34098
  var _useContext = (0,external_root_React_commonjs2_react_commonjs_react_amd_react_.useContext)(CardGroupContext),
34164
34099
  container = _useContext.container;
34165
34100
  var classes = (_props$jssStyle = props.jssStyle) === null || _props$jssStyle === void 0 || (_props$jssStyle$cardG = _props$jssStyle.cardGroup) === null || _props$jssStyle$cardG === void 0 ? void 0 : _props$jssStyle$cardG.call(_props$jssStyle);
34166
- var _useInView = use_in_view({
34167
- root: container,
34168
- rootMargin: "".concat(props.lazyLoadOffset || (container === null || container === void 0 ? void 0 : container.clientHeight) || 100, "px")
34169
- }),
34170
- itemRef = _useInView.ref,
34171
- itemIsInView = _useInView.isInView,
34172
- wasInView = _useInView.wasInView;
34173
- var isInView = props.placeholder ? itemIsInView : true;
34174
- var _useState = (0,external_root_React_commonjs2_react_commonjs_react_amd_react_.useState)(0),
34175
- _useState2 = slicedToArray_default()(_useState, 2),
34176
- itemHeight = _useState2[0],
34177
- setItemHeight = _useState2[1];
34178
34101
  var handleChange = usePersistFn(function (_, checked) {
34179
34102
  if (props.onChange) props.onChange(checked, props.value);
34180
34103
  });
@@ -34184,7 +34107,6 @@ var Item = function Item(props) {
34184
34107
  return /*#__PURE__*/(0,jsx_runtime.jsx)(lazyload, {
34185
34108
  container: container,
34186
34109
  placeholder: props.placeholder,
34187
- isInView: isInView,
34188
34110
  children: content
34189
34111
  });
34190
34112
  };
@@ -34199,26 +34121,9 @@ var Item = function Item(props) {
34199
34121
  className: classes === null || classes === void 0 ? void 0 : classes.checkbox
34200
34122
  })]
34201
34123
  });
34202
- (0,external_root_React_commonjs2_react_commonjs_react_amd_react_.useLayoutEffect)(function () {
34203
- if (isInView) {
34204
- var _itemRef$current;
34205
- setItemHeight(((_itemRef$current = itemRef.current) === null || _itemRef$current === void 0 ? void 0 : _itemRef$current.offsetHeight) || 0);
34206
- }
34207
- }, [isInView]);
34208
- var hiddenStyle = (0,external_root_React_commonjs2_react_commonjs_react_amd_react_.useMemo)(function () {
34209
- return !isInView && wasInView && itemHeight ? {
34210
- height: itemHeight,
34211
- overflow: 'hidden',
34212
- visibility: isInView ? 'visible' : 'hidden'
34213
- } : undefined;
34214
- }, [isInView, itemHeight]);
34215
- var itemStyle = (0,external_root_React_commonjs2_react_commonjs_react_amd_react_.useMemo)(function () {
34216
- return hiddenStyle ? objectSpread2_default()(objectSpread2_default()({}, props.style), hiddenStyle) : props.style;
34217
- }, [hiddenStyle, props.style]);
34218
34124
  return /*#__PURE__*/(0,jsx_runtime.jsx)("div", {
34219
- ref: itemRef,
34220
34125
  className: cls,
34221
- style: itemStyle,
34126
+ style: props.style,
34222
34127
  children: renderChildren(content)
34223
34128
  });
34224
34129
  };
@@ -47568,10 +47473,17 @@ var useImage = function useImage() {
47568
47473
  offset: typeof lazy === 'number' ? lazy : 0,
47569
47474
  element: elementRef.current,
47570
47475
  render: markToRender,
47476
+ offscreen: function offscreen() {
47477
+ setStatus(PLACEHOLDER);
47478
+ },
47479
+ noRemove: props.inViewOnly,
47571
47480
  container: typeof container === 'string' ? document.querySelector(container) : container
47572
47481
  });
47573
47482
  }
47574
47483
  }
47484
+ return function () {
47485
+ if (lazyId) removeStack(lazyId);
47486
+ };
47575
47487
  }, [src]);
47576
47488
  return {
47577
47489
  src: src,
@@ -65411,7 +65323,7 @@ var upload_interface = __webpack_require__(8821);
65411
65323
 
65412
65324
 
65413
65325
  /* harmony default export */ var src_0 = ({
65414
- version: '3.4.5-beta.5'
65326
+ version: '3.4.5-beta.6'
65415
65327
  });
65416
65328
  }();
65417
65329
  /******/ return __webpack_exports__;