@redocly/theme 0.1.21 → 0.1.22

package/Button/Button.d.ts

@@ -12,7 +12,7 @@ export interface ButtonProps {
     size?: ButtonSize;
     extraClass?: string;
     to?: string;
-    onClick?: () => void;
+    onClick?: (e?: any) => void;
 }
 export declare const baseButtonStyles: FlattenSimpleInterpolation;
 export declare const Button: React.FC<ButtonProps>;

package/Footer/Footer.js

@@ -12,9 +12,12 @@ var react_1 = __importDefault(require("react"));
 var styled_components_1 = __importDefault(require("styled-components"));
 var FooterColumns_1 = require("../Footer/FooterColumns");
 var FooterCopyright_1 = require("../Footer/FooterCopyright");
+var hooks_1 = require("../mocks/hooks");
+var constants_1 = require("../mocks/constants");
 function Footer(_a) {
     var _b = _a.data, columns = _b.columns, copyrightText = _b.copyrightText;
-    if (!((columns === null || columns === void 0 ? void 0 : columns.length) || copyrightText)) {
+    var footer = (0, hooks_1.useThemeSettings)(constants_1.USER_THEME_ALIAS).footer;
+    if (!((columns === null || columns === void 0 ? void 0 : columns.length) || copyrightText) || (footer === null || footer === void 0 ? void 0 : footer.hide)) {
         return null;
     }
     return (react_1.default.createElement(FooterContainer, { "data-component-name": "Footer/Footer" },

package/Navbar/Navbar.d.ts

@@ -5,6 +5,6 @@ interface NavbarProps {
     logo: React.ReactNode;
     search: React.ReactNode;
 }
-export declare function Navbar({ menu, logo, search }: NavbarProps): JSX.Element;
+export declare function Navbar({ menu, logo, search }: NavbarProps): JSX.Element | null;
 export declare const NavbarContainer: import("styled-components").StyledComponent<"nav", any, {}, never>;
 export {};

package/Navbar/Navbar.js

@@ -16,9 +16,12 @@ var Navbar_1 = require("../Navbar");
 function Navbar(_a) {
     var _b;
     var menu = _a.menu, logo = _a.logo, search = _a.search;
-    var searchThemeSettings = (_b = (0, hooks_1.useThemeSettings)(constants_1.USER_THEME_ALIAS)) === null || _b === void 0 ? void 0 : _b.search;
-    var hideSearch = (searchThemeSettings === null || searchThemeSettings === void 0 ? void 0 : searchThemeSettings.hide) ||
-        ((searchThemeSettings === null || searchThemeSettings === void 0 ? void 0 : searchThemeSettings.placement) && (searchThemeSettings === null || searchThemeSettings === void 0 ? void 0 : searchThemeSettings.placement) !== 'navbar');
+    var settings = (0, hooks_1.useThemeSettings)(constants_1.USER_THEME_ALIAS);
+    var searchSettings = settings.search;
+    var 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 ((_b = settings === null || settings === void 0 ? void 0 : settings.navbar) === null || _b === void 0 ? void 0 : _b.hide) {
+        return null;
+    }
     return (react_1.default.createElement(exports.NavbarContainer, { "data-component-name": "Navbar/Navbar" },
         logo,
         react_1.default.createElement(Navbar_1.NavbarMenu, { menuItems: menu }),

package/Sidebar/SidebarLayout.d.ts

@@ -3,5 +3,5 @@ interface SidebarLayoutProps {
     versions: React.ReactNode;
     menu: React.ReactNode;
 }
-export declare function SidebarLayout({ versions, menu }: SidebarLayoutProps): JSX.Element;
+export declare function SidebarLayout({ versions, menu }: SidebarLayoutProps): JSX.Element | null;
 export {};

package/Sidebar/SidebarLayout.js

@@ -21,10 +21,13 @@ function SidebarLayout(_a) {
     var versions = _a.versions, menu = _a.menu;
     var _b = (0, useMobileMenu_1.useMobileMenu)(), isOpen = _b[0], setIsOpen = _b[1];
     var toggleMenu = function () { return setIsOpen(!isOpen); };
-    var _c = (0, hooks_1.useThemeSettings)(constants_1.DEFAULT_THEME_NAME).search || {}, hide = _c.hide, placement = _c.placement;
+    var _c = (0, hooks_1.useThemeSettings)(constants_1.DEFAULT_THEME_NAME), search = _c.search, sidebar = _c.sidebar;
+    if (sidebar === null || sidebar === void 0 ? void 0 : sidebar.hide) {
+        return null;
+    }
     return (react_1.default.createElement(Wrapper, { "data-component-name": "Sidebar/SidebarLayout" },
         react_1.default.createElement(MobileSidebarButton_1.MobileSidebarButton, { opened: isOpen, onClick: toggleMenu }),
-        !hide && placement === 'sidebar' ? react_1.default.createElement(SidebarSearch_1.SidebarSearch, null) : null,
+        !(search === null || search === void 0 ? void 0 : search.hide) && (search === null || search === void 0 ? void 0 : search.placement) === 'sidebar' ? react_1.default.createElement(SidebarSearch_1.SidebarSearch, null) : null,
         react_1.default.createElement(Sidebar_1.Sidebar, { animate: true, opened: isOpen },
             versions,
             react_1.default.createElement(MenuContainer_1.MenuContainer, null, menu))));

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@redocly/theme",
-  "version": "0.1.21",
+  "version": "0.1.22",
   "description": "Shared UI components",
   "author": "team@redocly.com",
   "license": "SEE LICENSE IN LICENSE",

package/settings.yaml

@@ -7,3 +7,9 @@ toc:
     label: On this page
 navigation:
   hide: false
+navbar:
+  hide: false
+sidebar:
+  hide: false
+footer:
+  hide: false

package/src/Button/Button.tsx

@@ -16,7 +16,7 @@ export interface ButtonProps {
   size?: ButtonSize;
   extraClass?: string;
   to?: string;
-  onClick?: () => void;
+  onClick?: (e?: any) => void;
 }
 
 const getBlink = (): Keyframes => keyframes`

package/src/Footer/Footer.tsx

@@ -4,13 +4,17 @@ import styled from 'styled-components';
 import { FooterColumns } from '@theme/Footer/FooterColumns';
 import { FooterCopyright } from '@theme/Footer/FooterCopyright';
 import type { NavGroupRecord } from '@theme/types/portal';
+import { useThemeSettings } from '@portal/hooks';
+import { USER_THEME_ALIAS } from '@portal/constants';
 
 interface FooterProps {
   data: NavGroupRecord;
 }
 
 export function Footer({ data: { columns, copyrightText } }: FooterProps): JSX.Element | null {
-  if (!(columns?.length || copyrightText)) {
+  const { footer } = useThemeSettings(USER_THEME_ALIAS);
+
+  if (!(columns?.length || copyrightText) || footer?.hide) {
     return null;
   }
 

package/src/Navbar/Navbar.tsx

@@ -12,11 +12,15 @@ interface NavbarProps {
   search: React.ReactNode;
 }
 
-export function Navbar({ menu, logo, search }: NavbarProps): JSX.Element {
-  const searchThemeSettings = useThemeSettings(USER_THEME_ALIAS)?.search;
+export function Navbar({ menu, logo, search }: NavbarProps): JSX.Element | null {
+  const settings = useThemeSettings(USER_THEME_ALIAS);
+  const searchSettings = settings.search;
   const hideSearch =
-    searchThemeSettings?.hide ||
-    (searchThemeSettings?.placement && searchThemeSettings?.placement !== 'navbar');
+    searchSettings?.hide || (searchSettings?.placement && searchSettings?.placement !== 'navbar');
+
+  if (settings?.navbar?.hide) {
+    return null;
+  }
 
   return (
     <NavbarContainer data-component-name="Navbar/Navbar">

package/src/PageNavigation/NextPageLink.tsx

@@ -2,8 +2,8 @@ import React from 'react';
 
 import type { ResolvedNavLinkItem } from '@theme/types/portal';
 import { usePageData } from '@portal/hooks/usePageData';
-import { useThemeSettings } from '@portal/hooks/';
-import { DEFAULT_THEME_NAME } from '@portal/constants/';
+import { useThemeSettings } from '@portal/hooks';
+import { DEFAULT_THEME_NAME } from '@portal/constants';
 import { Button } from '@theme/Button/Button';
 
 interface NextPageType {

package/src/Sidebar/SidebarLayout.tsx

@@ -5,8 +5,8 @@ import { Sidebar } from '@theme/Sidebar/Sidebar';
 import { useMobileMenu } from '@theme/hooks/useMobileMenu';
 import { MobileSidebarButton } from '@theme/Sidebar/MobileSidebarButton';
 import { MenuContainer } from '@theme/Sidebar/MenuContainer';
-import { useThemeSettings } from '@portal/hooks/';
-import { DEFAULT_THEME_NAME } from '@portal/constants/';
+import { useThemeSettings } from '@portal/hooks';
+import { DEFAULT_THEME_NAME } from '@portal/constants';
 import { SidebarSearch } from '@theme/Search/SidebarSearch';
 
 interface SidebarLayoutProps {
@@ -14,16 +14,20 @@ interface SidebarLayoutProps {
   menu: React.ReactNode;
 }
 
-export function SidebarLayout({ versions, menu }: SidebarLayoutProps): JSX.Element {
+export function SidebarLayout({ versions, menu }: SidebarLayoutProps): JSX.Element | null {
   const [isOpen, setIsOpen] = useMobileMenu();
   const toggleMenu = () => setIsOpen(!isOpen);
-  const { hide, placement } = useThemeSettings(DEFAULT_THEME_NAME).search || {};
+  const { search, sidebar } = useThemeSettings(DEFAULT_THEME_NAME);
+
+  if (sidebar?.hide) {
+    return null;
+  }
 
   return (
     <Wrapper data-component-name="Sidebar/SidebarLayout">
       <MobileSidebarButton opened={isOpen} onClick={toggleMenu} />
 
-      {!hide && placement === 'sidebar' ? <SidebarSearch /> : null}
+      {!search?.hide && search?.placement === 'sidebar' ? <SidebarSearch /> : null}
       <Sidebar animate={true} opened={isOpen}>
         {versions}
         <MenuContainer>{menu}</MenuContainer>