@redocly/theme 0.1.9 → 0.1.10

package/src/Sidebar/BackButton.tsx

@@ -25,7 +25,7 @@ const Button = styled.button`
   padding: 0;
   border: 0;
   outline: 0;
-  color: var(--color-secondary-contrast);
+  color: var(--color-content);
   display: flex;
   align-items: center;
   cursor: pointer;
@@ -39,6 +39,6 @@ const Button = styled.button`
   }
 
   &:hover {
-    color: var(--sidebar-text-color);
+    color: var(--sidebar-item-color);
   }
 `;

package/src/Sidebar/DrilldownMenuItem.tsx

@@ -9,7 +9,7 @@ export function DrilldownMenuItem({ item }: MenuItemProps): JSX.Element {
       {item.icon ? <Icon src={item.icon} /> : null}
       <div>
         {item.label}
-        {item.sublabel ? <Sublabel>{item.sublabel}</Sublabel> : null}
+        {item.sublabel ? <SubLabel>{item.sublabel}</SubLabel> : null}
       </div>
     </Container>
   );
@@ -18,7 +18,7 @@ export function DrilldownMenuItem({ item }: MenuItemProps): JSX.Element {
 const Container = styled.div`
   display: flex;
   align-items: center;
-  color: var(--sidebar-text-color);
+  color: var(--sidebar-item-color);
   font-size: var(--sidebar-font-size);
   font-weight: var(--font-weight-bold);
 `;
@@ -32,9 +32,9 @@ const Icon = styled.img`
   overflow: hidden;
 `;
 
-const Sublabel = styled.div`
+const SubLabel = styled.div`
   margin-top: 2px;
   font-size: 0.85rem;
-  color: var(--color-secondary-contrast);
+  color: var(--color-content);
   font-weight: var(--font-weight-regular);
 `;

package/src/Sidebar/Menu.tsx

