@autobest-ui/components 2.13.12 → 2.14.1

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (111) hide show
  1. package/esm/affix/index.d.ts +0 -10
  2. package/esm/affix/index.js +9 -50
  3. package/esm/carousel/index.d.ts +4 -0
  4. package/esm/carousel/index.js +10 -1
  5. package/esm/checkbox/Checkbox.js +3 -19
  6. package/esm/checkbox/style/index.css +1 -1
  7. package/esm/confirm/style/index.css +1 -1
  8. package/esm/index.d.ts +6 -0
  9. package/esm/index.js +4 -1
  10. package/esm/input/Adorn.d.ts +4 -0
  11. package/esm/input/Adorn.js +7 -3
  12. package/esm/input/Input.d.ts +1 -0
  13. package/esm/input/Input.js +5 -1
  14. package/esm/input/TextArea.d.ts +1 -0
  15. package/esm/input/TextArea.js +4 -1
  16. package/esm/input-number/index.d.ts +1 -0
  17. package/esm/input-number/index.js +5 -1
  18. package/esm/input-phone/index.d.ts +1 -0
  19. package/esm/input-phone/index.js +1 -0
  20. package/esm/lazy-image/index.d.ts +10 -30
  21. package/esm/lazy-image/index.js +30 -51
  22. package/esm/lazy-image/style/index.css +1 -1
  23. package/esm/loading-container/index.d.ts +1 -19
  24. package/esm/loading-container/index.js +16 -122
  25. package/esm/loading-icon/index.d.ts +1 -1
  26. package/esm/loading-icon/index.js +3 -21
  27. package/esm/modal/Affix.d.ts +4 -0
  28. package/esm/modal/Affix.js +7 -0
  29. package/esm/modal/index.d.ts +5 -19
  30. package/esm/modal/index.js +17 -18
  31. package/esm/modal/style/index.css +1 -1
  32. package/esm/move/index.d.ts +10 -0
  33. package/esm/move/index.js +12 -7
  34. package/esm/radio/Radio.js +10 -7
  35. package/esm/radio/RadioGroup.js +3 -6
  36. package/esm/radio/style/index.css +1 -1
  37. package/esm/radio/type.d.ts +0 -2
  38. package/esm/read-more/index.d.ts +92 -0
  39. package/esm/read-more/index.js +377 -0
  40. package/esm/read-more/style/index.css +1 -0
  41. package/esm/read-more-html/index.d.ts +89 -0
  42. package/esm/read-more-html/index.js +362 -0
  43. package/esm/read-more-html/style/index.css +1 -0
  44. package/esm/select/index.d.ts +0 -3
  45. package/esm/select/index.js +4 -25
  46. package/esm/select/style/index.css +1 -1
  47. package/esm/show-more/index.d.ts +27 -12
  48. package/esm/show-more/index.js +87 -41
  49. package/esm/show-more/style/index.css +1 -1
  50. package/esm/style.css +1 -1
  51. package/esm/table/style/index.css +1 -1
  52. package/esm/trigger/index.d.ts +3 -10
  53. package/esm/trigger/index.js +19 -39
  54. package/lib/affix/index.d.ts +0 -10
  55. package/lib/affix/index.js +8 -49
  56. package/lib/carousel/index.d.ts +4 -0
  57. package/lib/carousel/index.js +10 -1
  58. package/lib/checkbox/Checkbox.js +3 -19
  59. package/lib/checkbox/style/index.css +1 -1
  60. package/lib/confirm/style/index.css +1 -1
  61. package/lib/index.d.ts +6 -0
  62. package/lib/index.js +21 -0
  63. package/lib/input/Adorn.d.ts +4 -0
  64. package/lib/input/Adorn.js +7 -3
  65. package/lib/input/Input.d.ts +1 -0
  66. package/lib/input/Input.js +5 -1
  67. package/lib/input/TextArea.d.ts +1 -0
  68. package/lib/input/TextArea.js +4 -1
  69. package/lib/input-number/index.d.ts +1 -0
  70. package/lib/input-number/index.js +5 -1
  71. package/lib/input-phone/index.d.ts +1 -0
  72. package/lib/input-phone/index.js +1 -0
  73. package/lib/lazy-image/index.d.ts +10 -30
  74. package/lib/lazy-image/index.js +30 -51
  75. package/lib/lazy-image/style/index.css +1 -1
  76. package/lib/loading-container/index.d.ts +1 -19
  77. package/lib/loading-container/index.js +16 -125
  78. package/lib/loading-icon/index.d.ts +1 -1
  79. package/lib/loading-icon/index.js +3 -21
  80. package/lib/modal/Affix.d.ts +4 -0
  81. package/lib/modal/Affix.js +14 -0
  82. package/lib/modal/index.d.ts +5 -19
  83. package/lib/modal/index.js +17 -18
  84. package/lib/modal/style/index.css +1 -1
  85. package/lib/move/index.d.ts +10 -0
  86. package/lib/move/index.js +12 -7
  87. package/lib/radio/Radio.js +10 -7
  88. package/lib/radio/RadioGroup.js +3 -6
  89. package/lib/radio/style/index.css +1 -1
  90. package/lib/radio/type.d.ts +0 -2
  91. package/lib/read-more/index.d.ts +92 -0
  92. package/lib/read-more/index.js +388 -0
  93. package/lib/read-more/style/index.css +1 -0
  94. package/lib/read-more-html/index.d.ts +89 -0
  95. package/lib/read-more-html/index.js +373 -0
  96. package/lib/read-more-html/style/index.css +1 -0
  97. package/lib/select/index.d.ts +0 -3
  98. package/lib/select/index.js +4 -25
  99. package/lib/select/style/index.css +1 -1
  100. package/lib/show-more/index.d.ts +27 -12
  101. package/lib/show-more/index.js +86 -40
  102. package/lib/show-more/style/index.css +1 -1
  103. package/lib/style.css +1 -1
  104. package/lib/table/style/index.css +1 -1
  105. package/lib/trigger/index.d.ts +3 -10
  106. package/lib/trigger/index.js +19 -39
  107. package/package.json +3 -3
  108. package/esm/affix/observe.d.ts +0 -8
  109. package/esm/affix/observe.js +0 -6
  110. package/lib/affix/observe.d.ts +0 -8
  111. package/lib/affix/observe.js +0 -12
