@redocly/theme 0.1.25 → 0.1.28

package/src/Navbar/Navbar.tsx

@@ -5,6 +5,9 @@ import { useThemeSettings } from '@portal/hooks';
 import { DEFAULT_THEME_NAME } from '@portal/constants';
 import { ResolvedConfigLinks } from '@theme/types/portal';
 import { NavbarMenu } from '@theme/Navbar';
+import { useMobileMenu } from '@theme/hooks/useMobileMenu';
+import { MobileNavbarMenuButton } from '@theme/Navbar/MobileNavbarMenuButton';
+import { MobileNavbarMenu } from '@theme/Navbar/MobileNavbarMenu';
 
 interface NavbarProps {
   menu: ResolvedConfigLinks;
@@ -13,17 +16,22 @@ interface NavbarProps {
 }
 
 export function Navbar({ menu, logo, search }: NavbarProps): JSX.Element | null {
-  const settings = useThemeSettings(DEFAULT_THEME_NAME);
-  const searchSettings = settings.search;
+  const [isOpen, setIsOpen] = useMobileMenu(false);
+  const { search: searchSettings, navbar } = useThemeSettings(DEFAULT_THEME_NAME);
   const hideSearch =
     searchSettings?.hide || (searchSettings?.placement && searchSettings?.placement !== 'navbar');
 
-  if (settings?.navbar?.hide) {
+  if (navbar?.hide) {
     return null;
   }
 
+  const openMobileMenu = () => setIsOpen(true);
+  const closeMobileMenu = () => setIsOpen(false);
+
   return (
     <NavbarContainer data-component-name="Navbar/Navbar">
+      <MobileNavbarMenuButton onClick={openMobileMenu} />
+      {isOpen && <MobileNavbarMenu closeMenu={closeMobileMenu} menuItems={menu} />}
       {logo}
       <NavbarMenu menuItems={menu} />
       {hideSearch ? null : search}

package/src/Navbar/NavbarDropdown.tsx

@@ -31,7 +31,7 @@ export const DropdownWrapper = styled.div`
   box-shadow: var(--navbar-dropdown-shadow);
   & > div {
     text-align: left;
-    padding: 10px 0px;
+    padding: 10px 0;
     cursor: pointer;
     a {
       color: var(--navbar-text-color);

package/src/Navbar/NavbarItem.tsx

@@ -11,18 +11,19 @@ import { Link } from '@portal/Link';
 import { withPathPrefix } from '@portal/utils';
 import { NavbarDropdown, DropdownWrapper } from '@theme/Navbar/NavbarDropdown';
 
-interface NavbarItemProps {
+export interface NavbarItemProps {
   navItem: ResolvedNavItem;
+  className?: string;
 }
 
-export function NavbarItem({ navItem }: NavbarItemProps): JSX.Element | null {
+export function NavbarItem({ navItem, className }: NavbarItemProps): JSX.Element | null {
   const { pathname } = useLocation();
 
   if ((navItem as ResolvedNavLinkItem).link) {
     const item = navItem as ResolvedNavLinkItem;
     const isActive = pathname === withPathPrefix(item.link);
     return (
-      <NavMenuItem active={isActive} data-component-name="Navbar/NavbarItem">
+      <NavMenuItem active={isActive} data-component-name="Navbar/NavbarItem" className={className}>
         <NavLink to={item.link} active={isActive}>
           <NavLabel>{item.label}</NavLabel>
         </NavLink>
@@ -34,7 +35,7 @@ export function NavbarItem({ navItem }: NavbarItemProps): JSX.Element | null {
     const item = navItem as ResolvedNavGroupItem;
     return (
       <NavMenuItemWithDropdownWrapper>
-        <NavMenuItem active={false} data-component-name="Navbar/NavbarItem">
+        <NavMenuItem active={false} data-component-name="Navbar/NavbarItem" className={className}>
           <NavLabel>{item.label}</NavLabel>
         </NavMenuItem>
         <NavbarDropdown items={item.items as ResolvedNavLinkItem[]} />
@@ -45,7 +46,7 @@ export function NavbarItem({ navItem }: NavbarItemProps): JSX.Element | null {
   return null;
 }
 
-const NavMenuItemWithDropdownWrapper = styled.div`
+export const NavMenuItemWithDropdownWrapper = styled.div`
   display: inline-block;
   position: relative;
   border-radius: var(--navbar-item-border-radius);
@@ -57,9 +58,9 @@ const NavMenuItemWithDropdownWrapper = styled.div`
   }
 `;
 
-const NavMenuItem = styled.li<{ active?: boolean }>`
+export const NavMenuItem = styled.li<{ active?: boolean }>`
   display: inline-block;
-  padding: 20px calc(var(--sidebar-spacing-horizontal) * 2);
+  padding: 8px calc(var(--sidebar-spacing-horizontal) * 2);
   text-align: center;
   line-height: 1;
   font-size: var(--navbar-item-font-size);
@@ -70,7 +71,7 @@ const NavMenuItem = styled.li<{ active?: boolean }>`
   background: ${({ active }) => (active ? 'var(--navbar-item-active-background-color)' : 'none')};
 `;
 
-const NavLink = styled(Link)`
+export const NavLink = styled(Link)`
   color: ${({ active }) =>
     active ? 'var(--navbar-item-active-text-color)' : 'var(--navbar-text-color)'};
   text-decoration: ${({ active }) =>

package/src/Navbar/NavbarMenu.tsx

@@ -3,9 +3,10 @@ import styled from 'styled-components';
 
 import { NavbarItem } from '@theme/Navbar/NavbarItem';
 import type { ResolvedConfigLinks, ResolvedNavItem } from '@theme/types/portal';
+import { isPrimitive, isEmptyArray } from '@theme/utils';
 
 export function NavbarMenu({ menuItems }: { menuItems: ResolvedConfigLinks }): JSX.Element | null {
-  if (!menuItems?.length) {
+  if (isPrimitive(menuItems) || isEmptyArray(menuItems)) {
     return null;
   }
 
@@ -22,11 +23,15 @@ export function NavbarMenu({ menuItems }: { menuItems: ResolvedConfigLinks }): J
 
 const NavItemsContainer = styled.ul`
   list-style: none;
-  margin: 0;
+  margin: 0 7px;
   padding: 0;
-  display: block;
+  display: none;
+  flex-wrap: nowrap;
+  align-items: center;
+  justify-content: flex-end;
+  flex: 1;
 
   ${({ theme }) => theme.mediaQueries.medium} {
-    display: block;
+    display: flex;
   }
 `;

package/src/PageNavigation/NextPageLink.tsx

@@ -1,4 +1,5 @@
 import React from 'react';
+import styled from 'styled-components';
 
 import type { ResolvedNavItemWithLink } from '@theme/types/portal';
 import { useThemeSettings, useSidebarSiblingsData } from '@portal/hooks';
@@ -11,22 +12,26 @@ interface NextPageType {
 
 export function NextPageLink(): JSX.Element {
   const { nextPage }: NextPageType = useSidebarSiblingsData() || {};
-  const { themeSettings } = useThemeSettings(DEFAULT_THEME_NAME);
+  const { navigation } = useThemeSettings(DEFAULT_THEME_NAME);
 
-  if (!nextPage || themeSettings?.navigation?.hide) {
+  if (!nextPage || navigation?.hide) {
     return <div>&nbsp;</div>;
   }
 
-  const label = themeSettings?.navigation?.nextPageLink?.label || `Next to ${nextPage.label}`;
+  const label = navigation?.nextPageLink?.label || `Next to ${nextPage.label}`;
 
   return (
-    <Button
+    <StyledButton
       variant="outlined"
       size="large"
       to={nextPage.link}
       data-component-name="PageNavigation/NextPageLink"
     >
       {label}
-    </Button>
+    </StyledButton>
   );
 }
+
+const StyledButton = styled(Button)`
+  font-family: var(--font-family-base);
+`;

package/src/PageNavigation/PreviousPageLink.tsx

@@ -1,4 +1,5 @@
 import React from 'react';
+import styled from 'styled-components';
 
 import type { ResolvedNavItemWithLink } from '@theme/types/portal';
 import { useThemeSettings, useSidebarSiblingsData } from '@portal/hooks';
@@ -11,22 +12,26 @@ interface PreviousPageType {
 
 export function PreviousPageLink(): JSX.Element {
   const { prevPage }: PreviousPageType = useSidebarSiblingsData() || {};
-  const { themeSettings } = useThemeSettings(DEFAULT_THEME_NAME);
+  const { navigation } = useThemeSettings(DEFAULT_THEME_NAME);
 
-  if (!prevPage || themeSettings?.navigation?.hide) {
+  if (!prevPage || navigation?.hide) {
     return <div>&nbsp;</div>;
   }
 
-  const label = themeSettings?.navigation?.nextPageLink?.label || `Back to ${prevPage.label}`;
+  const label = navigation?.nextPageLink?.label || `Back to ${prevPage.label}`;
 
   return (
-    <Button
+    <StyledButton
       variant="outlined"
       size="large"
       to={prevPage.link}
       data-component-name="PageNavigation/PreviousPageLink"
     >
       {label}
-    </Button>
+    </StyledButton>
   );
 }
+
+const StyledButton = styled(Button)`
+  font-family: var(--font-family-base);
+`;

package/src/SourceCode/SourceCode.tsx

@@ -1,6 +1,6 @@
 import React from 'react';
 
-import { highlight } from '@theme/utils';
+import { highlight, addLineNumbers } from '@theme/utils';
 import {
   SampleControls,
   SampleControlsWrap,
@@ -8,7 +8,12 @@ import {
 } from '@theme/SamplesPanelControls';
 import { CopyButtonWrapper } from '@theme/CopyButton';
 
-export interface SourceCodeProps {
+interface CommonCodeProps {
+  withLineNumbers?: boolean;
+  startLineNumber?: number;
+}
+
+export interface SourceCodeProps extends CommonCodeProps {
   lang: string;
   source?: string;
   externalSource?: ExternalSource;
@@ -16,6 +21,10 @@ export interface SourceCodeProps {
   dataTestId?: string;
 }
 
+interface CodeProps
+  extends Required<Pick<SourceCodeProps, 'lang' | 'source' | 'dataTestId'>>,
+    CommonCodeProps {}
+
 export interface Sample {
   lang: string;
   label?: string;
@@ -37,10 +46,18 @@ export function Code({
   source,
   lang,
   dataTestId,
-}: Required<Omit<SourceCodeProps, 'externalSource' | 'withCopyButton'>>): JSX.Element {
+  withLineNumbers,
+  startLineNumber,
+}: CodeProps): JSX.Element {
+  const highlightedCode = highlight(source, lang);
+
   return (
     <PreformattedCodeBlock
-      dangerouslySetInnerHTML={{ __html: highlight(source, lang) }}
+      dangerouslySetInnerHTML={{
+        __html: withLineNumbers
+          ? addLineNumbers(highlightedCode, startLineNumber)
+          : highlightedCode,
+      }}
       data-cy={dataTestId}
     />
   );
@@ -52,6 +69,8 @@ export function SourceCode({
   externalSource,
   withCopyButton,
   dataTestId = 'source-code',
+  withLineNumbers,
+  startLineNumber,
 }: SourceCodeProps): JSX.Element {
   const _source = source || externalSource?.sample?.get?.(externalSource) || '';
   if (withCopyButton) {
@@ -60,7 +79,13 @@ export function SourceCode({
         {({ renderCopyButton }) => (
           <SampleControlsWrap>
             <SampleControls data-cy="copy-button">{renderCopyButton()}</SampleControls>
-            <Code lang={lang} source={_source} dataTestId={dataTestId} />
+            <Code
+              lang={lang}
+              source={_source}
+              withLineNumbers={withLineNumbers}
+              startLineNumber={startLineNumber}
+              dataTestId={dataTestId}
+            />
           </SampleControlsWrap>
         )}
       </CopyButtonWrapper>
@@ -72,6 +97,8 @@ export function SourceCode({
       dataTestId={dataTestId}
       lang={lang}
       source={_source}
+      withLineNumbers={withLineNumbers}
+      startLineNumber={startLineNumber}
       data-component-name="SourceCode/SourceCode"
     />
   );

package/src/TableOfContent/TableOfContent.tsx

@@ -19,9 +19,9 @@ export function TableOfContent(props: TableOfContentProps): JSX.Element | null {
   const sidebar = useRef<HTMLDivElement | null>(null);
   useFullHeight(sidebar);
   const activeHeadingId = useActiveHeading(contentWrapper);
-  const { themeSettings } = useThemeSettings(DEFAULT_THEME_NAME);
+  const { toc } = useThemeSettings(DEFAULT_THEME_NAME);
 
-  if (themeSettings?.toc?.hide) {
+  if (toc?.hide) {
     return null;
   }
   if (headings && headings.length === 1 && (!headings[0] || headings[0].depth === 1)) {
@@ -36,7 +36,7 @@ export function TableOfContent(props: TableOfContentProps): JSX.Element | null {
       {headings && (
         <TableOfContentMenu data-component-name="TableOfContent/TableOfContent">
           <TableOfContentItems ref={sidebar}>
-            <TocHeader>{themeSettings?.toc?.header?.label || 'On this page'}</TocHeader>
+            <TocHeader>{toc?.header?.label || 'On this page'}</TocHeader>
             {headings.map((heading: MdHeading | null, idx: number) => {
               // TODO: not sure about !heading
               if (!heading) {

package/src/Typography/Typography.ts

@@ -1,21 +1,29 @@
 import styled from 'styled-components';
-import { color, typography as typographySystem, TypographyProps } from 'styled-system';
 
-export const Typography = styled.p.attrs(() => ({
+export interface TypographyProps {
+  color?: string;
+  fontFamily?: string;
+  fontSize?: string;
+  fontStyle?: string;
+  fontWeight?: string;
+  lineHeight?: string;
+  letterSpacing?: string;
+  marginBottom?: string;
+  marginTop?: string;
+  textAlign?: string;
+}
+
+export const Typography = styled.div.attrs(() => ({
   'data-component-name': 'Typography/Typography',
-}))<
-  TypographyProps & {
-    color?: string;
-    mt?: string;
-    mb?: string;
-  }
->`
-  font-size: var(--font-size-base);
-  font-family: var(--font-family-base);
-  line-height: var(--line-height-base);
-  color: var(--color-content);
-  ${color};
-  margin-top: ${({ mt }) => mt || '1em'};
-  margin-bottom: ${({ mb }) => mb || '1em'};
-  ${typographySystem}
+}))<TypographyProps>`
+  color: ${({ color }) => color || 'var(--color-content)'};
+  font-family: ${({ fontFamily }) => fontFamily || 'var(--font-family-base)'};
+  font-size: ${({ fontSize }) => fontSize || 'var(--font-size-base)'};
+  font-style: ${({ fontStyle }) => fontStyle};
+  font-weight: ${({ fontWeight }) => fontWeight || 'var(--font-weight-regular)'};
+  line-height: ${({ lineHeight }) => lineHeight || 'var(--line-height-base)'};
+  letter-spacing: ${({ letterSpacing }) => letterSpacing};
+  margin-bottom: ${({ marginBottom }) => marginBottom};
+  margin-top: ${({ marginTop }) => marginTop};
+  text-align: ${({ textAlign }) => textAlign};
 `;