@@ -6,6 +6,6 @@ export const Menu = styled.ul.attrs(() => ({
   padding: 0;
   margin: 0;
   list-style: none;
-  color: var(--sidebar-text-color);
+  color: var(--sidebar-item-color);
   position: relative;
 `;

package/src/Sidebar/MenuItemLabel.tsx

@@ -25,14 +25,14 @@ export const MenuItemLabel = styled.li.attrs(() => ({
   ${(props) =>
     props.active
       ? `
-    color: var(--sidebar-text-active-color);
-    background-color: var(--sidebar-text-active-background-color);
+    color: var(--sidebar-item-active-color);
+    background-color: var(--sidebar-item-active-background-color);
   `
       : null};
 
   :hover {
-    color: var(--sidebar-text-active-color);
-    background-color: var(--sidebar-text-active-background-color);
+    color: var(--sidebar-item-active-color);
+    background-color: var(--sidebar-item-active-background-color);
   }
 
   :empty {

package/src/Sidebar/MenuLink.tsx

@@ -6,7 +6,7 @@ export const MenuLink = styled(UniversalLink).attrs(() => ({
   'data-component-name': 'Sidebar/MenuLink',
 }))<UniversalLinkProps>`
   text-decoration: none;
-  color: var(--sidebar-text-color);
+  color: var(--sidebar-item-color);
 
   &&.external-url:after {
     content: none;

package/src/Sidebar/MobileSidebarButton.tsx

@@ -12,7 +12,7 @@ export const MobileSidebarButton = styled.span.attrs(() => ({
   position: fixed;
   right: 20px;
   z-index: 3;
-  box-shadow: rgba(0, 0, 0, 0.3) 0px 0px 20px;
+  box-shadow: rgba(0, 0, 0, 0.3) 0 0 20px;
   border-radius: 50%;
   transform: ${(props) => (props.opened ? 'rotate(180deg)' : 'rotate(0deg)')};
   transition: transform 0.75s;
@@ -35,7 +35,7 @@ export const MobileSidebarButton = styled.span.attrs(() => ({
     left: 50%;
     width: 25px;
     height: 25px;
-    background-color: var(--color-primary-contrast);
+    background-color: #fff;
     -webkit-mask: url("data:image/svg+xml,%3C%3Fxml version='1.0' encoding='iso-8859-1'%3F%3E%3C!-- Generator: Adobe Illustrator 19.0.0, SVG Export Plug-In . SVG Version: 6.00 Build 0) --%3E%3Csvg version='1.1' id='Capa_1' xmlns='http://www.w3.org/2000/svg' xmlns:xlink='http://www.w3.org/1999/xlink' x='0px' y='0px' viewBox='0 0 294.842 294.842' style='enable-background:new 0 0 294.842 294.842;' xml:space='preserve'%3E%3Cg%3E%3Cpath fill='%23fff' d='M292.128,214.846c-2.342-2.344-6.143-2.344-8.484,0l-59.512,59.511V6c0-3.313-2.687-6-6-6s-6,2.687-6,6v268.356 l-59.513-59.512c-2.342-2.342-6.142-2.343-8.485,0.001c-2.343,2.343-2.343,6.142,0.001,8.485l69.755,69.754 c1.171,1.171,2.707,1.757,4.242,1.757s3.071-0.586,4.242-1.758l69.754-69.754C294.472,220.987,294.472,217.188,292.128,214.846z'/%3E%3Cpath fill='%23fff' d='M6.956,12h180.137c3.313,0,6-2.687,6-6s-2.687-6-6-6H6.956c-3.313,0-6,2.687-6,6S3.643,12,6.956,12z'/%3E%3Cpath fill='%23fff' d='M6.956,82.228h180.137c3.313,0,6-2.687,6-6s-2.687-6-6-6H6.956c-3.313,0-6,2.687-6,6S3.643,82.228,6.956,82.228z'/%3E%3Cpath fill='%23fff' d='M6.956,152.456h180.137c3.313,0,6-2.687,6-6s-2.687-6-6-6H6.956c-3.313,0-6,2.687-6,6S3.643,152.456,6.956,152.456z'/%3E%3Cpath fill='%23fff' d='M124.438,210.685H6.956c-3.313,0-6,2.687-6,6s2.687,6,6,6h117.482c3.313,0,6-2.687,6-6S127.752,210.685,124.438,210.685z' /%3E%3Cpath fill='%23fff' d='M124.438,280.912H6.956c-3.313,0-6,2.687-6,6s2.687,6,6,6h117.482c3.313,0,6-2.687,6-6S127.752,280.912,124.438,280.912z' /%3E%3C/g%3E%3Cg%3E%3C/g%3E%3Cg%3E%3C/g%3E%3Cg%3E%3C/g%3E%3Cg%3E%3C/g%3E%3Cg%3E%3C/g%3E%3Cg%3E%3C/g%3E%3Cg%3E%3C/g%3E%3Cg%3E%3C/g%3E%3Cg%3E%3C/g%3E%3Cg%3E%3C/g%3E%3Cg%3E%3C/g%3E%3Cg%3E%3C/g%3E%3Cg%3E%3C/g%3E%3Cg%3E%3C/g%3E%3Cg%3E%3C/g%3E%3C/svg%3E%0A")
       no-repeat 50% 50%;
     mask: url("data:image/svg+xml,%3C%3Fxml version='1.0' encoding='iso-8859-1'%3F%3E%3C!-- Generator: Adobe Illustrator 19.0.0, SVG Export Plug-In . SVG Version: 6.00 Build 0) --%3E%3Csvg version='1.1' id='Capa_1' xmlns='http://www.w3.org/2000/svg' xmlns:xlink='http://www.w3.org/1999/xlink' x='0px' y='0px' viewBox='0 0 294.842 294.842' style='enable-background:new 0 0 294.842 294.842;' xml:space='preserve'%3E%3Cg%3E%3Cpath fill='%23fff' d='M292.128,214.846c-2.342-2.344-6.143-2.344-8.484,0l-59.512,59.511V6c0-3.313-2.687-6-6-6s-6,2.687-6,6v268.356 l-59.513-59.512c-2.342-2.342-6.142-2.343-8.485,0.001c-2.343,2.343-2.343,6.142,0.001,8.485l69.755,69.754 c1.171,1.171,2.707,1.757,4.242,1.757s3.071-0.586,4.242-1.758l69.754-69.754C294.472,220.987,294.472,217.188,292.128,214.846z'/%3E%3Cpath fill='%23fff' d='M6.956,12h180.137c3.313,0,6-2.687,6-6s-2.687-6-6-6H6.956c-3.313,0-6,2.687-6,6S3.643,12,6.956,12z'/%3E%3Cpath fill='%23fff' d='M6.956,82.228h180.137c3.313,0,6-2.687,6-6s-2.687-6-6-6H6.956c-3.313,0-6,2.687-6,6S3.643,82.228,6.956,82.228z'/%3E%3Cpath fill='%23fff' d='M6.956,152.456h180.137c3.313,0,6-2.687,6-6s-2.687-6-6-6H6.956c-3.313,0-6,2.687-6,6S3.643,152.456,6.956,152.456z'/%3E%3Cpath fill='%23fff' d='M124.438,210.685H6.956c-3.313,0-6,2.687-6,6s2.687,6,6,6h117.482c3.313,0,6-2.687,6-6S127.752,210.685,124.438,210.685z' /%3E%3Cpath fill='%23fff' d='M124.438,280.912H6.956c-3.313,0-6,2.687-6,6s2.687,6,6,6h117.482c3.313,0,6-2.687,6-6S127.752,280.912,124.438,280.912z' /%3E%3C/g%3E%3Cg%3E%3C/g%3E%3Cg%3E%3C/g%3E%3Cg%3E%3C/g%3E%3Cg%3E%3C/g%3E%3Cg%3E%3C/g%3E%3Cg%3E%3C/g%3E%3Cg%3E%3C/g%3E%3Cg%3E%3C/g%3E%3Cg%3E%3C/g%3E%3Cg%3E%3C/g%3E%3Cg%3E%3C/g%3E%3Cg%3E%3C/g%3E%3Cg%3E%3C/g%3E%3Cg%3E%3C/g%3E%3Cg%3E%3C/g%3E%3C/svg%3E%0A")

package/src/Sidebar/Sidebar.tsx

@@ -17,7 +17,7 @@ export const Sidebar = styled.aside.attrs(() => ({
   background: var(--sidebar-background-color);
   font-size: var(--sidebar-font-size);
   font-family: var(--sidebar-font-family);
-  color: var(--sidebar-text-color);
+  color: var(--sidebar-item-color);
   top: var(--navbar-height);
   height: calc(100vh - var(--navbar-height));
   display: flex;

package/src/Sidebar/index.ts

@@ -1,19 +1,19 @@
-export * from './ApiCallItem';
-export * from './ArrowBack';
-export * from './BackButton';
-export * from './Drilldown';
-export * from './DrilldownMenu';
-export * from './DrilldownMenuItem';
-export * from './ExternalIcon';
-export * from './Menu';
-export * from './MenuContainer';
-export * from './MenuGroup';
-export * from './MenuItem';
-export * from './MenuItemLabel';
-export * from './MenuLink';
-export * from './MenuLinkItem';
-export * from './MobileSidebarButton';
-export * from './Separator';
-export * from './SeparatorItem';
-export * from './Sidebar';
-export * from './SidebarLayout';
+export * from '@theme/Sidebar/ApiCallItem';
+export * from '@theme/Sidebar/ArrowBack';
+export * from '@theme/Sidebar/BackButton';
+export * from '@theme/Sidebar/Drilldown';
+export * from '@theme/Sidebar/DrilldownMenu';
+export * from '@theme/Sidebar/DrilldownMenuItem';
+export * from '@theme/Sidebar/ExternalIcon';
+export * from '@theme/Sidebar/Menu';
+export * from '@theme/Sidebar/MenuContainer';
+export * from '@theme/Sidebar/MenuGroup';
+export * from '@theme/Sidebar/MenuItem';
+export * from '@theme/Sidebar/MenuItemLabel';
+export * from '@theme/Sidebar/MenuLink';
+export * from '@theme/Sidebar/MenuLinkItem';
+export * from '@theme/Sidebar/MobileSidebarButton';
+export * from '@theme/Sidebar/Separator';
+export * from '@theme/Sidebar/SeparatorItem';
+export * from '@theme/Sidebar/Sidebar';
+export * from '@theme/Sidebar/SidebarLayout';

package/src/Sidebar/types/index.ts

@@ -1,5 +1,5 @@
-export * from './DrilldownMenuProps';
-export * from './ItemState';
-export * from './MenuItemProps';
-export * from './MenuStyle';
-export * from './NavItem';
+export * from '@theme/Sidebar/types/DrilldownMenuProps';
+export * from '@theme/Sidebar/types/ItemState';
+export * from '@theme/Sidebar/types/MenuItemProps';
+export * from '@theme/Sidebar/types/MenuStyle';
+export * from '@theme/Sidebar/types/NavItem';

package/src/SidebarLogo/SidebarLogo.stories.tsx

@@ -4,7 +4,7 @@ import { ComponentStory, ComponentMeta } from '@storybook/react';
 import { SidebarLogo } from '@theme/SidebarLogo';
 
 export default {
-  title: 'SidebarLogo',
+  title: 'Components/SidebarLogo',
   component: SidebarLogo,
   argTypes: {
     backgroundColor: { control: 'color' },

package/src/SidebarLogo/index.ts

@@ -1 +1 @@
-export * from './SidebarLogo';
+export * from '@theme/SidebarLogo/SidebarLogo';

package/src/SourceCode/SourceCode.stories.tsx

@@ -4,7 +4,7 @@ import { ComponentStory, ComponentMeta } from '@storybook/react';
 import { SourceCode } from '@theme/SourceCode';
 
 export default {
-  title: 'SourceCode',
+  title: 'Components/SourceCode',
   component: SourceCode,
 } as ComponentMeta<typeof SourceCode>;
 

package/src/SourceCode/index.ts

@@ -1 +1 @@
-export * from './SourceCode';
+export * from '@theme/SourceCode/SourceCode';

package/src/TableOfContent/TableOfContent.tsx

@@ -70,7 +70,7 @@ const TocHeader = styled.div`
 
 const MenuItem = styled.a<{ depth: number }>`
   display: block;
-  color: var(--color-text-main);
+  color: var(--color-content);
   cursor: pointer;
   font-size: 0.8em;
   padding: 10px 15px;
@@ -78,11 +78,11 @@ const MenuItem = styled.a<{ depth: number }>`
   transition: background-color 0.3s, color 0.3s;
   text-decoration: none;
   word-break: break-word;
-  font-family: var(--font-family-h);
+  font-family: var(--h-font-family);
   :hover,
   &.active {
-    color: var(--sidebar-text-active-color);
-    background-color: var(--sidebar-text-active-background-color);
+    color: var(--sidebar-item-active-color);
+    background-color: var(--sidebar-item-active-background-color);
   }
   :empty {
     padding: 0;
@@ -94,7 +94,7 @@ const TableOfContentMenu = styled.aside`
   background-color: transparent;
   flex-shrink: 0;
   display: none !important;
-  font-family: var(--font-family-primary);
+  font-family: var(--font-family-base);
 
   ${({ theme }) => theme.mediaQueries.medium} {
     width: var(--toc-width);
@@ -106,7 +106,7 @@ const TableOfContentItems = styled.div`
   position: sticky;
   top: calc(var(--navbar-height) + 20px);
   max-height: calc(100vh - var(--navbar-height) - 20px);
-  border-left: 1px solid var(--color-border-light);
+  border-left: 1px solid var(--global-border-color);
   overflow-y: auto;
   width: var(--toc-width); ;
 `;

package/src/TableOfContent/index.ts

@@ -1 +1 @@
-export * from './TableOfContent';
+export * from '@theme/TableOfContent/TableOfContent';

package/src/Tooltip/Tooltip.stories.tsx

@@ -4,7 +4,7 @@ import { ComponentStory, ComponentMeta } from '@storybook/react';
 import { Tooltip } from '@theme/Tooltip';
 
 export default {
-  title: 'Tooltip',
+  title: 'Components/Tooltip',
   component: Tooltip,
 } as ComponentMeta<typeof Tooltip>;
 

package/src/Tooltip/index.ts

@@ -1 +1 @@
-export * from './Tooltip';
+export * from '@theme/Tooltip/Tooltip';

package/src/Welcome.stories.mdx

@@ -0,0 +1,7 @@
+import { Meta } from '@storybook/addon-docs';
+
+<Meta title="Welcome" />
+
+# @redocly/theme
+
+Welcome to storybook for [@redocly/theme](https://www.npmjs.com/package/@redocly/theme) package.

package/src/globalStyle.ts

@@ -317,7 +317,7 @@ export const GlobalStyle = createGlobalStyle`
     --samples-panel-width: 50%;
     --samples-panel-block-background-color: #fff;
     --samples-panel-background-color: #52606d;
-    --samples-panel-callback-background-color: var(--samples-panel-callback-background-color);
+    --samples-panel-callback-background-color: var(--color-secondary-300);
     --samples-panel-controls-background-color: #323f4b;
     --samples-panel-controls-hover-background-color: #3c4c5a;
     --samples-panel-controls-active-border-color: var(--color-accent-500);
@@ -421,21 +421,53 @@ export const GlobalStyle = createGlobalStyle`
     --fab-color: #0065FB;
     --fab-background-color: #f2f2f2;
     
+    //* PORTAL settings *//
     /**
-     * Portal Logo
+     * Headings
+     * */
+    --h2-font-weight: var(--font-weight-bold);
+
+    --h1-margin-top: 1.35em;
+    --h1-margin-bottom: 0.9em;
+    --h2-margin-top: 1.25em;
+    --h2-margin-bottom: 0.8em;
+    --h3-margin-top: 1.25em;
+    --h3-margin-bottom: 0.8em;
+    
+    /**
+     * Footer
+     * */
+    --footer-background-color: var(--color-primary-500);
+    --footer-text-color: #fff;
+
+    /**
+     * Sidebar
+     * */
+    --sidebar-padding-horizontal: var(--sidebar-spacing-unit);
+    --sidebar-padding-vertical: var(--sidebar-spacing-unit);
+
+    --sidebar-spacing-padding-vertical: var(--sidebar-spacing-unit);
+    --sidebar-spacing-padding-horizontal: var(--sidebar-spacing-unit);
+
+    --sidebar-border-radius: 4px;
+    --sidebar-font-size: var(--font-size-base);
+    --sidebar-font-family: var(--font-family-base);
+
+    /**
+     * Logo
      * */
     --logo-height: 2rem;
     --logo-margin: var(--sidebar-margin-left);
 
     /**
-     * Portal Navbar
+     * Navbar
      * */
     --navbar-height: 60px;
-    --navbar-color-text: var(--color-content-inverse);
-    --navbar-color-background: var(--color-primary-500);
+    --navbar-text-color: #fff;
+    --navbar-background-color: var(--color-primary-500);
 
     /**
-     * Portal Navbar Item
+     * Navbar Item
      * */
     --navbar-item-font-size: 16px;
     --navbar-item-margin-horizontal: 0;
@@ -443,7 +475,70 @@ export const GlobalStyle = createGlobalStyle`
     --navbar-item-border-radius: 10px;
     --navbar-item-font-weight: var(--font-weight-bold);
     --navbar-item-active-background-color: #1b75fa;
-    --navbar-item-active-text-color: var(--color-primary-contrast);
+    --navbar-item-active-text-color: var(--navbar-text-color);
     --navbar-item-active-text-decoration: none;
+
+    /**
+     * TOC
+     * */
+    --toc-width: 240px;
+
+    /**
+     * Markdown
+     * */
+    --content-wrapper-max-width: 910px;
+    --content-wrapper-padding-vertical: 25px;
+    --content-wrapper-padding-horizontal: 0px;
+
+    /**
+     * Bloquote
+     * */
+    --bloquote-margin-vertical: 1.5em;
+    --bloquote-margin-horizontal: 0;
+    --bloquote-padding-vertical: 0;
+    --bloquote-padding-horizontal: calc(var(--spacing-unit) * 4);
+    --bloquote-background-color: transparent;
+
+    /**
+     * Admonition
+     * */
+    --admonition-margin-horizontal: 0;
+    --admonition-margin-vertical: calc(var(--spacing-unit) * 2);
+    --admonition-padding-horizontal: calc(var(--spacing-unit) * 4);
+    --admonition-padding-vertical: calc(var(--spacing-unit) * 4);
+    --admonition-icon-size: 25px;
+    --admonition-border-radius: 8px;
+    --admonition-font-size: 16px;
+    --admonition-font-weight: normal;
+    --admonition-line-height: 1.5em;
+    --admonition-heading-font-size: 16px;
+    --admonition-heading-font-weight: var(--font-weight-bold);
+    --admonition-heading-letter-spacing: 0.3px;
+    --admonition-heading-transform: uppercase;
+
+    /* info */
+    --admonition-info-background-color: #ebedf0;
+    --admonition-info-text-color: var(--color-content);
+    --admonition-info-icon-color: #4782cb;
+
+    /* attention */
+    --admonition-attention-background-color: #e6eef8;
+    --admonition-attention-text-color: var(--color-content);
+    --admonition-attention-icon-color: #4782cb;
+
+    /* warning */
+    --admonition-warning-background-color: #feeda5;
+    --admonition-warning-text-color: var(--color-content);
+    --admonition-warning-icon-color: #d4ad03;
+
+    /* danger */
+    --admonition-danger-background-color: #fceaea;
+    --admonition-danger-text-color: var(--color-content);
+    --admonition-danger-icon-color: #e53935;
+
+    /* success */
+    --admonition-success-background-color: #ddffe1;
+    --admonition-success-text-color: var(--color-content);
+    --admonition-success-icon-color: #00aa13;
   }
 `;

package/src/hooks/index.ts

@@ -1,7 +1,7 @@
-export * from './useControl';
-export * from './useMount';
-export * from './useUnmount';
-export * from './useActiveHeading';
-export * from './useActiveSectionId';
-export * from './useFullHeight';
-export * from './useNavbarHeight';
+export * from '@theme/hooks/useControl';
+export * from '@theme/hooks/useMount';
+export * from '@theme/hooks/useUnmount';
+export * from '@theme/hooks/useActiveHeading';
+export * from '@theme/hooks/useActiveSectionId';
+export * from '@theme/hooks/useFullHeight';
+export * from '@theme/hooks/useNavbarHeight';

package/src/hooks/useActiveSectionId.ts

@@ -1,14 +1,14 @@
+import { Location } from 'history';
 import { useEffect, useState, useMemo } from 'react';
 import throttle from 'lodash.throttle';
 
 import { useNavbarHeight } from '@theme/hooks/useNavbarHeight';
-import type { MenuProps } from '@theme/types/portal';
 
 export type UseActiveSectionIdReturnType = string;
 
 export function useActiveSectionId(
-  location: MenuProps['location'],
-  hasOverviewPage: boolean,
+  location: Location,
+  hasOverviewPage = false,
 ): UseActiveSectionIdReturnType {
   const [itemId, setItemId] = useState<string>('');
   const navbarHeight = useNavbarHeight(location);

package/src/icons/ShelfIcon/index.ts

@@ -1,2 +1,2 @@
-export { ShelfIcon } from './ShelfIcon';
-export type { ShelfIconProps } from './ShelfIcon';
+export { ShelfIcon } from '@theme/icons/ShelfIcon/ShelfIcon';
+export type { ShelfIconProps } from '@theme/icons/ShelfIcon/ShelfIcon';

package/src/icons/index.ts

@@ -1 +1 @@
-export * from './ShelfIcon';
+export * from '@theme/icons/ShelfIcon';

package/src/types/portal/index.d.ts

@@ -2,5 +2,4 @@ export * from './src/client/styling';
 export * from './src/client/app/Sidebar/types';
 export * from './src/server/plugins/portal-config/types';
 export * from './src/shared/types';
-export * from './src/server/plugins/versions/types';
 export type { MdHeading } from './src/server/plugins/markdown/types';

package/src/types/portal/src/client/app/Sidebar/types.d.ts

@@ -1,50 +1,41 @@
-import { Location } from 'history';
 import { MenuStyle } from '../../../shared/types';
-import type { Version } from '../../../server/plugins/versions/types';
 export interface SidebarNavItem {
-  label?: string;
-  sublabel?: string;
-  icon?: string;
-  link?: string;
-  type?: string;
-  httpVerb?: string;
-  expanded?: string;
-  selectFirstItemOnExpand?: boolean;
-  pageId?: string;
-  redocPrevLink?: string;
-  redocPrevLabel?: string;
-  redocNextLink?: string;
-  redocNextLabel?: string;
-  redocFakePage?: boolean;
-  redocInfoPageId?: string;
-  target?: string;
-  external?: boolean;
-  items?: SidebarNavItem[];
-  permission?: string;
-  menuStyle?: MenuStyle;
-  separatorLine?: boolean;
-  version?: string;
-  default?: boolean;
+    label?: string;
+    sublabel?: string;
+    icon?: string;
+    link?: string;
+    type?: string;
+    httpVerb?: string;
+    expanded?: string;
+    selectFirstItemOnExpand?: boolean;
+    pageId?: string;
+    redocPrevLink?: string;
+    redocPrevLabel?: string;
+    redocNextLink?: string;
+    redocNextLabel?: string;
+    redocFakePage?: boolean;
+    redocInfoPageId?: string;
+    target?: string;
+    external?: boolean;
+    items?: SidebarNavItem[];
+    permission?: string;
+    menuStyle?: MenuStyle;
+    separatorLine?: boolean;
+    version?: string;
 }
 export interface ItemState extends SidebarNavItem {
-  items: ItemState[];
-  active: boolean;
-  hasActiveSubItem: boolean;
-  menuStyle?: MenuStyle | null;
-}
-export interface MenuProps {
-  items: SidebarNavItem[];
-  location: Location;
-  pageId: string;
-  versions?: Version[];
+    items: ItemState[];
+    active: boolean;
+    hasActiveSubItem: boolean;
+    menuStyle?: MenuStyle | null;
 }
 export declare enum MenuType {
-  Separator = 'separator',
-  DrillDown = 'drilldown',
-  Group = 'group',
-  Operation = 'operation',
+    Separator = "separator",
+    DrillDown = "drilldown",
+    Group = "group",
+    Operation = "operation"
 }
 export interface MenuItemProps {
-  item: ItemState;
-  activeItem?: ItemState;
+    item: ItemState;
+    activeItem?: ItemState;
 }

package/src/types/portal/src/client/app/media-css.d.ts

@@ -1,7 +1,7 @@
 export declare const breakpoints: {
-  small: string;
-  medium: string;
-  large: string;
+    small: string;
+    medium: string;
+    large: string;
 };
-export declare const mediaQueries: import('@theme/utils/media-css').MediaQueries;
+export declare const mediaQueries: import("@theme/utils/media-css").MediaQueries;
 export type { MediaQueries } from '@theme/utils/media-css';