zent
Version:
一套前端设计语言和基于React的实现
22 lines (21 loc) • 1.54 kB
JavaScript
import { __assign } from "tslib";
import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
import { useState, useCallback } from 'react';
import cn from 'classnames';
import Icon from '../../../icon';
import Popover from '../../../popover';
import { useEventCallbackRef } from '../../../utils/hooks/useEventCallbackRef';
import { getTabPanelStringTitle } from '../../utils';
var AnchorOperation = function (_a) {
var tabs = _a.tabs, onChange = _a.onChange;
var onChangeRef = useEventCallbackRef(onChange);
var _b = useState(false), visible = _b[0], setVisible = _b[1];
var onClick = useCallback(function (item) {
onChangeRef.current(item);
!item.disabled && setVisible(false);
}, [onChangeRef]);
return (_jsxs(Popover, __assign({ position: Popover.Position.BottomLeft, cushion: 3, visible: visible, onVisibleChange: setVisible }, { children: [_jsx(Popover.Trigger.Hover, { children: _jsx(Icon, { type: "more" }, void 0) }, void 0), _jsx(Popover.Content, { children: _jsx("div", __assign({ className: "zent-tabs-hidden-tabs", "data-zv": '10.0.17' }, { children: tabs.map(function (item) { return (_jsx("div", __assign({ className: cn('zent-tabs-hidden-tab', {
'zent-tabs-hidden-tab-disabled': item.disabled,
}), onClick: function () { return onClick(item); }, title: getTabPanelStringTitle(item.title), "data-zv": '10.0.17' }, { children: item.title }), item.key)); }) }), void 0) }, void 0)] }), void 0));
};
export default AnchorOperation;