@@ -1,136 +1,27 @@
1
1
  "use strict";
2
2
 
3
3
  var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
4
- var _typeof = require("@babel/runtime/helpers/typeof");
5
4
  Object.defineProperty(exports, "__esModule", {
6
5
  value: true
7
6
  });
8
7
  exports.default = void 0;
9
- var _react = _interopRequireWildcard(require("react"));
8
+ var _react = _interopRequireDefault(require("react"));
10
9
  var _classnames = _interopRequireDefault(require("classnames"));
11
- var _utils = require("@autobest-ui/utils");
12
10
  var _loadingIcon = _interopRequireDefault(require("../loading-icon"));
13
- function _getRequireWildcardCache(nodeInterop) { if (typeof WeakMap !== "function") return null; var cacheBabelInterop = new WeakMap(); var cacheNodeInterop = new WeakMap(); return (_getRequireWildcardCache = function _getRequireWildcardCache(nodeInterop) { return nodeInterop ? cacheNodeInterop : cacheBabelInterop; })(nodeInterop); }
14
- function _interopRequireWildcard(obj, nodeInterop) { if (!nodeInterop && obj && obj.__esModule) { return obj; } if (obj === null || _typeof(obj) !== "object" && typeof obj !== "function") { return { default: obj }; } var cache = _getRequireWildcardCache(nodeInterop); if (cache && cache.has(obj)) { return cache.get(obj); } var newObj = {}; var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var key in obj) { if (key !== "default" && Object.prototype.hasOwnProperty.call(obj, key)) { var desc = hasPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : null; if (desc && (desc.get || desc.set)) { Object.defineProperty(newObj, key, desc); } else { newObj[key] = obj[key]; } } } newObj.default = obj; if (cache) { cache.set(obj, newObj); } return newObj; }
15
- var __extends = void 0 && (void 0).__extends || function () {
16
- var _extendStatics = function extendStatics(d, b) {
17
- _extendStatics = Object.setPrototypeOf || {
18
- __proto__: []
19
- } instanceof Array && function (d, b) {
20
- d.__proto__ = b;
21
- } || function (d, b) {
22
- for (var p in b) {
23
- if (Object.prototype.hasOwnProperty.call(b, p)) d[p] = b[p];
24
- }
25
- };
26
- return _extendStatics(d, b);
27
- };
28
- return function (d, b) {
29
- if (typeof b !== "function" && b !== null) throw new TypeError("Class extends value " + String(b) + " is not a constructor or null");
30
- _extendStatics(d, b);
31
- function __() {
32
- this.constructor = d;
33
- }
34
- d.prototype = b === null ? Object.create(b) : (__.prototype = b.prototype, new __());
35
- };
36
- }();
37
- var LoadingContainer = /** @class */function (_super) {
38
- __extends(LoadingContainer, _super);
39
- function LoadingContainer() {
40
- var _this = _super !== null && _super.apply(this, arguments) || this;
41
- _this.prefixCls = 'ab-loading-container';
42
- _this.wrapRef = /*#__PURE__*/(0, _react.createRef)();
43
- _this.iconRef = /*#__PURE__*/(0, _react.createRef)();
44
- _this.addScrollListener = function () {
45
- if (!_this.addScrollHandlerListener) {
46
- // 滚动监听
47
- _this.addScrollHandlerListener = (0, _utils.addEventListener)(window, 'scroll', (0, _utils.throttleWithRAF)(_this.onHandlerScroll));
48
- }
49
- };
50
- _this.removeScrollListener = function () {
51
- if (_this.addScrollHandlerListener) {
52
- _this.addScrollHandlerListener();
53
- _this.addScrollHandlerListener = null;
54
- }
55
- };
56
- _this.setIconTopStyle = function (top) {
57
- _this.iconRef.current.style.top = top;
58
- };
59
- _this.onHandlerScroll = function () {
60
- var wrapElement = _this.wrapRef.current;
61
- if (!_this.props.loadingInView || !_this.props.loading || !wrapElement) {
62
- return;
63
- }
64
- var iconElement = _this.iconRef.current;
65
- if (!(0, _utils.isInViewArea)(wrapElement) || !iconElement) {
66
- // 组件在可视区域外
67
- return;
68
- }
69
- var halfIconHeight = (0, _utils.getElementSize)(iconElement).height / 2;
70
- var _a = (0, _utils.getOffsetAndSize)(wrapElement, true),
71
- top = _a.top,
72
- height = _a.height;
73
- var bottom = top + height;
74
- if (top >= 0 && bottom <= window.innerHeight) {
75
- // 整个组件都在可视区域内,直接在组件内居中显示LoadingIcon
76
- _this.setIconTopStyle('50%');
77
- return;
78
- }
79
- if (top < 0 && bottom > window.innerHeight) {
80
- // 组件超出浏览器可视区域,在浏览器可视区域居中显示LoadingIcon
81
- _this.setIconTopStyle("".concat(window.innerHeight / 2 - top, "px"));
82
- return;
83
- }
84
- if (top < 0) {
85
- // 组件上半部分超出可视区域
86
- var iconTop_1 = bottom / 2 - top;
87
- _this.setIconTopStyle("".concat(iconTop_1 > height - halfIconHeight ? height - halfIconHeight : iconTop_1, "px"));
88
- return;
89
- }
90
- // 组件下半部分超出可视区域
91
- var iconTop = (window.innerHeight - top) / 2;
92
- _this.setIconTopStyle("".concat(iconTop < halfIconHeight ? halfIconHeight : iconTop, "px"));
93
- };
94
- return _this;
95
- }
96
- LoadingContainer.prototype.componentDidMount = function () {
97
- if (this.props.loadingInView && this.props.loading) {
98
- this.onHandlerScroll();
99
- this.addScrollListener();
100
- }
101
- };
102
- LoadingContainer.prototype.componentDidUpdate = function (prevProps) {
103
- if (prevProps.loading !== this.props.loading || prevProps.loadingInView !== this.props.loadingInView) {
104
- if (this.props.loadingInView && this.props.loading) {
105
- this.onHandlerScroll();
106
- this.addScrollListener();
107
- return;
108
- }
109
- this.removeScrollListener();
110
- }
111
- };
112
- LoadingContainer.prototype.componentWillUnmount = function () {
113
- this.removeScrollListener();
114
- };
115
- LoadingContainer.prototype.render = function () {
116
- var _a;
117
- var cls = this.prefixCls;
118
- var _b = this.props,
119
- _c = _b.loading,
120
- loading = _c === void 0 ? false : _c,
121
- className = _b.className,
122
- children = _b.children;
123
- return /*#__PURE__*/_react.default.createElement("div", {
124
- className: (0, _classnames.default)(className, cls, (_a = {}, _a["".concat(cls, "-active")] = loading, _a)),
125
- ref: this.wrapRef
126
- }, children, loading && /*#__PURE__*/_react.default.createElement("div", {
127
- className: "".concat(cls, "-icon-box")
128
- }, /*#__PURE__*/_react.default.createElement(_loadingIcon.default, {
129
- className: "".concat(cls, "-icon"),
130
- ref: this.iconRef
131
- })));
132
- };
133
- return LoadingContainer;
134
- }(_react.default.Component);
11
+ var cls = 'ab-loading-container';
12
+ function LoadingContainer(props) {
13
+ var _a;
14
+ var _b = props.loading,
15
+ loading = _b === void 0 ? false : _b,
16
+ className = props.className,
17
+ children = props.children;
18
+ return /*#__PURE__*/_react.default.createElement("div", {
19
+ className: (0, _classnames.default)(className, cls, (_a = {}, _a["".concat(cls, "-active")] = loading, _a))
20
+ }, children, loading && /*#__PURE__*/_react.default.createElement("div", {
21
+ className: "".concat(cls, "-icon-box")
22
+ }, /*#__PURE__*/_react.default.createElement(_loadingIcon.default, {
23
+ className: "".concat(cls, "-icon")
24
+ })));
25
+ }
135
26
  var _default = LoadingContainer;
