@redocly/theme 0.4.14 → 0.4.16

package/lib/Navbar/MobileNavbarItem.js

@@ -0,0 +1,106 @@
+"use strict";
+var __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {
+    if (k2 === undefined) k2 = k;
+    var desc = Object.getOwnPropertyDescriptor(m, k);
+    if (!desc || ("get" in desc ? !m.__esModule : desc.writable || desc.configurable)) {
+      desc = { enumerable: true, get: function() { return m[k]; } };
+    }
+    Object.defineProperty(o, k2, desc);
+}) : (function(o, m, k, k2) {
+    if (k2 === undefined) k2 = k;
+    o[k2] = m[k];
+}));
+var __setModuleDefault = (this && this.__setModuleDefault) || (Object.create ? (function(o, v) {
+    Object.defineProperty(o, "default", { enumerable: true, value: v });
+}) : function(o, v) {
+    o["default"] = v;
+});
+var __importStar = (this && this.__importStar) || function (mod) {
+    if (mod && mod.__esModule) return mod;
+    var result = {};
+    if (mod != null) for (var k in mod) if (k !== "default" && Object.prototype.hasOwnProperty.call(mod, k)) __createBinding(result, mod, k);
+    __setModuleDefault(result, mod);
+    return result;
+};
+var __importDefault = (this && this.__importDefault) || function (mod) {
+    return (mod && mod.__esModule) ? mod : { "default": mod };
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.NavLink = exports.NavMenuItemWithDropdownWrapper = exports.NavMenuItem = exports.MobileNavbarItem = void 0;
+const react_1 = __importStar(require("react"));
+const styled_components_1 = __importDefault(require("styled-components"));
+const react_router_dom_1 = require("react-router-dom");
+const Link_1 = require("../mocks/Link");
+const utils_1 = require("../mocks/utils");
+const MobileNavbarDropdown_1 = require("../Navbar/MobileNavbarDropdown");
+function MobileNavbarItem({ navItem, className }) {
+    const { pathname } = (0, react_router_dom_1.useLocation)();
+    const [expandedDropdown, setExpandedDropdown] = (0, react_1.useState)(false);
+    const toggleDropdown = () => setExpandedDropdown(!expandedDropdown);
+    if (navItem.link) {
+        const item = navItem;
+        const isActive = pathname === (0, utils_1.withPathPrefix)(item.link);
+        return (react_1.default.createElement(exports.NavMenuItem, { active: isActive, "data-component-name": "Navbar/MobileNavbarItem", className: className },
+            react_1.default.createElement(exports.NavLink, { to: item.link, active: isActive },
+                react_1.default.createElement(NavLabel, null, item.label))));
+    }
+    if (navItem.items) {
+        const item = navItem;
+        return (react_1.default.createElement(exports.NavMenuItemWithDropdownWrapper, { expanded: expandedDropdown },
+            react_1.default.createElement(exports.NavMenuItem, { active: false, onClick: toggleDropdown, "data-component-name": "Navbar/MobileNavbarItem", className: className },
+                react_1.default.createElement(NavLabel, null, item.label),
+                react_1.default.createElement(ExpandedArrow, null)),
+            react_1.default.createElement(MobileNavbarDropdown_1.MobileNavbarDropdown, { items: item.items })));
+    }
+    return null;
+}
+exports.MobileNavbarItem = MobileNavbarItem;
+const ExpandedArrow = styled_components_1.default.div `
+  width: 5px;
+  height: 5px;
+  border: 1px solid;
+  border-left: none;
+  border-top: none;
+  transition: all 0.3s ease-out;
+`;
+exports.NavMenuItem = styled_components_1.default.li `
+  display: flex;
+  justify-content: space-between;
+  align-items: center;
+  padding: var(--navbar-item-padding-horizontal);
+  text-align: left;
+  line-height: 1;
+  font-size: var(--navbar-item-font-size);
+  font-weight: var(--navbar-item-font-weight);
+  background: ${({ active }) => (active ? 'var(--navbar-item-active-background-color)' : 'none')};
+  &:not(:last-child) {
+    border-bottom: 1px solid var(--navbar-item-separator-line-color, #dadada);
+  }
+`;
+exports.NavMenuItemWithDropdownWrapper = styled_components_1.default.div `
+  display: inline-block;
+  position: relative;
+  border-bottom: 1px solid var(--navbar-item-separator-line-color, #dadada);
+
+  ${ExpandedArrow} {
+    transform: rotate(${({ expanded }) => (expanded ? '' : '-')}45deg);
+  }
+
+  ${MobileNavbarDropdown_1.MobileDropdownWrapper} {
+    height: ${({ expanded }) => (expanded ? '100%' : '0')};
+    opacity: ${({ expanded }) => (expanded ? '1' : '0')};
+  }
+
+  ${exports.NavMenuItem} {
+    border-bottom: none;
+  }
+`;
+exports.NavLink = (0, styled_components_1.default)(Link_1.Link) `
+  color: ${({ active }) => active ? 'var(--navbar-item-active-text-color)' : 'var(--navbar-text-color)'};
+  text-decoration: ${({ active }) => active ? 'var(--navbar-item-active-text-decoration)' : 'none'};
+`;
+const NavLabel = styled_components_1.default.span `
+  cursor: pointer;
+  vertical-align: middle;
+`;
+//# sourceMappingURL=MobileNavbarItem.js.map

package/lib/Navbar/MobileNavbarMenu.js

@@ -0,0 +1,92 @@
+"use strict";
+var __importDefault = (this && this.__importDefault) || function (mod) {
+    return (mod && mod.__esModule) ? mod : { "default": mod };
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.MobileNavbarMenu = void 0;
+const react_1 = __importDefault(require("react"));
+const styled_components_1 = __importDefault(require("styled-components"));
+const NavbarItem_1 = require("../Navbar/NavbarItem");
+const MobileNavbarItem_1 = require("../Navbar/MobileNavbarItem");
+const NavbarDropdown_1 = require("../Navbar/NavbarDropdown");
+const utils_1 = require("../utils");
+function MobileNavbarMenu({ menuItems, closeMenu, }) {
+    if ((0, utils_1.isPrimitive)(menuItems) || (0, utils_1.isEmptyArray)(menuItems)) {
+        return null;
+    }
+    return (react_1.default.createElement(NavbarItemsWrapper, { "data-component-name": "Navbar/MobileNavbarMenu" },
+        react_1.default.createElement(NavbarItemsContainer, null, menuItems.map((navItem, index) => {
+            return (react_1.default.createElement(MobileNavbarItem_1.MobileNavbarItem, { key: `${navItem.label}_${index}`, "data-cy": navItem.label, navItem: navItem }));
+        })),
+        react_1.default.createElement(NavbarItemsClosableArea, { onClick: closeMenu })));
+}
+exports.MobileNavbarMenu = MobileNavbarMenu;
+const NavbarItemsWrapper = styled_components_1.default.div `
+  height: 100%;
+  width: 100%;
+  position: fixed;
+  z-index: 201; //more than Search
+  left: 0;
+  top: 0;
+  overflow-x: hidden;
+  transition: 0.5s;
+  display: flex;
+  ${NavbarDropdown_1.DropdownWrapper} {
+    & > div {
+      text-align: center;
+      padding: 10px 0;
+      cursor: pointer;
+      a {
+        color: var(--navbar-text-color);
+        text-decoration: none;
+      }
+      :hover {
+        text-decoration: underline;
+      }
+    }
+  }
+`;
+const NavbarItemsClosableArea = styled_components_1.default.div `
+  display: flex;
+  flex: 1;
+  min-width: 50px;
+  height: 100%;
+  background-color: rgba(255, 255, 255, 0.4);
+`;
+const NavbarItemsContainer = styled_components_1.default.ul `
+  width: 70%;
+  list-style: none;
+  margin: 0;
+  padding: 0;
+  display: flex;
+  flex-direction: column;
+  background: var(--navbar-background-color);
+
+  ${NavbarItem_1.NavbarMenuItem} {
+    &:not(:last-child) {
+      border-bottom: 1px solid var(--navbar-item-separator-line-color, #dadada);
+    }
+    border-radius: 0;
+    padding: 1em 0;
+    width: 100%;
+  }
+
+  ${NavbarItem_1.NavbarMenuItemWithDropdownWrapper} {
+    display: block;
+    &:not(:last-child) {
+      border-bottom: 1px solid var(--navbar-item-separator-line-color, #dadada);
+      border-radius: 0;
+    }
+    ${NavbarItem_1.NavbarMenuItem} {
+      border-bottom: none;
+    }
+  }
+
+  ${NavbarDropdown_1.DropdownWrapper} {
+    background-color: var(--navbar-background-color);
+    width: 100%;
+    padding: 0;
+    position: relative;
+  }
+`;
+//# sourceMappingURL=MobileNavbarMenu.js.map

package/lib/Navbar/MobileNavbarMenuButton.js

@@ -0,0 +1,18 @@
+"use strict";
+var __importDefault = (this && this.__importDefault) || function (mod) {
+    return (mod && mod.__esModule) ? mod : { "default": mod };
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.MobileNavbarMenuButton = void 0;
+const styled_components_1 = __importDefault(require("styled-components"));
+const Burger_1 = require("../ui/Burger");
+exports.MobileNavbarMenuButton = (0, styled_components_1.default)(Burger_1.Burger).attrs(() => ({
+    'data-component-name': 'Navbar/MobileNavbarMenuButton',
+})) `
+  display: block;
+
+  ${({ theme }) => theme.mediaQueries.medium} {
+    display: none;
+  }
+`;
+//# sourceMappingURL=MobileNavbarMenuButton.js.map

package/lib/Navbar/Navbar.js

@@ -0,0 +1,75 @@
+"use strict";
+var __importDefault = (this && this.__importDefault) || function (mod) {
+    return (mod && mod.__esModule) ? mod : { "default": mod };
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.NavbarRow = exports.NavbarContainer = exports.Navbar = void 0;
+const react_1 = __importDefault(require("react"));
+const styled_components_1 = __importDefault(require("styled-components"));
+const Navbar_1 = require("../Navbar");
+const useMobileMenu_1 = require("../hooks/useMobileMenu");
+const MobileNavbarMenuButton_1 = require("../Navbar/MobileNavbarMenuButton");
+const MobileNavbarMenu_1 = require("../Navbar/MobileNavbarMenu");
+const ColorModeSwitcher_1 = require("../ColorModeSwitcher/ColorModeSwitcher");
+const useDefaultThemeSettings_1 = require("../hooks/useDefaultThemeSettings");
+function Navbar({ menu, logo, search, profile }) {
+    const [isOpen, setIsOpen] = (0, useMobileMenu_1.useMobileMenu)(false);
+    const { search: searchSettings, navbar } = (0, useDefaultThemeSettings_1.useDefaultThemeSettings)();
+    const hideSearch = (searchSettings === null || searchSettings === void 0 ? void 0 : searchSettings.hide) || ((searchSettings === null || searchSettings === void 0 ? void 0 : searchSettings.placement) && (searchSettings === null || searchSettings === void 0 ? void 0 : searchSettings.placement) !== 'navbar');
+    if (navbar === null || navbar === void 0 ? void 0 : navbar.hide) {
+        return null;
+    }
+    const openMobileMenu = () => setIsOpen(true);
+    const closeMobileMenu = () => setIsOpen(false);
+    return (react_1.default.createElement(exports.NavbarContainer, { "data-component-name": "Navbar/Navbar" },
+        react_1.default.createElement(MobileNavbarMenuButton_1.MobileNavbarMenuButton, { onClick: openMobileMenu }),
+        isOpen && react_1.default.createElement(MobileNavbarMenu_1.MobileNavbarMenu, { closeMenu: closeMobileMenu, menuItems: menu }),
+        react_1.default.createElement(exports.NavbarRow, null,
+            logo,
+            react_1.default.createElement(Navbar_1.NavbarMenu, { menuItems: menu }),
+            hideSearch ? null : search,
+            profile,
+            react_1.default.createElement(ColorModeSwitcher_1.ColorModeSwitcher, null))));
+}
+exports.Navbar = Navbar;
+exports.NavbarContainer = styled_components_1.default.nav `
+  height: var(--navbar-height);
+  box-sizing: border-box;
+  display: flex;
+  align-items: center;
+  flex-shrink: 0;
+
+  font-size: 0.875rem;
+  position: sticky;
+  top: 0;
+  z-index: 200;
+  padding: var(--navbar-item-paddin-vertical) var(--navbar-item-padding-horizontal);
+  background: var(--navbar-background-color);
+  font-family: var(--navbar-item-font-family);
+
+  ${({ theme }) => theme.mediaQueries.medium} {
+    font-size: 1rem;
+  }
+
+  ${({ theme }) => theme.mediaQueries.print} {
+    background: transparent;
+    display: none;
+    > :not(a, img) {
+      display: none !important;
+    }
+    img {
+      padding: 0;
+      margin: 0;
+    }
+  }
+`;
+exports.NavbarRow = styled_components_1.default.div `
+  display: flex;
+  align-items: center;
+  justify-content: space-between;
+  margin: 0 auto;
+  width: 100%;
+
+  max-width: var(--navbar-container-max-width);
+`;
+//# sourceMappingURL=Navbar.js.map

package/lib/Navbar/NavbarDropdown.js

@@ -0,0 +1,38 @@
+"use strict";
+var __importDefault = (this && this.__importDefault) || function (mod) {
+    return (mod && mod.__esModule) ? mod : { "default": mod };
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.DropdownWrapper = exports.NavbarDropdown = void 0;
+const react_1 = __importDefault(require("react"));
+const styled_components_1 = __importDefault(require("styled-components"));
+const Link_1 = require("../mocks/Link");
+function NavbarDropdown({ items }) {
+    return (react_1.default.createElement(exports.DropdownWrapper, { "data-component-name": "Navbar/NavbarDropdown" }, items.map((item, index) => (react_1.default.createElement("div", { key: `${item.label}_${index}` },
+        react_1.default.createElement(Link_1.Link, { to: item.link }, item.label))))));
+}
+exports.NavbarDropdown = NavbarDropdown;
+exports.DropdownWrapper = styled_components_1.default.div `
+  display: none;
+  position: absolute;
+  background: var(--navbar-dropdown-background);
+  border: var(--navbar-item-border);
+  border-radius: var(--navbar-item-border-radius);
+  padding: 10px 15px;
+  width: max-content;
+  line-height: 1rem;
+  box-shadow: var(--navbar-dropdown-shadow);
+  & > div {
+    text-align: left;
+    padding: 10px 0;
+    cursor: pointer;
+    a {
+      color: var(--navbar-text-color);
+      text-decoration: none;
+    }
+    :hover {
+      text-decoration: underline;
+    }
+  }
+`;
+//# sourceMappingURL=NavbarDropdown.js.map

package/{Navbar → lib/Navbar}/NavbarItem.d.ts

@@ -1,6 +1,6 @@
 /// <reference types="react" />
-import type { ResolvedNavItem } from '@theme/types/portal';
 import { Link } from '../mocks/Link';
+import type { ResolvedNavItem } from '@theme/types/portal';
 export interface NavbarItemProps {
     navItem: ResolvedNavItem;
     className?: string;

package/lib/Navbar/NavbarItem.js

@@ -0,0 +1,72 @@
+"use strict";
+var __importDefault = (this && this.__importDefault) || function (mod) {
+    return (mod && mod.__esModule) ? mod : { "default": mod };
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.NavbarMenuItem = exports.NavbarLink = exports.NavbarMenuItemWithDropdownWrapper = exports.NavbarItem = void 0;
+const react_1 = __importDefault(require("react"));
+const styled_components_1 = __importDefault(require("styled-components"));
+const react_router_dom_1 = require("react-router-dom");
+const Link_1 = require("../mocks/Link");
+const utils_1 = require("../mocks/utils");
+const NavbarDropdown_1 = require("../Navbar/NavbarDropdown");
+function NavbarItem({ navItem, className }) {
+    const { pathname } = (0, react_router_dom_1.useLocation)();
+    if (navItem.link) {
+        const item = navItem;
+        const isActive = pathname === (0, utils_1.withPathPrefix)(item.link);
+        return (react_1.default.createElement(exports.NavbarMenuItem, { active: isActive, "data-component-name": "Navbar/NavbarItem", className: className },
+            react_1.default.createElement(exports.NavbarLink, { to: item.link, active: isActive },
+                react_1.default.createElement(NavbarLabel, null, item.label))));
+    }
+    if (navItem.items) {
+        const item = navItem;
+        return (react_1.default.createElement(exports.NavbarMenuItemWithDropdownWrapper, null,
+            react_1.default.createElement(exports.NavbarMenuItem, { active: false, "data-component-name": "Navbar/NavbarItem", className: className },
+                react_1.default.createElement(NavbarLabel, null, item.label)),
+            react_1.default.createElement(NavbarDropdown_1.NavbarDropdown, { items: item.items })));
+    }
+    return null;
+}
+exports.NavbarItem = NavbarItem;
+exports.NavbarMenuItemWithDropdownWrapper = styled_components_1.default.div `
+  display: inline-block;
+  position: relative;
+  border-radius: var(--navbar-item-border-radius);
+  &:hover {
+    background: var(--navbar-item-active-background-color);
+    ${NavbarDropdown_1.DropdownWrapper} {
+      display: block;
+    }
+  }
+`;
+exports.NavbarLink = (0, styled_components_1.default)(Link_1.Link) `
+  color: ${({ active }) => active ? 'var(--navbar-item-active-text-color)' : 'var(--navbar-text-color)'};
+  text-decoration: ${({ active }) => active ? 'var(--navbar-item-active-text-decoration)' : 'none'};
+`;
+exports.NavbarMenuItem = styled_components_1.default.li `
+  display: inline-block;
+  padding: var(--navbar-item-paddin-vertical) var(--navbar-item-padding-horizontal);
+  margin-left: var(--navbar-item-margin-horizontal);
+  text-align: center;
+  line-height: 1;
+  font-size: var(--navbar-item-font-size);
+  border-radius: var(--navbar-item-border-radius);
+  font-weight: var(--navbar-item-font-weight);
+  background: ${({ active }) => active && 'var(--navbar-item-active-background-color)'};
+  color: ${({ active }) => active && 'var(--navbar-item-active-text-color)'};
+  &:hover {
+    color: var(--navbar-item-hover-text-color);
+    text-decoration: var(--navbar-item-hover-text-decoration);
+    background: var(--navbar-item-hover-background-color);
+    ${exports.NavbarLink} {
+      color: var(--navbar-item-hover-text-color);
+      text-decoration: var(--navbar-item-hover-text-decoration);
+    }
+  }
+`;
+const NavbarLabel = styled_components_1.default.span `
+  cursor: pointer;
+  vertical-align: middle;
+`;
+//# sourceMappingURL=NavbarItem.js.map

package/lib/Navbar/NavbarMenu.js

@@ -0,0 +1,34 @@
+"use strict";
+var __importDefault = (this && this.__importDefault) || function (mod) {
+    return (mod && mod.__esModule) ? mod : { "default": mod };
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.NavbarMenu = void 0;
+const react_1 = __importDefault(require("react"));
+const styled_components_1 = __importDefault(require("styled-components"));
+const NavbarItem_1 = require("../Navbar/NavbarItem");
+const utils_1 = require("../utils");
+function NavbarMenu({ menuItems }) {
+    if ((0, utils_1.isPrimitive)(menuItems)) {
+        return null;
+    }
+    return (react_1.default.createElement(NavItemsContainer, { "data-component-name": "Navbar/NavbarMenu" }, menuItems.map((navItem, index) => {
+        return (react_1.default.createElement(NavbarItem_1.NavbarItem, { key: `${navItem.label}_${index}`, "data-cy": navItem.label, navItem: navItem }));
+    })));
+}
+exports.NavbarMenu = NavbarMenu;
+const NavItemsContainer = styled_components_1.default.ul `
+  list-style: none;
+  margin: 0 var(--navbar-item-margin-horizontal);
+  padding: 0;
+  display: none;
+  flex-wrap: nowrap;
+  align-items: center;
+  justify-content: flex-end;
+  flex: 1;
+
+  ${({ theme }) => theme.mediaQueries.medium} {
+    display: flex;
+  }
+`;
+//# sourceMappingURL=NavbarMenu.js.map

package/{Navbar → lib/Navbar}/index.js

@@ -17,3 +17,4 @@ Object.defineProperty(exports, "__esModule", { value: true });
 __exportStar(require("../Navbar/Navbar"), exports);
 __exportStar(require("../Navbar/NavbarItem"), exports);
 __exportStar(require("../Navbar/NavbarMenu"), exports);
+//# sourceMappingURL=index.js.map

package/lib/NavbarLogo/NavbarLogo.js

@@ -0,0 +1,24 @@
+"use strict";
+var __importDefault = (this && this.__importDefault) || function (mod) {
+    return (mod && mod.__esModule) ? mod : { "default": mod };
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.NavbarLogo = void 0;
+const react_1 = __importDefault(require("react"));
+const styled_components_1 = __importDefault(require("styled-components"));
+const Link_1 = require("../mocks/Link");
+function NavbarLogo({ logo }) {
+    if (!logo.image) {
+        return null;
+    }
+    const img = (react_1.default.createElement(NavLogo, { src: logo.image, alt: logo.altText, "data-component-name": "NavbarLogo/NavbarLogo" }));
+    return logo.link ? react_1.default.createElement(Link_1.Link, { to: logo.link }, img) : img;
+}
+exports.NavbarLogo = NavbarLogo;
+const NavLogo = styled_components_1.default.img `
+  max-width: var(--navbar-logo-max-width);
+  max-height: var(--navbar-logo-max-height);
+  height: var(--navbar-logo-height);
+  margin: var(--navbar-logo-margin);
+`;
+//# sourceMappingURL=NavbarLogo.js.map

package/{NavbarLogo → lib/NavbarLogo}/index.js

@@ -15,3 +15,4 @@ var __exportStar = (this && this.__exportStar) || function(m, exports) {
 };
 Object.defineProperty(exports, "__esModule", { value: true });
 __exportStar(require("../NavbarLogo/NavbarLogo"), exports);
+//# sourceMappingURL=index.js.map

package/lib/OperationBadge/OperationBadge.js

@@ -0,0 +1,68 @@
+"use strict";
+var __importDefault = (this && this.__importDefault) || function (mod) {
+    return (mod && mod.__esModule) ? mod : { "default": mod };
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.OperationBadge = void 0;
+const styled_components_1 = __importDefault(require("styled-components"));
+exports.OperationBadge = styled_components_1.default.span.attrs((props) => ({
+    className: `operation-type ${props.type}`,
+    'data-component-name': 'OperationBadge/OperationBadge',
+})) `
+  display: inline-flex;
+  align-items: center;
+  justify-content: center;
+  font-size: var(--badge-http-font-size);
+  font-family: var(--badge-http-font-family);
+  font-weight: var(--badge-http-font-weight);
+  line-height: var(--badge-http-line-height);
+  color: var(--badge-http-text-color);
+  background-color: var(--badge-background-color);
+  border-radius: var(--badge-http-border-radius);
+  width: 58px;
+  text-transform: uppercase;
+  text-align: center;
+  margin-right: 6px;
+
+  &.get {
+    background-color: var(--color-http-get);
+  }
+
+  &.post {
+    background-color: var(--color-http-post);
+  }
+
+  &.put {
+    background-color: var(--color-http-put);
+  }
+
+  &.options {
+    background-color: var(--color-http-options);
+  }
+
+  &.patch {
+    background-color: var(--color-http-patch);
+  }
+
+  &.delete {
+    background-color: var(--color-http-delete);
+  }
+
+  &.basic,
+  &.schema {
+    background-color: var(--color-http-basic);
+  }
+
+  &.link {
+    background-color: var(--color-http-link);
+  }
+
+  &.head {
+    background-color: var(--color-http-head);
+  }
+
+  &.hook {
+    background-color: var(--color-http-hook);
+  }
+`;
+//# sourceMappingURL=OperationBadge.js.map

package/{OperationBadge → lib/OperationBadge}/index.js

@@ -15,3 +15,4 @@ var __exportStar = (this && this.__exportStar) || function(m, exports) {
 };
 Object.defineProperty(exports, "__esModule", { value: true });
 __exportStar(require("../OperationBadge/OperationBadge"), exports);
+//# sourceMappingURL=index.js.map

package/lib/PageNavigation/NextPageLink.js

@@ -0,0 +1,26 @@
+"use strict";
+var __importDefault = (this && this.__importDefault) || function (mod) {
+    return (mod && mod.__esModule) ? mod : { "default": mod };
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.NextPageLink = void 0;
+const react_1 = __importDefault(require("react"));
+const styled_components_1 = __importDefault(require("styled-components"));
+const hooks_1 = require("../mocks/hooks");
+const Button_1 = require("../Button/Button");
+const useDefaultThemeSettings_1 = require("../hooks/useDefaultThemeSettings");
+function NextPageLink() {
+    var _a, _b;
+    const { nextPage } = (0, hooks_1.useSidebarSiblingsData)() || {};
+    const { navigation } = (0, useDefaultThemeSettings_1.useDefaultThemeSettings)();
+    if (!nextPage || (navigation === null || navigation === void 0 ? void 0 : navigation.hide) || ((_a = navigation === null || navigation === void 0 ? void 0 : navigation.nextPageLink) === null || _a === void 0 ? void 0 : _a.hide)) {
+        return react_1.default.createElement("div", null, "\u00A0");
+    }
+    const label = ((_b = navigation === null || navigation === void 0 ? void 0 : navigation.nextPageLink) === null || _b === void 0 ? void 0 : _b.label) || `Next to ${nextPage.label}`;
+    return (react_1.default.createElement(StyledButton, { variant: "outlined", size: "large", to: nextPage.link, "data-component-name": "PageNavigation/NextPageLink" }, label));
+}
+exports.NextPageLink = NextPageLink;
+const StyledButton = (0, styled_components_1.default)(Button_1.Button) `
+  font-family: var(--font-family-base);
+`;
+//# sourceMappingURL=NextPageLink.js.map

package/lib/PageNavigation/PageNavigation.d.ts

@@ -0,0 +1,2 @@
+/// <reference types="react" />
+export declare function PageNavigation(): JSX.Element | null;

package/lib/PageNavigation/PageNavigation.js

@@ -0,0 +1,27 @@
+"use strict";
+var __importDefault = (this && this.__importDefault) || function (mod) {
+    return (mod && mod.__esModule) ? mod : { "default": mod };
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.PageNavigation = void 0;
+const react_1 = __importDefault(require("react"));
+const styled_components_1 = __importDefault(require("styled-components"));
+const PreviousPageLink_1 = require("../PageNavigation/PreviousPageLink");
+const NextPageLink_1 = require("../PageNavigation/NextPageLink");
+const useDefaultThemeSettings_1 = require("../hooks/useDefaultThemeSettings");
+function PageNavigation() {
+    const { navigation } = (0, useDefaultThemeSettings_1.useDefaultThemeSettings)();
+    if (navigation === null || navigation === void 0 ? void 0 : navigation.hide) {
+        return null;
+    }
+    return (react_1.default.createElement(PageNavigationWrapper, { "data-component-name": "PageNavigation/PageNavigation" },
+        react_1.default.createElement(PreviousPageLink_1.PreviousPageLink, null),
+        react_1.default.createElement(NextPageLink_1.NextPageLink, null)));
+}
+exports.PageNavigation = PageNavigation;
+const PageNavigationWrapper = styled_components_1.default.div `
+  display: flex;
+  justify-content: space-between;
+  margin: 25px 0;
+`;
+//# sourceMappingURL=PageNavigation.js.map