@sheinx/base 3.1.15 → 3.1.16

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 (25) hide show
  1. package/cjs/card/card-header.d.ts.map +1 -1
  2. package/cjs/card/card-header.js +19 -9
  3. package/cjs/form/form-field.type.d.ts +1 -1
  4. package/cjs/form/form-field.type.d.ts.map +1 -1
  5. package/cjs/input/input-group.d.ts.map +1 -1
  6. package/cjs/input/input-group.js +4 -2
  7. package/cjs/input/input-group.type.d.ts +10 -0
  8. package/cjs/input/input-group.type.d.ts.map +1 -1
  9. package/cjs/input/input.type.d.ts +1 -0
  10. package/cjs/input/input.type.d.ts.map +1 -1
  11. package/cjs/sticky/sticky.d.ts.map +1 -1
  12. package/cjs/sticky/sticky.js +169 -104
  13. package/esm/card/card-header.d.ts.map +1 -1
  14. package/esm/card/card-header.js +19 -9
  15. package/esm/form/form-field.type.d.ts +1 -1
  16. package/esm/form/form-field.type.d.ts.map +1 -1
  17. package/esm/input/input-group.d.ts.map +1 -1
  18. package/esm/input/input-group.js +4 -2
  19. package/esm/input/input-group.type.d.ts +10 -0
  20. package/esm/input/input-group.type.d.ts.map +1 -1
  21. package/esm/input/input.type.d.ts +1 -0
  22. package/esm/input/input.type.d.ts.map +1 -1
  23. package/esm/sticky/sticky.d.ts.map +1 -1
  24. package/esm/sticky/sticky.js +170 -105
  25. package/package.json +2 -2
package/cjs/card/card-header.d.ts.map CHANGED
@@ -1 +1 @@
1
- {"version":3,"file":"card-header.d.ts","sourceRoot":"","sources":["card-header.tsx"],"names":[],"mappings":";AAMA,OAAO,KAAK,EAAE,eAAe,EAAE,MAAM,oBAAoB,CAAC;AAE1D,QAAA,MAAM,UAAU,UAAW,eAAe,gBAiDzC,CAAC;AAEF,eAAe,UAAU,CAAC"}
1
+ {"version":3,"file":"card-header.d.ts","sourceRoot":"","sources":["card-header.tsx"],"names":[],"mappings":";AAMA,OAAO,KAAK,EAAE,eAAe,EAAE,MAAM,oBAAoB,CAAC;AAE1D,QAAA,MAAM,UAAU,UAAW,eAAe,gBA6DzC,CAAC;AAEF,eAAe,UAAU,CAAC"}
package/cjs/card/card-header.js CHANGED
@@ -11,6 +11,12 @@ var _icons = _interopRequireDefault(require("../icons"));
11
11
  var _config = require("../config");
12
12
  var _jsxRuntime = require("react/jsx-runtime");
13
13
  function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
