linkmore-design 1.0.54 → 1.0.55

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 (99) hide show
  1. package/dist/Affix/demos/basic.d.ts +2 -0
  2. package/dist/Affix/index.d.ts +54 -0
  3. package/dist/Affix/style/index.d.ts +1 -0
  4. package/dist/Affix/utils.d.ts +15 -0
  5. package/dist/CardTable/fns/index.d.ts +1 -5
  6. package/dist/IconFont/index.d.ts +1 -1
  7. package/dist/LmFilter/{components → baseFilter}/fuzzySearch.d.ts +0 -0
  8. package/dist/LmFilter/utils.d.ts +1 -0
  9. package/dist/QuickMenu/demos/basic.d.ts +2 -0
  10. package/dist/QuickMenu/index.d.ts +14 -0
  11. package/dist/QuickMenu/style/index.d.ts +1 -0
  12. package/dist/Tag/demos/ExigencyTag.d.ts +2 -0
  13. package/dist/Tag/index.d.ts +4 -0
  14. package/dist/Upload/demos/picture-little.d.ts +3 -0
  15. package/dist/Upload/index.d.ts +5 -1
  16. package/dist/_util/domTarget.d.ts +7 -0
  17. package/dist/_util/throttleByAnimationFrame.d.ts +8 -0
  18. package/dist/index.d.ts +1 -0
  19. package/dist/index.umd.js +548 -8
  20. package/dist/index.umd.min.js +4 -4
  21. package/es/Affix/index.d.ts +54 -0
  22. package/es/Affix/index.js +326 -0
  23. package/es/Affix/style/index.css +505 -0
  24. package/es/Affix/style/index.d.ts +1 -0
  25. package/es/Affix/style/index.js +1 -0
  26. package/es/Affix/utils.d.ts +15 -0
  27. package/es/Affix/utils.js +83 -0
  28. package/es/CardTable/fns/index.js +6 -5
  29. package/es/Descriptions/style/index.css +10 -8
  30. package/es/IconFont/index.js +3 -2
  31. package/es/LmFilter/baseFilter/fuzzySearch.js +53 -0
  32. package/es/LmFilter/baseFilter/index.js +1 -1
  33. package/es/LmFilter/clearFilter/index.js +3 -1
  34. package/es/LmFilter/components/CascaderFilter.js +17 -41
  35. package/es/LmFilter/components/DateFilter.js +12 -20
  36. package/es/LmFilter/components/DropdownFIlter.js +78 -10
  37. package/es/LmFilter/components/index.js +56 -13
  38. package/es/LmFilter/hooks/useDelayedFn.js +8 -6
  39. package/es/LmFilter/style/style.css +16 -0
  40. package/es/LmFilter/utils.js +16 -0
  41. package/es/LmFilter/wrapper/FilterRoot.js +6 -0
  42. package/es/QuickMenu/index.d.ts +14 -0
  43. package/es/QuickMenu/index.js +169 -0
  44. package/es/QuickMenu/style/index.css +560 -0
  45. package/es/QuickMenu/style/index.d.ts +1 -0
  46. package/es/QuickMenu/style/index.js +1 -0
  47. package/es/Tag/index.d.ts +4 -0
  48. package/es/Tag/index.js +48 -2
  49. package/es/Tag/style/index.css +4 -1
  50. package/es/Upload/index.d.ts +5 -1
  51. package/es/Upload/index.js +7 -2
  52. package/es/Upload/style/index.css +35 -0
  53. package/es/_util/domTarget.d.ts +7 -0
  54. package/es/_util/domTarget.js +20 -0
  55. package/es/_util/throttleByAnimationFrame.d.ts +8 -0
  56. package/es/_util/throttleByAnimationFrame.js +58 -0
  57. package/es/index.d.ts +1 -0
  58. package/es/index.js +2 -1
  59. package/lib/Affix/index.d.ts +54 -0
  60. package/lib/Affix/index.js +349 -0
  61. package/lib/Affix/style/index.css +505 -0
  62. package/lib/Affix/style/index.d.ts +1 -0
  63. package/lib/Affix/style/index.js +3 -0
  64. package/lib/Affix/utils.d.ts +15 -0
  65. package/lib/Affix/utils.js +104 -0
  66. package/lib/CardTable/fns/index.js +6 -5
  67. package/lib/Descriptions/style/index.css +10 -8
  68. package/lib/IconFont/index.js +3 -2
  69. package/lib/LmFilter/baseFilter/fuzzySearch.js +53 -0
  70. package/lib/LmFilter/baseFilter/index.js +1 -1
  71. package/lib/LmFilter/clearFilter/index.js +3 -1
  72. package/lib/LmFilter/components/CascaderFilter.js +17 -41
  73. package/lib/LmFilter/components/DateFilter.js +12 -20
  74. package/lib/LmFilter/components/DropdownFIlter.js +78 -10
  75. package/lib/LmFilter/components/index.js +56 -13
  76. package/lib/LmFilter/hooks/useDelayedFn.js +8 -6
  77. package/lib/LmFilter/style/style.css +16 -0
  78. package/lib/LmFilter/utils.js +16 -0
  79. package/lib/LmFilter/wrapper/FilterRoot.js +6 -0
  80. package/lib/QuickMenu/index.d.ts +14 -0
  81. package/lib/QuickMenu/index.js +187 -0
  82. package/lib/QuickMenu/style/index.css +560 -0
  83. package/lib/QuickMenu/style/index.d.ts +1 -0
  84. package/lib/QuickMenu/style/index.js +3 -0
  85. package/lib/Tag/index.d.ts +4 -0
  86. package/lib/Tag/index.js +48 -1
  87. package/lib/Tag/style/index.css +4 -1
  88. package/lib/Upload/index.d.ts +5 -1
  89. package/lib/Upload/index.js +8 -2
  90. package/lib/Upload/style/index.css +35 -0
  91. package/lib/_util/domTarget.d.ts +7 -0
  92. package/lib/_util/domTarget.js +31 -0
  93. package/lib/_util/throttleByAnimationFrame.d.ts +8 -0
  94. package/lib/_util/throttleByAnimationFrame.js +72 -0
  95. package/lib/index.d.ts +1 -0
  96. package/lib/index.js +9 -1
  97. package/package.json +5 -2
  98. package/es/LmFilter/components/fuzzySearch.js +0 -37
  99. package/lib/LmFilter/components/fuzzySearch.js +0 -37