package/src/globalStyle.ts

@@ -182,6 +182,10 @@ const typography = css`
 const headingsTypography = css`
   // --h-{css-property-name} is fallback for h1...h6
 
+  * {
+    box-sizing: border-box;
+  }
+
   /**
     * @tokens Typography headings font
     */
@@ -295,6 +299,7 @@ const buttons = css`
     * @tokens Button borders
     */
   --button-border-radius: var(--global-border-radius); // @presenter BorderRadius
+  --button-margin: 5px; // @presenter Margin
   --button-box-shadow: none; // @presenter Shadow
   --button-active-box-shadow: 0px 0px 12px 0px rgba(0, 0, 0, 0.1); // @presenter Shadow
 
@@ -747,6 +752,7 @@ const navbar = css`
   --navbar-item-font-weight: var(--font-weight-bold); // @presenter FontWeight
   --navbar-item-active-background-color: #1b75fa; // @presenter Color
   --navbar-item-active-text-color: var(--navbar-text-color); // @presenter Color
+  --navbar-item-separator-line-color: var(--sidebar-separator-line-color); // @presenter Color
   --navbar-item-active-text-decoration: none;
 
   // @tokens End

package/src/hooks/useActiveSectionId.ts

@@ -1,4 +1,4 @@
-import { Location } from 'history';
+import type { Location } from 'history';
 import { useEffect, useState, useMemo } from 'react';
 import throttle from 'lodash.throttle';
 

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

