@redocly/theme
Version:
Shared UI components lib
43 lines • 2.35 kB
JavaScript
"use strict";
var __importDefault = (this && this.__importDefault) || function (mod) {
return (mod && mod.__esModule) ? mod : { "default": mod };
};
Object.defineProperty(exports, "__esModule", { value: true });
exports.PreviousButton = PreviousButton;
const react_1 = __importDefault(require("react"));
const styled_components_1 = __importDefault(require("styled-components"));
const hooks_1 = require("../../core/hooks");
const Button_1 = require("../../components/Button/Button");
const ArrowLeftIcon_1 = require("../../icons/ArrowLeftIcon/ArrowLeftIcon");
function PreviousButton({ prevPage, className }) {
var _a, _b;
const { navigation } = (0, hooks_1.useThemeConfig)();
const { useTranslate } = (0, hooks_1.useThemeHooks)();
const { translate } = useTranslate();
if (!prevPage || ((_a = navigation === null || navigation === void 0 ? void 0 : navigation.previousButton) === null || _a === void 0 ? void 0 : _a.hide)) {
return react_1.default.createElement("div", null, "\u00A0");
}
const prevPageText = prevPage.label || prevPage.routeSlug || '';
const translationKey = 'page.previousButton';
const label = ((_b = navigation === null || navigation === void 0 ? void 0 : navigation.previousButton) === null || _b === void 0 ? void 0 : _b.text) ||
translate(translationKey, { defaultValue: 'Previous page' });
return (react_1.default.createElement(PreviousButtonWrapper, { "data-component-name": "PageNavigation/PreviousButton", "data-translation-key": translationKey },
react_1.default.createElement(PreviousPageLabel, null, label),
react_1.default.createElement(PreviousPageButton, { size: "large", to: prevPage.link, extraClass: className, variant: "link", icon: react_1.default.createElement(ArrowLeftIcon_1.ArrowLeftIcon, null), iconPosition: "left" }, prevPageText)));
}
const PreviousButtonWrapper = styled_components_1.default.div `
display: flex;
flex-direction: column;
text-align: left;
`;
const PreviousPageButton = (0, styled_components_1.default)(Button_1.Button) `
text-wrap: wrap;
padding-left: 0;
padding-right: 0;
`;
const PreviousPageLabel = styled_components_1.default.span `
font-size: var(--font-size-sm);
line-height: var(--line-height-sm);
font-weight: var(--font-weight-regular);
`;
//# sourceMappingURL=PreviousButton.js.map