@@ -0,0 +1 @@
1
+ import "./index.css";
package/es/Tag/index.d.ts CHANGED
@@ -1,9 +1,13 @@
1
1
  import React from 'react';
2
2
  import { Tag, TagProps } from 'antd';
3
+ import type { CheckableTagProps } from 'antd/es/tag/CheckableTag';
3
4
  export interface ILMTagProps extends TagProps {
4
5
  className?: string;
5
6
  noborder?: boolean;
6
7
  }
8
+ export interface ILMTagCheckProps extends CheckableTagProps {
9
+ color?: string;
10
+ }
7
11
  interface LmTagInterface extends React.ForwardRefExoticComponent<ILMTagProps & React.RefAttributes<unknown>> {
8
12
  CheckableTag?: typeof Tag.CheckableTag;
9
13
  }
package/es/Tag/index.js CHANGED
@@ -14,7 +14,9 @@ var __rest = this && this.__rest || function (s, e) {
14
14
  return t;
15
15
  };
16
16
 
17
- import React, { forwardRef } from 'react';
17
+ import React, { forwardRef, useMemo, useRef } from 'react';
18
+ import hexToRgba from 'hex-to-rgba';
19
+ var CheckableTag = _Tag.CheckableTag;
18
20
  import classNames from 'classnames';
19
21
  export var PresetColorTypes = ['pink', 'red', 'yellow', 'orange', 'cyan', 'green', 'blue', 'purple', 'geekblue', 'magenta', 'volcano', 'gold', 'lime', 'theme'];
20
22
  var prefixCls = 'lm_tag';
@@ -32,5 +34,49 @@ var LmTag = /*#__PURE__*/forwardRef(function (props, ref) {
32
34
  }, className, PresetColorTypes.includes(color) && "lm_tag_main_color lm_tag_main_".concat(color))
33
35
  }));
34
36
  });