@@ -1,3 +1,4 @@
+import { PERMISSION_PROP_NAME } from '../../../shared/constants';
 import { MenuStyle } from '../../../shared/types';
 export interface SidebarNavItem {
     label?: string;
@@ -18,7 +19,7 @@ export interface SidebarNavItem {
     target?: string;
     external?: boolean;
     items?: SidebarNavItem[];
-    permission?: string;
+    [PERMISSION_PROP_NAME]?: string;
     menuStyle?: MenuStyle;
     separatorLine?: boolean;
     version?: string;

package/src/types/portal/src/server/constants.d.ts

@@ -5,3 +5,5 @@ export declare enum cliCommandNames {
 export declare const VERSION_SEPARATOR = "@";
 export declare const DEFAULT_VERSION_NAME = "default";
 export declare const VERSIONED_FOLDER_REGEXP_MATCH: RegExp;
+export declare const PORTAL_CONFIG_FILE_NAME = "portal.yaml";
+export declare const JWT_SECRET_KEY: string;

package/src/types/portal/src/server/dev-server/types.d.ts

@@ -0,0 +1,22 @@
+/// <reference types="node" />
+import http from 'http';
+import { MatchFunction } from 'path-to-regexp';
+import { BuildIncremental } from 'esbuild';
+export interface DevServerOptions {
+    clientEsbuild: BuildIncremental;
+    serverEsbuild: BuildIncremental;
+    port?: number;
+}
+export interface EnhancedIncomingMessage extends http.IncomingMessage {
+    pathname: string;
+    params: Record<string, string>;
+    body: string;
+}
+export interface Route {
+    matchPath: MatchFunction<EnhancedIncomingMessage['params']>;
+    handler(req: EnhancedIncomingMessage, res: http.ServerResponse): void;
+}
+export interface Server {
+    httpServer: http.Server;
+    addRoute(path: string, handler: Route['handler']): void;
+}

package/src/types/portal/src/server/plugins/markdown/types.d.ts

@@ -1,4 +1,5 @@
 import { Config, Node, RenderableTreeNode } from '@markdoc/markdoc/dist/src/types';
+import type { PageStaticData } from '../../../shared/types.js';
 import type { ContentProvider, ContentRecord } from '../../content/content-provider.js';
 import { PluginDefaultOptions } from '../types.js';
 import type { RouteDetails } from '../types.js';
@@ -7,16 +8,21 @@ export interface MdHeading {
     value: string;
     depth: number;
 }
-export declare type MarkdownOptions = {
+export declare type RoutesInfoActions = {
     getRouteByFsPath: (relativePath: string) => RouteDetails | undefined;
     getRouteBySlug?: (slug: string) => RouteDetails | undefined;
-    contentProvider: ContentProvider;
 };
-export interface MdPartialsContext {
+export interface MdOptions {
     partials: Record<string, Node>;
+    variables?: Record<string, any>;
 }
-export declare type MdRenderContext = ContentRecord & PluginDefaultOptions & MdPartialsContext;
-export declare type MdCompilationContext = MdRenderContext & MarkdownOptions;
+export declare type MdRenderContext = ContentRecord & PluginDefaultOptions & MdOptions;
+export declare type MdCompilationContext = MdRenderContext & RoutesInfoActions & {
+    contentProvider: ContentProvider;
+};
+export declare type MdProcessContext = PluginDefaultOptions & RoutesInfoActions & {
+    contentProvider: ContentProvider;
+} & MdOptions;
 export interface MdCompilationResult {
     result: RenderableTreeNode;
     headings: MdHeading[];
@@ -24,3 +30,7 @@ export interface MdCompilationResult {
 export interface ExtendedMarkdocConfig extends Config {
     currentProcessedPage?: string;
 }
+export interface MdPageStaticData extends PageStaticData {
+    ast: string;
+    frontmatter: Record<string, unknown>;
+}

package/src/types/portal/src/server/plugins/portal-config/get-frontmatter-keys-to-resolve.d.ts

@@ -0,0 +1,2 @@
+import { PortalConfig } from '../../../shared/models/config.js';
+export declare function getFrontmatterKeysToResolve(config?: PortalConfig): string[];

package/src/types/portal/src/server/plugins/portal-config/types.d.ts

@@ -1,5 +1,5 @@
 import { ResolvedConfigLinks } from '../../../shared/types.js';
-import { PortalConfig, RawTheme } from '../../../shared/models/config.js';
+import { AuthConfig, PortalConfig, RawTheme } from '../../../shared/models/config.js';
 import { Redirect } from '../types';
 export interface GlobalData {
     nav?: ResolvedConfigLinks;
@@ -13,8 +13,12 @@ export interface GlobalConfig {
     stylesheets?: string;
     redirects: Record<string, Redirect>;
     fileName: string;
+    rbac: RbacConfig;
     [k: string]: unknown;
 }
-export declare type RbacConfig = Record<string, string[]>;
+export declare type RbacConfig = {
+    roles: Record<string, string[]>;
+    auth?: AuthConfig;
+};
 export declare type CustomEntryPropertyType = Record<string, string | boolean>;
 export declare type ScriptOrStylesheetConfig = string | CustomEntryPropertyType;

package/src/types/portal/src/server/plugins/reference-docs/utils.d.ts

@@ -0,0 +1,26 @@
+import type { Pagination as PaginationType, IMenuItem, OpenAPIDefinition as IOpenAPIDefinition, MenuItemType } from '@redocly/reference-docs';
+import { RedocProRawOptions } from '@redocly/reference-docs';
+import type { ResolvedNavItem } from '../../../shared/types.js';
+import type { ParsedContentRecord } from '../../content/content-provider.js';
+export interface IMenuItemExtended extends IMenuItem {
+    httpVerb?: string;
+}
+export declare function loadDefinition(content: ParsedContentRecord): Promise<IOpenAPIDefinition | undefined>;
+export declare function convertRedocToSidebar(data: {
+    redocItems: IMenuItemExtended[];
+    sidebarItems: ResolvedNavItem[];
+    parentId?: string;
+    routeSlug: string;
+    pagination: PaginationType;
+}): void;
+export declare const shouldAddPage: ({ pagination, type, }: {
+    pagination: PaginationType;
+    type: MenuItemType;
+}) => boolean;
+export declare const removeMarkdownLinks: (text: string) => string;
+export declare function getConfigByPath(apis: {
+    [x: string]: {
+        root: string;
+        'features.openapi': RedocProRawOptions;
+    };
+} | undefined, path: string): RedocProRawOptions;

package/src/types/portal/src/server/plugins/types.d.ts

@@ -1,24 +1,39 @@
-import type { PageProps, ResolvedNavItem } from '../../shared/types.js';
-import type { Template } from '../store';
+import type { PageProps, PageStaticData, ResolvedNavItem, Version } from '../../shared/types.js';
 import type { ContentProvider } from '../content/content-provider.js';
 import { SearchData, SearchDocument } from '../../shared/models';
-import type { GlobalData, GlobalConfig, RbacConfig } from './portal-config/types.js';
-export declare type DataLoaderContext = {
+import { PERMISSION_PROP_NAME } from '@shared/constants.js';
+import { Store } from '../store.js';
+import type { GlobalData, GlobalConfig } from './portal-config/types.js';
+import { MdOptions } from './markdown/types.js';
+export declare type GetStaticDataContext = {
     getRouteByFsPath: (relativePath: string) => RouteDetails | undefined;
     getRouteBySlug: (relativePath: string) => RouteDetails | undefined;
+    getGlobalConfig<T = unknown>(key: string): T | undefined;
+    getAllRoutes: () => RouteDetails[];
+    contentDir: string;
+    outdir: string;
+};
+export declare type RbacContext = {
+    roles: string[];
+    permissions: string[];
 };
-export declare type DataLoader<T = any> = (contentProvider: ContentProvider, context: DataLoaderContext) => Promise<T>;
-export interface RouteDetails {
+export declare type GetStaticDataFn<TData extends PageStaticData = PageStaticData, TProps extends PageProps = PageProps> = (route: RouteDetails<TData, TProps>, contentProvider: ContentProvider, context: GetStaticDataContext) => Promise<TData>;
+export declare type GetServerPropsContext = {
+    getGlobalConfig<T = unknown>(key: string): T | undefined;
+    getRbacPermissionsByRole: Store['getRbacPermissionsByRole'];
+};
+export declare type GetServerPropsFn<TData extends PageStaticData = PageStaticData, TProps extends PageProps = PageProps> = (route: RouteDetails<TData, TProps>, data: TData, mdOptions: MdOptions) => Promise<TProps>;
+export interface RouteDetails<TData extends PageStaticData = PageStaticData, TProps extends PageProps = PageProps> {
     slug: string;
     fsPath: string;
     templateId: string;
-    dataLoaders: {
-        props: DataLoader<PageProps>;
-        [k: string]: DataLoader;
-    };
+    [PERMISSION_PROP_NAME]?: string;
+    versions?: Version[];
     getNavText?: () => Promise<string>;
     getSidebar?(): ResolvedNavItem[];
     getSearchDocuments?(): Promise<SearchDocument[]>;
+    getStaticData?: GetStaticDataFn<TData, TProps>;
+    serverPropsGetterIds?: string[];
 }
 export interface Redirect {
     to: string;
@@ -32,9 +47,10 @@ export interface PathVersionInfo {
 export interface ProcessContentActions {
     createSharedData(id: string, data: unknown): string;
     addRouteSharedData(slug: string, dataKey: string, dataId: string): void;
+    setGlobalConfig: (data: Partial<GlobalConfig>) => void;
     addRoute: (route: RouteDetails) => void;
-    createTemplate: (template: Template) => Template;
-    setRbacConfig: (rbacConfig: RbacConfig) => void;
+    createTemplate: (id: string, importPath: string) => string;
+    registerServerPropsGetter: (id: string, importPath: string) => string;
 }
 export interface AfterRoutesCreatedActions {
     createSharedData(id: string, data: unknown): string;
@@ -47,6 +63,7 @@ export interface AfterRoutesCreatedActions {
     setSearchData: (data: SearchData) => void;
     addRedirect: (from: string, to: Redirect) => void;
     contentDir: string;
+    outdir: string;
 }
 export interface PluginInstance {
     watch?: RegExp;