yzsd
Version:
a niubi UI component
144 lines (143 loc) • 7.02 kB
JavaScript
;
var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
var _typeof = require("@babel/runtime/helpers/typeof");
Object.defineProperty(exports, "__esModule", {
value: true
});
exports["default"] = void 0;
var _extends2 = _interopRequireDefault(require("@babel/runtime/helpers/extends"));
var _toConsumableArray2 = _interopRequireDefault(require("@babel/runtime/helpers/toConsumableArray"));
var _slicedToArray2 = _interopRequireDefault(require("@babel/runtime/helpers/slicedToArray"));
var _react = _interopRequireWildcard(require("react"));
var _reactDom = require("react-dom");
var _notice = _interopRequireDefault(require("./notice"));
var _classnames = _interopRequireDefault(require("classnames"));
var _reactTransitionGroup = require("react-transition-group");
function _getRequireWildcardCache(nodeInterop) { if (typeof WeakMap !== "function") return null; var cacheBabelInterop = new WeakMap(); var cacheNodeInterop = new WeakMap(); return (_getRequireWildcardCache = function _getRequireWildcardCache(nodeInterop) { return nodeInterop ? cacheNodeInterop : cacheBabelInterop; })(nodeInterop); }
function _interopRequireWildcard(obj, nodeInterop) { if (!nodeInterop && obj && obj.__esModule) { return obj; } if (obj === null || _typeof(obj) !== "object" && typeof obj !== "function") { return { "default": obj }; } var cache = _getRequireWildcardCache(nodeInterop); if (cache && cache.has(obj)) { return cache.get(obj); } var newObj = {}; var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var key in obj) { if (key !== "default" && Object.prototype.hasOwnProperty.call(obj, key)) { var desc = hasPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : null; if (desc && (desc.get || desc.set)) { Object.defineProperty(newObj, key, desc); } else { newObj[key] = obj[key]; } } } newObj["default"] = obj; if (cache) { cache.set(obj, newObj); } return newObj; }
var timeout = 200;
var noTifications = /*#__PURE__*/(0, _react.forwardRef)(function (props, ref) {
var container = props.container,
prefixCls = props.prefixCls,
className = props.className,
style = props.style,
_props$maxCount = props.maxCount,
maxCount = _props$maxCount === void 0 ? 0 : _props$maxCount,
onAllRemoved = props.onAllRemoved;
var _useState = (0, _react.useState)([]),
_useState2 = (0, _slicedToArray2["default"])(_useState, 2),
configList = _useState2[0],
setConfigList = _useState2[1];
var _useState3 = (0, _react.useState)({}),
_useState4 = (0, _slicedToArray2["default"])(_useState3, 2),
placements = _useState4[0],
setPlacements = _useState4[1];
(0, _react.useImperativeHandle)(ref, function () {
return {
open: function open(config) {
setConfigList(function (list) {
var _a;
var clone = (0, _toConsumableArray2["default"])(list);
var index = clone.findIndex(function (i) {
return i.key === config.key;
});
var innerConfig = (0, _extends2["default"])({}, config);
if (index >= 0) {
innerConfig.times = (((_a = list[index]) === null || _a === void 0 ? void 0 : _a.times) || 0) + 1;
clone[index] = innerConfig;
} else {
innerConfig.times = 0;
clone.push(innerConfig);
}
if (maxCount > 0 && clone.length > maxCount) {
clone = clone.slice(-maxCount);
}
return clone;
});
},
close: function close() {},
destroy: function destroy() {}
};
});
(0, _react.useEffect)(function () {
var nextPlacements = {};
configList.forEach(function (config) {
var _config$placement = config.placement,
placement = _config$placement === void 0 ? 'topRight' : _config$placement;
nextPlacements[placement] = nextPlacements[placement] || [];
(nextPlacements[placement] || []).push(config);
});
// Fill exist placements to avoid empty list causing remove without motion
Object.keys(placements).forEach(function (placement) {
nextPlacements[placement] = nextPlacements[placement] || [];
});
setPlacements(nextPlacements);
}, [configList]);
// Effect tell that placements is empty now
var emptyRef = _react["default"].useRef(false);
_react["default"].useEffect(function () {
if (Object.keys(placements).length > 0) {
emptyRef.current = true;
} else if (emptyRef.current) {
// Trigger only when from exist to empty
onAllRemoved === null || onAllRemoved === void 0 ? void 0 : onAllRemoved();
emptyRef.current = false;
}
}, [placements]);
var onAllNoticeRemoved = function onAllNoticeRemoved(placement) {
setPlacements(function (originPlacements) {
var clone = (0, _extends2["default"])({}, originPlacements);
var list = clone[placement];
if (!(list === null || list === void 0 ? void 0 : list.length)) {
delete clone[placement];
}
return clone;
});
};
var onNoticeClose = function onNoticeClose(key) {
var _a;
var config = configList.find(function (i) {
return i.key === key;
});
(_a = config === null || config === void 0 ? void 0 : config.onClose) === null || _a === void 0 ? void 0 : _a.call(config);
setConfigList(function (list) {
return list.filter(function (i) {
return i.key !== key;
});
});
};
var placementList = Object.keys(placements);
if (!container) {
return null;
}
return /*#__PURE__*/(0, _reactDom.createPortal)( /*#__PURE__*/_react["default"].createElement(_react["default"].Fragment, null, placementList.map(function (placement) {
var keys = placements[placement];
if (!(keys === null || keys === void 0 ? void 0 : keys.length)) {
setTimeout(function () {
onAllNoticeRemoved(placement);
}, timeout);
}
return /*#__PURE__*/_react["default"].createElement(_reactTransitionGroup.TransitionGroup, {
key: placement,
className: (0, _classnames["default"])("".concat(prefixCls), "".concat(prefixCls, "-").concat(placement), className === null || className === void 0 ? void 0 : className(placement)),
style: style === null || style === void 0 ? void 0 : style(placement),
appear: true
}, keys === null || keys === void 0 ? void 0 : keys.map(function (config) {
return /*#__PURE__*/_react["default"].createElement(_reactTransitionGroup.CSSTransition, {
key: config.key,
timeout: timeout,
classNames: "".concat(prefixCls)
}, /*#__PURE__*/_react["default"].createElement(_notice["default"], (0, _extends2["default"])({}, config, {
key: config.key,
eventKey: config.key,
prefixCls: prefixCls,
className: config.className,
style: config.style,
times: config.times,
onNoticeClose: onNoticeClose
})));
}));
})), container);
});
var _default = noTifications;
exports["default"] = _default;