@cainiaofe/cn-ui-m
Version:
32 lines (31 loc) • 1.98 kB
JavaScript
import { __assign } from "tslib";
import React, { forwardRef, useCallback, useImperativeHandle, useMemo, useRef, } from 'react';
import classNames from 'classnames';
import { CnPopover } from './popover';
var classPrefix = 'cn-ui-m-popover-menu';
export var CnPopoverMenu = forwardRef(function (props, ref) {
var onAction = props.onAction;
var innerRef = useRef(null);
useImperativeHandle(ref, function () { return innerRef.current; }, []);
var onClick = useCallback(function (e) {
var _a;
onAction === null || onAction === void 0 ? void 0 : onAction(e);
(_a = innerRef.current) === null || _a === void 0 ? void 0 : _a.hide();
}, [onAction]);
var overlay = useMemo(function () {
return (React.createElement("div", { className: "".concat(classPrefix, "-list") },
React.createElement("div", { className: "".concat(classPrefix, "-list-inner") }, props.actions.map(function (action, index) {
var _a;
return (React.createElement("a", { key: (_a = action.key) !== null && _a !== void 0 ? _a : index, className: classNames("".concat(classPrefix, "-item"), "".concat(classPrefix, "-plain-anchor"), action.disabled && "".concat(classPrefix, "-item-disabled")), onClick: function () {
var _a;
if (action.disabled)
return;
onClick(action);
(_a = action.onClick) === null || _a === void 0 ? void 0 : _a.call(action);
} },
action.icon && (React.createElement("div", { className: "".concat(classPrefix, "-item-icon") }, action.icon)),
React.createElement("div", { className: "".concat(classPrefix, "-item-text") }, action.text)));
}))));
}, [props.actions, onClick]);
return (React.createElement(CnPopover, __assign({ ref: innerRef }, props, { content: overlay }), props.children));
});