yootd 0.2.21 → 0.2.23

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.
@@ -1,7 +1,7 @@
1
1
  import _extends from "@babel/runtime/helpers/esm/extends";
2
2
  import _slicedToArray from "@babel/runtime/helpers/esm/slicedToArray";
3
3
  import _objectWithoutProperties from "@babel/runtime/helpers/esm/objectWithoutProperties";
4
- var _excluded = ["size", "capsule", "className", "items", "onChange", "activeKey", "destroyInactiveTabPane", "isTabMargin"];
4
+ var _excluded = ["size", "capsule", "className", "items", "onChange", "activeKey", "defaultActiveKey", "destroyInactiveTabPane", "isTabMargin"];
5
5
  import { Tabs as AntTabs, Radio } from 'antd';
6
6
  import React, { useEffect, useState } from 'react';
7
7
  import { useBem } from "../hooks/useBem";
@@ -14,16 +14,18 @@ export var TabsComponent = function TabsComponent(_ref) {
14
14
  items = _ref.items,
15
15
  _onChange = _ref.onChange,
16
16
  activeKey = _ref.activeKey,
17
+ defaultActiveKey = _ref.defaultActiveKey,
17
18
  _ref$destroyInactiveT = _ref.destroyInactiveTabPane,
18
19
  destroyInactiveTabPane = _ref$destroyInactiveT === void 0 ? false : _ref$destroyInactiveT,
19
20
  _ref$isTabMargin = _ref.isTabMargin,
20
21
  isTabMargin = _ref$isTabMargin === void 0 ? true : _ref$isTabMargin,
21
22
  rest = _objectWithoutProperties(_ref, _excluded);
22
23
  var mb = useBem('tabs');
23
- var _useState = useState(),
24
+ // const [key, setKey] = useState<string>();
25
+ var _useState = useState(activeKey !== null && activeKey !== void 0 ? activeKey : defaultActiveKey),
24
26
  _useState2 = _slicedToArray(_useState, 2),
25
- key = _useState2[0],
26
- setKey = _useState2[1];
27
+ capsuleKey = _useState2[0],
28
+ setCapsuleKey = _useState2[1];
27
29
  var _useState3 = useState(new Set()),
28
30
  _useState4 = _slicedToArray(_useState3, 2),
29
31
  renderKey = _useState4[0],
@@ -40,22 +42,28 @@ export var TabsComponent = function TabsComponent(_ref) {
40
42
  // 默认为小尺寸
41
43
  _className = "".concat(mb.b('large'));
42
44
  }
45
+ console.log("capsuleKey", capsuleKey);
46
+
43
47
  // 给key设置默认值
44
48
  useEffect(function () {
45
- if (activeKey != null) {
46
- setKey(activeKey);
47
- setRenderKey(function (pre) {
48
- return pre.add(activeKey);
49
+ if (capsuleKey != null) {
50
+ setRenderKey(function (prev) {
51
+ var newSet = new Set(prev);
52
+ newSet.add(capsuleKey);
53
+ return newSet;
49
54
  });
50
55
  } else {
51
- var _items$0$key, _items$;
52
- setKey((_items$0$key = items === null || items === void 0 || (_items$ = items[0]) === null || _items$ === void 0 ? void 0 : _items$.key) !== null && _items$0$key !== void 0 ? _items$0$key : '1');
53
- setRenderKey(function (pre) {
54
- var _items$0$key2, _items$2;
55
- return pre.add((_items$0$key2 = items === null || items === void 0 || (_items$2 = items[0]) === null || _items$2 === void 0 ? void 0 : _items$2.key) !== null && _items$0$key2 !== void 0 ? _items$0$key2 : '1');
56
+ setRenderKey(function (prev) {
57
+ var _items$;
58
+ var newSet = new Set(prev);
59
+ var firstKey = items === null || items === void 0 || (_items$ = items[0]) === null || _items$ === void 0 ? void 0 : _items$.key;
60
+ if (firstKey != null) {
61
+ newSet.add(firstKey);
62
+ }
63
+ return newSet;
56
64
  });
57
65
  }
58
- }, [activeKey]);
66
+ }, [capsuleKey, items]);
59
67
  return /*#__PURE__*/React.createElement("div", {
60
68
  className: "".concat(mb)
61
69
  }, capsule ? /*#__PURE__*/React.createElement("div", {
@@ -65,22 +73,30 @@ export var TabsComponent = function TabsComponent(_ref) {
65
73
  style: {
66
74
  paddingBottom: isTabMargin ? 16 : 0
67
75
  }
68
- }, /*#__PURE__*/React.createElement(Radio.Group, {
69
- value: key,
76
+ }, /*#__PURE__*/React.createElement(Radio.Group, _extends({}, activeKey != null ? {
77
+ value: activeKey
78
+ } : {}, defaultActiveKey != null ? {
79
+ defaultValue: defaultActiveKey
80
+ } : {}, {
70
81
  onChange: function onChange(e) {
71
- setKey(e.target.value);
72
82
  setRenderKey(function (pre) {
73
83
  return pre.add(e.target.value);
74
84
  });
85
+ if (activeKey == null) {
86
+ setCapsuleKey(e.target.value);
87
+ }
75
88
  _onChange === null || _onChange === void 0 || _onChange(e.target.value);
76
- }
77
- }, items === null || items === void 0 ? void 0 : items.map(function (item) {
78
- return /*#__PURE__*/React.createElement(Radio.Button, {
79
- key: item.key,
80
- value: item.key
81
- }, item.label);
89
+ },
90
+ block: true,
91
+ optionType: "button",
92
+ options: items === null || items === void 0 ? void 0 : items.map(function (item) {
93
+ return {
94
+ value: item.key,
95
+ label: item.label
96
+ };
97
+ })
82
98
  }))), destroyInactiveTabPane ? /*#__PURE__*/React.createElement("div", null, items === null || items === void 0 || (_items$find = items.find(function (item) {
83
- return item.key === key;
99
+ return item.key === capsuleKey;
84
100
  })) === null || _items$find === void 0 ? void 0 : _items$find.children) : /*#__PURE__*/React.createElement("div", {
85
101
  className: "".concat(mb.b('capsule').e('value'))
86
102
  }, items === null || items === void 0 || (_items$filter = items.filter(function (item) {
@@ -89,17 +105,17 @@ export var TabsComponent = function TabsComponent(_ref) {
89
105
  return /*#__PURE__*/React.createElement("div", {
90
106
  key: item.key,
91
107
  style: {
92
- display: key === item.key ? 'block' : 'none'
108
+ display: capsuleKey === item.key ? 'block' : 'none'
93
109
  }
94
110
  }, item.children);
95
111
  }))) : /*#__PURE__*/React.createElement(AntTabs, _extends({
96
- activeKey: key,
112
+ activeKey: activeKey,
113
+ defaultActiveKey: defaultActiveKey,
97
114
  size: size,
98
115
  items: items,
99
116
  className: "".concat(className !== null && className !== void 0 ? className : '', " ").concat(_className, " ").concat(isTabMargin ? '' : mb.b('istabmargin'), " "),
100
117
  destroyInactiveTabPane: destroyInactiveTabPane,
101
118
  onChange: function onChange(e) {
102
- setKey(e);
103
119
  _onChange === null || _onChange === void 0 || _onChange(e);
104
120
  }
105
121
  }, rest)));
@@ -115,7 +115,8 @@ var InternalUpload = function InternalUpload(props, ref) {
115
115
  url: item.filename,
116
116
  uid: file.uid,
117
117
  preview: item.filename,
118
- status: 'done'
118
+ status: 'done',
119
+ size: file.size
119
120
  });
120
121
  });
121
122
  onChange === null || onChange === void 0 || onChange([].concat(_toConsumableArray(filteredList), _list));
@@ -142,7 +142,8 @@ var InternalUpload = function InternalUpload(props, ref) {
142
142
  url: item.filename,
143
143
  uid: file.uid,
144
144
  preview: item.filename,
145
- status: 'done'
145
+ status: 'done',
146
+ size: file.size
146
147
  });
147
148
  });
148
149
  onChange === null || onChange === void 0 || onChange([].concat(_toConsumableArray(fileList), _fileList));
@@ -6,6 +6,7 @@ import { useBem } from "../hooks/useBem";
6
6
  import "./index.scss";
7
7
  export var WithSearchForm = function WithSearchForm(_ref) {
8
8
  var children = _ref.children;
9
+ var childrenArray = React.Children.toArray(children);
9
10
  var mb = useBem('WithSearchForm');
10
11
  // 外层dom实例
11
12
  var formRef = useRef(null);
@@ -13,7 +14,7 @@ export var WithSearchForm = function WithSearchForm(_ref) {
13
14
  var btnRef = useRef(null);
14
15
  // 传进来的children dom数组实例
15
16
  var childRefs = useRef([]);
16
- var _useState = useState(children.length),
17
+ var _useState = useState(childrenArray.length),
17
18
  _useState2 = _slicedToArray(_useState, 2),
18
19
  visibleCount = _useState2[0],
19
20
  setVisibleCount = _useState2[1];
@@ -23,7 +24,7 @@ export var WithSearchForm = function WithSearchForm(_ref) {
23
24
  isExpanded = _useState4[0],
24
25
  setIsExpanded = _useState4[1];
25
26
  // 计算出应该显示的children数量
26
- var _useState5 = useState(children.length),
27
+ var _useState5 = useState(childrenArray.length),
27
28
  _useState6 = _slicedToArray(_useState5, 2),
28
29
  calculatedCount = _useState6[0],
29
30
  setCalculatedCount = _useState6[1];
@@ -70,7 +71,7 @@ export var WithSearchForm = function WithSearchForm(_ref) {
70
71
  // 保存计算出的数量
71
72
  setCalculatedCount(itemCount);
72
73
  // 根据展开状态设置可见数量
73
- setVisibleCount(isExpanded ? children.length : itemCount);
74
+ setVisibleCount(isExpanded ? childrenArray.length : itemCount);
74
75
  };
75
76
  useEffect(function () {
76
77
  // 创建 ResizeObserver 实例
@@ -85,12 +86,12 @@ export var WithSearchForm = function WithSearchForm(_ref) {
85
86
  return function () {
86
87
  resizeObserver.disconnect();
87
88
  };
88
- }, [children, isExpanded]);
89
+ }, [childrenArray, isExpanded]);
89
90
 
90
91
  // 处理展开/收起的点击事件
91
92
  var handleExpandClick = function handleExpandClick() {
92
93
  setIsExpanded(!isExpanded);
93
- setVisibleCount(!isExpanded ? children.length : calculatedCount);
94
+ setVisibleCount(!isExpanded ? childrenArray.length : calculatedCount);
94
95
  };
95
96
  return /*#__PURE__*/React.createElement("div", {
96
97
  ref: formRef,
@@ -103,7 +104,7 @@ export var WithSearchForm = function WithSearchForm(_ref) {
103
104
  flexWrap: 'wrap',
104
105
  width: '100%'
105
106
  }
106
- }, children === null || children === void 0 ? void 0 : children.map(function (child, index) {
107
+ }, childrenArray === null || childrenArray === void 0 ? void 0 : childrenArray.map(function (child, index) {
107
108
  return /*#__PURE__*/React.createElement("div", {
108
109
  key: "measure-".concat(index),
109
110
  ref: function ref(el) {
@@ -113,7 +114,7 @@ export var WithSearchForm = function WithSearchForm(_ref) {
113
114
  display: 'inline-block'
114
115
  }
115
116
  }, child);
116
- })), children === null || children === void 0 ? void 0 : children.slice(0, visibleCount), /*#__PURE__*/React.createElement("div", {
117
+ })), childrenArray === null || childrenArray === void 0 ? void 0 : childrenArray.slice(0, visibleCount), /*#__PURE__*/React.createElement("div", {
117
118
  ref: btnRef
118
119
  }, /*#__PURE__*/React.createElement(Form.Item, {
119
120
  className: "mb-4"
@@ -123,7 +124,7 @@ export var WithSearchForm = function WithSearchForm(_ref) {
123
124
  }, "\u67E5\u8BE2"), /*#__PURE__*/React.createElement(Button, {
124
125
  type: "default",
125
126
  htmlType: "reset"
126
- }, "\u91CD\u7F6E"), (children === null || children === void 0 ? void 0 : children.length) > calculatedCount ? /*#__PURE__*/React.createElement("span", {
127
+ }, "\u91CD\u7F6E"), (childrenArray === null || childrenArray === void 0 ? void 0 : childrenArray.length) > calculatedCount ? /*#__PURE__*/React.createElement("span", {
127
128
  className: "".concat(mb.e('expanded')),
128
129
  onClick: handleExpandClick
129
130
  }, isExpanded ? '收起' : '展开', ' ', /*#__PURE__*/React.createElement(DownOutlined, {
@@ -1,3 +1,3 @@
1
1
  export interface WithSearchFormProps {
2
- children: ReactNode[];
2
+ children: ReactNode;
3
3
  }
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "yootd",
3
- "version": "0.2.21",
3
+ "version": "0.2.23",
4
4
  "description": "基于 Antd 二次开发的组件库",
5
5
  "license": "MIT",
6
6
  "module": "dist/index.js",