@docusaurus/theme-common 2.0.0-beta.ff31de0ff → 2.0.1

package/src/utils/useThemeConfig.ts

@@ -4,9 +4,11 @@
  * This source code is licensed under the MIT license found in the
  * LICENSE file in the root directory of this source tree.
  */
+
 import useDocusaurusContext from '@docusaurus/useDocusaurusContext';
-import {PrismTheme} from 'prism-react-renderer';
-import {CSSProperties} from 'react';
+import type {PrismTheme} from 'prism-react-renderer';
+import type {DeepPartial} from 'utility-types';
+import type {MagicCommentConfig} from './codeBlockUtils';
 
 export type DocsVersionPersistence = 'localStorage' | 'none';
 
@@ -16,19 +18,25 @@ export type NavbarItem = {
   items?: NavbarItem[];
   label?: string;
   position?: 'left' | 'right';
-};
+} & {[key: string]: unknown};
 
-export type NavbarLogo = {
+type BaseLogo = {
+  alt?: string;
   src: string;
   srcDark?: string;
   href?: string;
+  width?: string | number;
+  height?: string | number;
   target?: string;
-  alt?: string;
+  style?: object;
+  className?: string;
 };
 
+export type NavbarLogo = BaseLogo;
+
 // TODO improve
 export type Navbar = {
-  style: 'dark' | 'primary';
+  style?: 'dark' | 'primary';
   hideOnScroll: boolean;
   title?: string;
   items: NavbarItem[];
@@ -39,12 +47,6 @@ export type ColorModeConfig = {
   defaultMode: 'light' | 'dark';
   disableSwitch: boolean;
   respectPrefersColorScheme: boolean;
-  switchConfig: {
-    darkIcon: string;
-    darkIconStyle: CSSProperties;
-    lightIcon: string;
-    lightIconStyle: CSSProperties;
-  };
 };
 
 export type AnnouncementBarConfig = {
@@ -56,10 +58,11 @@ export type AnnouncementBarConfig = {
 };
 
 export type PrismConfig = {
-  theme?: PrismTheme;
+  theme: PrismTheme;
   darkTheme?: PrismTheme;
   defaultLanguage?: string;
-  additionalLanguages?: string[];
+  additionalLanguages: string[];
+  magicComments: MagicCommentConfig[];
 };
 
 export type FooterLinkItem = {
@@ -68,26 +71,42 @@ export type FooterLinkItem = {
   href?: string;
   html?: string;
   prependBaseUrlToHref?: string;
-};
-export type FooterLinks = {
-  title?: string;
-  items: FooterLinkItem[];
-};
-export type Footer = {
+} & {[key: string]: unknown};
+
+export type FooterLogo = BaseLogo;
+
+export type FooterBase = {
   style: 'light' | 'dark';
-  logo?: {
-    alt?: string;
-    src?: string;
-    srcDark?: string;
-    href?: string;
-  };
+  logo?: FooterLogo;
   copyright?: string;
-  links: FooterLinks[];
 };
 
+export type MultiColumnFooter = FooterBase & {
+  links: {
+    title: string | null;
+    items: FooterLinkItem[];
+  }[];
+};
+
+export type SimpleFooter = FooterBase & {
+  links: FooterLinkItem[];
+};
+
+export type Footer = MultiColumnFooter | SimpleFooter;
+
+export type TableOfContents = {
+  minHeadingLevel: number;
+  maxHeadingLevel: number;
+};
+
+// Theme config after validation/normalization
 export type ThemeConfig = {
   docs: {
     versionPersistence: DocsVersionPersistence;
+    sidebar: {
+      hideable: boolean;
+      autoCollapseCategories: boolean;
+    };
   };
 
   // TODO we should complete this theme config type over time
@@ -100,10 +119,17 @@ export type ThemeConfig = {
   announcementBar?: AnnouncementBarConfig;
   prism: PrismConfig;
   footer?: Footer;
-  hideableSidebar: boolean;
-  image: string;
+  image?: string;
+  metadata: {[key: string]: string}[];
+  tableOfContents: TableOfContents;
 };
 
+// User-provided theme config, unnormalized
+export type UserThemeConfig = DeepPartial<ThemeConfig>;
+
+/**
+ * A convenient/more semantic way to get theme config from context.
+ */
 export function useThemeConfig(): ThemeConfig {
   return useDocusaurusContext().siteConfig.themeConfig as ThemeConfig;
 }