136
27
  exports.default = _default;
@@ -2,5 +2,5 @@ import React from 'react';
2
2
  export interface LoadingIconProps {
3
3
  className?: string;
4
4
  }
5
- declare const _default: React.MemoExoticComponent<React.ForwardRefExoticComponent<LoadingIconProps & React.RefAttributes<HTMLSpanElement>>>;
5
+ declare const _default: React.MemoExoticComponent<(props: LoadingIconProps) => JSX.Element>;
6
6
  export default _default;
@@ -7,25 +7,11 @@ Object.defineProperty(exports, "__esModule", {
7
7
  exports.default = void 0;
8
8
  var _react = _interopRequireDefault(require("react"));
9
9
  var _classnames = _interopRequireDefault(require("classnames"));
10
- var __assign = void 0 && (void 0).__assign || function () {
11
- __assign = Object.assign || function (t) {
12
- for (var s, i = 1, n = arguments.length; i < n; i++) {
13
- s = arguments[i];
14
- for (var p in s) {
15
- if (Object.prototype.hasOwnProperty.call(s, p)) t[p] = s[p];
16
- }
17
- }
18
- return t;
19
- };
20
- return __assign.apply(this, arguments);
21
- };
22
10
  var cls = 'ab-svg-loading';
23
11
  var LoadingIcon = function LoadingIcon(props) {
24
- var className = props.className,
25
- upperRef = props.upperRef;
12
+ var className = props.className;
26
13
  return /*#__PURE__*/_react.default.createElement("span", {
27
- className: (0, _classnames.default)(className, cls),
28
- ref: upperRef
14
+ className: (0, _classnames.default)(className, cls)
29
15
  }, /*#__PURE__*/_react.default.createElement("svg", {
30
16
  xmlns: "http://www.w3.org/2000/svg",
31
17
  width: "24",
@@ -74,9 +60,5 @@ var LoadingIcon = function LoadingIcon(props) {
74
60
  fill: "#fff"
75
61
  })));
76
62
  };
77
- var _default = /*#__PURE__*/_react.default.memo( /*#__PURE__*/_react.default.forwardRef(function (props, ref) {
78
- return /*#__PURE__*/_react.default.createElement(LoadingIcon, __assign({}, props, {
79
- upperRef: ref
80
- }));
81
- }));
63
+ var _default = /*#__PURE__*/_react.default.memo(LoadingIcon);
82
64
  exports.default = _default;
@@ -0,0 +1,4 @@
1
+ /// <reference types="react" />
2
+ import { PortalProps } from '../portal';
3
+ export declare type AffixProps = Required<Omit<PortalProps, 'didUpdate'>>;
4
+ export default function Affix(props: AffixProps): JSX.Element;
@@ -0,0 +1,14 @@
1
+ "use strict";
2
+
3
+ var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
4
+ Object.defineProperty(exports, "__esModule", {
5
+ value: true
6
+ });
7
+ exports.default = Affix;
8
+ var _react = _interopRequireDefault(require("react"));
9
+ var _portal = _interopRequireDefault(require("../portal"));
10
+ function Affix(props) {
11
+ return /*#__PURE__*/_react.default.createElement(_portal.default, {
12
+ getContainer: props.getContainer
13
+ }, props.children);
14
+ }
@@ -1,4 +1,4 @@
1
- import React, { CSSProperties } from 'react';
1
+ import React from 'react';
2
2
  import { AddListenerEventRemoveHandler } from '@autobest-ui/utils';
3
3
  declare type PrevPopupSize = {
4
4
  width: number;
@@ -35,22 +35,9 @@ export interface ModalProps {
35
35
  popupLimitSpacing?: number;
36
36
  /**
37
37
  * 当写成`auto`时, 宽度是全屏
38
- * 默认值为6.5rem
39
38
  */
40
- width?: CSSProperties['width'];
41
- /**
42
- * 固定弹出框高度
43
- * 默认值为auto
44
- */
45
- height?: CSSProperties['height'];
46
- /**
47
- * 弹出框最小高度
48
- */
49
- minHeight?: CSSProperties['minHeight'];
50
- /**
51
- * 弹出框z-index层级
52
- */
53
- zIndex?: CSSProperties['zIndex'];
39
+ width?: string;
40
+ height?: string;
54
41
  /**
55
42
  * 弹框到顶部距离(只有在placement="top"时,有作用)
56
43
  */
@@ -90,6 +77,7 @@ interface ModalStates {
90
77
  cacheVisible: boolean;
91
78
  }
92
79
  declare class Modal extends React.Component<ModalProps, ModalStates> {
80
+ static Affix: React.ComponentType<Required<Omit<import("../portal").PortalProps, "didUpdate">>>;
93
81
  static cacheOpenedIds: number[];
94
82
  openId: number;
95
83
  prefixCls: string;
@@ -98,9 +86,7 @@ declare class Modal extends React.Component<ModalProps, ModalStates> {
98
86
  placement: string;
99
87
  width: string;
100
88
  height: string;
101
- minHeight: string;
102
89
  top: string;
103
- zIndex: number;
104
90
  popupLimitSpacing: number;
105
91
  closable: boolean;
106
92
  maskClosable: boolean;
@@ -127,7 +113,7 @@ declare class Modal extends React.Component<ModalProps, ModalStates> {
127
113
  */
128
114
  onDocumentClick: (event: any) => void;
129
115
  clearOutsideHandler(): void;
130
- clearPopupTimer: () => void;
116
+ clearPopupTimer: (popupEl?: HTMLElement) => void;
131
117
  getPopupDomNode(): HTMLDivElement;
132
118
  getMaskDomNode(): HTMLDivElement;
133
119
  onClose: (event: any, isOutsideClick?: boolean) => void;
@@ -12,6 +12,7 @@ var _utils = require("@autobest-ui/utils");
12
12
  var _portal = _interopRequireDefault(require("../portal"));
13
13
  var _mask = _interopRequireDefault(require("../mask"));
14
14
  var _Title = _interopRequireDefault(require("./Title"));
15
+ var _Affix = _interopRequireDefault(require("./Affix"));
15
16
  var _getPopupLocation = _interopRequireDefault(require("./getPopupLocation"));
16
17
  var __extends = void 0 && (void 0).__extends || function () {
17
18
  var _extendStatics = function extendStatics(d, b) {
@@ -74,8 +75,12 @@ var Modal = /** @class */function (_super) {
74
75
  _this.onClose(target, true);
75
76
  }
76
77
  };
77
- _this.clearPopupTimer = function () {
78
+ _this.clearPopupTimer = function (popupEl) {
78
79
  clearTimeout(_this.popupTimer);
80
+ var element = popupEl || _this.getPopupDomNode();
81
+ if (element) {
82
+ element.style.visibility = '';
83
+ }
79
84
  };
80
85
  _this.onClose = function (event, isOutsideClick) {
81
86
  if (isOutsideClick === void 0) {
@@ -95,11 +100,11 @@ var Modal = /** @class */function (_super) {
95
100
  if (!element) {
96
101
  return;
97
102
  }
98
- if (element.parentNode) {
103
+ if (element && element.parentNode) {
99
104
  var parentNode = element.parentNode;
100
105
  parentNode.style.display = 'block';
101
106
  }
102
- _this.clearPopupTimer();
107
+ _this.clearPopupTimer(element);
103
108
  var _a = _this.props,
104
109
  placement = _a.placement,
105
110
  hiddenScroll = _a.hiddenScroll,
@@ -143,7 +148,7 @@ var Modal = /** @class */function (_super) {
143
148
  lastChild.style.overflow = 'auto';
144
149
  var popupHeight = height || _this.props.height;
145
150
  if (!popupHeight || popupHeight === 'auto') {
146
- lastChild.style.maxHeight = "calc(100vh - ".concat(popupLimitSpacing * 2, "px - ").concat(placement === 'top' && top ? top : '0px', " - ").concat(firstChildHeight, "px)");
151
+ lastChild.style.maxHeight = "calc(100vh - .3rem - ".concat(placement === 'top' && top ? top : '0px', " - ").concat(firstChildHeight, "px)");
147
152
  } else {
148
153
  lastChild.style.maxHeight = "calc(100% - ".concat(firstChildHeight, "px)");
149
154
  }
@@ -242,9 +247,11 @@ var Modal = /** @class */function (_super) {
242
247
  width = _a.width,
243
248
  height = _a.height;
244
249
  if (prevPopupSize.width !== width || prevPopupSize.height !== height) {
245
- this.clearPopupTimer();
250
+ this.clearPopupTimer(popupEl);
251
+ popupEl.style.visibility = 'hidden';
246
252
  this.popupTimer = setTimeout(function () {
247
253
  _this.onEnter(popupEl);
254
+ popupEl.style.visibility = '';
248
255
  });
249
256
  }
250
257
  }
@@ -287,20 +294,14 @@ var Modal = /** @class */function (_super) {
287
294
  children = _b.children,
288
295
  width = _b.width,
289
296
  height = _b.height,
290
- minHeight = _b.minHeight,
291
- zIndex = _b.zIndex,
292
297
  className = _b.className,
293
298
  closable = _b.closable,
294
299
  title = _b.title,
295
300
  placement = _b.placement,
296
- top = _b.top,
297
- popupLimitSpacing = _b.popupLimitSpacing;
298
- var maxHeight = "calc(100vh - ".concat(popupLimitSpacing * 2, "px - ").concat(placement === 'top' && top ? top : '0px', ")");
301
+ top = _b.top;
302
+ var maxHeight = "calc(100vh - .3rem - ".concat(placement === 'top' && top ? top : '0px', ")");
299
303
  return /*#__PURE__*/_react.default.createElement("div", {
300
- className: (0, _classnames.default)(cls, className, (_a = {}, _a["".concat(cls, "-center")] = placement === 'center', _a["".concat(this.prefixCls, "-hidden")] = !visible && !this.state.isUserOperated, _a)),
301
- style: {
302
- zIndex: zIndex
303
- }
304
+ className: (0, _classnames.default)(cls, className, (_a = {}, _a["".concat(cls, "-center")] = placement === 'center', _a["".concat(this.prefixCls, "-hidden")] = !visible && !this.state.isUserOperated, _a))
304
305
  }, /*#__PURE__*/_react.default.createElement(_reactTransitionGroup.CSSTransition, {
305
306
  in: visible,
306
307
  timeout: 300,
@@ -315,8 +316,7 @@ var Modal = /** @class */function (_super) {
315
316
  style: state !== 'exited' ? {
316
317
  width: width,
317
318
  height: height,
318
- maxHeight: maxHeight,
319
- minHeight: minHeight
319
+ maxHeight: maxHeight
320
320
  } : undefined,
321
321
  ref: _this.popupRef
322
322
  }, /*#__PURE__*/_react.default.createElement(_Title.default, {
@@ -348,15 +348,14 @@ var Modal = /** @class */function (_super) {
348
348
  }
349
349
  return null;
350
350
  };
351
+ Modal.Affix = _Affix.default;
351
352
  Modal.cacheOpenedIds = [];
352
353
  // 默认值
353
354
  Modal.defaultProps = {
354
355
  placement: 'center',
355
356
  width: '6.5rem',
356
357
  height: 'auto',
357
- minHeight: '',
358
358
  top: '10%',
359
- zIndex: 101,
360
359
  popupLimitSpacing: 14,
361
360
  closable: true,
362
361
  maskClosable: true,
@@ -1 +1 @@
1
- .ab-mask{position:fixed;top:0;left:0;z-index:101;width:100%;height:100%;background-color:rgba(0,0,0,.45);transition:opacity .4s cubic-bezier(.7,.3,.1,1)}.ab-mask-fade-appear,.ab-mask-fade-enter{opacity:0}.ab-mask-fade-appear-active,.ab-mask-fade-enter-active,.ab-mask-fade-enter-done,.ab-mask-fade-exit{opacity:1}.ab-mask-fade-exit-active{opacity:0}.ab-mask-fade-exit-done{display:none}.ab-modal{position:fixed;top:0;right:0;bottom:0;left:0;overflow:auto;outline:0}.ab-modal.ab-modal-center{text-align:center}.ab-modal.ab-modal-center::before{display:inline-block;width:0;height:100%;vertical-align:middle;content:""}.ab-modal.ab-modal-center .ab-modal-content{top:0;text-align:left;display:inline-block;vertical-align:middle}.ab-modal-content{position:relative;background-color:#fff;max-width:calc(100vw - .3rem);margin-left:auto;margin-right:auto;overflow:auto;-webkit-overflow-scrolling:touch;transition:transform .3s,opacity .3s cubic-bezier(.7,.3,.1,1);z-index:101}.ab-modal-title{position:relative;width:100%}.ab-modal-title .ab-modal-times{top:50%;transform:translateY(-50%)}.ab-modal-times{position:absolute;top:.12rem;right:.12rem;font-size:.15rem;color:#b0b0b0;cursor:pointer}.ab-modal-times svg{display:block}.ab-modal-times:hover{color:#333}.ab-modal-hidden{display:none}@media only screen and (max-width:767px){.ab-modal-content{width:calc(100vw - .3rem)}}.ab-modal-fade-appear,.ab-modal-fade-enter{transform:translate3d(0,-30px,0);opacity:0}.ab-modal-fade-appear-active,.ab-modal-fade-enter-active,.ab-modal-fade-enter-done,.ab-modal-fade-exit{transform:translateZ(0);opacity:1}.ab-modal-fade-exit-active{transform:translate3d(0,-30px,0);opacity:0}.ab-modal-fade-exit-done{display:none}
1
+ .ab-mask{position:fixed;top:0;left:0;z-index:101;width:100%;height:100%;background-color:rgba(0,0,0,.45);transition:opacity .4s cubic-bezier(.7,.3,.1,1)}.ab-mask-fade-appear,.ab-mask-fade-enter{opacity:0}.ab-mask-fade-appear-active,.ab-mask-fade-enter-active,.ab-mask-fade-enter-done,.ab-mask-fade-exit{opacity:1}.ab-mask-fade-exit-active{opacity:0}.ab-mask-fade-exit-done{display:none}.ab-modal{position:fixed;top:0;right:0;bottom:0;left:0;z-index:101;overflow:auto;outline:0}.ab-modal.ab-modal-center{text-align:center}.ab-modal.ab-modal-center::before{display:inline-block;width:0;height:100%;vertical-align:middle;content:""}.ab-modal.ab-modal-center .ab-modal-content{top:0;text-align:left;display:inline-block;vertical-align:middle}.ab-modal-content{position:relative;background-color:#fff;max-width:calc(100vw - .3rem);margin-left:auto;margin-right:auto;overflow:auto;-webkit-overflow-scrolling:touch;transition:transform .3s,opacity .3s cubic-bezier(.7,.3,.1,1);z-index:101}.ab-modal-title{position:relative;width:100%}.ab-modal-title .ab-modal-times{top:50%;transform:translateY(-50%)}.ab-modal-times{position:absolute;top:.12rem;right:.12rem;font-size:.15rem;color:#b0b0b0;cursor:pointer}.ab-modal-times svg{display:block}.ab-modal-times:hover{color:#333}.ab-modal-hidden{display:none}@media only screen and (max-width:767px){.ab-modal-content{width:calc(100vw - .3rem)}}.ab-modal-fade-appear,.ab-modal-fade-enter{transform:translate3d(0,-30px,0);opacity:0}.ab-modal-fade-appear-active,.ab-modal-fade-enter-active,.ab-modal-fade-enter-done,.ab-modal-fade-exit{transform:translateZ(0);opacity:1}.ab-modal-fade-exit-active{transform:translate3d(0,-30px,0);opacity:0}.ab-modal-fade-exit-done{display:none}
@@ -36,6 +36,14 @@ export interface MoveProps {
36
36
  * 点击的回调函数, 如果移动,则不是click
37
37
  */
38
38
  onClick?: (event: any) => void;
39
+ /**
40
+ * 禁止水平方向的移动
41
+ */
42
+ horizontalMoveDisabled?: boolean;
43
+ /**
44
+ * 禁止垂直方向的移动
45
+ */
46
+ verticalMoveDisabled?: boolean;
39
47
  }
40
48
  declare class Move extends React.Component<MoveProps> {
41
49
  readonly prefixCls = "ab-move";
@@ -46,6 +54,8 @@ declare class Move extends React.Component<MoveProps> {
46
54
  maxScalable: number;
47
55
  horizontalPlacement: string;
48
56
  verticalPlacement: string;
57
+ horizontalMoveDisabled: boolean;
58
+ verticalMoveDisabled: boolean;
49
59
  };
50
60
  prevElementSize: {
51
61
  width: number;
package/lib/move/index.js CHANGED
@@ -215,13 +215,16 @@ var Move = /** @class */function (_super) {
215
215
  if (_this.isTouchScale && event.touches.length <= 1) {
216
216
  return;
217
217
  }
218
+ var _a = _this.props,
219
+ horizontalMoveDisabled = _a.horizontalMoveDisabled,
220
+ verticalMoveDisabled = _a.verticalMoveDisabled;
218
221
  _this.moveObj = {
219
222
  left: event.touches ? event.touches[0].pageX : event.clientX,
220
223
  top: event.touches ? event.touches[0].pageY : event.clientY
221
224
  };
222
225
  _this.currentObj = {
223
- left: _this.prevObj.left + _this.moveObj.left - _this.startObj.left,
224
- top: _this.prevObj.top + _this.moveObj.top - _this.startObj.top
226
+ left: horizontalMoveDisabled ? _this.prevObj.left : _this.prevObj.left + _this.moveObj.left - _this.startObj.left,
227
+ top: verticalMoveDisabled ? _this.prevObj.top : _this.prevObj.top + _this.moveObj.top - _this.startObj.top
225
228
  };
226
229
  _this.setElementInfo(element);
227
230
  };
@@ -233,6 +236,10 @@ var Move = /** @class */function (_super) {
233
236
  if (event.stopPropagation) {
234
237
  event.stopPropagation();
235
238
  }
239
+ var onClick = _this.props.onClick;
240
+ if (onClick && _this.currentObj.left === _this.prevObj.left && _this.currentObj.top === _this.prevObj.top && _this.prevScaleSize === _this.currentScaleSize) {
241
+ onClick(event);
242
+ }
236
243
  var _a = _this.checkRange(),
237
244
  nextX = _a.nextX,
238
245
  nextY = _a.nextY,
@@ -247,10 +254,6 @@ var Move = /** @class */function (_super) {
247
254
  _this.currentScaleSize = nextScaleSize;
248
255
  _this.setElementInfo(element);
249
256
  }
250
- var onClick = _this.props.onClick;
251
- if (onClick && _this.currentObj.left === _this.prevObj.left && _this.currentObj.top === _this.prevObj.top && _this.prevScaleSize === _this.currentScaleSize) {
252
- onClick(event);
253
- }
254
257
  };
255
258
  _this.onTransitionEnd = function () {
256
259
  var element = _this.getDomNode();
@@ -385,7 +388,9 @@ var Move = /** @class */function (_super) {
385
388
  minScalable: 1,
386
389
  maxScalable: 1,
387
390
  horizontalPlacement: 'left',
388
- verticalPlacement: 'top'
391
+ verticalPlacement: 'top',
392
+ horizontalMoveDisabled: false,
393
+ verticalMoveDisabled: false
389
394
  };
390
395
  return Move;
391
396
  }(_react.default.Component);
@@ -60,13 +60,14 @@ var Radio = function Radio(props) {
60
60
  if (mergedProps.disabled) {
61
61
  return;
62
62
  }
63
+ var checkedValue = ev.target.value;
63
64
  if (onChange) {
64
- onChange(value, mergedProps.name, ev.target.checked);
65
+ onChange(checkedValue, mergedProps.name, ev.target.checked);
65
66
  return;
66
67
  }
67
68
  // radioGroup
68
69
  if (groupContext.onChange) {
69
- groupContext.onChange(value, mergedProps.name);
70
+ groupContext.onChange(checkedValue, mergedProps.name);
70
71
  return;
71
72
  }
72
73
  setChecked(!checked);
@@ -84,6 +85,7 @@ var Radio = function Radio(props) {
84
85
  },
85
86
  type: "radio",
86
87
  checked: checked,
88
+ value: value,
87
89
  onChange: onRadioChange
88
90
  }, mergedProps)), /*#__PURE__*/_react.default.createElement("span", {
89
91
  className: "".concat(cls, "-control"),
@@ -96,21 +98,22 @@ var Radio = function Radio(props) {
96
98
  className: "".concat(cls, "-outer"),
97
99
  focusable: "false",
98
100
  "aria-hidden": "true",
99
- viewBox: "0 0 20 20"
101
+ viewBox: "0 0 512 512"
100
102
  }, /*#__PURE__*/_react.default.createElement("path", {
101
- stroke: "none",
102
- d: "M10 0C4.48 0 0 4.48 0 10s4.48 10 10 10 10-4.48 10-10S15.52 0 10 0zm0 18c-4.42 0-8-3.58-8-8s3.58-8 8-8 8 3.58 8 8-3.58 8-8 8z"
103
+ d: "M448,256c0-106-86-192-192-192S64,150,64,256s86,192,192,192S448,362,448,256Z",
104
+ strokeWidth: "1.5em",
105
+ fill: "#fff"
103
106
  })), /*#__PURE__*/_react.default.createElement("svg", {
104
107
  className: "".concat(cls, "-dot"),
105
108
  focusable: "false",
106
109
  "aria-hidden": "true",
107
110
  viewBox: "0 0 24 24"
108
111
  }, /*#__PURE__*/_react.default.createElement("path", {
109
- d: "M12 6a6 6 0 100 12 6 6 0 000-12Z"
112
+ d: "M8.465 8.465C9.37 7.56 10.62 7 12 7C14.76 7 17 9.24 17 12C17 13.38 16.44 14.63 15.535 15.535C14.63 16.44 13.38 17 12 17C9.24 17 7 14.76 7 12C7 10.62 7.56 9.37 8.465 8.465Z"
110
113
  }))), children);
111
114
  };
112
115
  Radio.defaultProps = {
113
- size: 13
116
+ size: 16
114
117
  };
115
118
  var _default = Radio;
116
119
  exports.default = _default;
@@ -7,7 +7,6 @@ Object.defineProperty(exports, "__esModule", {
7
7
  });
8
8
  exports.default = void 0;
9
9
  var _react = _interopRequireWildcard(require("react"));
10
- var _classnames = _interopRequireDefault(require("classnames"));
11
10
  var _utils = require("@autobest-ui/utils");
12
11
  var _context = require("./context");
13
12
  var _Radio = _interopRequireDefault(require("./Radio"));
@@ -106,12 +105,10 @@ var RadioGroup = /** @class */function (_super) {
106
105
  return null;
107
106
  };
108
107
  RadioGroup.prototype.render = function () {
109
- var _a = this.props,
110
- _b = _a.direction,
111
- direction = _b === void 0 ? 'horizontal' : _b,
112
- className = _a.className;
108
+ var _a = this.props.direction,
109
+ direction = _a === void 0 ? 'horizontal' : _a;
113
110
  return /*#__PURE__*/_react.default.createElement("div", {
114
- className: (0, _classnames.default)(className, "".concat(cls, "-group-").concat(direction))
111
+ className: "".concat(cls, "-group-").concat(direction)
115
112
  }, 'options' in this.props ? this.renderRadioList() : this.renderRadioGroup());
116
113
  };
117
114
  return RadioGroup;
@@ -1 +1 @@
1
- .ab-radio{position:relative;display:inline-flex;align-items:center;cursor:pointer}.ab-radio:hover .ab-radio-control{color:#4f4f4f}.ab-radio input{cursor:inherit;position:absolute;margin:0;padding:0;opacity:0;top:50%;left:0;transform:translateY(-50%);z-index:1}.ab-radio-checked:hover .ab-radio-control{color:#005cc8}.ab-radio-checked .ab-radio-control{color:#0075ff}.ab-radio-checked .ab-radio-control svg{display:inline-block}.ab-radio-disabled{cursor:not-allowed}.ab-radio-disabled .ab-radio-control,.ab-radio-disabled:hover .ab-radio-control{color:#d1d1d1}.ab-radio-control{margin-right:.06rem;position:relative;color:#767676;flex-shrink:0}.ab-radio-control svg{width:1em;height:1em;user-select:none;flex-shrink:0;fill:currentcolor;stroke:currentcolor;overflow:visible}.ab-radio-dot,.ab-radio-outer{position:absolute;left:0;top:0}.ab-radio-dot{display:none}.ab-radio-group-horizontal{display:flex}.ab-radio-group-horizontal .ab-radio-item{margin-right:.2rem}.ab-radio-group-horizontal .ab-radio-item:last-child{margin-right:0}.ab-radio-group-vertical{display:flex;flex-direction:column;align-items:flex-start}.ab-radio-group-vertical .ab-radio-item{margin-bottom:.15rem}.ab-radio-group-vertical .ab-radio-item:last-child{margin-bottom:0}
1
+ .ab-radio{position:relative;overflow:hidden;display:inline-flex;align-items:center;cursor:pointer;font-size:.14rem}.ab-radio:hover .ab-radio-control{color:#4f4f4f}.ab-radio input{cursor:inherit;position:absolute;margin:0;padding:0;opacity:0;top:0;left:0;z-index:1}.ab-radio-checked:hover .ab-radio-control{color:#005cc8}.ab-radio-checked .ab-radio-control{color:#0075ff}.ab-radio-checked .ab-radio-control svg{display:inline-block}.ab-radio-disabled{cursor:not-allowed}.ab-radio-disabled .ab-radio-control,.ab-radio-disabled:hover .ab-radio-control{color:#d1d1d1}.ab-radio-control{margin-right:.06rem;position:relative;color:#767676}.ab-radio-control svg{width:1em;height:1em;user-select:none;flex-shrink:0;fill:currentcolor;stroke:currentcolor}.ab-radio-dot,.ab-radio-outer{position:absolute;left:0;top:0}.ab-radio-dot{display:none}.ab-radio-group-horizontal{display:flex}.ab-radio-group-horizontal .ab-radio-item{margin-right:.2rem}.ab-radio-group-horizontal .ab-radio-item:last-child{margin-right:0}.ab-radio-group-vertical{display:flex;flex-direction:column}.ab-radio-group-vertical .ab-radio-item{margin-bottom:.15rem}.ab-radio-group-vertical .ab-radio-item:last-child{margin-bottom:0}
@@ -1,4 +1,3 @@
1
- import { ReactChild } from 'react';
2
1
  export declare type RadioValue = string | number;
3
2
  export interface RadioProps {
4
3
  name?: string;
@@ -9,7 +8,6 @@ export interface RadioProps {
9
8
  size?: number;
10
9
  onChange?: (value: RadioValue, name?: string, checked?: boolean) => void;
11
10
  className?: string;
12
- children?: ReactChild | ReactChild[];
13
11
  }
14
12
  export declare type RadioOptionItem = Pick<RadioProps, 'disabled' | 'name' | 'value'>;
15
13
  export interface RadioGroupProps extends Pick<RadioProps, 'value' | 'name' | 'disabled' | 'className' | 'size'> {
@@ -0,0 +1,92 @@
1
+ import React, { Component } from 'react';
2
+ export interface ReadMoreProps {
3
+ /**
4
+ * 需要显示的内容
5
+ */
6
+ children: React.ReactChild[] | React.ReactChild;
7
+ /**
8
+ * 整体样式
9
+ */
10
+ className?: string;
11
+ /**
12
+ * 需要忽略的类名数组,例如 ['mc_title']
13
+ */
14
+ ignoreClassList?: string[];
15
+ /**
16
+ * 展开文本
17
+ */
18
+ expandText?: string;
19
+ /**
20
+ * 折叠文本, 展开后点击收起的文字
21
+ */
22
+ collapseText?: string;
23
+ /**
24
+ * 初始时,显示的行数
25
+ */
26
+ lines?: number;
27
+ /**
28
+ * 是否执行resizeObserver监听宽度变化
29
+ */
30
+ isResizeObserver?: boolean;
31
+ /**
32
+ * 垂直方向触发换行的判定阈值 (默认 1px), 当一行中有字体,大小不同时,需要根据情况动态触发换行
33
+ */
34
+ lineThreshold?: number;
35
+ /**
36
+ * [不推荐]设置Wrap最大高度, 用于解决初始化时页面抖动问题,建议通过屏幕大小动态设置className
37
+ */
38
+ defaultWrapMaxHeight?: number;
39
+ /**
40
+ * 右下角按钮宽度
41
+ */
42
+ buttonWidth?: number;
43
+ /**
44
+ * 默认是否折叠
45
+ */
46
+ defaultCollapsed?: boolean;
47
+ /**
48
+ * 点击展开/收起前的回调函数,返回false时阻止change
49
+ */
50
+ onBeforeChange?: (isCollapsed: boolean) => Promise<boolean>;
51
+ /**
52
+ * 点击展开/收起后的回调函数
53
+ */
54
+ onAfterChange?: (isCollapsed: boolean) => void;
55
+ }
56
+ interface ReadMoreState {
57
+ wrapStyle: React.CSSProperties;
58
+ }
59
+ declare class ReadMore extends Component<ReadMoreProps, ReadMoreState> {
60
+ static defaultProps: {
61
+ onAfterChange: () => void;
62
+ isResizeObserver: boolean;
63
+ defaultCollapsed: boolean;
64
+ expandText: string;
65
+ buttonWidth: number;
66
+ collapseText: string;
67
+ lineThreshold: number;
68
+ lines: number;
69
+ };
70
+ cacheWrapWidth: number;
71
+ isCollapsed: boolean;
72
+ resizeObserver: ResizeObserver;
73
+ originalContent: string;
74
+ wrapRef: React.RefObject<HTMLDivElement>;
75
+ prefixCls: string;
76
+ constructor(props: ReadMoreProps);
77
+ componentDidMount(): void;
78
+ componentDidUpdate(prevProps: ReadMoreProps): void;
79
+ componentWillUnmount(): void;
80
+ /**
81
+ * 计算高度并设置样式
82
+ */
83
+ delayCalculate(): void;
84
+ /**
85
+ * 创建Show More/Show Less 按钮
86
+ */
87
+ getButtonElement: (wrapElement: HTMLDivElement, isCollapsed: boolean) => HTMLSpanElement;
88
+ applyToggle: (wrapElement: HTMLDivElement, node: any, index: number) => void;
89
+ onResizeObserver: () => void;
90
+ render(): JSX.Element;
91
+ }
92
+ export default ReadMore;