@bytedance/mona-client-web
Version:
web for mona
161 lines • 7.59 kB
JavaScript
var __assign = (this && this.__assign) || function () {
__assign = Object.assign || function(t) {
for (var s, i = 1, n = arguments.length; i < n; i++) {
s = arguments[i];
for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p))
t[p] = s[p];
}
return t;
};
return __assign.apply(this, arguments);
};
var __spreadArray = (this && this.__spreadArray) || function (to, from, pack) {
if (pack || arguments.length === 2) for (var i = 0, l = from.length, ar; i < l; i++) {
if (ar || !(i in from)) {
if (!ar) ar = Array.prototype.slice.call(from, 0, i);
ar[i] = from[i];
}
}
return to.concat(ar || Array.prototype.slice.call(from));
};
import { redirectTo } from '../../apis/api';
import formatPath from '@bytedance/mona-shared/dist/formatPath';
import EventEmitter from '../../EventEmitter';
import { useHistory } from 'react-router';
import { useCallback, useEffect, useState } from 'react';
var eventEmitter = new EventEmitter();
var defaultTabProps = {
color: 'inherit',
selectedColor: 'inherit',
backgroundColor: '#fff',
list: []
};
function safeSet(value, oldValue) {
return typeof value === 'undefined' ? oldValue : value;
}
export var useTabProps = function (rawTab) {
var _a = useState(rawTab !== null && rawTab !== void 0 ? rawTab : defaultTabProps), tab = _a[0], setTab = _a[1];
useEffect(function () {
eventEmitter.on('setTabBarStyle', function (options) {
if (options) {
var success = options.success, complete = options.complete, color_1 = options.color, selectedColor_1 = options.selectedColor, backgroundColor_1 = options.backgroundColor, borderStyle_1 = options.borderStyle;
setTab(function (prev) { return (__assign(__assign({}, prev), { color: safeSet(color_1, prev.color), selectedColor: safeSet(selectedColor_1, prev.selectedColor), backgroundColor: safeSet(backgroundColor_1, prev.backgroundColor), borderStyle: safeSet(borderStyle_1, prev.borderStyle) })); });
if (typeof success === 'function') {
success({ errMsg: '' });
}
if (typeof complete === 'function') {
complete({ errMsg: '' });
}
}
});
eventEmitter.on('setTabBarItem', function (options) {
if (options) {
var success = options.success, fail_1 = options.fail, complete = options.complete, index_1 = options.index, _a = options.text, text_1 = _a === void 0 ? '' : _a, iconPath_1 = options.iconPath, selectedIconPath_1 = options.selectedIconPath;
setTab(function (prev) {
var old = prev.list;
if (!old[index_1]) {
if (typeof fail_1 === 'function') {
fail_1({ errMsg: 'invalid index when setTabBarItem' });
}
return prev;
}
var target = old[index_1];
old[index_1] = __assign(__assign({}, target), { text: safeSet(text_1, target.text),
// TODO 处理iconPath变化
iconPath: safeSet(iconPath_1, target.iconPath), selectedIconPath: safeSet(selectedIconPath_1, target.selectedIconPath) });
return __assign(__assign({}, prev), { list: old });
});
if (typeof success === 'function') {
success({ errMsg: '' });
}
if (typeof complete === 'function') {
complete({ errMsg: '' });
}
}
});
}, []);
return { tab: tab };
};
export var useBadge = function () {
var _a = useState([]), badges = _a[0], setBadges = _a[1];
useEffect(function () {
eventEmitter.on('setTabBarBadge', function (options) {
setBadges(function (prev) {
prev[options.index] === options.text;
return prev;
});
});
eventEmitter.on('removeTabBarBadge', function (options) {
setBadges(function (prev) {
prev.splice(options.index, 1);
return prev;
});
});
}, []);
return { badges: badges };
};
export var useToggleDotShow = function () {
var _a = useState([]), dotIndexs = _a[0], setDotIndexs = _a[1];
useEffect(function () {
eventEmitter.on('setTabBarDotToggle', function (show, options) {
if (show && (options === null || options === void 0 ? void 0 : options.index)) {
setDotIndexs(function (prev) { return Array.from(new Set(__spreadArray(__spreadArray([], prev, true), [options === null || options === void 0 ? void 0 : options.index], false))); });
}
else if (!show && (options === null || options === void 0 ? void 0 : options.index)) {
setDotIndexs(function (prev) {
var index = prev.indexOf(options.index);
var next = __spreadArray([], prev, true);
if (index !== -1) {
next.splice(index, 1);
}
return next;
});
}
if (typeof (options === null || options === void 0 ? void 0 : options.success) === 'function') {
options.success({ errMsg: '' });
}
if (typeof (options === null || options === void 0 ? void 0 : options.complete) === 'function') {
options.complete({ errMsg: '' });
}
});
}, []);
return { dotIndexs: dotIndexs };
};
export var useToggleShow = function () {
var _a = useState(true), show = _a[0], setShow = _a[1];
var _b = useState(false), withAnimation = _b[0], setWithAnimation = _b[1];
useEffect(function () {
eventEmitter.on('setTabBarToggle', function (newShow, options) {
setShow(newShow);
setWithAnimation(!!(options === null || options === void 0 ? void 0 : options.animation));
if (typeof (options === null || options === void 0 ? void 0 : options.success) === 'function') {
options.success({ errMsg: '' });
}
if (typeof (options === null || options === void 0 ? void 0 : options.complete) === 'function') {
options.complete({ errMsg: '' });
}
});
}, []);
return { show: show, withAnimation: withAnimation };
};
export var useSelectTab = function (tab) {
var history = useHistory();
var getIndex = useCallback(function () { var _a; return (_a = tab === null || tab === void 0 ? void 0 : tab.list) === null || _a === void 0 ? void 0 : _a.findIndex(function (v) { return formatPath(v.pagePath) === history.location.pathname; }); }, [tab, history]);
useEffect(function () {
// 修复初始跳转，路由获取不正确的问题
setTimeout(function () {
setCurrent(getIndex());
});
var unlisten = history.listen(function () {
setCurrent(getIndex());
});
return function () { return unlisten(); };
}, [history, getIndex]);
var _a = useState(getIndex()), current = _a[0], setCurrent = _a[1];
var onSelect = function (url) {
redirectTo({ url: formatPath(url) });
setCurrent(getIndex());
};
return { currentIndex: current, setCurrent: onSelect };
};
//# sourceMappingURL=utils.js.map