@rainbow-oh/yee-c 0.9.1 → 0.10.0

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 (127) hide show
  1. package/dist/cjs/Badge/badge.js +5 -3
  2. package/dist/cjs/Badge/interface.d.ts +4 -0
  3. package/dist/cjs/Input/style/index.less +1 -0
  4. package/dist/cjs/Popconfirm/interface.d.ts +0 -4
  5. package/dist/cjs/Select/select.js +2 -1
  6. package/dist/cjs/TableSelect/table-select.js +2 -2
  7. package/dist/cjs/Tabs/demo/overflow-center.d.ts +3 -0
  8. package/dist/cjs/Tabs/demo/overflow-center.js +54 -0
  9. package/dist/cjs/Tabs/hooks/useNavListMove.d.ts +2 -1
  10. package/dist/cjs/Tabs/hooks/useNavListMove.js +51 -16
  11. package/dist/cjs/Tabs/hooks/useTabScroll.d.ts +1 -0
  12. package/dist/cjs/Tabs/hooks/useTabScroll.js +5 -1
  13. package/dist/cjs/Tabs/interface.d.ts +9 -0
  14. package/dist/cjs/Tabs/style/index.less +5 -0
  15. package/dist/cjs/Tabs/tab-header/index.d.ts +1 -0
  16. package/dist/cjs/Tabs/tab-header/index.js +9 -2
  17. package/dist/cjs/Tabs/tabs.js +4 -1
  18. package/dist/cjs/TreeSelect/tree-select.js +1 -1
  19. package/dist/cjs/Upload/demo/auto-upload.d.ts +3 -0
  20. package/dist/cjs/Upload/demo/auto-upload.js +65 -0
  21. package/dist/cjs/Upload/demo/basic.js +5 -10
  22. package/dist/cjs/Upload/demo/controlled.js +4 -4
  23. package/dist/cjs/Upload/demo/pictureWall.js +14 -13
  24. package/dist/cjs/Upload/dragger.d.ts +2 -1
  25. package/dist/cjs/Upload/dragger.js +32 -21
  26. package/dist/cjs/Upload/index.d.ts +1 -1
  27. package/dist/cjs/Upload/interface.d.ts +67 -120
  28. package/dist/cjs/Upload/style/index.less +40 -13
  29. package/dist/cjs/Upload/upload.d.ts +2 -2
  30. package/dist/cjs/Upload/upload.js +435 -185
  31. package/dist/cjs/Upload/uploaded-list/index.d.ts +2 -1
  32. package/dist/cjs/Upload/uploaded-list/index.js +6 -3
  33. package/dist/cjs/Upload/uploaded-list/uploaded-item.d.ts +6 -3
  34. package/dist/cjs/Upload/uploaded-list/uploaded-item.js +127 -138
  35. package/dist/cjs/style/size.css +1 -1
  36. package/dist/cjs/style/themes.css +1 -1
  37. package/dist/cjs/style/variables.css +2 -2
  38. package/dist/cjs/utils/ax/core.d.ts +3 -1
  39. package/dist/cjs/utils/ax/core.js +24 -37
  40. package/dist/cjs/utils/ax/index.d.ts +3 -1
  41. package/dist/cjs/utils/folder-scanner.d.ts +1 -1
  42. package/dist/cjs/utils/folder-scanner.js +43 -34
  43. package/dist/cjs/version.d.ts +1 -1
  44. package/dist/cjs/version.js +1 -1
  45. package/dist/esm/Badge/badge.js +3 -2
  46. package/dist/esm/Badge/interface.d.ts +4 -0
  47. package/dist/esm/Input/style/index.less +1 -0
  48. package/dist/esm/Popconfirm/interface.d.ts +0 -4
  49. package/dist/esm/Select/select.js +2 -1
  50. package/dist/esm/TableSelect/table-select.js +2 -2
  51. package/dist/esm/Tabs/demo/overflow-center.d.ts +3 -0
  52. package/dist/esm/Tabs/demo/overflow-center.js +61 -0
  53. package/dist/esm/Tabs/hooks/useNavListMove.d.ts +2 -1
  54. package/dist/esm/Tabs/hooks/useNavListMove.js +62 -25
  55. package/dist/esm/Tabs/hooks/useTabScroll.d.ts +1 -0
  56. package/dist/esm/Tabs/hooks/useTabScroll.js +9 -0
  57. package/dist/esm/Tabs/interface.d.ts +9 -0
  58. package/dist/esm/Tabs/style/index.less +5 -0
  59. package/dist/esm/Tabs/tab-header/index.d.ts +1 -0
  60. package/dist/esm/Tabs/tab-header/index.js +13 -2
  61. package/dist/esm/Tabs/tabs.js +4 -2
  62. package/dist/esm/TreeSelect/tree-select.js +1 -1
  63. package/dist/esm/Upload/demo/auto-upload.d.ts +3 -0
  64. package/dist/esm/Upload/demo/auto-upload.js +42 -0
  65. package/dist/esm/Upload/demo/basic.js +5 -11
  66. package/dist/esm/Upload/demo/controlled.js +8 -6
  67. package/dist/esm/Upload/demo/pictureWall.js +17 -14
  68. package/dist/esm/Upload/dragger.d.ts +2 -1
  69. package/dist/esm/Upload/dragger.js +10 -5
  70. package/dist/esm/Upload/index.d.ts +1 -1
  71. package/dist/esm/Upload/interface.d.ts +67 -120
  72. package/dist/esm/Upload/style/index.less +40 -13
  73. package/dist/esm/Upload/upload.d.ts +2 -2
  74. package/dist/esm/Upload/upload.js +573 -271
  75. package/dist/esm/Upload/uploaded-list/index.d.ts +2 -1
  76. package/dist/esm/Upload/uploaded-list/index.js +9 -4
  77. package/dist/esm/Upload/uploaded-list/uploaded-item.d.ts +6 -3
  78. package/dist/esm/Upload/uploaded-list/uploaded-item.js +145 -150
  79. package/dist/esm/style/size.css +1 -1
  80. package/dist/esm/style/themes.css +1 -1
  81. package/dist/esm/style/variables.css +2 -2
  82. package/dist/esm/utils/ax/core.d.ts +3 -1
  83. package/dist/esm/utils/ax/core.js +32 -40
  84. package/dist/esm/utils/ax/index.d.ts +3 -1
  85. package/dist/esm/utils/folder-scanner.d.ts +1 -1
  86. package/dist/esm/utils/folder-scanner.js +76 -75
  87. package/dist/esm/version.d.ts +1 -1
  88. package/dist/esm/version.js +1 -1
  89. package/dist/umd/yee-c.min.css +2 -2
  90. package/dist/umd/yee-c.min.js +1 -1
  91. package/package.json +1 -1
  92. package/src/Badge/badge.tsx +2 -1
  93. package/src/Badge/interface.ts +4 -0
  94. package/src/Input/style/index.less +1 -0
  95. package/src/Popconfirm/interface.ts +0 -4
  96. package/src/Select/select.tsx +2 -1
  97. package/src/TableSelect/table-select.tsx +1 -0
  98. package/src/Tabs/demo/overflow-center.tsx +35 -0
  99. package/src/Tabs/hooks/useNavListMove.ts +60 -18
  100. package/src/Tabs/hooks/useTabScroll.ts +7 -1
  101. package/src/Tabs/index.en-US.md +33 -31
  102. package/src/Tabs/index.zh-CN.md +33 -31
  103. package/src/Tabs/interface.ts +9 -0
  104. package/src/Tabs/style/index.less +5 -0
  105. package/src/Tabs/tab-header/index.tsx +12 -2
  106. package/src/Tabs/tabs.tsx +2 -0
  107. package/src/TreeSelect/tree-select.tsx +1 -1
  108. package/src/Upload/demo/auto-upload.tsx +35 -0
  109. package/src/Upload/demo/basic.tsx +7 -11
  110. package/src/Upload/demo/controlled.tsx +12 -8
  111. package/src/Upload/demo/directory.tsx +3 -4
  112. package/src/Upload/demo/drag.tsx +5 -12
  113. package/src/Upload/demo/multiple.tsx +3 -4
  114. package/src/Upload/demo/pictureWall.tsx +22 -21
  115. package/src/Upload/dragger.tsx +47 -34
  116. package/src/Upload/index.en-US.md +63 -43
  117. package/src/Upload/index.ts +8 -1
  118. package/src/Upload/index.zh-CN.md +62 -42
  119. package/src/Upload/interface.ts +68 -120
  120. package/src/Upload/style/index.less +40 -13
  121. package/src/Upload/upload.tsx +546 -215
  122. package/src/Upload/uploaded-list/index.tsx +9 -5
  123. package/src/Upload/uploaded-list/uploaded-item.tsx +199 -228
  124. package/src/style/size.css +1 -1
  125. package/src/utils/ax/core.ts +28 -41
  126. package/src/utils/folder-scanner.ts +51 -37
  127. package/src/version.ts +1 -1
