dumi-theme-lobehub/dist/slots/ContentFooter/Linker.js

dumi-theme-lobehub is a documentation site theme package designed for dumi2. It provides a more beautiful and user-friendly development and reading experience based on @lobehub/ui

import { Icon } from '@lobehub/ui';
import { Link } from 'dumi';
import { ArrowLeft, ArrowRight } from 'lucide-react';
import { memo, useMemo } from 'react';
import { Flexbox } from 'react-layout-kit';
import { useStyles } from "./Linker.style";
import { jsx as _jsx } from "react/jsx-runtime";
import { Fragment as _Fragment } from "react/jsx-runtime";
import { jsxs as _jsxs } from "react/jsx-runtime";
var Linker = /*#__PURE__*/memo(function (_ref) {
  var title = _ref.title,
    link = _ref.link,
    type = _ref.type;
  var _useStyles = useStyles(),
    styles = _useStyles.styles,
    cx = _useStyles.cx;
  var navContent = useMemo(function () {
    switch (type) {
      case 'prev':
        {
          return /*#__PURE__*/_jsxs(_Fragment, {
            children: [/*#__PURE__*/_jsx(Icon, {
              icon: ArrowLeft
            }), /*#__PURE__*/_jsx("span", {
              style: {
                lineHeight: 1
              },
              children: "Previous"
            })]
          });
        }
      case 'next':
        {
          return /*#__PURE__*/_jsxs(_Fragment, {
            children: [/*#__PURE__*/_jsx("span", {
              style: {
                lineHeight: 1
              },
              children: "Next"
            }), /*#__PURE__*/_jsx(Icon, {
              icon: ArrowRight
            })]
          });
        }
    }
  }, [type]);
  return /*#__PURE__*/_jsx(Link, {
    to: link,
    children: /*#__PURE__*/_jsxs(Flexbox, {
      className: styles.container,
      gap: 8,
      children: [/*#__PURE__*/_jsx(Flexbox, {
        className: cx(styles.nav, type === 'next' && styles.alignmentEnd),
        gap: 4,
        horizontal: true,
        children: navContent
      }), /*#__PURE__*/_jsx(Flexbox, {
        className: cx(styles.title, type === 'next' && styles.alignmentEnd),
        horizontal: true,
        children: title
      })]
    })
  });
});
export default Linker;