zent/es/elevator/ElevatorLinks.js

一套前端设计语言和基于React的实现

import { __assign, __rest } from "tslib";
import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
import { useContext, useRef, useEffect, } from 'react';
import cx from 'classnames';
import { ElevatorContext } from './context';
import { Affix } from '../affix';
import { WindowScrollHandler } from '..';
export var ElevatorLinks = function (_a) {
    var style = _a.style, links = _a.links, className = _a.className, offsetTop = _a.offsetTop, offsetBottom = _a.offsetBottom, onClick = _a.onClick, restProps = __rest(_a, ["style", "links", "className", "offsetTop", "offsetBottom", "onClick"]);
    var _b = useContext(ElevatorContext), activeLink = _b.activeLink, getContainer = _b.getContainer, onLinkClick = _b.onLinkClick;
    var affixRef = useRef(null);
    useEffect(function () {
        var linkIds = links.map(function (link) { return link.link; });
        if (Array.from(new Set(linkIds)).length !== linkIds.length) {
            console.warn('Warning: In the links property of Elevator, the link value must be unique.');
        }
    }, [links]);
    var handleScroll = function () {
        var _a;
        (_a = affixRef === null || affixRef === void 0 ? void 0 : affixRef.current) === null || _a === void 0 ? void 0 : _a.updatePosition();
    };
    var handleLinkClick = function (event, link) {
        onLinkClick(link);
        onClick === null || onClick === void 0 ? void 0 : onClick(event, link);
    };
    return (_jsxs(Affix, __assign({ offsetTop: offsetTop, offsetBottom: offsetBottom, getAffixContainer: getContainer, ref: affixRef }, restProps, { children: [_jsx("div", __assign({ className: cx('zent-elevator__links-wrapper', className), style: style, "data-zv": '10.0.17' }, { children: _jsx("div", __assign({ className: "zent-elevator__links-content", "data-zv": '10.0.17' }, { children: links.map(function (link) { return (_jsx("div", __assign({ onClick: function (e) { return handleLinkClick(e, link.link); }, className: cx('zent-elevator__link', {
                            'zent-elevator__link--active': activeLink === link.link,
                        }), "data-zv": '10.0.17' }, { children: link.title }), link.link)); }) }), void 0) }), void 0), getContainer && _jsx(WindowScrollHandler, { onScroll: handleScroll }, void 0)] }), void 0));
};