@@ -42,39 +42,48 @@ __export(folder_scanner_exports, {
42
42
  default: () => folderScanner
43
43
  });
44
44
  module.exports = __toCommonJS(folder_scanner_exports);
45
- function folderScanner(entry, filesList) {
46
- return __async(this, null, function* () {
47
- return new Promise((resolve, reject) => {
48
- if (entry.isDirectory) {
49
- const directoryReader = entry.createReader();
50
- directoryReader.readEntries(
51
- (entries) => __async(this, null, function* () {
52
- entries.forEach((entry2, index) => __async(this, null, function* () {
53
- yield folderScanner(entry2, filesList);
54
- if (index === entries.length - 1) {
55
- resolve(filesList);
56
- }
57
- }));
58
- }),
59
- (e) => {
60
- reject(e);
61
- }
62
- );
63
- } else if (entry.isFile) {
64
- entry.file(
65
- (file) => __async(this, null, function* () {
66
- const path = entry.fullPath.substring(1);
67
- const newFile = Object.defineProperty(file, "webkitRelativePath", {
68
- value: path
69
- });
70
- filesList.push(newFile);
71
- resolve(filesList);
72
- }),
73
- (e) => {
74
- reject(e);
75
- }
76
- );
77
- }
78
- });
45
+ var readAllEntries = (reader) => {
46
+ return new Promise((resolve, reject) => {
47
+ const entries = [];
48
+ const readNextBatch = () => {
49
+ reader.readEntries((batch) => {
50
+ if (batch.length === 0) {
51
+ resolve(entries);
52
+ return;
53
+ }
54
+ entries.push(...batch);
55
+ readNextBatch();
56
+ }, reject);
57
+ };
58
+ readNextBatch();
59
+ });
60
+ };
61
+ var readFile = (entry) => {
62
+ return new Promise((resolve, reject) => {
63
+ entry.file((file) => {
64
+ const path = entry.fullPath.replace(/^\//, "");
65
+ Object.defineProperty(file, "webkitRelativePath", {
66
+ configurable: true,
67
+ value: path
68
+ });
69
+ resolve(file);
70
+ }, reject);
71
+ });
72
+ };
73
+ function folderScanner(_0) {
74
+ return __async(this, arguments, function* (entry, filesList = []) {
75
+ if (entry.isFile) {
76
+ filesList.push(yield readFile(entry));
77
+ return filesList;
78
+ }
79
+ if (entry.isDirectory) {
80
+ const reader = entry.createReader();
81
+ const entries = yield readAllEntries(reader);
82
+ const nestedFiles = yield Promise.all(
83
+ entries.map((nestedEntry) => folderScanner(nestedEntry, []))
84
+ );
85
+ filesList.push(...nestedFiles.flat());
86
+ }
87
+ return filesList;
79
88
  });
80
89
  }
@@ -3,4 +3,4 @@ declare global {
3
3
  __yee_c_version__: string;
4
4
  }
5
5
  }
6
- export declare const version = "0.9.1";
6
+ export declare const version = "0.10.0";
@@ -22,7 +22,7 @@ __export(version_exports, {
22
22
  version: () => version
23
23
  });
24
24
  module.exports = __toCommonJS(version_exports);
25
- var version = "0.9.1";
25
+ var version = "0.10.0";
26
26
  if (typeof window !== "undefined") {
27
27
  window.__yee_c_version__ = version;
28
28
  }
@@ -1,5 +1,5 @@
1
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
- var _excluded = ["prefixCls", "children", "count", "showZero", "dot", "size", "status", "offset", "style", "color", "overflowCount", "text", "active", "className", "styles", "classNames"];
2
+ var _excluded = ["prefixCls", "children", "count", "showZero", "dot", "size", "status", "offset", "style", "color", "overflowCount", "text", "active", "className", "styles", "classNames", "title"];
3
3
  function _extends() { _extends = Object.assign ? Object.assign.bind() : function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends.apply(this, arguments); }
4
4
  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; }
5
5
  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; }
@@ -40,6 +40,7 @@ var InternalBadge = function InternalBadge(baseprops) {
40
40
  className = props.className,
41
41
  styles = props.styles,
42
42
  classNames = props.classNames,
43
+ title = props.title,
43
44
  rest = _objectWithoutProperties(props, _excluded);
44
45
  var supNode;
45
46
  var supTitle = '';
@@ -49,7 +50,7 @@ var InternalBadge = function InternalBadge(baseprops) {
49
50
  var renderCountNode = function renderCountNode() {
50
51
  if (count === null || count === undefined) return null;
51
52
  if (typeof count === 'number') {
52
- supTitle = String(count);
53
+ supTitle = title || String(count);
53
54
 
54
55
  // When count is 0 and showZero is false, return null
55
56
  if (count === 0 && !showZero) return null;
@@ -26,6 +26,10 @@ export interface BadgeProps extends DataAttributeProps {
26
26
  * Child component
27
27
  */
28
28
  children?: React.ReactNode;
29
+ /**
30
+ * Native Title
31
+ */
32
+ title?: string;
29
33
  /**
30
34
  * Number to display or custom content
31
35
  */
@@ -13,6 +13,7 @@
13
13
  border: var(--yee-input-border-width) solid var(--yee-input-border-color);
14
14
  border-radius: var(--yee-input-border-radius, 4px);
15
15
  font-family: var(--yee-font-family);
16
+ outline: inherit;
16
17
 
17
18
  &:not(@{pls}-disabled):hover {
18
19
  border-color: var(--yee-input-hover-border-color);
@@ -42,10 +42,6 @@ export interface PopconfirmProps extends Omit<TriggerProps, 'popup' | 'children'
42
42
  * open, controllered
43
43
  * */
44
44
  open?: boolean;
45
- /**
46
- * placement
47
- */
48
- placement?: 'top' | 'bottom' | 'left' | 'right';
49
45
  /**
50
46
  * 设置确认按钮文本
51
47
  * */
@@ -21,6 +21,7 @@ import useMergedState from "../hooks/useMergedState";
21
21
  import mergeContextToProps from "../utils/mergeContextToProps";
22
22
  import useSelectKeyboard from "./hooks/useSelectKeyboard";
23
23
  import Options from "./options";
24
+ import Omit from "../utils/omit";
24
25
  import "./style/index.less";
25
26
 
26
27
  // ---------------------------------------------------------------------------
@@ -228,7 +229,7 @@ var Select = function Select(baseprops) {
228
229
  } : undefined,
229
230
  open: disabled ? false : open,
230
231
  onOpenChange: handleOpenChange
231
- }), /*#__PURE__*/React.createElement(Selector, _extends({}, rest, {
232
+ }), /*#__PURE__*/React.createElement(Selector, _extends({}, Omit(rest, ['forceRender']), {
232
233
  mode: mode,
233
234
  value: searchValue,
234
235
  options: options,
@@ -174,7 +174,7 @@ var TableSelect = function TableSelect(baseprops) {
174
174
  rowKey: rowKey
175
175
  }));
176
176
  };
177
- return /*#__PURE__*/React.createElement(Trigger, {
177
+ return /*#__PURE__*/React.createElement(Trigger, _extends({}, rest, {
178
178
  trigger: "click",
179
179
  popupClassName: "".concat(prefixCls, "-popup"),
180
180
  popup: renderPopup(),
@@ -182,7 +182,7 @@ var TableSelect = function TableSelect(baseprops) {
182
182
  hideOnClick: selectionType === 'radio' ? true : false,
183
183
  onOpenChange: onVisibleChange,
184
184
  stretch: "minWidth"
185
- }, /*#__PURE__*/React.createElement(Selector, selectorProps));
185
+ }), /*#__PURE__*/React.createElement(Selector, selectorProps));
186
186
  };
187
187
  TableSelect.displayName = 'TableSelect';
188
188
  export default TableSelect;
@@ -0,0 +1,3 @@
1
+ import React from 'react';
2
+ declare const _default: () => React.JSX.Element;
3
+ export default _default;
@@ -0,0 +1,61 @@
1
+ function _slicedToArray(arr, i) { return _arrayWithHoles(arr) || _iterableToArrayLimit(arr, i) || _unsupportedIterableToArray(arr, i) || _nonIterableRest(); }
2
+ function _nonIterableRest() { throw new TypeError("Invalid attempt to destructure non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method."); }
3
+ function _unsupportedIterableToArray(o, minLen) { if (!o) return; if (typeof o === "string") return _arrayLikeToArray(o, minLen); var n = Object.prototype.toString.call(o).slice(8, -1); if (n === "Object" && o.constructor) n = o.constructor.name; if (n === "Map" || n === "Set") return Array.from(o); if (n === "Arguments" || /^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(n)) return _arrayLikeToArray(o, minLen); }
4
+ function _arrayLikeToArray(arr, len) { if (len == null || len > arr.length) len = arr.length; for (var i = 0, arr2 = new Array(len); i < len; i++) arr2[i] = arr[i]; return arr2; }
5
+ function _iterableToArrayLimit(r, l) { var t = null == r ? null : "undefined" != typeof Symbol && r[Symbol.iterator] || r["@@iterator"]; if (null != t) { var e, n, i, u, a = [], f = !0, o = !1; try { if (i = (t = t.call(r)).next, 0 === l) { if (Object(t) !== t) return; f = !1; } else for (; !(f = (e = i.call(t)).done) && (a.push(e.value), a.length !== l); f = !0); } catch (r) { o = !0, n = r; } finally { try { if (!f && null != t.return && (u = t.return(), Object(u) !== u)) return; } finally { if (o) throw n; } } return a; } }
6
+ function _arrayWithHoles(arr) { if (Array.isArray(arr)) return arr; }
7
+ import { Tabs } from "../..";
8
+ import React, { useState } from 'react';
9
+ export default (function () {
10
+ var items = Array.from({
11
+ length: 24
12
+ }, function (_, i) {
13
+ return {
14
+ key: "tab-".concat(i + 1),
15
+ label: "Tab ".concat(i + 1),
16
+ children: "Content of Tab Pane ".concat(i + 1)
17
+ };
18
+ });
19
+ var _useState = useState('tab-1'),
20
+ _useState2 = _slicedToArray(_useState, 2),
21
+ centerKey = _useState2[0],
22
+ setCenterKey = _useState2[1];
23
+ var _useState3 = useState('tab-1'),
24
+ _useState4 = _slicedToArray(_useState3, 2),
25
+ autoKey = _useState4[0],
26
+ setAutoKey = _useState4[1];
27
+ return /*#__PURE__*/React.createElement("div", {
28
+ style: {
29
+ display: 'flex',
30
+ flexDirection: 'column',
31
+ gap: 24
32
+ }
33
+ }, /*#__PURE__*/React.createElement("div", null, /*#__PURE__*/React.createElement("p", {
34
+ style: {
35
+ marginBottom: 8
36
+ }
37
+ }, "activeAlign=\"center\""), /*#__PURE__*/React.createElement("div", {
38
+ style: {
39
+ maxWidth: 480
40
+ },
41
+ "data-testid": "center-wrap"
42
+ }, /*#__PURE__*/React.createElement(Tabs, {
43
+ activeAlign: "center",
44
+ items: items,
45
+ activeKey: centerKey,
46
+ onChange: setCenterKey
47
+ }))), /*#__PURE__*/React.createElement("div", null, /*#__PURE__*/React.createElement("p", {
48
+ style: {
49
+ marginBottom: 8
50
+ }
51
+ }, "default (auto)"), /*#__PURE__*/React.createElement("div", {
52
+ style: {
53
+ maxWidth: 480
54
+ },
55
+ "data-testid": "auto-wrap"
56
+ }, /*#__PURE__*/React.createElement(Tabs, {
57
+ items: items,
58
+ activeKey: autoKey,
59
+ onChange: setAutoKey
60
+ }))));
61
+ });
@@ -3,10 +3,11 @@ interface UseNavListMoveOptions {
3
3
  direction: 'horizontal' | 'vertical';
4
4
  activeKey: string | number;
5
5
  enabled: boolean;
6
+ align?: 'auto' | 'center';
6
7
  activetab: React.RefObject<HTMLElement | null>;
7
8
  navList: React.RefObject<HTMLDivElement | null>;
8
9
  navContainer: React.RefObject<HTMLDivElement | null>;
9
10
  onMoved?: () => void;
10
11
  }
11
- export declare function useNavListMove({ direction, activeKey, enabled, activetab, navList, navContainer, onMoved, }: UseNavListMoveOptions): void;
12
+ export declare function useNavListMove({ direction, activeKey, enabled, align, activetab, navList, navContainer, onMoved, }: UseNavListMoveOptions): void;
12
13
  export {};
@@ -10,6 +10,8 @@ export function useNavListMove(_ref) {
10
10
  var direction = _ref.direction,
11
11
  activeKey = _ref.activeKey,
12
12
  enabled = _ref.enabled,
13
+ _ref$align = _ref.align,
14
+ align = _ref$align === void 0 ? 'auto' : _ref$align,
13
15
  activetab = _ref.activetab,
14
16
  navList = _ref.navList,
15
17
  navContainer = _ref.navContainer,
@@ -21,47 +23,82 @@ export function useNavListMove(_ref) {
21
23
  if (!enabled || !tab || !list || !container) {
22
24
  return;
23
25
  }
24
- var _isInContainer = isInContainer(direction, tab, list, container),
25
- _isInContainer2 = _slicedToArray(_isInContainer, 1),
26
- isVisible = _isInContainer2[0];
27
- if (isVisible) return;
26
+
27
+ // 'auto': keep as-is when the active tab is already fully visible.
28
+ // 'center': always re-center, even for tabs already visible on the header.
29
+ if (align !== 'center') {
30
+ var _isInContainer = isInContainer(direction, tab, list, container),
31
+ _isInContainer2 = _slicedToArray(_isInContainer, 1),
32
+ isVisible = _isInContainer2[0];
33
+ if (isVisible) return;
34
+ }
35
+ var moved = false;
28
36
  if (direction === 'horizontal') {
29
- var _getEleTranslate = getEleTranslate(list),
30
- _getEleTranslate2 = _slicedToArray(_getEleTranslate, 1),
31
- x = _getEleTranslate2[0];
32
- var tabLeft = tab.offsetLeft;
33
- var tabWidth = tab.offsetWidth;
34
- var containerWidth = container.clientWidth;
35
- var newX = x;
37
+ if (align === 'center') {
38
+ var containerWidth = container.clientWidth;
39
+ var maxOffset = list.scrollWidth - containerWidth;
40
+ var tabCenter = tab.offsetLeft + tab.offsetWidth / 2;
41
+ var newX = Math.round(containerWidth / 2 - tabCenter);
42
+ newX = Math.max(-maxOffset, Math.min(0, newX));
43
+ var _getEleTranslate = getEleTranslate(list),
44
+ _getEleTranslate2 = _slicedToArray(_getEleTranslate, 1),
45
+ x = _getEleTranslate2[0];
46
+ if (Math.abs(newX - x) > 0.5) {
47
+ setEleTranslate(list, newX);
48
+ moved = true;
49
+ }
50
+ } else {
51
+ var _getEleTranslate3 = getEleTranslate(list),
52
+ _getEleTranslate4 = _slicedToArray(_getEleTranslate3, 1),
53
+ _x = _getEleTranslate4[0];
54
+ var tabLeft = tab.offsetLeft;
55
+ var tabWidth = tab.offsetWidth;
56
+ var _containerWidth = container.clientWidth;
57
+ var _newX = _x;
36
58
 
37
- // Tab overflows on the right side
38
- if (tabLeft + tabWidth - Math.abs(x) > containerWidth) {
39
- var overflow = tabLeft + tabWidth - Math.abs(x) - containerWidth;
40
- newX = x - overflow;
59
+ // Tab overflows on the right side
60
+ if (tabLeft + tabWidth - Math.abs(_x) > _containerWidth) {
61
+ var overflow = tabLeft + tabWidth - Math.abs(_x) - _containerWidth;
62
+ _newX = _x - overflow;
63
+ }
64
+ // Tab overflows on the left side
65
+ else if (tabLeft < Math.abs(_x)) {
66
+ var _overflow = Math.abs(_x) - tabLeft;
67
+ _newX = _x + _overflow;
68
+ }
69
+ setEleTranslate(list, _newX);
70
+ moved = true;
41
71
  }
42
- // Tab overflows on the left side
43
- else if (tabLeft < Math.abs(x)) {
44
- var _overflow = Math.abs(x) - tabLeft;
45
- newX = x + _overflow;
72
+ } else if (align === 'center') {
73
+ var containerHeight = container.clientHeight;
74
+ var _maxOffset = container.scrollHeight - containerHeight;
75
+ var _tabCenter = tab.offsetTop + tab.offsetHeight / 2;
76
+ var newScrollTop = Math.max(0, Math.min(_maxOffset, Math.round(_tabCenter - containerHeight / 2)));
77
+ if (Math.abs(newScrollTop - container.scrollTop) > 0.5) {
78
+ container.scrollTop = newScrollTop;
79
+ moved = true;
46
80
  }
47
- setEleTranslate(list, newX);
48
81
  } else {
49
82
  var tabTop = tab.offsetTop;
50
83
  var tabHeight = tab.offsetHeight;
51
- var containerHeight = container.clientHeight;
84
+ var _containerHeight = container.clientHeight;
52
85
  var scrollTop = container.scrollTop;
53
86
 
54
87
  // Tab overflows below
55
- if (tabTop + tabHeight - scrollTop >= containerHeight) {
56
- var _overflow2 = tabTop + tabHeight - scrollTop - containerHeight;
88
+ if (tabTop + tabHeight - scrollTop >= _containerHeight) {
89
+ var _overflow2 = tabTop + tabHeight - scrollTop - _containerHeight;
57
90
  container.scrollTop = scrollTop + _overflow2;
91
+ moved = true;
58
92
  }
59
93
  // Tab overflows above
60
94
  else if (tabTop < scrollTop) {
61
95
  var _overflow3 = scrollTop - tabTop;
62
96
  container.scrollTop = scrollTop - _overflow3;
97
+ moved = true;
63
98
  }
64
99
  }
65
- onMoved === null || onMoved === void 0 || onMoved();
66
- }, [activeKey, enabled, direction, activetab, navList, navContainer, onMoved]);
100
+ if (moved) {
101
+ onMoved === null || onMoved === void 0 || onMoved();
102
+ }
103
+ }, [activeKey, enabled, direction, align, activetab, navList, navContainer, onMoved]);
67
104
  }
@@ -7,6 +7,7 @@ interface UseTabScrollOptions {
7
7
  }
8
8
  export declare function useTabScroll({ direction, navContainer, navList, enabled, }: UseTabScrollOptions): {
9
9
  refreshKey: number;
10
+ refresh: () => void;
10
11
  updateShadow: import("../../utils/debounce").Debounced<() => void>;
11
12
  };
12
13
  export {};
@@ -35,6 +35,14 @@ export function useTabScroll(_ref) {
35
35
  container.classList.toggle('with-suffix-shadow', currentOffset < maxOffset);
36
36
  }, [direction, navContainer, navList]);
37
37
  var debouncedUpdateShadow = useDebounceFunction(updateShadow, 200);
38
+
39
+ // Refresh dropdown range and shadows after the nav list is moved programmatically
40
+ var refresh = useCallback(function () {
41
+ setRefreshKey(function (prev) {
42
+ return prev + 1;
43
+ });
44
+ debouncedUpdateShadow();
45
+ }, [debouncedUpdateShadow]);
38
46
  useEffect(function () {
39
47
  var container = navContainer.current;
40
48
  var list = navList.current;
@@ -84,6 +92,7 @@ export function useTabScroll(_ref) {
84
92
  }, [direction, enabled, navContainer, navList, debouncedUpdateShadow, updateShadow]);
85
93
  return {
86
94
  refreshKey: refreshKey,
95
+ refresh: refresh,
87
96
  updateShadow: debouncedUpdateShadow
88
97
  };
89
98
  }
@@ -121,5 +121,14 @@ export interface TabsProps extends DataAttributeProps {
121
121
  * @default false
122
122
  */
123
123
  fixedHeader?: boolean;
124
+ /**
125
+ * How the active tab is aligned when the tab list overflows
126
+ * - 'auto': scroll minimally so the active tab is visible at the edge;
127
+ * no scrolling when it is already fully visible
128
+ * - 'center': always scroll so the active tab is centered in the header,
129
+ * including tabs clicked directly on the header
130
+ * @default 'auto'
131
+ */
132
+ activeAlign?: 'auto' | 'center';
124
133
  }
125
134
  export {};
@@ -439,6 +439,10 @@
439
439
  height: var(--yee-tabs-nav-operations-height);
440
440
  }
441
441
 
442
+ @{pls}-nav-more {
443
+ margin-left: 4px;
444
+ }
445
+
442
446
  // 下拉框
443
447
  @{pls}-operation-container {
444
448
  max-height: var(--yee-tabs-operation-container-max-height);
@@ -452,6 +456,7 @@
452
456
 
453
457
  @{pls}-tab {
454
458
  height: var(--yee-tabs-operation-tab-height);
459
+ margin: 0;
455
460
  padding: var(--yee-tabs-operation-tab-padding);
456
461
  cursor: pointer;
457
462
 
@@ -12,6 +12,7 @@ export interface TabHeaderProps {
12
12
  prefixCls: string;
13
13
  type?: 'card' | 'editable-card';
14
14
  position?: 'top' | 'bottom' | 'left' | 'right';
15
+ activeAlign?: 'auto' | 'center';
15
16
  headerExtra?: {
16
17
  prefix?: React.ReactNode | (() => React.ReactNode);
17
18
  suffix?: React.ReactNode | (() => React.ReactNode);
@@ -23,6 +23,8 @@ var TabHeader = function TabHeader(props) {
23
23
  type = props.type,
24
24
  _props$position = props.position,
25
25
  position = _props$position === void 0 ? 'top' : _props$position,
26
+ _props$activeAlign = props.activeAlign,
27
+ activeAlign = _props$activeAlign === void 0 ? 'auto' : _props$activeAlign,
26
28
  headerExtra = props.headerExtra,
27
29
  classNames = props.classNames,
28
30
  styles = props.styles,
@@ -58,7 +60,8 @@ var TabHeader = function TabHeader(props) {
58
60
  navList: navList,
59
61
  enabled: moreOpen
60
62
  }),
61
- refreshKey = _useTabScroll.refreshKey;
63
+ refreshKey = _useTabScroll.refreshKey,
64
+ refreshNav = _useTabScroll.refresh;
62
65
 
63
66
  // ActiveBar movement
64
67
  useActiveBar({
@@ -70,15 +73,22 @@ var TabHeader = function TabHeader(props) {
70
73
  enabled: !type // Only show active bar for non-card types
71
74
  });
72
75
 
76
+ // Recompute dropdown visibility, dropdown range and shadows after the list is moved
77
+ var handleNavMoved = useCallback(function () {
78
+ checkVisibility();
79
+ refreshNav();
80
+ }, [checkVisibility, refreshNav]);
81
+
73
82
  // Navigation list movement
74
83
  useNavListMove({
75
84
  direction: direction,
76
85
  activeKey: activeKey,
77
86
  enabled: moreOpen,
87
+ align: activeAlign,
78
88
  activetab: activetab,
79
89
  navList: navList,
80
90
  navContainer: navContainer,
81
- onMoved: checkVisibility
91
+ onMoved: handleNavMoved
82
92
  });
83
93
 
84
94
  // Listen for container size changes
@@ -159,6 +169,7 @@ var TabHeader = function TabHeader(props) {
159
169
  range: range
160
170
  }, /*#__PURE__*/React.createElement(Button, {
161
171
  className: "".concat(prefixCls, "-nav-more"),
172
+ size: "small",
162
173
  icon: /*#__PURE__*/React.createElement(Ellipsis, {
163
174
  size: 14,
164
175
  strokeWidth: 1.5
@@ -1,5 +1,5 @@
1
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
- var _excluded = ["prefixCls", "position", "type", "className", "style", "classNames", "styles", "items", "lazy", "activeKey", "defaultActiveKey", "fixedHeader", "onChange", "onEdit", "onTabClick"];
2
+ var _excluded = ["prefixCls", "position", "type", "className", "style", "classNames", "styles", "items", "lazy", "activeKey", "defaultActiveKey", "fixedHeader", "activeAlign", "onChange", "onEdit", "onTabClick"];
3
3
  function _extends() { _extends = Object.assign ? Object.assign.bind() : function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends.apply(this, arguments); }
4
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
5
  function _toPropertyKey(t) { var i = _toPrimitive(t, "string"); return "symbol" == _typeof(i) ? i : String(i); }
@@ -42,6 +42,7 @@ var Tabs = function Tabs(baseprops) {
42
42
  activeKey = props.activeKey,
43
43
  defaultActiveKey = props.defaultActiveKey,
44
44
  fixedHeader = props.fixedHeader,
45
+ activeAlign = props.activeAlign,
45
46
  onChange = props.onChange,
46
47
  onEdit = props.onEdit,
47
48
  onTabClick = props.onTabClick,
@@ -110,7 +111,8 @@ var Tabs = function Tabs(baseprops) {
110
111
  }), /*#__PURE__*/React.createElement(TabsCtx.Provider, {
111
112
  value: contextValue
112
113
  }, /*#__PURE__*/React.createElement(TabHeader, _extends({}, omit(props, ['children', 'className', 'style']), {
113
- prefixCls: prefixCls
114
+ prefixCls: prefixCls,
115
+ activeAlign: activeAlign
114
116
  })), /*#__PURE__*/React.createElement(TabContent, {
115
117
  prefixCls: prefixCls,
116
118
  className: classNames === null || classNames === void 0 ? void 0 : classNames.content,
@@ -231,7 +231,7 @@ var TreeSelect = function TreeSelect(baseprops) {
231
231
  popupClassName: "".concat(prefixCls, "-popup"),
232
232
  hideOnClick: false,
233
233
  onOpenChange: handleOpenChange
234
- }), /*#__PURE__*/React.createElement(Selector, _extends({}, omit(rest, ['showLine']), {
234
+ }), /*#__PURE__*/React.createElement(Selector, _extends({}, omit(rest, ['showLine', 'forceRender']), {
235
235
  className: "".concat(prefixCls, "-selector"),
236
236
  mode: mode,
237
237
  value: searchValue,
@@ -0,0 +1,3 @@
1
+ import React from 'react';
2
+ declare const _default: () => React.JSX.Element;
3
+ export default _default;
@@ -0,0 +1,42 @@
1
+ function _slicedToArray(arr, i) { return _arrayWithHoles(arr) || _iterableToArrayLimit(arr, i) || _unsupportedIterableToArray(arr, i) || _nonIterableRest(); }
2
+ function _nonIterableRest() { throw new TypeError("Invalid attempt to destructure non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method."); }
3
+ function _unsupportedIterableToArray(o, minLen) { if (!o) return; if (typeof o === "string") return _arrayLikeToArray(o, minLen); var n = Object.prototype.toString.call(o).slice(8, -1); if (n === "Object" && o.constructor) n = o.constructor.name; if (n === "Map" || n === "Set") return Array.from(o); if (n === "Arguments" || /^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(n)) return _arrayLikeToArray(o, minLen); }
4
+ function _arrayLikeToArray(arr, len) { if (len == null || len > arr.length) len = arr.length; for (var i = 0, arr2 = new Array(len); i < len; i++) arr2[i] = arr[i]; return arr2; }
5
+ function _iterableToArrayLimit(r, l) { var t = null == r ? null : "undefined" != typeof Symbol && r[Symbol.iterator] || r["@@iterator"]; if (null != t) { var e, n, i, u, a = [], f = !0, o = !1; try { if (i = (t = t.call(r)).next, 0 === l) { if (Object(t) !== t) return; f = !1; } else for (; !(f = (e = i.call(t)).done) && (a.push(e.value), a.length !== l); f = !0); } catch (r) { o = !0, n = r; } finally { try { if (!f && null != t.return && (u = t.return(), Object(u) !== u)) return; } finally { if (o) throw n; } } return a; } }
6
+ function _arrayWithHoles(arr) { if (Array.isArray(arr)) return arr; }
7
+ import { Button, Upload } from "../..";
8
+ import React, { useRef, useState } from 'react';
9
+ export default (function () {
10
+ var uploadRef = useRef(null);
11
+ var _useState = useState([]),
12
+ _useState2 = _slicedToArray(_useState, 2),
13
+ fileList = _useState2[0],
14
+ setFileList = _useState2[1];
15
+ var readyCount = fileList.filter(function (file) {
16
+ return file.status === 'ready';
17
+ }).length;
18
+ return /*#__PURE__*/React.createElement("div", {
19
+ style: {
20
+ display: 'flex',
21
+ flexDirection: 'column',
22
+ gap: 12
23
+ }
24
+ }, /*#__PURE__*/React.createElement(Upload, {
25
+ ref: uploadRef,
26
+ autoUpload: false,
27
+ multiple: true,
28
+ action: "https://www.mocky.io/v2/5cc8019d300000980a055e76",
29
+ fileList: fileList,
30
+ onChange: function onChange(_ref) {
31
+ var nextFileList = _ref.fileList;
32
+ return setFileList(nextFileList);
33
+ }
34
+ }), /*#__PURE__*/React.createElement("div", null, /*#__PURE__*/React.createElement(Button, {
35
+ type: "primary",
36
+ disabled: readyCount === 0,
37
+ onClick: function onClick() {
38
+ var _uploadRef$current;
39
+ return (_uploadRef$current = uploadRef.current) === null || _uploadRef$current === void 0 ? void 0 : _uploadRef$current.upload();
40
+ }
41
+ }, "Start upload (", readyCount, ")")));
42
+ });
@@ -13,24 +13,18 @@ export default (function () {
13
13
  defaultFileList: [{
14
14
  uid: '1',
15
15
  name: 'xxx.png',
16
- status: 'done',
17
- raw: {},
16
+ status: 'success',
18
17
  size: 123,
19
- percent: 0,
18
+ percent: 100,
20
19
  type: 'image/png'
21
20
  }, {
22
21
  uid: '2',
23
22
  name: 'yyy.png',
24
- status: 'done',
25
- raw: {},
23
+ status: 'success',
26
24
  size: 123,
27
- percent: 0,
25
+ percent: 100,
28
26
  type: 'image/png'
29
27
  }]
30
28
  };
31
- return (
32
- /*#__PURE__*/
33
- // @ts-ignore
34
- React.createElement(Upload, props, /*#__PURE__*/React.createElement(Button, null, "Upload"))
35
- );
29
+ return /*#__PURE__*/React.createElement(Upload, props, /*#__PURE__*/React.createElement(Button, null, "Upload"));
36
30
  });