linkmore-design/lib/anchor/AnchorLink.js

🌈 🚀lm组件库。🚀

"use strict";

var _interopRequireWildcard = require("@babel/runtime/helpers/interopRequireWildcard").default;
var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault").default;
Object.defineProperty(exports, "__esModule", {
  value: true
});
exports.default = void 0;
var _classnames = _interopRequireDefault(require("classnames"));
var React = _interopRequireWildcard(require("react"));
var _configProvider = require("../config-provider");
var _context = _interopRequireDefault(require("./context"));
const AnchorLink = props => {
  const {
    href = '#',
    title,
    prefixCls: customizePrefixCls,
    children,
    className,
    target
  } = props;
  const context = React.useContext(_context.default);
  const {
    registerLink,
    unregisterLink,
    scrollTo,
    onClick,
    activeLink
  } = context || {};
  React.useEffect(() => {
    registerLink?.(href);
    return () => {
      unregisterLink?.(href);
    };
  }, [href, registerLink, unregisterLink]);
  const handleClick = e => {
    onClick?.(e, {
      title,
      href
    });
    scrollTo?.(href);
  };
  return /*#__PURE__*/React.createElement(_configProvider.ConfigConsumer, null, ({
    getPrefixCls
  }) => {
    const prefixCls = getPrefixCls('anchor', customizePrefixCls);
    const active = activeLink === href;
    const wrapperClassName = (0, _classnames.default)(`${prefixCls}-link`, className, {
      [`${prefixCls}-link-active`]: active
    });
    const titleClassName = (0, _classnames.default)(`${prefixCls}-link-title`, {
      [`${prefixCls}-link-title-active`]: active
    });
    return /*#__PURE__*/React.createElement("div", {
      className: wrapperClassName
    }, /*#__PURE__*/React.createElement("a", {
      className: titleClassName,
      href: href,
      title: typeof title === 'string' ? title : '',
      target: target,
      onClick: handleClick
    }, title), children);
  });
};
var _default = AnchorLink;
exports.default = _default;