35
- LmTag.CheckableTag = _Tag.CheckableTag;
37
+ var checkPreFixCls = 'lm_check_tag';
38
+
39
+ LmTag.CheckableTag = function (props) {
40
+ var className = props.className,
41
+ color = props.color,
42
+ checked = props.checked,
43
+ rest = __rest(props, ["className", "color", "checked"]);
44
+
45
+ var checkTagRef = useRef(null);
46
+ var colorProps = useMemo(function () {
47
+ if (color) {
48
+ try {
49
+ return {
50
+ style: {
51
+ color: checked ? '#fff' : hexToRgba(color),
52
+ background: checked ? color : hexToRgba(color, 0.15)
53
+ },
54
+ onMouseEnter: function onMouseEnter() {
55
+ checkTagRef.current.firstChild.style.background = checked ? color : hexToRgba(color, 0.25);
56
+ },
57
+ onMouseLeave: function onMouseLeave() {
58
+ checkTagRef.current.firstChild.style.background = checked ? color : hexToRgba(color, 0.15);
59
+ }
60
+ };
61
+ } catch (_a) {
62
+ return {
63
+ style: {
64
+ color: hexToRgba(color),
65
+ background: hexToRgba(color, 0.15)
66
+ }
67
+ };
68
+ }
69
+ } else {
70
+ return {};
71
+ }
72
+ }, [color, checked]);
73
+ return /*#__PURE__*/React.createElement("span", {
74
+ ref: checkTagRef
75
+ }, /*#__PURE__*/React.createElement(CheckableTag, Object.assign({}, rest, {
76
+ checked: checked
77
+ }, colorProps, {
78
+ className: classNames(checkPreFixCls, className, color && 'lm_custom_color_tag')
79
+ })));
80
+ };
81
+
36
82
  export default LmTag;
@@ -513,8 +513,8 @@ html {
513
513
  margin-left: 6px;
514
514
  }
515
515
  .lm_tag.ant-tag.lm_tag_main_theme {
516
- background: var(--tree-select-bg);
517
516
  color: var(--primary-color);
517
+ background: var(--tree-select-bg);
518
518
  }