14
+ function _typeof(o) { "@babel/helpers - typeof"; return _typeof = "function" == typeof Symbol && "symbol" == typeof Symbol.iterator ? function (o) { return typeof o; } : function (o) { return o && "function" == typeof Symbol && o.constructor === Symbol && o !== Symbol.prototype ? "symbol" : typeof o; }, _typeof(o); }
15
+ function ownKeys(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbols) { var o = Object.getOwnPropertySymbols(e); r && (o = o.filter(function (r) { return Object.getOwnPropertyDescriptor(e, r).enumerable; })), t.push.apply(t, o); } return t; }
16
+ function _objectSpread(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys(Object(t), !0).forEach(function (r) { _defineProperty(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
17
+ function _defineProperty(obj, key, value) { key = _toPropertyKey(key); if (key in obj) { Object.defineProperty(obj, key, { value: value, enumerable: true, configurable: true, writable: true }); } else { obj[key] = value; } return obj; }
18
+ function _toPropertyKey(t) { var i = _toPrimitive(t, "string"); return "symbol" == _typeof(i) ? i : String(i); }
19
+ function _toPrimitive(t, r) { if ("object" != _typeof(t) || !t) return t; var e = t[Symbol.toPrimitive]; if (void 0 !== e) { var i = e.call(t, r || "default"); if ("object" != _typeof(i)) return i; throw new TypeError("@@toPrimitive must return a primitive value."); } return ("string" === r ? String : Number)(t); }
14
20
  var CardHeader = function CardHeader(props) {
15
21
  var _props$jssStyle, _props$jssStyle$card;
16
22
  var align = props.align;
@@ -33,18 +39,22 @@ var CardHeader = function CardHeader(props) {
33
39
  };
34
40
  var alignClass = (0, _classnames.default)(align === 'center' && (cardClasses === null || cardClasses === void 0 ? void 0 : cardClasses.center), align === 'right' && (cardClasses === null || cardClasses === void 0 ? void 0 : cardClasses.right));
35
41
  var headerContentClassName = (0, _classnames.default)(cardClasses === null || cardClasses === void 0 ? void 0 : cardClasses.headerContent, alignClass);
42
+ var commonHeaderProps = {
43
+ onMouseDown: handleDragMouseDown,
44
+ onClick: onCollapse,
45
+ style: props.style
46
+ };
36
47
  if (!props.extra && !collapsible) {
37
48
  var simpleHeaderClassName = (0, _classnames.default)(cardClasses === null || cardClasses === void 0 ? void 0 : cardClasses.header, cardClasses === null || cardClasses === void 0 ? void 0 : cardClasses.simpleHeader, alignClass, props.className);
38
- return /*#__PURE__*/(0, _jsxRuntime.jsx)("div", {
39
- className: simpleHeaderClassName,
49
+ return /*#__PURE__*/(0, _jsxRuntime.jsx)("div", _objectSpread(_objectSpread({
50
+ className: simpleHeaderClassName
51
+ }, commonHeaderProps), {}, {
40
52
  children: props.children
41
- });
53
+ }));
42
54
  }
43
- return /*#__PURE__*/(0, _jsxRuntime.jsxs)("div", {
44
- onMouseDown: handleDragMouseDown,
45
- onClick: onCollapse,
46
- className: (0, _classnames.default)(props.className, cardClasses === null || cardClasses === void 0 ? void 0 : cardClasses.header),
47
- style: props.style,
55
+ return /*#__PURE__*/(0, _jsxRuntime.jsxs)("div", _objectSpread(_objectSpread({
56
+ className: (0, _classnames.default)(props.className, cardClasses === null || cardClasses === void 0 ? void 0 : cardClasses.header)
57
+ }, commonHeaderProps), {}, {
48
58
  children: [renderIndicator(), /*#__PURE__*/(0, _jsxRuntime.jsx)("div", {
49
59
  className: headerContentClassName,
50
60
  children: props.children
@@ -52,6 +62,6 @@ var CardHeader = function CardHeader(props) {
52
62
  className: cardClasses === null || cardClasses === void 0 ? void 0 : cardClasses.headerExtra,
53
63
  children: props.extra
54
64
  })]
55
- });
65
+ }));
56
66
  };
57
67
  var _default = exports.default = CardHeader;
package/cjs/form/form-field.type.d.ts CHANGED
@@ -31,7 +31,7 @@ export interface FormFieldProps<T> extends Partial<BaseFormControlProps<T>> {
31
31
  * @cn 校验规则 详见 [Rule](/components/rule)
32
32
  * @override RuleItem[]
33
33
  */
34
- rules?: FormItemRule<T>;
34
+ rules?: FormItemRule<any>;
35
35
  /**
36
36
  * @en React components that support value and onChange or function. The function object attribute is as follows:
37
37
  * value: The value obtained from the parent Form or Form.Block by name.
package/cjs/form/form-field.type.d.ts.map CHANGED
@@ -1 +1 @@
1
- {"version":3,"file":"form-field.type.d.ts","sourceRoot":"","sources":["form-field.type.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAC;AAC1B,OAAO,EAAE,oBAAoB,EAAE,YAAY,EAAE,UAAU,EAAE,MAAM,eAAe,CAAC;AAE/E,MAAM,WAAW,iBAAiB,CAAC,CAAC;IAClC,KAAK,CAAC,EAAE,CAAC,CAAC;IACV,QAAQ,CAAC,EAAE,CAAC,KAAK,EAAE,CAAC,EAAE,GAAG,IAAI,EAAE,GAAG,KAAK,IAAI,CAAC;IAC5C,MAAM,CAAC,EAAE,OAAO,CAAC;IACjB,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,KAAK,CAAC,EAAE;QAAE,OAAO,CAAC,EAAE,MAAM,CAAA;KAAE,GAAG,MAAM,CAAC;CACvC;AAED,MAAM,MAAM,qBAAqB,CAAC,CAAC,IAAI,CAAC,KAAK,EAAE,iBAAiB,CAAC,CAAC,CAAC,KAAK,KAAK,CAAC,YAAY,CAAC;AAE3F,MAAM,WAAW,cAAc,CAAC,CAAC,CAAE,SAAQ,OAAO,CAAC,oBAAoB,CAAC,CAAC,CAAC,CAAC;IACzE;;;OAGG;IACH,IAAI,EAAE,MAAM,GAAG,MAAM,EAAE,CAAC;IACxB;;;OAGG;IACH,WAAW,CAAC,EAAE,OAAO,CAAC;IACtB;;;OAGG;IACH,YAAY,CAAC,EAAE,CAAC,CAAC;IACjB;;;;OAIG;IACH,KAAK,CAAC,EAAE,YAAY,CAAC,CAAC,CAAC,CAAC;IACxB;;;;;;;;;;;;;;OAcG;IACH,QAAQ,EACJ,KAAK,CAAC,YAAY,CAAC;QAAE,KAAK,CAAC,EAAE,GAAG,CAAC;QAAC,QAAQ,CAAC,EAAE,GAAG,CAAC;QAAC,CAAC,IAAI,EAAE,MAAM,GAAG,GAAG,CAAA;KAAE,CAAC,GACxE,qBAAqB,CAAC,CAAC,CAAC,CAAC;IAE7B;;OAEG;IACH,QAAQ,CAAC,EAAE,CAAC,KAAK,EAAE,CAAC,EAAE,GAAG,IAAI,EAAE,GAAG,KAAK,IAAI,CAAC;IAC5C;;;OAGG;IACH,OAAO,CAAC,EAAE,CAAC,KAAK,CAAC,EAAE,KAAK,KAAK,IAAI,CAAC;IAClC;;OAEG;IACH,gBAAgB,CAAC,EAAE,MAAM,UAAU,CAAC;CACrC"}
1
+ {"version":3,"file":"form-field.type.d.ts","sourceRoot":"","sources":["form-field.type.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAC;AAC1B,OAAO,EAAE,oBAAoB,EAAE,YAAY,EAAE,UAAU,EAAE,MAAM,eAAe,CAAC;AAE/E,MAAM,WAAW,iBAAiB,CAAC,CAAC;IAClC,KAAK,CAAC,EAAE,CAAC,CAAC;IACV,QAAQ,CAAC,EAAE,CAAC,KAAK,EAAE,CAAC,EAAE,GAAG,IAAI,EAAE,GAAG,KAAK,IAAI,CAAC;IAC5C,MAAM,CAAC,EAAE,OAAO,CAAC;IACjB,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,KAAK,CAAC,EAAE;QAAE,OAAO,CAAC,EAAE,MAAM,CAAA;KAAE,GAAG,MAAM,CAAC;CACvC;AAED,MAAM,MAAM,qBAAqB,CAAC,CAAC,IAAI,CAAC,KAAK,EAAE,iBAAiB,CAAC,CAAC,CAAC,KAAK,KAAK,CAAC,YAAY,CAAC;AAE3F,MAAM,WAAW,cAAc,CAAC,CAAC,CAAE,SAAQ,OAAO,CAAC,oBAAoB,CAAC,CAAC,CAAC,CAAC;IACzE;;;OAGG;IACH,IAAI,EAAE,MAAM,GAAG,MAAM,EAAE,CAAC;IACxB;;;OAGG;IACH,WAAW,CAAC,EAAE,OAAO,CAAC;IACtB;;;OAGG;IACH,YAAY,CAAC,EAAE,CAAC,CAAC;IACjB;;;;OAIG;IACH,KAAK,CAAC,EAAE,YAAY,CAAC,GAAG,CAAC,CAAC;IAC1B;;;;;;;;;;;;;;OAcG;IACH,QAAQ,EACJ,KAAK,CAAC,YAAY,CAAC;QAAE,KAAK,CAAC,EAAE,GAAG,CAAC;QAAC,QAAQ,CAAC,EAAE,GAAG,CAAC;QAAC,CAAC,IAAI,EAAE,MAAM,GAAG,GAAG,CAAA;KAAE,CAAC,GACxE,qBAAqB,CAAC,CAAC,CAAC,CAAC;IAE7B;;OAEG;IACH,QAAQ,CAAC,EAAE,CAAC,KAAK,EAAE,CAAC,EAAE,GAAG,IAAI,EAAE,GAAG,KAAK,IAAI,CAAC;IAC5C;;;OAGG;IACH,OAAO,CAAC,EAAE,CAAC,KAAK,CAAC,EAAE,KAAK,KAAK,IAAI,CAAC;IAClC;;OAEG;IACH,gBAAgB,CAAC,EAAE,MAAM,UAAU,CAAC;CACrC"}
package/cjs/input/input-group.d.ts.map CHANGED
@@ -1 +1 @@
1
- {"version":3,"file":"input-group.d.ts","sourceRoot":"","sources":["input-group.tsx"],"names":[],"mappings":";AAIA,OAAO,EAAE,eAAe,EAAE,MAAM,oBAAoB,CAAC;gCAK9B,eAAe;AAAtC,wBA6DE"}
1
+ {"version":3,"file":"input-group.d.ts","sourceRoot":"","sources":["input-group.tsx"],"names":[],"mappings":";AAIA,OAAO,EAAE,eAAe,EAAE,MAAM,oBAAoB,CAAC;gCAK9B,eAAe;AAAtC,wBA8DE"}
package/cjs/input/input-group.js CHANGED
@@ -41,7 +41,9 @@ var _default = exports.default = function _default(props) {
41
41
  });
42
42
  var _useWithFormConfig = (0, _useWithFormConfig2.default)(props),
43
43
  size = _useWithFormConfig.size,
44
- disabled = _useWithFormConfig.disabled;
44
+ disabled = _useWithFormConfig.disabled,
45
+ status = _useWithFormConfig.status,
46
+ error = _useWithFormConfig.error;
45
47
  var getProps = function getProps(child) {
46
48
  ref.current.propsMap.set(child, {
47
49
  onFocus: child.props.onFocus,
@@ -73,7 +75,7 @@ var _default = exports.default = function _default(props) {
73
75
  className = props.className,
74
76
  width = props.width,
75
77
  style = props.style;
76
- var rootClass = (0, _classnames.default)(className, inputStyle === null || inputStyle === void 0 ? void 0 : inputStyle.group, size === 'small' && (inputStyle === null || inputStyle === void 0 ? void 0 : inputStyle.groupSmall), size === 'large' && (inputStyle === null || inputStyle === void 0 ? void 0 : inputStyle.groupLarge), !!disabled && (inputStyle === null || inputStyle === void 0 ? void 0 : inputStyle.groupDisabled), !!focus && (inputStyle === null || inputStyle === void 0 ? void 0 : inputStyle.groupFocus));
78
+ var rootClass = (0, _classnames.default)(className, inputStyle === null || inputStyle === void 0 ? void 0 : inputStyle.group, size === 'small' && (inputStyle === null || inputStyle === void 0 ? void 0 : inputStyle.groupSmall), size === 'large' && (inputStyle === null || inputStyle === void 0 ? void 0 : inputStyle.groupLarge), !!disabled && (inputStyle === null || inputStyle === void 0 ? void 0 : inputStyle.groupDisabled), !!focus && (inputStyle === null || inputStyle === void 0 ? void 0 : inputStyle.groupFocus), (status === 'error' || error) && (inputStyle === null || inputStyle === void 0 ? void 0 : inputStyle.groupError));
77
79
  return /*#__PURE__*/(0, _jsxRuntime.jsx)("div", _objectSpread(_objectSpread({}, _hooks.util.getDataAttribute({
78
80
  role: 'input-group'
79
81
  })), {}, {
package/cjs/input/input-group.type.d.ts CHANGED
@@ -1,6 +1,7 @@
1
1
  import * as React from 'react';
2
2
  import { ReactNode } from 'react';
3
3
  import { InputStyle } from './input.type';
4
+ import { CommonType } from '../common/type';
4
5
  export interface InputGroupProps {
5
6
  children?: ReactNode;
6
7
  className?: string;
@@ -9,5 +10,14 @@ export interface InputGroupProps {
9
10
  size?: 'small' | 'large' | 'default';
10
11
  disabled?: boolean;
11
12
  jssStyle: InputStyle;
13
+ /**
14
+ * @cn 错误信息
15
+ * @en error message
16
+ * @private 内部属性
17
+ */
18
+ error?: string | {
19
+ message?: string;
20
+ };
21
+ status?: CommonType['status'];
12
22
  }
13
23
  //# sourceMappingURL=input-group.type.d.ts.map
package/cjs/input/input-group.type.d.ts.map CHANGED
@@ -1 +1 @@
1
- {"version":3,"file":"input-group.type.d.ts","sourceRoot":"","sources":["input-group.type.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAC/B,OAAO,EAAE,SAAS,EAAE,MAAM,OAAO,CAAC;AAClC,OAAO,EAAE,UAAU,EAAE,MAAM,cAAc,CAAC;AAE1C,MAAM,WAAW,eAAe;IAC9B,QAAQ,CAAC,EAAE,SAAS,CAAC;IACrB,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,KAAK,CAAC,EAAE,MAAM,GAAG,MAAM,CAAC;IACxB,KAAK,CAAC,EAAE,KAAK,CAAC,aAAa,CAAC;IAC5B,IAAI,CAAC,EAAE,OAAO,GAAG,OAAO,GAAG,SAAS,CAAC;IACrC,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,QAAQ,EAAE,UAAU,CAAC;CACtB"}
1
+ {"version":3,"file":"input-group.type.d.ts","sourceRoot":"","sources":["input-group.type.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAC/B,OAAO,EAAE,SAAS,EAAE,MAAM,OAAO,CAAC;AAClC,OAAO,EAAE,UAAU,EAAE,MAAM,cAAc,CAAC;AAC1C,OAAO,EAAE,UAAU,EAAE,MAAM,gBAAgB,CAAC;AAE5C,MAAM,WAAW,eAAe;IAC9B,QAAQ,CAAC,EAAE,SAAS,CAAC;IACrB,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,KAAK,CAAC,EAAE,MAAM,GAAG,MAAM,CAAC;IACxB,KAAK,CAAC,EAAE,KAAK,CAAC,aAAa,CAAC;IAC5B,IAAI,CAAC,EAAE,OAAO,GAAG,OAAO,GAAG,SAAS,CAAC;IACrC,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,QAAQ,EAAE,UAAU,CAAC;IACrB;;;;OAIG;IACH,KAAK,CAAC,EAAE,MAAM,GAAG;QAAE,OAAO,CAAC,EAAE,MAAM,CAAA;KAAE,CAAC;IACtC,MAAM,CAAC,EAAE,UAAU,CAAC,QAAQ,CAAC,CAAC;CAC/B"}
package/cjs/input/input.type.d.ts CHANGED
@@ -40,6 +40,7 @@ export interface InputClasses {
40
40
  groupLarge: string;
41
41
  groupFocus: string;
42
42
  groupDisabled: string;
43
+ groupError: string;
43
44
  wrapperNumber: string;
44
45
  numberStep: string;
45
46
  passwordToggle: string;
package/cjs/input/input.type.d.ts.map CHANGED
@@ -1 +1 @@
1
- {"version":3,"file":"input.type.d.ts","sourceRoot":"","sources":["input.type.ts"],"names":[],"mappings":"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"}
1
+ {"version":3,"file":"input.type.d.ts","sourceRoot":"","sources":["input.type.ts"],"names":[],"mappings":"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"}
package/cjs/sticky/sticky.d.ts.map CHANGED
@@ -1 +1 @@
1
- {"version":3,"file":"sticky.d.ts","sourceRoot":"","sources":["sticky.tsx"],"names":[],"mappings":";AAGA,OAAO,EAAE,WAAW,EAAE,MAAM,eAAe,CAAC;AAuB5C,QAAA,MAAM,MAAM,UAAW,WAAW,gBAqTjC,CAAC;AAEF,eAAe,MAAM,CAAC"}
1
+ {"version":3,"file":"sticky.d.ts","sourceRoot":"","sources":["sticky.tsx"],"names":[],"mappings":";AAGA,OAAO,EAAE,WAAW,EAAE,MAAM,eAAe,CAAC;AAuB5C,QAAA,MAAM,MAAM,UAAW,WAAW,gBA2XjC,CAAC;AAEF,eAAe,MAAM,CAAC"}
package/cjs/sticky/sticky.js CHANGED
@@ -47,14 +47,16 @@ var Sticky = function Sticky(props) {
47
47
  var children = props.children,
48
48
  top = props.top,
49
49
  bottom = props.bottom;
50
- var css = props.css || props.target;
50
+ // 是否使用css sticky
51
+ var css = (props.css || props.target) && supportSticky;
52
+ var forceUpdate = (0, _hooks.useRender)();
51
53
  var _useRef = (0, _react.useRef)({
52
54
  target: null,
53
55
  div: null,
54
- observer: null,
56
+ position: '',
57
+ targetObserver: null,
55
58
  parentObserver: null,
56
- isTop: false,
57
- bodyObserver: null
59
+ fixedObserver: null
58
60
  }),
59
61
  context = _useRef.current;
60
62
  var _useState = (0, _react.useState)({}),
@@ -69,7 +71,6 @@ var Sticky = function Sticky(props) {
69
71
  _useState6 = _slicedToArray(_useState5, 2),
70
72
  parentVisible = _useState6[0],
71
73
  setParentVisible = _useState6[1];
72
- var forceRender = (0, _hooks.useRender)();
73
74
  var elementRef = (0, _react.useRef)(null);
74
75
  var getTarget = function getTarget() {
75
76
  var scrollContainer = props.scrollContainer;
@@ -82,19 +83,17 @@ var Sticky = function Sticky(props) {
82
83
  }
83
84
  return null;
84
85
  };
86
+
87
+ // window resize 时需要重新计算底部附着的位置
85
88
  var updateStyle = (0, _hooks.usePersistFn)(function () {
86
- if (context.div && !context.isTop && show) {
89
+ if (context.div && context.position === 'bottom' && show) {
87
90
  var scrollRect = context.target.getBoundingClientRect();
88
91
  var targetRect = elementRef.current.getBoundingClientRect();
89
92
  var targetLeft = targetRect.left;
90
- var width = targetRect.width,
91
- height = targetRect.height;
92
93
  if (typeof bottom === 'number') {
93
94
  var outRootRect = context.target.getBoundingClientRect();
94
95
  var _style = {
95
96
  position: 'absolute',
96
- width: "".concat(width, "px"),
97
- height: "".concat(height, "px"),
98
97
  top: "".concat(scrollRect.bottom - (props.bottom || 0) - outRootRect.top, "px"),
99
98
  left: "".concat(targetLeft - outRootRect.left, "px"),
100
99
  transform: 'translateY(-100%)'
@@ -103,6 +102,8 @@ var Sticky = function Sticky(props) {
103
102
  }
104
103
  }
105
104
  });
105
+
106
+ // 有滚动容器时的定位
106
107
  var handleTargetPosition = (0, _hooks.usePersistFn)(function (entries) {
107
108
  var entry = entries[0];
108
109
  var scrollRect = entry.rootBounds;
@@ -110,17 +111,13 @@ var Sticky = function Sticky(props) {
110
111
  if (!entry.isIntersecting) {
111
112
  var targetLeft = targetRect.left;
112
113
  var outRootRect = context.div.getBoundingClientRect();
113
- var width = targetRect.width,
114
- height = targetRect.height;
115
114
  if (scrollRect && targetRect.bottom < scrollRect.bottom) {
116
115
  // top in
117
- context.isTop = true;
116
+ context.position = 'top';
118
117
  if (typeof top === 'number') {
119
118
  setShow(true);
120
119
  var _style2 = {
121
120
  position: 'absolute',
122
- width: "".concat(width, "px"),
123
- height: "".concat(height, "px"),
124
121
  top: "".concat(scrollRect.top - outRootRect.top, "px"),
125
122
  left: "".concat(targetLeft - outRootRect.left, "px")
126
123
  };
@@ -128,16 +125,13 @@ var Sticky = function Sticky(props) {
128
125
  }
129
126
  } else if (scrollRect) {
130
127
  // bottom in
131
- context.isTop = false;
128
+ context.position = 'bottom';
132
129
  if (typeof bottom === 'number') {
133
130
  setShow(true);
134
- var _outRootRect = context.target.getBoundingClientRect();
135
131
  var _style3 = {
136
132
  position: 'absolute',
137
- width: "".concat(width, "px"),
138
- height: "".concat(height, "px"),
139
- top: "".concat(scrollRect.bottom - _outRootRect.top, "px"),
140
- left: "".concat(targetLeft - _outRootRect.left, "px"),
133
+ top: "".concat(scrollRect.bottom - outRootRect.top, "px"),
134
+ left: "".concat(targetLeft - outRootRect.left, "px"),
141
135
  transform: 'translateY(-100%)'
142
136
  };
143
137
  setStyle(_style3);
@@ -146,8 +140,11 @@ var Sticky = function Sticky(props) {
146
140
  }
147
141
  if (entry.isIntersecting) {
148
142
  setShow(false);
143
+ context.position = '';
149
144
  }
150
145
  });
146
+
147
+ // 父元素是否可见
151
148
  var handleParentVisible = (0, _hooks.usePersistFn)(function (entries) {
152
149
  var entry = entries[0];
153
150
  if (entry.isIntersecting) {
@@ -156,83 +153,118 @@ var Sticky = function Sticky(props) {
156
153
  setParentVisible(false);
157
154
  }
158
155
  });
156
+ var setFixedStyle = (0, _hooks.usePersistFn)(function (s, m) {
157
+ var l = arguments.length > 2 && arguments[2] !== undefined ? arguments[2] : 0;
158
+ if (s !== show) {
159
+ setShow(s);
160
+ }
161
+ if (s && m) {
162
+ var newStyle = _defineProperty(_defineProperty({
163
+ position: 'fixed'
164
+ }, m, m === 'top' ? top : bottom), "left", l);
165
+ if (!_hooks.util.shallowEqual(style, newStyle)) {
166
+ setStyle(newStyle);
167
+ }
168
+ }
169
+ });
170
+
171
+ // 无滚动容器的时候，body 滚动 resize 计算
159
172
  var handleFixedPosition = (0, _hooks.usePersistFn)(function () {
173
+ if (css || context.target) return;
160
174
  var element = elementRef.current;
175
+ if (!parentVisible) {
176
+ setFixedStyle(false);
177
+ return;
178
+ }
161
179
  if (!element) return;
162
180
  var selfRect = element.getBoundingClientRect();
163
181
  if (selfRect === null) return;
164
182
  // If the element is hidden, the width and height will be 0
165
183
  if (selfRect && selfRect.width === 0 && selfRect.height === 0) return;
166
- // const { marginBottom, marginTop } = getComputedStyle(element);
167
- // selfRect.height += parseFloat(marginBottom) + parseFloat(marginTop);
168
- var scrollElement = document.body;
169
- var scrollRect = scrollElement.getBoundingClientRect();
184
+ var scrollRect = document.body.getBoundingClientRect();
170
185
  var top = props.top,
171
186
  bottom = props.bottom;
172
187
  if (top !== undefined && Math.ceil(selfRect.top) <= top) {
173
- setShow(true);
174
- setStyle({
175
- position: 'fixed',
176
- top: top,
177
- left: "".concat(selfRect.left, "px"),
178
- width: "".concat(selfRect.width, "px")
179
- });
188
+ setFixedStyle(true, 'top', selfRect.left);
180
189
  return;
181
190
  } else if (bottom !== undefined && Math.ceil(selfRect.bottom) + bottom > scrollRect.bottom) {
182
- setShow(true);
183
- setStyle({
184
- position: 'fixed',
185
- bottom: bottom,
186
- left: "".concat(selfRect.left, "px"),
187
- width: "".concat(selfRect.width, "px")
188
- });
191
+ setFixedStyle(true, 'bottom', selfRect.left);
189
192
  return;
190
193
  } else {
191
- setShow(false);
194
+ setFixedStyle(false);
195
+ }
196
+ });
197
+
198
+ // 无滚动容器时内滚场景触发
199
+ var handleFixedInter = (0, _hooks.usePersistFn)(function (entries) {
200
+ if (!parentVisible) {
201
+ setFixedStyle(false);
202
+ return;
203
+ }
204
+ var entry = entries[0];
205
+ var scrollRect = entry.rootBounds;
206
+ var targetRect = entry.boundingClientRect;
207
+ if (scrollRect && scrollRect.top === 0 && scrollRect.bottom === 0) {
208
+ return;
209
+ }
210
+ if (!entry.isIntersecting) {
211
+ var targetLeft = targetRect.left;
212
+ var outRootRect = document.body.getBoundingClientRect();
213
+ if (scrollRect && targetRect.bottom < scrollRect.bottom) {
214
+ // top in
215
+ if (typeof top === 'number') {
216
+ setFixedStyle(true, 'top', targetLeft - outRootRect.left);
217
+ }
218
+ } else if (scrollRect) {
219
+ // bottom in
220
+ if (typeof bottom === 'number') {
221
+ setFixedStyle(true, 'bottom', targetLeft - outRootRect.left);
222
+ }
223
+ }
224
+ }
225
+ if (entry.isIntersecting) {
226
+ setFixedStyle(false);
192
227
  }
193
228
  });
194
229
  var elementSize = (0, _hooks.useResize)({
195
230
  targetRef: elementRef,
196
- timer: 0,
231
+ timer: 10,
197
232
  cb: handleFixedPosition
198
233
  });
199
- var createBodyObserver = function createBodyObserver() {
200
- if (context.bodyObserver) {
201
- context.bodyObserver.disconnect();
234
+ var cancelFixedObserver = function cancelFixedObserver() {
235
+ if (context.fixedObserver) {
236
+ context.fixedObserver.disconnect();
237
+ context.fixedObserver = null;
202
238
  }
203
- context.bodyObserver = new IntersectionObserver(handleFixedPosition, {
239
+ };
240
+ var createFixedObserver = function createFixedObserver() {
241
+ cancelFixedObserver();
242
+ context.fixedObserver = new IntersectionObserver(handleFixedInter, {
204
243
  root: null,
205
244
  rootMargin: "-".concat(top || 0, "px 0px -").concat(bottom || 0, "px 0px"),
206
245
  threshold: 1.0
207
246
  });
208
- context.bodyObserver.observe(elementRef.current);
209
247
  };
210
248
  var cancelObserver = function cancelObserver() {
211
- if (context.observer) {
212
- context.observer.disconnect();
213
- context.observer = null;
214
- }
215
- if (context.parentObserver) {
216
- context.parentObserver.disconnect();
217
- context.parentObserver = null;
249
+ if (context.targetObserver) {
250
+ context.targetObserver.disconnect();
251
+ context.targetObserver = null;
218
252
  }
219
253
  };
220
- var createObserver = function createObserver(target) {
254
+ var createObserver = function createObserver() {
221
255
  if (!context.div) {
222
256
  context.div = document.createElement('div');
223
257
  context.div.style.position = 'relative';
224
258
  }
225
- if (target) {
226
- forceRender();
227
- cancelObserver();
259
+ if (context.target) {
228
260
  if (context.div) {
229
261
  // append div
230
- if (target === document.body) {
231
- document.body.appendChild(context.div);
262
+ if (context.target === document.body) {
263
+ document.body.insertBefore(context.div, document.body.firstChild);
232
264
  } else {
233
- target.parentNode.insertBefore(context.div, target);
265
+ context.target.parentNode.insertBefore(context.div, context.target);
234
266
  }
235
- var _style4 = window.getComputedStyle(target);
267
+ var _style4 = window.getComputedStyle(context.target);
236
268
  if (_style4.position === 'absolute' || _style4.position === 'fixed') {
237
269
  context.div.style.position = _style4.position;
238
270
  context.div.style.top = _style4.top;
@@ -241,76 +273,109 @@ var Sticky = function Sticky(props) {
241
273
  context.div.style.bottom = _style4.bottom;
242
274
  }
243
275
  }
276
+ cancelFixedObserver();
244
277
  if (window.IntersectionObserver) {
245
278
  var observer = new IntersectionObserver(handleTargetPosition, {
246
- root: target,
279
+ root: context.target,
247
280
  rootMargin: "-".concat(top || 0, "px 0px -").concat(bottom || 0, "px 0px"),
248
281
  threshold: 1.0
249
282
  });
250
- context.observer = observer;
251
- context.parentObserver = new IntersectionObserver(handleParentVisible, {
252
- root: target,
253
- rootMargin: "-".concat(top || 0, "px 0px -").concat(bottom || 0, "px 0px"),
254
- threshold: 0
255
- });
283
+ context.targetObserver = observer;
256
284
  }
257
285
  }
258
286
  };
287
+ var cancelParentObserver = function cancelParentObserver() {
288
+ if (context.parentObserver) {
289
+ context.parentObserver.disconnect();
290
+ context.parentObserver = null;
291
+ }
292
+ };
293
+ var createParentObserver = function createParentObserver() {
294
+ if (!props.parent) return;
295
+ cancelParentObserver();
296
+ context.parentObserver = new IntersectionObserver(handleParentVisible, {
297
+ root: context.target,
298
+ rootMargin: "-".concat(top || 0, "px 0px -").concat(bottom || 0, "px 0px"),
299
+ threshold: 0
300
+ });
301
+ context.parentObserver.observe(props.parent);
302
+ };
303
+
304
+ // 存在滚动容器时的定位
305
+ var createTargetEvents = function createTargetEvents() {
306
+ createObserver();
307
+ window.addEventListener('resize', updateStyle);
308
+ };
309
+ var cancelTargetEvents = function cancelTargetEvents() {
310
+ cancelObserver();
311
+ window.removeEventListener('resize', updateStyle);
312
+ if (context.div) {
313
+ context.div.remove();
314
+ context.div = null;
315
+ }
316
+ };
317
+ var createFixedEvents = function createFixedEvents() {
318
+ createFixedObserver();
319
+ events.forEach(function (event) {
320
+ window.addEventListener(event, handleFixedPosition);
321
+ });
322
+ };
323
+ var cancelFixedEvents = function cancelFixedEvents() {
324
+ cancelFixedObserver();
325
+ events.forEach(function (event) {
326
+ window.removeEventListener(event, handleFixedPosition);
327
+ });
328
+ };
259
329
  var handleElementRef = function handleElementRef(el) {
260
330
  if (el) {
261
331
  elementRef.current = el;
262
- if (el && context.observer) {
263
- context.observer.observe(el);
332
+ if (context.targetObserver) {
333
+ if (!el) {
334
+ context.targetObserver.disconnect();
335
+ } else {
336
+ context.targetObserver.observe(el);
337
+ }
338
+ }
339
+ if (context.fixedObserver) {
340
+ if (!el) {
341
+ context.fixedObserver.disconnect();
342
+ } else {
343
+ context.fixedObserver.observe(el);
344
+ }
264
345
  }
265
346
  }
266
347
  };
267
- (0, _react.useEffect)(function () {
348
+ (0, _react.useLayoutEffect)(function () {
268
349
  if (css) return;
269
350
  var target = getTarget();
270
- context.target = target;
271
- if (target) {
272
- createObserver(target);
273
- window.addEventListener('resize', updateStyle);
274
- return function () {
275
- cancelObserver();
276
- window.removeEventListener('resize', updateStyle);
277
- if (context.div) {
278
- context.div.remove();
279
- }
280
- };
351
+ if (context.target !== target) {
352
+ context.target = target;
353
+ forceUpdate();
354
+ }
355
+ if (context.target) {
356
+ createTargetEvents();
357
+ return cancelTargetEvents;
281
358
  } else {
282
359
  // fixed 布局
283
- createBodyObserver();
284
- events.forEach(function (event) {
285
- window.addEventListener(event, handleFixedPosition);
286
- });
287
- return function () {
288
- if (context.bodyObserver) {
289
- context.bodyObserver.disconnect();
290
- }
291
- events.forEach(function (event) {
292
- window.removeEventListener(event, handleFixedPosition);
293
- });
294
- };
360
+ createFixedEvents();
361
+ return cancelFixedEvents;
295
362
  }
296
- }, [css]);
297
- (0, _react.useEffect)(function () {
298
- if (props.parent && context.parentObserver) {
363
+ }, [css, top, bottom]);
364
+ (0, _react.useLayoutEffect)(function () {
365
+ if (props.parent && !css) {
366
+ // createParentObserver 用到context.target
367
+ createParentObserver();
299
368
  context.parentObserver.observe(props.parent);
300
369
  }
301
- return function () {
302
- if (context.parentObserver) {
303
- context.parentObserver.disconnect();
304
- }
305
- };
306
- }, [props.parent]);
370
+ return cancelParentObserver;
371
+ }, [props.parent, css, context.target, top, bottom]);
307
372
 
308
373
  // 纯css方法 直接使用css
309
374
  // js方法
310
375
  // 1. 不指定滚动容器 基于document.body 使用fixed + js计算
311
376
  // 2. 指定滚动容器 在滚动容器上方插入一个dom占位 基于该dom渲染和定位
312
377
  // 3. 使用 intersectionObserver 来判断是否需要sticky
313
- if (css && supportSticky) {
378
+ if (css) {
314
379
  return /*#__PURE__*/(0, _jsxRuntime.jsx)("div", {
315
380
  className: props.className,
316
381
  style: _objectSpread(_objectSpread({
package/esm/card/card-header.d.ts.map CHANGED
@@ -1 +1 @@
1
- {"version":3,"file":"card-header.d.ts","sourceRoot":"","sources":["card-header.tsx"],"names":[],"mappings":";AAMA,OAAO,KAAK,EAAE,eAAe,EAAE,MAAM,oBAAoB,CAAC;AAE1D,QAAA,MAAM,UAAU,UAAW,eAAe,gBAiDzC,CAAC;AAEF,eAAe,UAAU,CAAC"}
1
+ {"version":3,"file":"card-header.d.ts","sourceRoot":"","sources":["card-header.tsx"],"names":[],"mappings":";AAMA,OAAO,KAAK,EAAE,eAAe,EAAE,MAAM,oBAAoB,CAAC;AAE1D,QAAA,MAAM,UAAU,UAAW,eAAe,gBA6DzC,CAAC;AAEF,eAAe,UAAU,CAAC"}
package/esm/card/card-header.js CHANGED
@@ -1,3 +1,9 @@
1
+ function _typeof(o) { "@babel/helpers - typeof"; return _typeof = "function" == typeof Symbol && "symbol" == typeof Symbol.iterator ? function (o) { return typeof o; } : function (o) { return o && "function" == typeof Symbol && o.constructor === Symbol && o !== Symbol.prototype ? "symbol" : typeof o; }, _typeof(o); }
2
+ function ownKeys(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbols) { var o = Object.getOwnPropertySymbols(e); r && (o = o.filter(function (r) { return Object.getOwnPropertyDescriptor(e, r).enumerable; })), t.push.apply(t, o); } return t; }
3
+ function _objectSpread(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys(Object(t), !0).forEach(function (r) { _defineProperty(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
4
+ function _defineProperty(obj, key, value) { key = _toPropertyKey(key); if (key in obj) { Object.defineProperty(obj, key, { value: value, enumerable: true, configurable: true, writable: true }); } else { obj[key] = value; } return obj; }
5
+ function _toPropertyKey(t) { var i = _toPrimitive(t, "string"); return "symbol" == _typeof(i) ? i : String(i); }
6
+ function _toPrimitive(t, r) { if ("object" != _typeof(t) || !t) return t; var e = t[Symbol.toPrimitive]; if (void 0 !== e) { var i = e.call(t, r || "default"); if ("object" != _typeof(i)) return i; throw new TypeError("@@toPrimitive must return a primitive value."); } return ("string" === r ? String : Number)(t); }
1
7
  import classNames from 'classnames';
2
8
  import { CardContext } from "./card.context";
3
9
  import { useContext } from 'react';
@@ -27,18 +33,22 @@ var CardHeader = function CardHeader(props) {
27
33
  };
28
34
  var alignClass = classNames(align === 'center' && (cardClasses === null || cardClasses === void 0 ? void 0 : cardClasses.center), align === 'right' && (cardClasses === null || cardClasses === void 0 ? void 0 : cardClasses.right));
29
35
  var headerContentClassName = classNames(cardClasses === null || cardClasses === void 0 ? void 0 : cardClasses.headerContent, alignClass);
36
+ var commonHeaderProps = {
37
+ onMouseDown: handleDragMouseDown,
38
+ onClick: onCollapse,
39
+ style: props.style
40
+ };
30
41
  if (!props.extra && !collapsible) {
31
42
  var simpleHeaderClassName = classNames(cardClasses === null || cardClasses === void 0 ? void 0 : cardClasses.header, cardClasses === null || cardClasses === void 0 ? void 0 : cardClasses.simpleHeader, alignClass, props.className);
32
- return /*#__PURE__*/_jsx("div", {
33
- className: simpleHeaderClassName,
43
+ return /*#__PURE__*/_jsx("div", _objectSpread(_objectSpread({
44
+ className: simpleHeaderClassName
45
+ }, commonHeaderProps), {}, {
34
46
  children: props.children
35
- });
47
+ }));
36
48
  }
37
- return /*#__PURE__*/_jsxs("div", {
38
- onMouseDown: handleDragMouseDown,
39
- onClick: onCollapse,
40
- className: classNames(props.className, cardClasses === null || cardClasses === void 0 ? void 0 : cardClasses.header),
41
- style: props.style,
49
+ return /*#__PURE__*/_jsxs("div", _objectSpread(_objectSpread({
50
+ className: classNames(props.className, cardClasses === null || cardClasses === void 0 ? void 0 : cardClasses.header)
51
+ }, commonHeaderProps), {}, {
42
52
  children: [renderIndicator(), /*#__PURE__*/_jsx("div", {
43
53
  className: headerContentClassName,
44
54
  children: props.children
@@ -46,6 +56,6 @@ var CardHeader = function CardHeader(props) {
46
56
  className: cardClasses === null || cardClasses === void 0 ? void 0 : cardClasses.headerExtra,
47
57
  children: props.extra
48
58
  })]
49
- });
59
+ }));
50
60
  };
51
61
  export default CardHeader;
package/esm/form/form-field.type.d.ts CHANGED
@@ -31,7 +31,7 @@ export interface FormFieldProps<T> extends Partial<BaseFormControlProps<T>> {
31
31
  * @cn 校验规则 详见 [Rule](/components/rule)
32
32
  * @override RuleItem[]
33
33
  */
34
- rules?: FormItemRule<T>;
34
+ rules?: FormItemRule<any>;
35
35
  /**
36
36
  * @en React components that support value and onChange or function. The function object attribute is as follows:
37
37
  * value: The value obtained from the parent Form or Form.Block by name.
package/esm/form/form-field.type.d.ts.map CHANGED
@@ -1 +1 @@
1
- {"version":3,"file":"form-field.type.d.ts","sourceRoot":"","sources":["form-field.type.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAC;AAC1B,OAAO,EAAE,oBAAoB,EAAE,YAAY,EAAE,UAAU,EAAE,MAAM,eAAe,CAAC;AAE/E,MAAM,WAAW,iBAAiB,CAAC,CAAC;IAClC,KAAK,CAAC,EAAE,CAAC,CAAC;IACV,QAAQ,CAAC,EAAE,CAAC,KAAK,EAAE,CAAC,EAAE,GAAG,IAAI,EAAE,GAAG,KAAK,IAAI,CAAC;IAC5C,MAAM,CAAC,EAAE,OAAO,CAAC;IACjB,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,KAAK,CAAC,EAAE;QAAE,OAAO,CAAC,EAAE,MAAM,CAAA;KAAE,GAAG,MAAM,CAAC;CACvC;AAED,MAAM,MAAM,qBAAqB,CAAC,CAAC,IAAI,CAAC,KAAK,EAAE,iBAAiB,CAAC,CAAC,CAAC,KAAK,KAAK,CAAC,YAAY,CAAC;AAE3F,MAAM,WAAW,cAAc,CAAC,CAAC,CAAE,SAAQ,OAAO,CAAC,oBAAoB,CAAC,CAAC,CAAC,CAAC;IACzE;;;OAGG;IACH,IAAI,EAAE,MAAM,GAAG,MAAM,EAAE,CAAC;IACxB;;;OAGG;IACH,WAAW,CAAC,EAAE,OAAO,CAAC;IACtB;;;OAGG;IACH,YAAY,CAAC,EAAE,CAAC,CAAC;IACjB;;;;OAIG;IACH,KAAK,CAAC,EAAE,YAAY,CAAC,CAAC,CAAC,CAAC;IACxB;;;;;;;;;;;;;;OAcG;IACH,QAAQ,EACJ,KAAK,CAAC,YAAY,CAAC;QAAE,KAAK,CAAC,EAAE,GAAG,CAAC;QAAC,QAAQ,CAAC,EAAE,GAAG,CAAC;QAAC,CAAC,IAAI,EAAE,MAAM,GAAG,GAAG,CAAA;KAAE,CAAC,GACxE,qBAAqB,CAAC,CAAC,CAAC,CAAC;IAE7B;;OAEG;IACH,QAAQ,CAAC,EAAE,CAAC,KAAK,EAAE,CAAC,EAAE,GAAG,IAAI,EAAE,GAAG,KAAK,IAAI,CAAC;IAC5C;;;OAGG;IACH,OAAO,CAAC,EAAE,CAAC,KAAK,CAAC,EAAE,KAAK,KAAK,IAAI,CAAC;IAClC;;OAEG;IACH,gBAAgB,CAAC,EAAE,MAAM,UAAU,CAAC;CACrC"}
1
+ {"version":3,"file":"form-field.type.d.ts","sourceRoot":"","sources":["form-field.type.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAC;AAC1B,OAAO,EAAE,oBAAoB,EAAE,YAAY,EAAE,UAAU,EAAE,MAAM,eAAe,CAAC;AAE/E,MAAM,WAAW,iBAAiB,CAAC,CAAC;IAClC,KAAK,CAAC,EAAE,CAAC,CAAC;IACV,QAAQ,CAAC,EAAE,CAAC,KAAK,EAAE,CAAC,EAAE,GAAG,IAAI,EAAE,GAAG,KAAK,IAAI,CAAC;IAC5C,MAAM,CAAC,EAAE,OAAO,CAAC;IACjB,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,KAAK,CAAC,EAAE;QAAE,OAAO,CAAC,EAAE,MAAM,CAAA;KAAE,GAAG,MAAM,CAAC;CACvC;AAED,MAAM,MAAM,qBAAqB,CAAC,CAAC,IAAI,CAAC,KAAK,EAAE,iBAAiB,CAAC,CAAC,CAAC,KAAK,KAAK,CAAC,YAAY,CAAC;AAE3F,MAAM,WAAW,cAAc,CAAC,CAAC,CAAE,SAAQ,OAAO,CAAC,oBAAoB,CAAC,CAAC,CAAC,CAAC;IACzE;;;OAGG;IACH,IAAI,EAAE,MAAM,GAAG,MAAM,EAAE,CAAC;IACxB;;;OAGG;IACH,WAAW,CAAC,EAAE,OAAO,CAAC;IACtB;;;OAGG;IACH,YAAY,CAAC,EAAE,CAAC,CAAC;IACjB;;;;OAIG;IACH,KAAK,CAAC,EAAE,YAAY,CAAC,GAAG,CAAC,CAAC;IAC1B;;;;;;;;;;;;;;OAcG;IACH,QAAQ,EACJ,KAAK,CAAC,YAAY,CAAC;QAAE,KAAK,CAAC,EAAE,GAAG,CAAC;QAAC,QAAQ,CAAC,EAAE,GAAG,CAAC;QAAC,CAAC,IAAI,EAAE,MAAM,GAAG,GAAG,CAAA;KAAE,CAAC,GACxE,qBAAqB,CAAC,CAAC,CAAC,CAAC;IAE7B;;OAEG;IACH,QAAQ,CAAC,EAAE,CAAC,KAAK,EAAE,CAAC,EAAE,GAAG,IAAI,EAAE,GAAG,KAAK,IAAI,CAAC;IAC5C;;;OAGG;IACH,OAAO,CAAC,EAAE,CAAC,KAAK,CAAC,EAAE,KAAK,KAAK,IAAI,CAAC;IAClC;;OAEG;IACH,gBAAgB,CAAC,EAAE,MAAM,UAAU,CAAC;CACrC"}
package/esm/input/input-group.d.ts.map CHANGED
@@ -1 +1 @@
1
- {"version":3,"file":"input-group.d.ts","sourceRoot":"","sources":["input-group.tsx"],"names":[],"mappings":";AAIA,OAAO,EAAE,eAAe,EAAE,MAAM,oBAAoB,CAAC;gCAK9B,eAAe;AAAtC,wBA6DE"}
1
+ {"version":3,"file":"input-group.d.ts","sourceRoot":"","sources":["input-group.tsx"],"names":[],"mappings":";AAIA,OAAO,EAAE,eAAe,EAAE,MAAM,oBAAoB,CAAC;gCAK9B,eAAe;AAAtC,wBA8DE"}
package/esm/input/input-group.js CHANGED
@@ -33,7 +33,9 @@ export default (function (props) {
33
33
  });
34
34
  var _useWithFormConfig = useWithFormConfig(props),
35
35
  size = _useWithFormConfig.size,
36
- disabled = _useWithFormConfig.disabled;
36
+ disabled = _useWithFormConfig.disabled,
37
+ status = _useWithFormConfig.status,
38
+ error = _useWithFormConfig.error;
37
39
  var getProps = function getProps(child) {
38
40
  ref.current.propsMap.set(child, {
39
41
  onFocus: child.props.onFocus,
@@ -65,7 +67,7 @@ export default (function (props) {
65
67
  className = props.className,
66
68
  width = props.width,
67
69
  style = props.style;
68
- var rootClass = classNames(className, inputStyle === null || inputStyle === void 0 ? void 0 : inputStyle.group, size === 'small' && (inputStyle === null || inputStyle === void 0 ? void 0 : inputStyle.groupSmall), size === 'large' && (inputStyle === null || inputStyle === void 0 ? void 0 : inputStyle.groupLarge), !!disabled && (inputStyle === null || inputStyle === void 0 ? void 0 : inputStyle.groupDisabled), !!focus && (inputStyle === null || inputStyle === void 0 ? void 0 : inputStyle.groupFocus));
70
+ var rootClass = classNames(className, inputStyle === null || inputStyle === void 0 ? void 0 : inputStyle.group, size === 'small' && (inputStyle === null || inputStyle === void 0 ? void 0 : inputStyle.groupSmall), size === 'large' && (inputStyle === null || inputStyle === void 0 ? void 0 : inputStyle.groupLarge), !!disabled && (inputStyle === null || inputStyle === void 0 ? void 0 : inputStyle.groupDisabled), !!focus && (inputStyle === null || inputStyle === void 0 ? void 0 : inputStyle.groupFocus), (status === 'error' || error) && (inputStyle === null || inputStyle === void 0 ? void 0 : inputStyle.groupError));
69
71
  return /*#__PURE__*/_jsx("div", _objectSpread(_objectSpread({}, util.getDataAttribute({
70
72
  role: 'input-group'
71
73
  })), {}, {
package/esm/input/input-group.type.d.ts CHANGED
@@ -1,6 +1,7 @@
1
1
  import * as React from 'react';
2
2
  import { ReactNode } from 'react';
3
3
  import { InputStyle } from './input.type';
4
+ import { CommonType } from '../common/type';
4
5
  export interface InputGroupProps {
5
6
  children?: ReactNode;
6
7
  className?: string;
@@ -9,5 +10,14 @@ export interface InputGroupProps {
9
10
  size?: 'small' | 'large' | 'default';
10
11
  disabled?: boolean;
11
12
  jssStyle: InputStyle;
13
+ /**
14
+ * @cn 错误信息
15
+ * @en error message
16
+ * @private 内部属性
17
+ */
18
+ error?: string | {
19
+ message?: string;
20
+ };
21
+ status?: CommonType['status'];
12
22
  }
13
23
  //# sourceMappingURL=input-group.type.d.ts.map
package/esm/input/input-group.type.d.ts.map CHANGED
@@ -1 +1 @@
1
- {"version":3,"file":"input-group.type.d.ts","sourceRoot":"","sources":["input-group.type.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAC/B,OAAO,EAAE,SAAS,EAAE,MAAM,OAAO,CAAC;AAClC,OAAO,EAAE,UAAU,EAAE,MAAM,cAAc,CAAC;AAE1C,MAAM,WAAW,eAAe;IAC9B,QAAQ,CAAC,EAAE,SAAS,CAAC;IACrB,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,KAAK,CAAC,EAAE,MAAM,GAAG,MAAM,CAAC;IACxB,KAAK,CAAC,EAAE,KAAK,CAAC,aAAa,CAAC;IAC5B,IAAI,CAAC,EAAE,OAAO,GAAG,OAAO,GAAG,SAAS,CAAC;IACrC,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,QAAQ,EAAE,UAAU,CAAC;CACtB"}
1
+ {"version":3,"file":"input-group.type.d.ts","sourceRoot":"","sources":["input-group.type.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAC/B,OAAO,EAAE,SAAS,EAAE,MAAM,OAAO,CAAC;AAClC,OAAO,EAAE,UAAU,EAAE,MAAM,cAAc,CAAC;AAC1C,OAAO,EAAE,UAAU,EAAE,MAAM,gBAAgB,CAAC;AAE5C,MAAM,WAAW,eAAe;IAC9B,QAAQ,CAAC,EAAE,SAAS,CAAC;IACrB,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,KAAK,CAAC,EAAE,MAAM,GAAG,MAAM,CAAC;IACxB,KAAK,CAAC,EAAE,KAAK,CAAC,aAAa,CAAC;IAC5B,IAAI,CAAC,EAAE,OAAO,GAAG,OAAO,GAAG,SAAS,CAAC;IACrC,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,QAAQ,EAAE,UAAU,CAAC;IACrB;;;;OAIG;IACH,KAAK,CAAC,EAAE,MAAM,GAAG;QAAE,OAAO,CAAC,EAAE,MAAM,CAAA;KAAE,CAAC;IACtC,MAAM,CAAC,EAAE,UAAU,CAAC,QAAQ,CAAC,CAAC;CAC/B"}
package/esm/input/input.type.d.ts CHANGED
@@ -40,6 +40,7 @@ export interface InputClasses {
40
40
  groupLarge: string;
41
41
  groupFocus: string;
42
42
  groupDisabled: string;
43
+ groupError: string;
43
44
  wrapperNumber: string;
44
45
  numberStep: string;
45
46
  passwordToggle: string;
package/esm/input/input.type.d.ts.map CHANGED
@@ -1 +1 @@
1
- {"version":3,"file":"input.type.d.ts","sourceRoot":"","sources":["input.type.ts"],"names":[],"mappings":"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"}
1
+ {"version":3,"file":"input.type.d.ts","sourceRoot":"","sources":["input.type.ts"],"names":[],"mappings":"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"}
package/esm/sticky/sticky.d.ts.map CHANGED
@@ -1 +1 @@
1
- {"version":3,"file":"sticky.d.ts","sourceRoot":"","sources":["sticky.tsx"],"names":[],"mappings":";AAGA,OAAO,EAAE,WAAW,EAAE,MAAM,eAAe,CAAC;AAuB5C,QAAA,MAAM,MAAM,UAAW,WAAW,gBAqTjC,CAAC;AAEF,eAAe,MAAM,CAAC"}
1
+ {"version":3,"file":"sticky.d.ts","sourceRoot":"","sources":["sticky.tsx"],"names":[],"mappings":";AAGA,OAAO,EAAE,WAAW,EAAE,MAAM,eAAe,CAAC;AAuB5C,QAAA,MAAM,MAAM,UAAW,WAAW,gBA2XjC,CAAC;AAEF,eAAe,MAAM,CAAC"}
package/esm/sticky/sticky.js CHANGED
@@ -12,7 +12,7 @@ function _iterableToArrayLimit(r, l) { var t = null == r ? null : "undefined" !=
12
12
  function _arrayWithHoles(arr) { if (Array.isArray(arr)) return arr; }
13
13
  import { usePersistFn, util, useResize, useRender } from '@sheinx/hooks';
14
14
  import { createPortal } from 'react-dom';
15
- import React, { useEffect, useRef, useState } from 'react';
15
+ import React, { useLayoutEffect, useRef, useState } from 'react';
16
16
  import { jsx as _jsx } from "react/jsx-runtime";
17
17
  import { Fragment as _Fragment } from "react/jsx-runtime";
18
18
  import { jsxs as _jsxs } from "react/jsx-runtime";
@@ -41,14 +41,16 @@ var Sticky = function Sticky(props) {
41
41
  var children = props.children,
42
42
  top = props.top,
43
43
  bottom = props.bottom;
44
- var css = props.css || props.target;
44
+ // 是否使用css sticky
45
+ var css = (props.css || props.target) && supportSticky;
46
+ var forceUpdate = useRender();
45
47
  var _useRef = useRef({
46
48
  target: null,
47
49
  div: null,
48
- observer: null,
50
+ position: '',
51
+ targetObserver: null,
49
52
  parentObserver: null,
50
- isTop: false,
51
- bodyObserver: null
53
+ fixedObserver: null
52
54
  }),
53
55
  context = _useRef.current;
54
56
  var _useState = useState({}),
@@ -63,7 +65,6 @@ var Sticky = function Sticky(props) {
63
65
  _useState6 = _slicedToArray(_useState5, 2),
64
66
  parentVisible = _useState6[0],
65
67
  setParentVisible = _useState6[1];
66
- var forceRender = useRender();
67
68
  var elementRef = useRef(null);
68
69
  var getTarget = function getTarget() {
69
70
  var scrollContainer = props.scrollContainer;
@@ -76,19 +77,17 @@ var Sticky = function Sticky(props) {
76
77
  }
77
78
  return null;
78
79
  };
80
+
81
+ // window resize 时需要重新计算底部附着的位置
79
82
  var updateStyle = usePersistFn(function () {
80
- if (context.div && !context.isTop && show) {
83
+ if (context.div && context.position === 'bottom' && show) {
81
84
  var scrollRect = context.target.getBoundingClientRect();
82
85
  var targetRect = elementRef.current.getBoundingClientRect();
83
86
  var targetLeft = targetRect.left;
84
- var width = targetRect.width,
85
- height = targetRect.height;
86
87
  if (typeof bottom === 'number') {
87
88
  var outRootRect = context.target.getBoundingClientRect();
88
89
  var _style = {
89
90
  position: 'absolute',
90
- width: "".concat(width, "px"),
91
- height: "".concat(height, "px"),
92
91
  top: "".concat(scrollRect.bottom - (props.bottom || 0) - outRootRect.top, "px"),
93
92
  left: "".concat(targetLeft - outRootRect.left, "px"),
94
93
  transform: 'translateY(-100%)'
@@ -97,6 +96,8 @@ var Sticky = function Sticky(props) {
97
96
  }
98
97
  }
99
98
  });
99
+
100
+ // 有滚动容器时的定位
100
101
  var handleTargetPosition = usePersistFn(function (entries) {
101
102
  var entry = entries[0];
102
103
  var scrollRect = entry.rootBounds;
@@ -104,17 +105,13 @@ var Sticky = function Sticky(props) {
104
105
  if (!entry.isIntersecting) {
105
106
  var targetLeft = targetRect.left;
106
107
  var outRootRect = context.div.getBoundingClientRect();
107
- var width = targetRect.width,
108
- height = targetRect.height;
109
108
  if (scrollRect && targetRect.bottom < scrollRect.bottom) {
110
109
  // top in
111
- context.isTop = true;
110
+ context.position = 'top';
112
111
  if (typeof top === 'number') {
113
112
  setShow(true);
114
113
  var _style2 = {
115
114
  position: 'absolute',
116
- width: "".concat(width, "px"),
117
- height: "".concat(height, "px"),
118
115
  top: "".concat(scrollRect.top - outRootRect.top, "px"),
119
116
  left: "".concat(targetLeft - outRootRect.left, "px")
120
117
  };
@@ -122,16 +119,13 @@ var Sticky = function Sticky(props) {
122
119
  }
123
120
  } else if (scrollRect) {
124
121
  // bottom in
125
- context.isTop = false;
122
+ context.position = 'bottom';
126
123
  if (typeof bottom === 'number') {
127
124
  setShow(true);
128
- var _outRootRect = context.target.getBoundingClientRect();
129
125
  var _style3 = {
130
126
  position: 'absolute',
131
- width: "".concat(width, "px"),
132
- height: "".concat(height, "px"),
133
- top: "".concat(scrollRect.bottom - _outRootRect.top, "px"),
134
- left: "".concat(targetLeft - _outRootRect.left, "px"),
127
+ top: "".concat(scrollRect.bottom - outRootRect.top, "px"),
128
+ left: "".concat(targetLeft - outRootRect.left, "px"),
135
129
  transform: 'translateY(-100%)'
136
130
  };
137
131
  setStyle(_style3);
@@ -140,8 +134,11 @@ var Sticky = function Sticky(props) {
140
134
  }
141
135
  if (entry.isIntersecting) {
142
136
  setShow(false);
137
+ context.position = '';
143
138
  }
144
139
  });
140
+
141
+ // 父元素是否可见
145
142
  var handleParentVisible = usePersistFn(function (entries) {
146
143
  var entry = entries[0];
147
144
  if (entry.isIntersecting) {
@@ -150,83 +147,118 @@ var Sticky = function Sticky(props) {
150
147
  setParentVisible(false);
151
148
  }
152
149
  });
150
+ var setFixedStyle = usePersistFn(function (s, m) {
151
+ var l = arguments.length > 2 && arguments[2] !== undefined ? arguments[2] : 0;
152
+ if (s !== show) {
153
+ setShow(s);
154
+ }
155
+ if (s && m) {
156
+ var newStyle = _defineProperty(_defineProperty({
157
+ position: 'fixed'
158
+ }, m, m === 'top' ? top : bottom), "left", l);
159
+ if (!util.shallowEqual(style, newStyle)) {
160
+ setStyle(newStyle);
161
+ }
162
+ }
163
+ });
164
+
165
+ // 无滚动容器的时候，body 滚动 resize 计算
153
166
  var handleFixedPosition = usePersistFn(function () {
167
+ if (css || context.target) return;
154
168
  var element = elementRef.current;
169
+ if (!parentVisible) {
170
+ setFixedStyle(false);
171
+ return;
172
+ }
155
173
  if (!element) return;
156
174
  var selfRect = element.getBoundingClientRect();
157
175
  if (selfRect === null) return;
158
176
  // If the element is hidden, the width and height will be 0
159
177
  if (selfRect && selfRect.width === 0 && selfRect.height === 0) return;
160
- // const { marginBottom, marginTop } = getComputedStyle(element);
161
- // selfRect.height += parseFloat(marginBottom) + parseFloat(marginTop);
162
- var scrollElement = document.body;
163
- var scrollRect = scrollElement.getBoundingClientRect();
178
+ var scrollRect = document.body.getBoundingClientRect();
164
179
  var top = props.top,
165
180
  bottom = props.bottom;
166
181
  if (top !== undefined && Math.ceil(selfRect.top) <= top) {
167
- setShow(true);
168
- setStyle({
169
- position: 'fixed',
170
- top: top,
171
- left: "".concat(selfRect.left, "px"),
172
- width: "".concat(selfRect.width, "px")
173
- });
182
+ setFixedStyle(true, 'top', selfRect.left);
174
183
  return;
175
184
  } else if (bottom !== undefined && Math.ceil(selfRect.bottom) + bottom > scrollRect.bottom) {
176
- setShow(true);
177
- setStyle({
178
- position: 'fixed',
179
- bottom: bottom,
180
- left: "".concat(selfRect.left, "px"),
181
- width: "".concat(selfRect.width, "px")
182
- });
185
+ setFixedStyle(true, 'bottom', selfRect.left);
183
186
  return;
184
187
  } else {
185
- setShow(false);
188
+ setFixedStyle(false);
189
+ }
190
+ });
191
+
192
+ // 无滚动容器时内滚场景触发
193
+ var handleFixedInter = usePersistFn(function (entries) {
194
+ if (!parentVisible) {
195
+ setFixedStyle(false);
196
+ return;
197
+ }
198
+ var entry = entries[0];
199
+ var scrollRect = entry.rootBounds;
200
+ var targetRect = entry.boundingClientRect;
201
+ if (scrollRect && scrollRect.top === 0 && scrollRect.bottom === 0) {
202
+ return;
203
+ }
204
+ if (!entry.isIntersecting) {
205
+ var targetLeft = targetRect.left;
206
+ var outRootRect = document.body.getBoundingClientRect();
207
+ if (scrollRect && targetRect.bottom < scrollRect.bottom) {
208
+ // top in
209
+ if (typeof top === 'number') {
210
+ setFixedStyle(true, 'top', targetLeft - outRootRect.left);
211
+ }
212
+ } else if (scrollRect) {
213
+ // bottom in
214
+ if (typeof bottom === 'number') {
215
+ setFixedStyle(true, 'bottom', targetLeft - outRootRect.left);
216
+ }
217
+ }
218
+ }
219
+ if (entry.isIntersecting) {
220
+ setFixedStyle(false);
186
221
  }
187
222
  });
188
223
  var elementSize = useResize({
189
224
  targetRef: elementRef,
190
- timer: 0,
225
+ timer: 10,
191
226
  cb: handleFixedPosition
192
227
  });
193
- var createBodyObserver = function createBodyObserver() {
194
- if (context.bodyObserver) {
195
- context.bodyObserver.disconnect();
228
+ var cancelFixedObserver = function cancelFixedObserver() {
229
+ if (context.fixedObserver) {
230
+ context.fixedObserver.disconnect();
231
+ context.fixedObserver = null;
196
232
  }
197
- context.bodyObserver = new IntersectionObserver(handleFixedPosition, {
233
+ };
234
+ var createFixedObserver = function createFixedObserver() {
235
+ cancelFixedObserver();
236
+ context.fixedObserver = new IntersectionObserver(handleFixedInter, {
198
237
  root: null,
199
238
  rootMargin: "-".concat(top || 0, "px 0px -").concat(bottom || 0, "px 0px"),
200
239
  threshold: 1.0
201
240
  });
202
- context.bodyObserver.observe(elementRef.current);
203
241
  };
204
242
  var cancelObserver = function cancelObserver() {
205
- if (context.observer) {
206
- context.observer.disconnect();
207
- context.observer = null;
208
- }
209
- if (context.parentObserver) {
210
- context.parentObserver.disconnect();
211
- context.parentObserver = null;
243
+ if (context.targetObserver) {
244
+ context.targetObserver.disconnect();
245
+ context.targetObserver = null;
212
246
  }
213
247
  };
214
- var createObserver = function createObserver(target) {
248
+ var createObserver = function createObserver() {
215
249
  if (!context.div) {
216
250
  context.div = document.createElement('div');
217
251
  context.div.style.position = 'relative';
218
252
  }
219
- if (target) {
220
- forceRender();
221
- cancelObserver();
253
+ if (context.target) {
222
254
  if (context.div) {
223
255
  // append div
224
- if (target === document.body) {
225
- document.body.appendChild(context.div);
256
+ if (context.target === document.body) {
257
+ document.body.insertBefore(context.div, document.body.firstChild);
226
258
  } else {
227
- target.parentNode.insertBefore(context.div, target);
259
+ context.target.parentNode.insertBefore(context.div, context.target);
228
260
  }
229
- var _style4 = window.getComputedStyle(target);
261
+ var _style4 = window.getComputedStyle(context.target);
230
262
  if (_style4.position === 'absolute' || _style4.position === 'fixed') {
231
263
  context.div.style.position = _style4.position;
232
264
  context.div.style.top = _style4.top;
@@ -235,76 +267,109 @@ var Sticky = function Sticky(props) {
235
267
  context.div.style.bottom = _style4.bottom;
236
268
  }
237
269
  }
270
+ cancelFixedObserver();
238
271
  if (window.IntersectionObserver) {
239
272
  var observer = new IntersectionObserver(handleTargetPosition, {
240
- root: target,
273
+ root: context.target,
241
274
  rootMargin: "-".concat(top || 0, "px 0px -").concat(bottom || 0, "px 0px"),
242
275
  threshold: 1.0
243
276
  });
244
- context.observer = observer;
245
- context.parentObserver = new IntersectionObserver(handleParentVisible, {
246
- root: target,
247
- rootMargin: "-".concat(top || 0, "px 0px -").concat(bottom || 0, "px 0px"),
248
- threshold: 0
249
- });
277
+ context.targetObserver = observer;
250
278
  }
251
279
  }
252
280
  };
281
+ var cancelParentObserver = function cancelParentObserver() {
282
+ if (context.parentObserver) {
283
+ context.parentObserver.disconnect();
284
+ context.parentObserver = null;
285
+ }
286
+ };
287
+ var createParentObserver = function createParentObserver() {
288
+ if (!props.parent) return;
289
+ cancelParentObserver();
290
+ context.parentObserver = new IntersectionObserver(handleParentVisible, {
291
+ root: context.target,
292
+ rootMargin: "-".concat(top || 0, "px 0px -").concat(bottom || 0, "px 0px"),
293
+ threshold: 0
294
+ });
295
+ context.parentObserver.observe(props.parent);
296
+ };
297
+
298
+ // 存在滚动容器时的定位
299
+ var createTargetEvents = function createTargetEvents() {
300
+ createObserver();
301
+ window.addEventListener('resize', updateStyle);
302
+ };
303
+ var cancelTargetEvents = function cancelTargetEvents() {
304
+ cancelObserver();
305
+ window.removeEventListener('resize', updateStyle);
306
+ if (context.div) {
307
+ context.div.remove();
308
+ context.div = null;
309
+ }
310
+ };
311
+ var createFixedEvents = function createFixedEvents() {
312
+ createFixedObserver();
313
+ events.forEach(function (event) {
314
+ window.addEventListener(event, handleFixedPosition);
315
+ });
316
+ };
317
+ var cancelFixedEvents = function cancelFixedEvents() {
318
+ cancelFixedObserver();
319
+ events.forEach(function (event) {
320
+ window.removeEventListener(event, handleFixedPosition);
321
+ });
322
+ };
253
323
  var handleElementRef = function handleElementRef(el) {
254
324
  if (el) {
255
325
  elementRef.current = el;
256
- if (el && context.observer) {
257
- context.observer.observe(el);
326
+ if (context.targetObserver) {
327
+ if (!el) {
328
+ context.targetObserver.disconnect();
329
+ } else {
330
+ context.targetObserver.observe(el);
331
+ }
332
+ }
333
+ if (context.fixedObserver) {
334
+ if (!el) {
335
+ context.fixedObserver.disconnect();
336
+ } else {
337
+ context.fixedObserver.observe(el);
338
+ }
258
339
  }
259
340
  }
260
341
  };
261
- useEffect(function () {
342
+ useLayoutEffect(function () {
262
343
  if (css) return;
263
344
  var target = getTarget();
264
- context.target = target;
265
- if (target) {
266
- createObserver(target);
267
- window.addEventListener('resize', updateStyle);
268
- return function () {
269
- cancelObserver();
270
- window.removeEventListener('resize', updateStyle);
271
- if (context.div) {
272
- context.div.remove();
273
- }
274
- };
345
+ if (context.target !== target) {
346
+ context.target = target;
347
+ forceUpdate();
348
+ }
349
+ if (context.target) {
350
+ createTargetEvents();
351
+ return cancelTargetEvents;
275
352
  } else {
276
353
  // fixed 布局
277
- createBodyObserver();
278
- events.forEach(function (event) {
279
- window.addEventListener(event, handleFixedPosition);
280
- });
281
- return function () {
282
- if (context.bodyObserver) {
283
- context.bodyObserver.disconnect();
284
- }
285
- events.forEach(function (event) {
286
- window.removeEventListener(event, handleFixedPosition);
287
- });
288
- };
354
+ createFixedEvents();
355
+ return cancelFixedEvents;
289
356
  }
290
- }, [css]);
291
- useEffect(function () {
292
- if (props.parent && context.parentObserver) {
357
+ }, [css, top, bottom]);
358
+ useLayoutEffect(function () {
359
+ if (props.parent && !css) {
360
+ // createParentObserver 用到context.target
361
+ createParentObserver();
293
362
  context.parentObserver.observe(props.parent);
294
363
  }
295
- return function () {
296
- if (context.parentObserver) {
297
- context.parentObserver.disconnect();
298
- }
299
- };
300
- }, [props.parent]);
364
+ return cancelParentObserver;
365
+ }, [props.parent, css, context.target, top, bottom]);
301
366
 
302
367
  // 纯css方法 直接使用css
303
368
  // js方法
304
369
  // 1. 不指定滚动容器 基于document.body 使用fixed + js计算
305
370
  // 2. 指定滚动容器 在滚动容器上方插入一个dom占位 基于该dom渲染和定位
306
371
  // 3. 使用 intersectionObserver 来判断是否需要sticky
307
- if (css && supportSticky) {
372
+ if (css) {
308
373
  return /*#__PURE__*/_jsx("div", {
309
374
  className: props.className,
310
375
  style: _objectSpread(_objectSpread({
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@sheinx/base",
3
- "version": "3.1.15",
3
+ "version": "3.1.16",
4
4
  "description": "",
5
5
  "keywords": [],
6
6
  "license": "MIT",
@@ -10,7 +10,7 @@
10
10
  "module": "./esm/index.js",
11
11
  "typings": "./cjs/index.d.ts",
12
12
  "dependencies": {
13
- "@sheinx/hooks": "3.1.15",
13
+ "@sheinx/hooks": "3.1.16",
14
14
  "immer": "^10.0.0",
15
15
  "classnames": "^2.0.0",
16
16
  "@shined/reactive": "^0.1.3-alpha.0"