1 | "use strict";
|
2 |
|
3 | var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
|
4 |
|
5 | Object.defineProperty(exports, "__esModule", {
|
6 | value: true
|
7 | });
|
8 | exports.toGroups = toGroups;
|
9 | exports.toArray = toArray;
|
10 | exports.getDefaultActiveKeyInGroup = getDefaultActiveKeyInGroup;
|
11 | exports.getDefaultActiveKey = getDefaultActiveKey;
|
12 | exports.getDefaultGroupKey = getDefaultGroupKey;
|
13 | exports.getActiveKeyByGroupKey = getActiveKeyByGroupKey;
|
14 | exports.generateKey = generateKey;
|
15 | exports.getActiveIndex = getActiveIndex;
|
16 | exports.setTransform = setTransform;
|
17 | exports.isTransformSupported = isTransformSupported;
|
18 | exports.setTransition = setTransition;
|
19 | exports.getTransformPropValue = getTransformPropValue;
|
20 | exports.isVertical = isVertical;
|
21 | exports.getTransformByIndex = getTransformByIndex;
|
22 | exports.getMarginStyle = getMarginStyle;
|
23 | exports.getStyle = getStyle;
|
24 | exports.setPxStyle = setPxStyle;
|
25 | exports.getDataAttr = getDataAttr;
|
26 | exports.getLeft = getLeft;
|
27 | exports.getTop = getTop;
|
28 | exports.getHeader = getHeader;
|
29 | exports.normalizePanes = normalizePanes;
|
30 |
|
31 | var _objectSpread2 = _interopRequireDefault(require("@babel/runtime/helpers/objectSpread2"));
|
32 |
|
33 | var _defineProperty2 = _interopRequireDefault(require("@babel/runtime/helpers/defineProperty"));
|
34 |
|
35 | var _slicedToArray2 = _interopRequireDefault(require("@babel/runtime/helpers/slicedToArray"));
|
36 |
|
37 | var _toConsumableArray2 = _interopRequireDefault(require("@babel/runtime/helpers/toConsumableArray"));
|
38 |
|
39 | var _react = require("react");
|
40 |
|
41 | var _reactIs = require("react-is");
|
42 |
|
43 | var _isNil = _interopRequireDefault(require("lodash/isNil"));
|
44 |
|
45 | var _enum = require("./enum");
|
46 |
|
47 | var _TabGroup = require("./TabGroup");
|
48 |
|
49 | function toGroups(children) {
|
50 | var c = [];
|
51 |
|
52 | _react.Children.forEach(children, function (child) {
|
53 | if (child) {
|
54 | if ((0, _reactIs.isFragment)(child)) {
|
55 | c.push.apply(c, (0, _toConsumableArray2["default"])(toGroups(child.props.children)));
|
56 | } else if ((0, _TabGroup.isTabGroup)(child)) {
|
57 | c.push(child);
|
58 | }
|
59 | }
|
60 | });
|
61 |
|
62 | return c;
|
63 | }
|
64 |
|
65 | function toArray(children) {
|
66 | var c = [];
|
67 |
|
68 | _react.Children.forEach(children, function (child) {
|
69 | if (child) {
|
70 | if ((0, _reactIs.isFragment)(child)) {
|
71 | c.push.apply(c, (0, _toConsumableArray2["default"])(toArray(child.props.children)));
|
72 | } else if ((0, _react.isValidElement)(child)) {
|
73 | c.push(child);
|
74 | }
|
75 | }
|
76 | });
|
77 |
|
78 | return c;
|
79 | }
|
80 |
|
81 | function getDefaultActiveKeyInGroup(panelMap) {
|
82 | var _iteratorNormalCompletion = true;
|
83 | var _didIteratorError = false;
|
84 | var _iteratorError = undefined;
|
85 |
|
86 | try {
|
87 | for (var _iterator = panelMap[Symbol.iterator](), _step; !(_iteratorNormalCompletion = (_step = _iterator.next()).done); _iteratorNormalCompletion = true) {
|
88 | var _step$value = (0, _slicedToArray2["default"])(_step.value, 2),
|
89 | key = _step$value[0],
|
90 | panel = _step$value[1];
|
91 |
|
92 | if (!panel.disabled) {
|
93 | return key;
|
94 | }
|
95 | }
|
96 | } catch (err) {
|
97 | _didIteratorError = true;
|
98 | _iteratorError = err;
|
99 | } finally {
|
100 | try {
|
101 | if (!_iteratorNormalCompletion && _iterator["return"] != null) {
|
102 | _iterator["return"]();
|
103 | }
|
104 | } finally {
|
105 | if (_didIteratorError) {
|
106 | throw _iteratorError;
|
107 | }
|
108 | }
|
109 | }
|
110 | }
|
111 |
|
112 | function getDefaultActiveKey(totalPanelsMap, groupedPanelsMap, option) {
|
113 | var activeKey = option.activeKey,
|
114 | defaultActiveKey = option.defaultActiveKey;
|
115 |
|
116 | if (activeKey !== undefined) {
|
117 | return activeKey;
|
118 | }
|
119 |
|
120 | if (defaultActiveKey !== undefined) {
|
121 | return defaultActiveKey;
|
122 | }
|
123 |
|
124 | var _groupedPanelsMap$val = groupedPanelsMap.values().next(),
|
125 | value = _groupedPanelsMap$val.value;
|
126 |
|
127 | if (value) {
|
128 | var groupDefaultActiveKey = value.group.defaultActiveKey;
|
129 |
|
130 | if (groupDefaultActiveKey !== undefined) {
|
131 | return groupDefaultActiveKey;
|
132 | }
|
133 | }
|
134 |
|
135 | return getDefaultActiveKeyInGroup(totalPanelsMap);
|
136 | }
|
137 |
|
138 | function getDefaultGroupKey(groupedPanelsMap) {
|
139 | var _iteratorNormalCompletion2 = true;
|
140 | var _didIteratorError2 = false;
|
141 | var _iteratorError2 = undefined;
|
142 |
|
143 | try {
|
144 | for (var _iterator2 = groupedPanelsMap[Symbol.iterator](), _step2; !(_iteratorNormalCompletion2 = (_step2 = _iterator2.next()).done); _iteratorNormalCompletion2 = true) {
|
145 | var _step2$value = (0, _slicedToArray2["default"])(_step2.value, 2),
|
146 | key = _step2$value[0],
|
147 | panelsMap = _step2$value[1].panelsMap;
|
148 |
|
149 | var _iteratorNormalCompletion3 = true;
|
150 | var _didIteratorError3 = false;
|
151 | var _iteratorError3 = undefined;
|
152 |
|
153 | try {
|
154 | for (var _iterator3 = panelsMap[Symbol.iterator](), _step3; !(_iteratorNormalCompletion3 = (_step3 = _iterator3.next()).done); _iteratorNormalCompletion3 = true) {
|
155 | var _step3$value = (0, _slicedToArray2["default"])(_step3.value, 2),
|
156 | panel = _step3$value[1];
|
157 |
|
158 | if (!panel.disabled) {
|
159 | return key;
|
160 | }
|
161 | }
|
162 | } catch (err) {
|
163 | _didIteratorError3 = true;
|
164 | _iteratorError3 = err;
|
165 | } finally {
|
166 | try {
|
167 | if (!_iteratorNormalCompletion3 && _iterator3["return"] != null) {
|
168 | _iterator3["return"]();
|
169 | }
|
170 | } finally {
|
171 | if (_didIteratorError3) {
|
172 | throw _iteratorError3;
|
173 | }
|
174 | }
|
175 | }
|
176 | }
|
177 | } catch (err) {
|
178 | _didIteratorError2 = true;
|
179 | _iteratorError2 = err;
|
180 | } finally {
|
181 | try {
|
182 | if (!_iteratorNormalCompletion2 && _iterator2["return"] != null) {
|
183 | _iterator2["return"]();
|
184 | }
|
185 | } finally {
|
186 | if (_didIteratorError2) {
|
187 | throw _iteratorError2;
|
188 | }
|
189 | }
|
190 | }
|
191 | }
|
192 |
|
193 | function getActiveKeyByGroupKey(groupedPanelsMap, key) {
|
194 | var map = groupedPanelsMap.get(key);
|
195 |
|
196 | if (map) {
|
197 | var group = map.group,
|
198 | panelsMap = map.panelsMap,
|
199 | lastActiveKey = map.lastActiveKey;
|
200 |
|
201 | if (lastActiveKey) {
|
202 | return lastActiveKey;
|
203 | }
|
204 |
|
205 | if ('defaultActiveKey' in group) {
|
206 | return group.defaultActiveKey;
|
207 | }
|
208 |
|
209 | return getDefaultActiveKeyInGroup(panelsMap);
|
210 | }
|
211 | }
|
212 |
|
213 | function generateKey(key, index) {
|
214 | return String((0, _isNil["default"])(key) ? index : key);
|
215 | }
|
216 |
|
217 | function getActiveIndex(map, activeKey) {
|
218 | return activeKey === undefined ? -1 : (0, _toConsumableArray2["default"])(map.keys()).findIndex(function (key) {
|
219 | return key === activeKey;
|
220 | });
|
221 | }
|
222 |
|
223 | function setTransform(style) {
|
224 | var v = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : '';
|
225 | style.transform = v;
|
226 | style.webkitTransform = v;
|
227 | }
|
228 |
|
229 | function isTransformSupported(style) {
|
230 | return 'transform' in style || 'webkitTransform' in style;
|
231 | }
|
232 |
|
233 | function setTransition(style) {
|
234 | var v = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : '';
|
235 | style.transition = v;
|
236 | style.webkitTransition = v;
|
237 | }
|
238 |
|
239 | function getTransformPropValue(v) {
|
240 | return {
|
241 | transform: v,
|
242 | WebkitTransform: v
|
243 | };
|
244 | }
|
245 |
|
246 | function isVertical(tabBarPosition) {
|
247 | return tabBarPosition === _enum.TabsPosition.left || tabBarPosition === _enum.TabsPosition.right;
|
248 | }
|
249 |
|
250 | function getTransformByIndex(index, tabBarPosition) {
|
251 | var translate = isVertical(tabBarPosition) ? 'translateY' : 'translateX';
|
252 | return "".concat(translate, "(").concat(-index * 100, "%) translateZ(0)");
|
253 | }
|
254 |
|
255 | function getMarginStyle(index, tabBarPosition) {
|
256 | var marginDirection = isVertical(tabBarPosition) ? 'marginTop' : 'marginLeft';
|
257 | return (0, _defineProperty2["default"])({}, marginDirection, "".concat(-index * 100, "%"));
|
258 | }
|
259 |
|
260 | function getStyle(el, property) {
|
261 | return +getComputedStyle(el).getPropertyValue(property).replace('px', '');
|
262 | }
|
263 |
|
264 | function setPxStyle(el, value, vertical) {
|
265 | value = vertical ? "0px, ".concat(value, "px, 0px") : "".concat(value, "px, 0px, 0px");
|
266 | setTransform(el.style, "translate3d(".concat(value, ")"));
|
267 | }
|
268 |
|
269 | function getDataAttr(props) {
|
270 | return Object.keys(props).reduce(function (prev, key) {
|
271 | if (key === 'role' || key.startsWith('aria-') || key.startsWith('data-')) {
|
272 | prev[key] = props[key];
|
273 | }
|
274 |
|
275 | return prev;
|
276 | }, {});
|
277 | }
|
278 |
|
279 | function toNum(style, property) {
|
280 | return +style.getPropertyValue(property).replace('px', '');
|
281 | }
|
282 |
|
283 | function getTypeValue(start, current, end, tabNode, wrapperNode) {
|
284 | var total = getStyle(wrapperNode, "padding-".concat(start));
|
285 | var parentNode = tabNode.parentNode;
|
286 |
|
287 | if (parentNode) {
|
288 | (0, _toConsumableArray2["default"])(parentNode.childNodes).some(function (node) {
|
289 | if (node !== tabNode) {
|
290 |
|
291 |
|
292 |
|
293 | if (node.className.includes('ink-bar')) {
|
294 | return false;
|
295 | }
|
296 |
|
297 | var style = getComputedStyle(node);
|
298 | total += toNum(style, "margin-".concat(start));
|
299 | total += toNum(style, "margin-".concat(end));
|
300 | total += toNum(style, current);
|
301 |
|
302 | if (style.boxSizing === 'content-box') {
|
303 | total += toNum(style, "border-".concat(start, "-width")) + toNum(style, "padding-".concat(start)) + toNum(style, "border-".concat(end, "-width")) + toNum(style, "padding-".concat(end));
|
304 | }
|
305 |
|
306 | return false;
|
307 | }
|
308 |
|
309 | return true;
|
310 | });
|
311 | }
|
312 |
|
313 | return total;
|
314 | }
|
315 |
|
316 | function getLeft(tabNode, wrapperNode) {
|
317 | return getTypeValue('left', 'width', 'right', tabNode, wrapperNode);
|
318 | }
|
319 |
|
320 | function getTop(tabNode, wrapperNode) {
|
321 | return getTypeValue('top', 'height', 'bottom', tabNode, wrapperNode);
|
322 | }
|
323 |
|
324 | function getHeader(props) {
|
325 | var tab = props.tab,
|
326 | title = props.title;
|
327 |
|
328 | if (typeof tab === 'function') {
|
329 | return tab(title);
|
330 | }
|
331 |
|
332 | if (title !== undefined) {
|
333 | return title;
|
334 | }
|
335 |
|
336 | if (tab !== undefined) {
|
337 | return tab;
|
338 | }
|
339 | }
|
340 |
|
341 | function normalizePanes(children, customized) {
|
342 | var groups = toGroups(children);
|
343 | var groupedPanels = new Map();
|
344 | var panelList = [];
|
345 | var panes = customized && customized.panes;
|
346 |
|
347 | var getCustomizedPane = function getCustomizedPane(key) {
|
348 | if (panes) {
|
349 | return panes[key];
|
350 | }
|
351 | };
|
352 |
|
353 | var sorter = function sorter(item1, item2) {
|
354 | var _item1$1$sort = item1[1].sort,
|
355 | sort = _item1$1$sort === void 0 ? 0 : _item1$1$sort;
|
356 | var _item2$1$sort = item2[1].sort,
|
357 | sort2 = _item2$1$sort === void 0 ? 0 : _item2$1$sort;
|
358 | return sort - sort2;
|
359 | };
|
360 |
|
361 | if (groups.length) {
|
362 | var index = 0;
|
363 | groups.forEach(function (group, i) {
|
364 | var groupPanelList = [];
|
365 | toArray(group.props.children).forEach(function (child, j) {
|
366 | var panelKey = generateKey(child.key, index);
|
367 | index += 1;
|
368 | groupPanelList.push([panelKey, (0, _objectSpread2["default"])({
|
369 | type: child.type,
|
370 | sort: j
|
371 | }, child.props, {}, getCustomizedPane(panelKey))]);
|
372 | });
|
373 | groupPanelList.sort(sorter);
|
374 | panelList.push.apply(panelList, groupPanelList);
|
375 | var groupKey = generateKey(group.key, i);
|
376 | groupedPanels.set(groupKey, {
|
377 | group: (0, _objectSpread2["default"])({}, group.props),
|
378 | panelsMap: new Map(groupPanelList)
|
379 | });
|
380 | });
|
381 | } else {
|
382 | toArray(children).sort().forEach(function (child, index) {
|
383 | var key = generateKey(child.key, index);
|
384 | panelList.push([key, (0, _objectSpread2["default"])({
|
385 | type: child.type,
|
386 | sort: index
|
387 | }, child.props, {}, getCustomizedPane(key))]);
|
388 | });
|
389 | panelList.sort(sorter);
|
390 | }
|
391 |
|
392 | return [new Map(panelList), groupedPanels];
|
393 | }
|
394 |
|