519
519
  .lm_tag.lm_tag_noborder {
520
520
  border-color: transparent;
@@ -564,3 +564,6 @@ html {
564
564
  .ant-tag-checkable.ant-tag-checkable-checked {
565
565
  background-color: var(--primary-color);
566
566
  }
567
+ .lm_check_tag.lm_custom_color_tag.ant-tag-checkable-checked {
568
+ color: #fff !important;
569
+ }
@@ -5,5 +5,9 @@ import type { RcFile as AntdRcFile } from 'antd/es/upload';
5
5
  export declare type UploadProps = AntdUploadProps;
6
6
  export declare type UploadFile = AntdUploadFile;
7
7
  export declare type RcFile = AntdRcFile;
8
- declare const LMUpload: React.FC<UploadProps>;
8
+ export interface LMUploadProps extends UploadProps {
9
+ className?: string;
10
+ sizeType?: string;
11
+ }
12
+ declare const LMUpload: React.FC<LMUploadProps>;
9
13
  export default LMUpload;
@@ -3,19 +3,24 @@ import _Upload from "antd/es/upload";
3
3
  import "antd/es/tooltip/style";
4
4
  import _Tooltip from "antd/es/tooltip";
5
5
  import React from 'react';
6
+ import classNames from 'classnames';
6
7
 
7
8
  var LMUpload = function LMUpload(props) {
8
- var listType = props.listType;
9
+ var className = props.className,
10
+ sizeType = props.sizeType,
11
+ listType = props.listType;
9
12
 
10
13
  var renderUploadItem = function renderUploadItem(originNode, file) {
11
14
  return !listType ? /*#__PURE__*/React.createElement(_Tooltip, {
12
- placement: 'bottom',
15
+ placement: "bottom",
13
16
  title: file.name
14
17
  }, originNode.props.children) : originNode;
15
18
  };
16
19
 
17
20
  return /*#__PURE__*/React.createElement(_Upload, Object.assign({
21
+ className: classNames(className, sizeType == 'small' && 'little-upload'),
18
22
  itemRender: renderUploadItem,
23
+ sizeType: sizeType,
19
24
  listType: listType
20
25
  }, props));
21
26
  };
@@ -503,3 +503,38 @@ html {
503
503
  .card_cell_content:hover .card_cell_body .card_cell_checkbox {
504
504
  opacity: 1;
505
505
  }
506
+ .ant-upload-select-picture-card div {
507
+ margin-top: 8px;
508
+ }
509
+ .little-upload .ant-upload-list-picture-card-container {
510
+ width: 64px;
511
+ height: 64px;
512
+ }
513
+ .little-upload .ant-upload-list-picture-card-container .ant-upload-list-item {
514
+ padding: 0 !important;
515
+ }
516
+ .little-upload .ant-upload-list-picture-card-container .ant-upload-list-item .ant-upload-list-item-thumbnail {
517
+ font-size: 12px;
518
+ }
519
+ .little-upload .ant-upload-list-picture-card-container .ant-upload-list-item .ant-upload-list-item-progress {
520
+ bottom: 5px;
521
+ left: 7px;
522
+ }
523
+ .little-upload .ant-upload-list-picture-card-container .ant-upload-list-item .ant-upload-list-item-name {
524
+ bottom: 5px;
525
+ font-size: 12px;
526
+ }
527
+ .little-upload .ant-upload.ant-upload-select-picture-card {
528
+ width: 64px;
529
+ height: 64px;
530
+ font-size: 12px;
531
+ }
532
+ .little-upload .ant-upload.ant-upload-select-picture-card .anticon svg {
533
+ width: 24px;
534
+ height: 24px;
535
+ margin-top: 8px;
536
+ }
537
+ .little-upload .ant-upload.ant-upload-select-picture-card div {
538
+ margin-top: 0;
539
+ font-size: 12px;
540
+ }
@@ -0,0 +1,7 @@
1
+ import type { MutableRefObject } from 'react';
2
+ export declare const isFunction: (value: unknown) => value is Function;
3
+ declare type TargetValue<T> = T | undefined | null;
4
+ declare type TargetType = HTMLElement | Element | Window | Document;
5
+ export declare type BasicTarget<T extends TargetType = Element> = (() => TargetValue<T>) | TargetValue<T> | MutableRefObject<TargetValue<T>>;
6
+ export declare function getTargetElement<T extends TargetType>(target: BasicTarget<T>, defaultElement?: T): T;
7
+ export {};
@@ -0,0 +1,20 @@
1
+ export var isFunction = function isFunction(value) {
2
+ return typeof value === 'function';
3
+ };
4
+ export function getTargetElement(target, defaultElement) {
5
+ if (!target) {
6
+ return defaultElement;
7
+ }
8
+
9
+ var targetElement;
10
+
11
+ if (isFunction(target)) {
12
+ targetElement = target();
13
+ } else if ('current' in target) {
14
+ targetElement = target.current;
15
+ } else {
16
+ targetElement = target;
17
+ }
18
+
19
+ return targetElement;
20
+ }
@@ -0,0 +1,8 @@
1
+ export declare function throttleByAnimationFrame<T extends unknown[]>(fn: (...args: T) => void): {
2
+ (...args: T): void;
3
+ cancel: () => void;
4
+ };
5
+ export declare function throttleByAnimationFrameDecorator(): (target: any, key: string, descriptor: any) => {
6
+ configurable: boolean;
7
+ get(): any;
8
+ };
@@ -0,0 +1,58 @@
1
+ import _toConsumableArray from "@babel/runtime/helpers/esm/toConsumableArray";
2
+ import raf from 'rc-util/lib/raf';
3
+ export function throttleByAnimationFrame(fn) {
4
+ var requestId;
5
+
6
+ var later = function later(args) {
7
+ return function () {
8
+ requestId = null;
9
+ fn.apply(void 0, _toConsumableArray(args));
10
+ };
11
+ };
12
+
13
+ var throttled = function throttled() {
14
+ if (requestId == null) {
15
+ for (var _len = arguments.length, args = new Array(_len), _key = 0; _key < _len; _key++) {
16
+ args[_key] = arguments[_key];
17
+ }
18
+
19
+ requestId = raf(later(args));
20
+ }
21
+ };
22
+
23
+ throttled.cancel = function () {
24
+ raf.cancel(requestId);
25
+ requestId = null;
26
+ };
27
+
28
+ return throttled;
29
+ }
30
+ export function throttleByAnimationFrameDecorator() {
31
+ return function throttle(target, key, descriptor) {
32
+ var fn = descriptor.value;
33
+ var definingProperty = false;
34
+ return {
35
+ configurable: true,
36
+ get: function get() {
37
+ // In IE11 calling Object.defineProperty has a side-effect of evaluating the
38
+ // getter for the property which is being replaced. This causes infinite
39
+ // recursion and an "Out of stack space" error.
40
+ // eslint-disable-next-line no-prototype-builtins
41
+ if (definingProperty || this === target.prototype || this.hasOwnProperty(key)) {
42
+ /* istanbul ignore next */
43
+ return fn;
44
+ }
45
+
46
+ var boundFn = throttleByAnimationFrame(fn.bind(this));
47
+ definingProperty = true;
48
+ Object.defineProperty(this, key, {
49
+ value: boundFn,
50
+ configurable: true,
51
+ writable: true
52
+ });
53
+ definingProperty = false;
54
+ return boundFn;
55
+ }
56
+ };
57
+ };
58
+ }
package/es/index.d.ts CHANGED
@@ -48,3 +48,4 @@ export { default as Form } from './Form';
48
48
  export { default as Spin } from './Spin';
49
49
  export { default as LmEditTable } from './LmEditTable';
50
50
  export { default as List } from './List';
51
+ export { default as LMQuickMenu } from './QuickMenu';
package/es/index.js CHANGED
@@ -46,4 +46,5 @@ export { default as Tooltip } from './Tooltip';
46
46
  export { default as Form } from './Form';
47
47
  export { default as Spin } from './Spin';
48
48
  export { default as LmEditTable } from './LmEditTable';
49
- export { default as List } from './List';
49
+ export { default as List } from './List';
50
+ export { default as LMQuickMenu } from './QuickMenu';
@@ -0,0 +1,54 @@
1
+ import * as React from 'react';
2
+ import type { ConfigConsumerProps } from 'antd/es/config-provider';
3
+ export interface AffixProps {
4
+ /** 距离窗口顶部达到指定偏移量后触发 */
5
+ offsetTop?: number;
6
+ /** 距离窗口底部达到指定偏移量后触发 */
7
+ offsetBottom?: number;
8
+ style?: React.CSSProperties;
9
+ /** 固定状态改变时触发的回调函数 */
10
+ onChange?: (affixed?: boolean) => void;
11
+ /** 设置 Affix 需要监听其滚动事件的元素,值为一个返回对应 DOM 元素的函数 */
12
+ target?: () => Window | HTMLElement | null;
13
+ prefixCls?: string;
14
+ className?: string;
15
+ children: React.ReactNode;
16
+ }
17
+ interface InternalAffixProps extends AffixProps {
18
+ affixPrefixCls: string;
19
+ }
20
+ declare enum AffixStatus {
21
+ None = 0,
22
+ Prepare = 1
23
+ }
24
+ export interface AffixState {
25
+ affixStyle?: React.CSSProperties;
26
+ placeholderStyle?: React.CSSProperties;
27
+ status: AffixStatus;
28
+ lastAffix: boolean;
29
+ prevTarget: Window | HTMLElement | null;
30
+ }
31
+ declare class Affix extends React.Component<InternalAffixProps, AffixState> {
32
+ static contextType: React.Context<ConfigConsumerProps>;
33
+ state: AffixState;
34
+ placeholderNode: HTMLDivElement;
35
+ fixedNode: HTMLDivElement;
36
+ private timeout;
37
+ context: ConfigConsumerProps;
38
+ private getTargetFunc;
39
+ componentDidMount(): void;
40
+ componentDidUpdate(prevProps: AffixProps): void;
41
+ componentWillUnmount(): void;
42
+ getOffsetTop: () => number;
43
+ getOffsetBottom: () => number;
44
+ savePlaceholderNode: (node: HTMLDivElement) => void;
45
+ saveFixedNode: (node: HTMLDivElement) => void;
46
+ measure: () => void;
47
+ prepareMeasure: () => void;
48
+ updatePosition(): void;
49
+ lazyUpdatePosition(): void;
50
+ render(): JSX.Element;
51
+ }
52
+ export declare type InternalAffixClass = Affix;
53
+ declare const AffixFC: React.ForwardRefExoticComponent<AffixProps & React.RefAttributes<Affix>>;
54
+ export default AffixFC;
@@ -0,0 +1,349 @@
1
+ "use strict";
2
+
3
+ var _interopRequireWildcard = require("@babel/runtime/helpers/interopRequireWildcard").default;
4
+
5
+ var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault").default;
6
+
7
+ Object.defineProperty(exports, "__esModule", {
8
+ value: true
9
+ });
10
+ exports.default = void 0;
11
+
12
+ require("antd/es/affix/style");
13
+
14
+ var _affix = _interopRequireDefault(require("antd/es/affix"));
15
+
16
+ var _defineProperty2 = _interopRequireDefault(require("@babel/runtime/helpers/defineProperty"));
17
+
18
+ var _classCallCheck2 = _interopRequireDefault(require("@babel/runtime/helpers/classCallCheck"));
19
+
20
+ var _createClass2 = _interopRequireDefault(require("@babel/runtime/helpers/createClass"));
21
+
22
+ var _inherits2 = _interopRequireDefault(require("@babel/runtime/helpers/inherits"));
23
+
24
+ var _createSuper2 = _interopRequireDefault(require("@babel/runtime/helpers/createSuper"));
25
+
26
+ var _typeof2 = _interopRequireDefault(require("@babel/runtime/helpers/typeof"));
27
+
28
+ var _classnames = _interopRequireDefault(require("classnames"));
29
+
30
+ var _rcResizeObserver = _interopRequireDefault(require("rc-resize-observer"));
31
+
32
+ var _omit = _interopRequireDefault(require("rc-util/lib/omit"));
33
+
34
+ var React = _interopRequireWildcard(require("react"));
35
+
36
+ var _configProvider = require("antd/es/config-provider");
37
+
38
+ var _throttleByAnimationFrame = require("../_util/throttleByAnimationFrame");
39
+
40
+ var _utils = require("./utils");
41
+
42
+ var __decorate = void 0 && (void 0).__decorate || function (decorators, target, key, desc) {
43
+ var c = arguments.length,
44
+ r = c < 3 ? target : desc === null ? desc = Object.getOwnPropertyDescriptor(target, key) : desc,
45
+ d;
46
+ if ((typeof Reflect === "undefined" ? "undefined" : (0, _typeof2.default)(Reflect)) === "object" && typeof Reflect.decorate === "function") r = Reflect.decorate(decorators, target, key, desc);else for (var i = decorators.length - 1; i >= 0; i--) {
47
+ if (d = decorators[i]) r = (c < 3 ? d(r) : c > 3 ? d(target, key, r) : d(target, key)) || r;
48
+ }
49
+ return c > 3 && r && Object.defineProperty(target, key, r), r;
50
+ };
51
+
52
+ function getDefaultTarget() {
53
+ return typeof window !== 'undefined' ? window : null;
54
+ }
55
+
56
+ var AffixStatus;
57
+
58
+ (function (AffixStatus) {
59
+ AffixStatus[AffixStatus["None"] = 0] = "None";
60
+ AffixStatus[AffixStatus["Prepare"] = 1] = "Prepare";
61
+ })(AffixStatus || (AffixStatus = {}));
62
+
63
+ var Affix = /*#__PURE__*/function (_React$Component) {
64
+ (0, _inherits2.default)(Affix, _React$Component);
65
+
66
+ var _super = (0, _createSuper2.default)(Affix);
67
+
68
+ function Affix() {
69
+ var _this;
70
+
71
+ (0, _classCallCheck2.default)(this, Affix);
72
+ _this = _super.apply(this, arguments);
73
+ _this.state = {
74
+ status: AffixStatus.None,
75
+ lastAffix: false,
76
+ prevTarget: null
77
+ };
78
+
79
+ _this.getOffsetTop = function () {
80
+ var _this$props = _this.props,
81
+ offsetBottom = _this$props.offsetBottom,
82
+ offsetTop = _this$props.offsetTop;
83
+ return offsetBottom === undefined && offsetTop === undefined ? 0 : offsetTop;
84
+ };
85
+
86
+ _this.getOffsetBottom = function () {
87
+ return _this.props.offsetBottom;
88
+ };
89
+
90
+ _this.savePlaceholderNode = function (node) {
91
+ _this.placeholderNode = node;
92
+ };
93
+
94
+ _this.saveFixedNode = function (node) {
95
+ _this.fixedNode = node;
96
+ }; // =================== Measure ===================
97
+
98
+
99
+ _this.measure = function () {
100
+ var _this$state = _this.state,
101
+ status = _this$state.status,
102
+ lastAffix = _this$state.lastAffix;
103
+ var onChange = _this.props.onChange;
104
+
105
+ var targetFunc = _this.getTargetFunc();
106
+
107
+ if (status !== AffixStatus.Prepare || !_this.fixedNode || !_this.placeholderNode || !targetFunc) {
108
+ return;
109
+ }
110
+
111
+ var offsetTop = _this.getOffsetTop();
112
+
113
+ var offsetBottom = _this.getOffsetBottom();
114
+
115
+ var targetNode = targetFunc();
116
+
117
+ if (!targetNode) {
118
+ return;
119
+ }
120
+
121
+ var newState = {
122
+ status: AffixStatus.None
123
+ };
124
+ var targetRect = (0, _utils.getTargetRect)(targetNode);
125
+ var placeholderReact = (0, _utils.getTargetRect)(_this.placeholderNode);
126
+ var fixedTop = (0, _utils.getFixedTop)(placeholderReact, targetRect, offsetTop);
127
+ var fixedBottom = (0, _utils.getFixedBottom)(placeholderReact, targetRect, offsetBottom);
128
+
129
+ if (fixedTop !== undefined) {
130
+ newState.affixStyle = {
131
+ position: 'fixed',
132
+ top: fixedTop,
133
+ width: placeholderReact.width,
134
+ height: placeholderReact.height
135
+ };
136
+ newState.placeholderStyle = {
137
+ width: placeholderReact.width,
138
+ height: placeholderReact.height
139
+ };
140
+ } else if (fixedBottom !== undefined) {
141
+ newState.affixStyle = {
142
+ position: 'fixed',
143
+ bottom: fixedBottom,
144
+ width: placeholderReact.width,
145
+ height: placeholderReact.height
146
+ };
147
+ newState.placeholderStyle = {
148
+ width: placeholderReact.width,
149
+ height: placeholderReact.height
150
+ };
151
+ }
152
+
153
+ newState.lastAffix = !!newState.affixStyle;
154
+
155
+ if (onChange && lastAffix !== newState.lastAffix) {
156
+ onChange(newState.lastAffix);
157
+ }
158
+
159
+ _this.setState(newState);
160
+ }; // @ts-ignore TS6133
161
+
162
+
163
+ _this.prepareMeasure = function () {
164
+ // event param is used before. Keep compatible ts define here.
165
+ _this.setState({
166
+ status: AffixStatus.Prepare,
167
+ affixStyle: undefined,
168
+ placeholderStyle: undefined
169
+ }); // Test if `updatePosition` called
170
+
171
+
172
+ if (process.env.NODE_ENV === 'test') {
173
+ var onTestUpdatePosition = _this.props.onTestUpdatePosition;
174
+ onTestUpdatePosition === null || onTestUpdatePosition === void 0 ? void 0 : onTestUpdatePosition();
175
+ }
176
+ };
177
+
178
+ return _this;
179
+ }
180
+
181
+ (0, _createClass2.default)(Affix, [{
182
+ key: "getTargetFunc",
183
+ value: function getTargetFunc() {
184
+ var getTargetContainer = this.context.getTargetContainer;
185
+ var target = this.props.target;
186
+
187
+ if (target !== undefined) {
188
+ return target;
189
+ }
190
+
191
+ return getTargetContainer || getDefaultTarget;
192
+ } // Event handler
193
+
194
+ }, {
195
+ key: "componentDidMount",
196
+ value: function componentDidMount() {
197
+ var _this2 = this;
198
+
199
+ var targetFunc = this.getTargetFunc();
200
+
201
+ if (targetFunc) {
202
+ // [Legacy] Wait for parent component ref has its value.
203
+ // We should use target as directly element instead of function which makes element check hard.
204
+ this.timeout = setTimeout(function () {
205
+ (0, _utils.addObserveTarget)(targetFunc(), _this2); // Mock Event object.
206
+
207
+ _this2.updatePosition();
208
+ });
209
+ }
210
+ }
211
+ }, {
212
+ key: "componentDidUpdate",
213
+ value: function componentDidUpdate(prevProps) {
214
+ var prevTarget = this.state.prevTarget;
215
+ var targetFunc = this.getTargetFunc();
216
+ var newTarget = (targetFunc === null || targetFunc === void 0 ? void 0 : targetFunc()) || null;
217
+
218
+ if (prevTarget !== newTarget) {
219
+ (0, _utils.removeObserveTarget)(this);
220
+
221
+ if (newTarget) {
222
+ (0, _utils.addObserveTarget)(newTarget, this); // Mock Event object.
223
+
224
+ this.updatePosition();
225
+ } // eslint-disable-next-line react/no-did-update-set-state
226
+
227
+
228
+ this.setState({
229
+ prevTarget: newTarget
230
+ });
231
+ }
232
+
233
+ if (prevProps.offsetTop !== this.props.offsetTop || prevProps.offsetBottom !== this.props.offsetBottom) {
234
+ this.updatePosition();
235
+ }
236
+
237
+ this.measure();
238
+ }
239
+ }, {
240
+ key: "componentWillUnmount",
241
+ value: function componentWillUnmount() {
242
+ clearTimeout(this.timeout);
243
+ (0, _utils.removeObserveTarget)(this);
244
+ this.updatePosition.cancel(); // https://github.com/ant-design/ant-design/issues/22683
245
+
246
+ this.lazyUpdatePosition.cancel();
247
+ } // Handle realign logic
248
+
249
+ }, {
250
+ key: "updatePosition",
251
+ value: function updatePosition() {
252
+ this.prepareMeasure();
253
+ }
254
+ }, {
255
+ key: "lazyUpdatePosition",
256
+ value: function lazyUpdatePosition() {
257
+ var targetFunc = this.getTargetFunc();
258
+ var affixStyle = this.state.affixStyle; // Check position change before measure to make Safari smooth
259
+
260
+ if (targetFunc && affixStyle) {
261
+ var offsetTop = this.getOffsetTop();
262
+ var offsetBottom = this.getOffsetBottom();
263
+ var targetNode = targetFunc();
264
+
265
+ if (targetNode && this.placeholderNode) {
266
+ var targetRect = (0, _utils.getTargetRect)(targetNode);
267
+ var placeholderReact = (0, _utils.getTargetRect)(this.placeholderNode);
268
+ var fixedTop = (0, _utils.getFixedTop)(placeholderReact, targetRect, offsetTop);
269
+ var fixedBottom = (0, _utils.getFixedBottom)(placeholderReact, targetRect, offsetBottom);
270
+
271
+ if (fixedTop !== undefined && affixStyle.top === fixedTop || fixedBottom !== undefined && affixStyle.bottom === fixedBottom) {
272
+ return;
273
+ }
274
+ }
275
+ } // Directly call prepare measure since it's already throttled.
276
+
277
+
278
+ this.prepareMeasure();
279
+ } // =================== Render ===================
280
+
281
+ }, {
282
+ key: "render",
283
+ value: function render() {
284
+ var _this3 = this;
285
+
286
+ var _this$state2 = this.state,
287
+ affixStyle = _this$state2.affixStyle,
288
+ placeholderStyle = _this$state2.placeholderStyle;
289
+ var _this$props2 = this.props,
290
+ affixPrefixCls = _this$props2.affixPrefixCls,
291
+ children = _this$props2.children;
292
+ var className = (0, _classnames.default)((0, _defineProperty2.default)({}, affixPrefixCls, !!affixStyle));
293
+ var props = (0, _omit.default)(this.props, ['prefixCls', 'offsetTop', 'offsetBottom', 'target', 'onChange', 'affixPrefixCls']); // Omit this since `onTestUpdatePosition` only works on test.
294
+
295
+ if (process.env.NODE_ENV === 'test') {
296
+ props = (0, _omit.default)(props, ['onTestUpdatePosition']);
297
+ }
298
+
299
+ return /*#__PURE__*/React.createElement(_rcResizeObserver.default, {
300
+ onResize: function onResize() {
301
+ _this3.updatePosition();
302
+ }
303
+ }, /*#__PURE__*/React.createElement("div", Object.assign({}, props, {
304
+ ref: this.savePlaceholderNode
305
+ }), affixStyle && /*#__PURE__*/React.createElement("div", {
306
+ style: placeholderStyle,
307
+ "aria-hidden": "true"
308
+ }), /*#__PURE__*/React.createElement("div", {
309
+ className: className,
310
+ ref: this.saveFixedNode,
311
+ style: affixStyle
312
+ }, /*#__PURE__*/React.createElement(_rcResizeObserver.default, {
313
+ onResize: function onResize() {
314
+ _this3.updatePosition();
315
+ }
316
+ }, children))));
317
+ }
318
+ }]);
319
+ return Affix;
320
+ }(React.Component);
321
+
322
+ Affix.contextType = _configProvider.ConfigContext;
323
+
324
+ __decorate([(0, _throttleByAnimationFrame.throttleByAnimationFrameDecorator)()], Affix.prototype, "updatePosition", null);
325
+
326
+ __decorate([(0, _throttleByAnimationFrame.throttleByAnimationFrameDecorator)()], Affix.prototype, "lazyUpdatePosition", null);
327
+
328
+ var AffixFC = /*#__PURE__*/React.forwardRef(function (props, ref) {
329
+ var customizePrefixCls = props.prefixCls;
330
+
331
+ var _React$useContext = React.useContext(_configProvider.ConfigContext),
332
+ getPrefixCls = _React$useContext.getPrefixCls;
333
+
334
+ var affixPrefixCls = getPrefixCls('affix', customizePrefixCls);
335
+ var affixProps = Object.assign(Object.assign({}, props), {
336
+ affixPrefixCls: affixPrefixCls
337
+ });
338
+ return /*#__PURE__*/React.createElement(Affix, Object.assign({}, affixProps, {
339
+ ref: ref
340
+ }));
341
+ });
342
+ AffixFC.AntdAffix = _affix.default;
343
+
344
+ if (process.env.NODE_ENV !== 'production') {
345
+ AffixFC.displayName = 'Affix';
346
+ }
347
+
348
+ var _default = AffixFC;
349
+ exports.default = _default;