@rainbow-oh/yee-c 0.9.2 → 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.
- package/dist/cjs/Input/style/index.less +1 -0
- package/dist/cjs/Tabs/demo/overflow-center.d.ts +3 -0
- package/dist/cjs/Tabs/demo/overflow-center.js +54 -0
- package/dist/cjs/Tabs/hooks/useNavListMove.d.ts +2 -1
- package/dist/cjs/Tabs/hooks/useNavListMove.js +51 -16
- package/dist/cjs/Tabs/hooks/useTabScroll.d.ts +1 -0
- package/dist/cjs/Tabs/hooks/useTabScroll.js +5 -1
- package/dist/cjs/Tabs/interface.d.ts +9 -0
- package/dist/cjs/Tabs/style/index.less +5 -0
- package/dist/cjs/Tabs/tab-header/index.d.ts +1 -0
- package/dist/cjs/Tabs/tab-header/index.js +9 -2
- package/dist/cjs/Tabs/tabs.js +4 -1
- package/dist/cjs/Upload/demo/auto-upload.d.ts +3 -0
- package/dist/cjs/Upload/demo/auto-upload.js +65 -0
- package/dist/cjs/Upload/demo/basic.js +5 -10
- package/dist/cjs/Upload/demo/controlled.js +4 -4
- package/dist/cjs/Upload/demo/pictureWall.js +14 -13
- package/dist/cjs/Upload/dragger.d.ts +2 -1
- package/dist/cjs/Upload/dragger.js +32 -21
- package/dist/cjs/Upload/index.d.ts +1 -1
- package/dist/cjs/Upload/interface.d.ts +67 -120
- package/dist/cjs/Upload/style/index.less +40 -13
- package/dist/cjs/Upload/upload.d.ts +2 -2
- package/dist/cjs/Upload/upload.js +435 -185
- package/dist/cjs/Upload/uploaded-list/index.d.ts +2 -1
- package/dist/cjs/Upload/uploaded-list/index.js +6 -3
- package/dist/cjs/Upload/uploaded-list/uploaded-item.d.ts +6 -3
- package/dist/cjs/Upload/uploaded-list/uploaded-item.js +127 -138
- package/dist/cjs/style/size.css +1 -1
- package/dist/cjs/style/themes.css +1 -1
- package/dist/cjs/style/variables.css +2 -2
- package/dist/cjs/utils/ax/core.d.ts +3 -1
- package/dist/cjs/utils/ax/core.js +24 -37
- package/dist/cjs/utils/ax/index.d.ts +3 -1
- package/dist/cjs/utils/folder-scanner.d.ts +1 -1
- package/dist/cjs/utils/folder-scanner.js +43 -34
- package/dist/cjs/version.d.ts +1 -1
- package/dist/cjs/version.js +1 -1
- package/dist/esm/Input/style/index.less +1 -0
- package/dist/esm/Tabs/demo/overflow-center.d.ts +3 -0
- package/dist/esm/Tabs/demo/overflow-center.js +61 -0
- package/dist/esm/Tabs/hooks/useNavListMove.d.ts +2 -1
- package/dist/esm/Tabs/hooks/useNavListMove.js +62 -25
- package/dist/esm/Tabs/hooks/useTabScroll.d.ts +1 -0
- package/dist/esm/Tabs/hooks/useTabScroll.js +9 -0
- package/dist/esm/Tabs/interface.d.ts +9 -0
- package/dist/esm/Tabs/style/index.less +5 -0
- package/dist/esm/Tabs/tab-header/index.d.ts +1 -0
- package/dist/esm/Tabs/tab-header/index.js +13 -2
- package/dist/esm/Tabs/tabs.js +4 -2
- package/dist/esm/Upload/demo/auto-upload.d.ts +3 -0
- package/dist/esm/Upload/demo/auto-upload.js +42 -0
- package/dist/esm/Upload/demo/basic.js +5 -11
- package/dist/esm/Upload/demo/controlled.js +8 -6
- package/dist/esm/Upload/demo/pictureWall.js +17 -14
- package/dist/esm/Upload/dragger.d.ts +2 -1
- package/dist/esm/Upload/dragger.js +10 -5
- package/dist/esm/Upload/index.d.ts +1 -1
- package/dist/esm/Upload/interface.d.ts +67 -120
- package/dist/esm/Upload/style/index.less +40 -13
- package/dist/esm/Upload/upload.d.ts +2 -2
- package/dist/esm/Upload/upload.js +573 -271
- package/dist/esm/Upload/uploaded-list/index.d.ts +2 -1
- package/dist/esm/Upload/uploaded-list/index.js +9 -4
- package/dist/esm/Upload/uploaded-list/uploaded-item.d.ts +6 -3
- package/dist/esm/Upload/uploaded-list/uploaded-item.js +145 -150
- package/dist/esm/style/size.css +1 -1
- package/dist/esm/style/themes.css +1 -1
- package/dist/esm/style/variables.css +2 -2
- package/dist/esm/utils/ax/core.d.ts +3 -1
- package/dist/esm/utils/ax/core.js +32 -40
- package/dist/esm/utils/ax/index.d.ts +3 -1
- package/dist/esm/utils/folder-scanner.d.ts +1 -1
- package/dist/esm/utils/folder-scanner.js +76 -75
- package/dist/esm/version.d.ts +1 -1
- package/dist/esm/version.js +1 -1
- package/dist/umd/yee-c.min.css +2 -2
- package/dist/umd/yee-c.min.js +1 -1
- package/package.json +1 -1
- package/src/Input/style/index.less +1 -0
- package/src/Tabs/demo/overflow-center.tsx +35 -0
- package/src/Tabs/hooks/useNavListMove.ts +60 -18
- package/src/Tabs/hooks/useTabScroll.ts +7 -1
- package/src/Tabs/index.en-US.md +33 -31
- package/src/Tabs/index.zh-CN.md +33 -31
- package/src/Tabs/interface.ts +9 -0
- package/src/Tabs/style/index.less +5 -0
- package/src/Tabs/tab-header/index.tsx +12 -2
- package/src/Tabs/tabs.tsx +2 -0
- package/src/Upload/demo/auto-upload.tsx +35 -0
- package/src/Upload/demo/basic.tsx +7 -11
- package/src/Upload/demo/controlled.tsx +12 -8
- package/src/Upload/demo/directory.tsx +3 -4
- package/src/Upload/demo/drag.tsx +5 -12
- package/src/Upload/demo/multiple.tsx +3 -4
- package/src/Upload/demo/pictureWall.tsx +22 -21
- package/src/Upload/dragger.tsx +47 -34
- package/src/Upload/index.en-US.md +63 -43
- package/src/Upload/index.ts +8 -1
- package/src/Upload/index.zh-CN.md +62 -42
- package/src/Upload/interface.ts +68 -120
- package/src/Upload/style/index.less +40 -13
- package/src/Upload/upload.tsx +546 -215
- package/src/Upload/uploaded-list/index.tsx +9 -5
- package/src/Upload/uploaded-list/uploaded-item.tsx +199 -228
- package/src/style/size.css +1 -1
- package/src/utils/ax/core.ts +28 -41
- package/src/utils/folder-scanner.ts +51 -37
- package/src/version.ts +1 -1
|
@@ -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);
|
|
@@ -0,0 +1,54 @@
|
|
|
1
|
+
var __create = Object.create;
|
|
2
|
+
var __defProp = Object.defineProperty;
|
|
3
|
+
var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
|
|
4
|
+
var __getOwnPropNames = Object.getOwnPropertyNames;
|
|
5
|
+
var __getProtoOf = Object.getPrototypeOf;
|
|
6
|
+
var __hasOwnProp = Object.prototype.hasOwnProperty;
|
|
7
|
+
var __export = (target, all) => {
|
|
8
|
+
for (var name in all)
|
|
9
|
+
__defProp(target, name, { get: all[name], enumerable: true });
|
|
10
|
+
};
|
|
11
|
+
var __copyProps = (to, from, except, desc) => {
|
|
12
|
+
if (from && typeof from === "object" || typeof from === "function") {
|
|
13
|
+
for (let key of __getOwnPropNames(from))
|
|
14
|
+
if (!__hasOwnProp.call(to, key) && key !== except)
|
|
15
|
+
__defProp(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable });
|
|
16
|
+
}
|
|
17
|
+
return to;
|
|
18
|
+
};
|
|
19
|
+
var __toESM = (mod, isNodeMode, target) => (target = mod != null ? __create(__getProtoOf(mod)) : {}, __copyProps(
|
|
20
|
+
// If the importer is in node compatibility mode or this is not an ESM
|
|
21
|
+
// file that has been converted to a CommonJS file using a Babel-
|
|
22
|
+
// compatible transform (i.e. "__esModule" has not been set), then set
|
|
23
|
+
// "default" to the CommonJS "module.exports" for node compatibility.
|
|
24
|
+
isNodeMode || !mod || !mod.__esModule ? __defProp(target, "default", { value: mod, enumerable: true }) : target,
|
|
25
|
+
mod
|
|
26
|
+
));
|
|
27
|
+
var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
|
|
28
|
+
|
|
29
|
+
// src/Tabs/demo/overflow-center.tsx
|
|
30
|
+
var overflow_center_exports = {};
|
|
31
|
+
__export(overflow_center_exports, {
|
|
32
|
+
default: () => overflow_center_default
|
|
33
|
+
});
|
|
34
|
+
module.exports = __toCommonJS(overflow_center_exports);
|
|
35
|
+
var import_yee_c = require("../..");
|
|
36
|
+
var import_react = __toESM(require("react"));
|
|
37
|
+
var overflow_center_default = () => {
|
|
38
|
+
const items = Array.from({ length: 24 }, (_, i) => ({
|
|
39
|
+
key: `tab-${i + 1}`,
|
|
40
|
+
label: `Tab ${i + 1}`,
|
|
41
|
+
children: `Content of Tab Pane ${i + 1}`
|
|
42
|
+
}));
|
|
43
|
+
const [centerKey, setCenterKey] = (0, import_react.useState)("tab-1");
|
|
44
|
+
const [autoKey, setAutoKey] = (0, import_react.useState)("tab-1");
|
|
45
|
+
return /* @__PURE__ */ import_react.default.createElement("div", { style: { display: "flex", flexDirection: "column", gap: 24 } }, /* @__PURE__ */ import_react.default.createElement("div", null, /* @__PURE__ */ import_react.default.createElement("p", { style: { marginBottom: 8 } }, 'activeAlign="center"'), /* @__PURE__ */ import_react.default.createElement("div", { style: { maxWidth: 480 }, "data-testid": "center-wrap" }, /* @__PURE__ */ import_react.default.createElement(
|
|
46
|
+
import_yee_c.Tabs,
|
|
47
|
+
{
|
|
48
|
+
activeAlign: "center",
|
|
49
|
+
items,
|
|
50
|
+
activeKey: centerKey,
|
|
51
|
+
onChange: setCenterKey
|
|
52
|
+
}
|
|
53
|
+
))), /* @__PURE__ */ import_react.default.createElement("div", null, /* @__PURE__ */ import_react.default.createElement("p", { style: { marginBottom: 8 } }, "default (auto)"), /* @__PURE__ */ import_react.default.createElement("div", { style: { maxWidth: 480 }, "data-testid": "auto-wrap" }, /* @__PURE__ */ import_react.default.createElement(import_yee_c.Tabs, { items, activeKey: autoKey, onChange: setAutoKey }))));
|
|
54
|
+
};
|
|
@@ -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 {};
|
|
@@ -28,6 +28,7 @@ function useNavListMove({
|
|
|
28
28
|
direction,
|
|
29
29
|
activeKey,
|
|
30
30
|
enabled,
|
|
31
|
+
align = "auto",
|
|
31
32
|
activetab,
|
|
32
33
|
navList,
|
|
33
34
|
navContainer,
|
|
@@ -40,23 +41,52 @@ function useNavListMove({
|
|
|
40
41
|
if (!enabled || !tab || !list || !container) {
|
|
41
42
|
return;
|
|
42
43
|
}
|
|
43
|
-
|
|
44
|
-
|
|
45
|
-
|
|
44
|
+
if (align !== "center") {
|
|
45
|
+
const [isVisible] = (0, import_tab_utils.isInContainer)(direction, tab, list, container);
|
|
46
|
+
if (isVisible)
|
|
47
|
+
return;
|
|
48
|
+
}
|
|
49
|
+
let moved = false;
|
|
46
50
|
if (direction === "horizontal") {
|
|
47
|
-
|
|
48
|
-
|
|
49
|
-
|
|
50
|
-
|
|
51
|
-
|
|
52
|
-
|
|
53
|
-
const
|
|
54
|
-
newX
|
|
55
|
-
|
|
56
|
-
|
|
57
|
-
|
|
51
|
+
if (align === "center") {
|
|
52
|
+
const containerWidth = container.clientWidth;
|
|
53
|
+
const maxOffset = list.scrollWidth - containerWidth;
|
|
54
|
+
const tabCenter = tab.offsetLeft + tab.offsetWidth / 2;
|
|
55
|
+
let newX = Math.round(containerWidth / 2 - tabCenter);
|
|
56
|
+
newX = Math.max(-maxOffset, Math.min(0, newX));
|
|
57
|
+
const [x] = (0, import_tab_utils.getEleTranslate)(list);
|
|
58
|
+
if (Math.abs(newX - x) > 0.5) {
|
|
59
|
+
(0, import_tab_utils.setEleTranslate)(list, newX);
|
|
60
|
+
moved = true;
|
|
61
|
+
}
|
|
62
|
+
} else {
|
|
63
|
+
const [x] = (0, import_tab_utils.getEleTranslate)(list);
|
|
64
|
+
const tabLeft = tab.offsetLeft;
|
|
65
|
+
const tabWidth = tab.offsetWidth;
|
|
66
|
+
const containerWidth = container.clientWidth;
|
|
67
|
+
let newX = x;
|
|
68
|
+
if (tabLeft + tabWidth - Math.abs(x) > containerWidth) {
|
|
69
|
+
const overflow = tabLeft + tabWidth - Math.abs(x) - containerWidth;
|
|
70
|
+
newX = x - overflow;
|
|
71
|
+
} else if (tabLeft < Math.abs(x)) {
|
|
72
|
+
const overflow = Math.abs(x) - tabLeft;
|
|
73
|
+
newX = x + overflow;
|
|
74
|
+
}
|
|
75
|
+
(0, import_tab_utils.setEleTranslate)(list, newX);
|
|
76
|
+
moved = true;
|
|
77
|
+
}
|
|
78
|
+
} else if (align === "center") {
|
|
79
|
+
const containerHeight = container.clientHeight;
|
|
80
|
+
const maxOffset = container.scrollHeight - containerHeight;
|
|
81
|
+
const tabCenter = tab.offsetTop + tab.offsetHeight / 2;
|
|
82
|
+
const newScrollTop = Math.max(
|
|
83
|
+
0,
|
|
84
|
+
Math.min(maxOffset, Math.round(tabCenter - containerHeight / 2))
|
|
85
|
+
);
|
|
86
|
+
if (Math.abs(newScrollTop - container.scrollTop) > 0.5) {
|
|
87
|
+
container.scrollTop = newScrollTop;
|
|
88
|
+
moved = true;
|
|
58
89
|
}
|
|
59
|
-
(0, import_tab_utils.setEleTranslate)(list, newX);
|
|
60
90
|
} else {
|
|
61
91
|
const tabTop = tab.offsetTop;
|
|
62
92
|
const tabHeight = tab.offsetHeight;
|
|
@@ -65,16 +95,21 @@ function useNavListMove({
|
|
|
65
95
|
if (tabTop + tabHeight - scrollTop >= containerHeight) {
|
|
66
96
|
const overflow = tabTop + tabHeight - scrollTop - containerHeight;
|
|
67
97
|
container.scrollTop = scrollTop + overflow;
|
|
98
|
+
moved = true;
|
|
68
99
|
} else if (tabTop < scrollTop) {
|
|
69
100
|
const overflow = scrollTop - tabTop;
|
|
70
101
|
container.scrollTop = scrollTop - overflow;
|
|
102
|
+
moved = true;
|
|
71
103
|
}
|
|
72
104
|
}
|
|
73
|
-
|
|
105
|
+
if (moved) {
|
|
106
|
+
onMoved == null ? void 0 : onMoved();
|
|
107
|
+
}
|
|
74
108
|
}, [
|
|
75
109
|
activeKey,
|
|
76
110
|
enabled,
|
|
77
111
|
direction,
|
|
112
|
+
align,
|
|
78
113
|
activetab,
|
|
79
114
|
navList,
|
|
80
115
|
navContainer,
|
|
@@ -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 {};
|
|
@@ -57,6 +57,10 @@ function useTabScroll({
|
|
|
57
57
|
container.classList.toggle("with-suffix-shadow", currentOffset < maxOffset);
|
|
58
58
|
}, [direction, navContainer, navList]);
|
|
59
59
|
const debouncedUpdateShadow = (0, import_useDebounceFunction.default)(updateShadow, 200);
|
|
60
|
+
const refresh = (0, import_react.useCallback)(() => {
|
|
61
|
+
setRefreshKey((prev) => prev + 1);
|
|
62
|
+
debouncedUpdateShadow();
|
|
63
|
+
}, [debouncedUpdateShadow]);
|
|
60
64
|
(0, import_react.useEffect)(() => {
|
|
61
65
|
const container = navContainer.current;
|
|
62
66
|
const list = navList.current;
|
|
@@ -95,5 +99,5 @@ function useTabScroll({
|
|
|
95
99
|
debouncedUpdateShadow,
|
|
96
100
|
updateShadow
|
|
97
101
|
]);
|
|
98
|
-
return { refreshKey, updateShadow: debouncedUpdateShadow };
|
|
102
|
+
return { refreshKey, refresh, updateShadow: debouncedUpdateShadow };
|
|
99
103
|
}
|
|
@@ -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);
|
|
@@ -67,6 +67,7 @@ var TabHeader = (props) => {
|
|
|
67
67
|
prefixCls,
|
|
68
68
|
type,
|
|
69
69
|
position = "top",
|
|
70
|
+
activeAlign = "auto",
|
|
70
71
|
headerExtra,
|
|
71
72
|
classNames,
|
|
72
73
|
styles,
|
|
@@ -84,7 +85,7 @@ var TabHeader = (props) => {
|
|
|
84
85
|
navList,
|
|
85
86
|
itemsLength: (items == null ? void 0 : items.length) || 0
|
|
86
87
|
});
|
|
87
|
-
const { refreshKey } = (0, import_hooks.useTabScroll)({
|
|
88
|
+
const { refreshKey, refresh: refreshNav } = (0, import_hooks.useTabScroll)({
|
|
88
89
|
direction,
|
|
89
90
|
navContainer,
|
|
90
91
|
navList,
|
|
@@ -99,14 +100,19 @@ var TabHeader = (props) => {
|
|
|
99
100
|
enabled: !type
|
|
100
101
|
// Only show active bar for non-card types
|
|
101
102
|
});
|
|
103
|
+
const handleNavMoved = (0, import_react.useCallback)(() => {
|
|
104
|
+
checkVisibility();
|
|
105
|
+
refreshNav();
|
|
106
|
+
}, [checkVisibility, refreshNav]);
|
|
102
107
|
(0, import_hooks.useNavListMove)({
|
|
103
108
|
direction,
|
|
104
109
|
activeKey,
|
|
105
110
|
enabled: moreOpen,
|
|
111
|
+
align: activeAlign,
|
|
106
112
|
activetab,
|
|
107
113
|
navList,
|
|
108
114
|
navContainer,
|
|
109
|
-
onMoved:
|
|
115
|
+
onMoved: handleNavMoved
|
|
110
116
|
});
|
|
111
117
|
(0, import_hooks.useContainerResize)(navContainer, checkVisibility);
|
|
112
118
|
const renderPrefixExtra = (0, import_react.useCallback)(() => {
|
|
@@ -198,6 +204,7 @@ var TabHeader = (props) => {
|
|
|
198
204
|
import_Button.default,
|
|
199
205
|
{
|
|
200
206
|
className: `${prefixCls}-nav-more`,
|
|
207
|
+
size: "small",
|
|
201
208
|
icon: /* @__PURE__ */ import_react.default.createElement(import_lucide_react.Ellipsis, { size: 14, strokeWidth: 1.5 }),
|
|
202
209
|
type: "text",
|
|
203
210
|
"aria-label": "More tabs"
|
package/dist/cjs/Tabs/tabs.js
CHANGED
|
@@ -88,6 +88,7 @@ var Tabs = (baseprops) => {
|
|
|
88
88
|
activeKey,
|
|
89
89
|
defaultActiveKey,
|
|
90
90
|
fixedHeader,
|
|
91
|
+
activeAlign,
|
|
91
92
|
onChange,
|
|
92
93
|
onEdit,
|
|
93
94
|
onTabClick
|
|
@@ -104,6 +105,7 @@ var Tabs = (baseprops) => {
|
|
|
104
105
|
"activeKey",
|
|
105
106
|
"defaultActiveKey",
|
|
106
107
|
"fixedHeader",
|
|
108
|
+
"activeAlign",
|
|
107
109
|
"onChange",
|
|
108
110
|
"onEdit",
|
|
109
111
|
"onTabClick"
|
|
@@ -167,7 +169,8 @@ var Tabs = (baseprops) => {
|
|
|
167
169
|
return /* @__PURE__ */ import_react.default.createElement("div", __spreadProps(__spreadValues({}, (0, import_omit.default)(rest, ["headerExtra"])), { className: cls, style }), /* @__PURE__ */ import_react.default.createElement(TabsCtx.Provider, { value: contextValue }, /* @__PURE__ */ import_react.default.createElement(
|
|
168
170
|
import_tab_header.default,
|
|
169
171
|
__spreadProps(__spreadValues({}, (0, import_omit.default)(props, ["children", "className", "style"])), {
|
|
170
|
-
prefixCls
|
|
172
|
+
prefixCls,
|
|
173
|
+
activeAlign
|
|
171
174
|
})
|
|
172
175
|
), /* @__PURE__ */ import_react.default.createElement(
|
|
173
176
|
import_tab_content.default,
|
|
@@ -0,0 +1,65 @@
|
|
|
1
|
+
var __create = Object.create;
|
|
2
|
+
var __defProp = Object.defineProperty;
|
|
3
|
+
var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
|
|
4
|
+
var __getOwnPropNames = Object.getOwnPropertyNames;
|
|
5
|
+
var __getProtoOf = Object.getPrototypeOf;
|
|
6
|
+
var __hasOwnProp = Object.prototype.hasOwnProperty;
|
|
7
|
+
var __export = (target, all) => {
|
|
8
|
+
for (var name in all)
|
|
9
|
+
__defProp(target, name, { get: all[name], enumerable: true });
|
|
10
|
+
};
|
|
11
|
+
var __copyProps = (to, from, except, desc) => {
|
|
12
|
+
if (from && typeof from === "object" || typeof from === "function") {
|
|
13
|
+
for (let key of __getOwnPropNames(from))
|
|
14
|
+
if (!__hasOwnProp.call(to, key) && key !== except)
|
|
15
|
+
__defProp(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable });
|
|
16
|
+
}
|
|
17
|
+
return to;
|
|
18
|
+
};
|
|
19
|
+
var __toESM = (mod, isNodeMode, target) => (target = mod != null ? __create(__getProtoOf(mod)) : {}, __copyProps(
|
|
20
|
+
// If the importer is in node compatibility mode or this is not an ESM
|
|
21
|
+
// file that has been converted to a CommonJS file using a Babel-
|
|
22
|
+
// compatible transform (i.e. "__esModule" has not been set), then set
|
|
23
|
+
// "default" to the CommonJS "module.exports" for node compatibility.
|
|
24
|
+
isNodeMode || !mod || !mod.__esModule ? __defProp(target, "default", { value: mod, enumerable: true }) : target,
|
|
25
|
+
mod
|
|
26
|
+
));
|
|
27
|
+
var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
|
|
28
|
+
|
|
29
|
+
// src/Upload/demo/auto-upload.tsx
|
|
30
|
+
var auto_upload_exports = {};
|
|
31
|
+
__export(auto_upload_exports, {
|
|
32
|
+
default: () => auto_upload_default
|
|
33
|
+
});
|
|
34
|
+
module.exports = __toCommonJS(auto_upload_exports);
|
|
35
|
+
var import_yee_c = require("../..");
|
|
36
|
+
var import_react = __toESM(require("react"));
|
|
37
|
+
var auto_upload_default = () => {
|
|
38
|
+
const uploadRef = (0, import_react.useRef)(null);
|
|
39
|
+
const [fileList, setFileList] = (0, import_react.useState)([]);
|
|
40
|
+
const readyCount = fileList.filter((file) => file.status === "ready").length;
|
|
41
|
+
return /* @__PURE__ */ import_react.default.createElement("div", { style: { display: "flex", flexDirection: "column", gap: 12 } }, /* @__PURE__ */ import_react.default.createElement(
|
|
42
|
+
import_yee_c.Upload,
|
|
43
|
+
{
|
|
44
|
+
ref: uploadRef,
|
|
45
|
+
autoUpload: false,
|
|
46
|
+
multiple: true,
|
|
47
|
+
action: "https://www.mocky.io/v2/5cc8019d300000980a055e76",
|
|
48
|
+
fileList,
|
|
49
|
+
onChange: ({ fileList: nextFileList }) => setFileList(nextFileList)
|
|
50
|
+
}
|
|
51
|
+
), /* @__PURE__ */ import_react.default.createElement("div", null, /* @__PURE__ */ import_react.default.createElement(
|
|
52
|
+
import_yee_c.Button,
|
|
53
|
+
{
|
|
54
|
+
type: "primary",
|
|
55
|
+
disabled: readyCount === 0,
|
|
56
|
+
onClick: () => {
|
|
57
|
+
var _a;
|
|
58
|
+
return (_a = uploadRef.current) == null ? void 0 : _a.upload();
|
|
59
|
+
}
|
|
60
|
+
},
|
|
61
|
+
"Start upload (",
|
|
62
|
+
readyCount,
|
|
63
|
+
")"
|
|
64
|
+
)));
|
|
65
|
+
};
|
|
@@ -60,25 +60,20 @@ var basic_default = () => {
|
|
|
60
60
|
{
|
|
61
61
|
uid: "1",
|
|
62
62
|
name: "xxx.png",
|
|
63
|
-
status: "
|
|
64
|
-
raw: {},
|
|
63
|
+
status: "success",
|
|
65
64
|
size: 123,
|
|
66
|
-
percent:
|
|
65
|
+
percent: 100,
|
|
67
66
|
type: "image/png"
|
|
68
67
|
},
|
|
69
68
|
{
|
|
70
69
|
uid: "2",
|
|
71
70
|
name: "yyy.png",
|
|
72
|
-
status: "
|
|
73
|
-
raw: {},
|
|
71
|
+
status: "success",
|
|
74
72
|
size: 123,
|
|
75
|
-
percent:
|
|
73
|
+
percent: 100,
|
|
76
74
|
type: "image/png"
|
|
77
75
|
}
|
|
78
76
|
]
|
|
79
77
|
};
|
|
80
|
-
return (
|
|
81
|
-
// @ts-ignore
|
|
82
|
-
/* @__PURE__ */ import_react.default.createElement(import_yee_c.Upload, __spreadValues({}, props), /* @__PURE__ */ import_react.default.createElement(import_yee_c.Button, null, "Upload"))
|
|
83
|
-
);
|
|
78
|
+
return /* @__PURE__ */ import_react.default.createElement(import_yee_c.Upload, __spreadValues({}, props), /* @__PURE__ */ import_react.default.createElement(import_yee_c.Button, null, "Upload"));
|
|
84
79
|
};
|
|
@@ -53,14 +53,14 @@ var controlled_default = () => {
|
|
|
53
53
|
const props = {
|
|
54
54
|
action: "https://www.mocky.io/v2/5cc8019d300000980a055e76",
|
|
55
55
|
fileList,
|
|
56
|
-
onChange({ file, fileList:
|
|
57
|
-
setFileList(
|
|
56
|
+
onChange({ file, fileList: nextFileList }) {
|
|
57
|
+
setFileList(nextFileList);
|
|
58
58
|
if (file.status !== "uploading") {
|
|
59
|
-
console.log(file,
|
|
59
|
+
console.log(file, nextFileList);
|
|
60
60
|
}
|
|
61
61
|
},
|
|
62
62
|
onRemove(file) {
|
|
63
|
-
setFileList(
|
|
63
|
+
setFileList((current) => current.filter((item) => item.uid !== file.uid));
|
|
64
64
|
return true;
|
|
65
65
|
}
|
|
66
66
|
};
|
|
@@ -48,35 +48,36 @@ __export(pictureWall_exports, {
|
|
|
48
48
|
module.exports = __toCommonJS(pictureWall_exports);
|
|
49
49
|
var import_yee_c = require("../..");
|
|
50
50
|
var import_react = __toESM(require("react"));
|
|
51
|
+
var imageUrl = "https://zos.alipayobjects.com/rmsportal/jkjgkEfvpUPVyRjUImniVslZfWPnJuuZ.png";
|
|
51
52
|
var pictureWall_default = () => {
|
|
52
53
|
const [fileList, setFileList] = (0, import_react.useState)([
|
|
53
54
|
{
|
|
54
55
|
uid: "-1",
|
|
55
|
-
name: "image.png",
|
|
56
|
-
status: "
|
|
57
|
-
|
|
56
|
+
name: "image-1.png",
|
|
57
|
+
status: "success",
|
|
58
|
+
type: "image/png",
|
|
59
|
+
url: imageUrl
|
|
58
60
|
},
|
|
59
61
|
{
|
|
60
62
|
uid: "-2",
|
|
61
|
-
name: "image.png",
|
|
62
|
-
status: "
|
|
63
|
-
|
|
63
|
+
name: "image-2.png",
|
|
64
|
+
status: "success",
|
|
65
|
+
type: "image/png",
|
|
66
|
+
url: imageUrl
|
|
64
67
|
},
|
|
65
68
|
{
|
|
66
69
|
uid: "-3",
|
|
67
|
-
name: "image.png",
|
|
68
|
-
status: "
|
|
69
|
-
|
|
70
|
+
name: "image-3.png",
|
|
71
|
+
status: "success",
|
|
72
|
+
type: "image/png",
|
|
73
|
+
url: imageUrl
|
|
70
74
|
}
|
|
71
75
|
]);
|
|
72
|
-
const handleChange = ({ fileList: fileList2 }) => {
|
|
73
|
-
setFileList(fileList2);
|
|
74
|
-
};
|
|
75
76
|
const props = {
|
|
76
77
|
action: "https://www.mocky.io/v2/5cc8019d300000980a055e76",
|
|
77
78
|
listType: "picture-wall",
|
|
78
79
|
fileList,
|
|
79
|
-
onChange:
|
|
80
|
+
onChange: ({ fileList: nextFileList }) => setFileList(nextFileList)
|
|
80
81
|
};
|
|
81
82
|
return /* @__PURE__ */ import_react.default.createElement(import_yee_c.Upload, __spreadValues({}, props));
|
|
82
83
|
};
|
|
@@ -1,3 +1,4 @@
|
|
|
1
1
|
import React from 'react';
|
|
2
|
-
|
|
2
|
+
import type { UploadDraggerProps, UploadInstance } from './interface';
|
|
3
|
+
declare const Dragger: React.ForwardRefExoticComponent<UploadDraggerProps & React.RefAttributes<UploadInstance>>;
|
|
3
4
|
export default Dragger;
|
|
@@ -54,27 +54,38 @@ var import_lucide_react = require("lucide-react");
|
|
|
54
54
|
var import_react = __toESM(require("react"));
|
|
55
55
|
var import_locale = require("../locale");
|
|
56
56
|
var import_upload = __toESM(require("./upload"));
|
|
57
|
-
var Dragger = import_react.default.forwardRef(
|
|
58
|
-
|
|
59
|
-
|
|
60
|
-
|
|
61
|
-
|
|
62
|
-
|
|
63
|
-
|
|
64
|
-
|
|
65
|
-
{
|
|
66
|
-
|
|
67
|
-
|
|
68
|
-
|
|
69
|
-
|
|
70
|
-
|
|
71
|
-
|
|
72
|
-
|
|
57
|
+
var Dragger = import_react.default.forwardRef(
|
|
58
|
+
(props, ref) => {
|
|
59
|
+
const {
|
|
60
|
+
prefixCls = "yee-upload-dragger",
|
|
61
|
+
children,
|
|
62
|
+
disabled,
|
|
63
|
+
hint
|
|
64
|
+
} = props;
|
|
65
|
+
const { t } = (0, import_locale.useLocale)();
|
|
66
|
+
const renderChildren = () => {
|
|
67
|
+
return children != null ? children : /* @__PURE__ */ import_react.default.createElement(import_react.default.Fragment, null, /* @__PURE__ */ import_react.default.createElement("span", { className: `${prefixCls}-icon`, "aria-hidden": "true" }, /* @__PURE__ */ import_react.default.createElement(import_lucide_react.Upload, { size: 22 })), /* @__PURE__ */ import_react.default.createElement("span", { className: `${prefixCls}-hint` }, hint != null ? hint : t("upload.draggerHint")));
|
|
68
|
+
};
|
|
69
|
+
return /* @__PURE__ */ import_react.default.createElement(import_upload.default, __spreadProps(__spreadValues({}, props), { type: "drag", ref }), /* @__PURE__ */ import_react.default.createElement(
|
|
70
|
+
"div",
|
|
71
|
+
{
|
|
72
|
+
className: (0, import_clsx.default)(prefixCls, {
|
|
73
|
+
[`${prefixCls}-disabled`]: disabled
|
|
74
|
+
}),
|
|
75
|
+
role: "button",
|
|
76
|
+
"aria-disabled": disabled,
|
|
77
|
+
tabIndex: disabled ? -1 : 0,
|
|
78
|
+
onKeyDown: (event) => {
|
|
79
|
+
var _a, _b;
|
|
80
|
+
if (event.key === "Enter" || event.key === " ") {
|
|
81
|
+
event.preventDefault();
|
|
82
|
+
(_b = (_a = event.currentTarget.parentElement) == null ? void 0 : _a.querySelector('input[type="file"]')) == null ? void 0 : _b.click();
|
|
83
|
+
}
|
|
73
84
|
}
|
|
74
|
-
}
|
|
75
|
-
|
|
76
|
-
|
|
77
|
-
|
|
78
|
-
|
|
85
|
+
},
|
|
86
|
+
renderChildren()
|
|
87
|
+
));
|
|
88
|
+
}
|
|
89
|
+
);
|
|
79
90
|
Dragger.displayName = "Dragger";
|
|
80
91
|
var dragger_default = Dragger;
|
|
@@ -4,5 +4,5 @@ type UploadType = typeof InternalUpload & {
|
|
|
4
4
|
Dragger: typeof Dragger;
|
|
5
5
|
};
|
|
6
6
|
declare const Upload: UploadType;
|
|
7
|
-
export type { UploadProps } from './interface';
|
|
7
|
+
export type { UploadDraggerProps, UploadFile, UploadInstance, UploadProps, UploadRequestAbort, UploadRequestOptions, } from './interface';
|
|
8
8
|
export default Upload;
|