fixup! feat!: Paragon 23 and External CSS support

Author: arbrandes

docs/how_tos/theming.md

@@ -87,7 +87,7 @@ with the following:
 | `variants.light`                    | Object    | Metadata about the theme's light variant styles.                                        |
 | `variants.light.url`                | String    | URL for the theme's light variant stylesheet.                                           |
 | `variants.dark`                     | Object    | Metadata about the theme's dark variant styles.                                         |
-| `variants.dark.url`                 | String    | URL for the theme's dark variant styles.                                                |
+| `variants.dark.url`                 | String    | URL for the theme's dark variant stylesheet.                                                |
 
 The `dark` theme variant is optional.
 

runtime/react/hooks/theme/useThemeConfig.test.ts

@@ -24,7 +24,7 @@ describe('useThemeConfig', () => {
   });
 
   describe('when `siteConfig.theme` is present', () => {
-    it('returns empty object if at least one variant is not defined', () => {
+    it('returns empty object if core is not defined and no variants are defined', () => {
       jest.spyOn(config, 'getSiteConfig').mockReturnValue({
         ...baseSiteConfig,
         theme: {
@@ -35,7 +35,25 @@ describe('useThemeConfig', () => {
       const { result } = renderHook(() => useThemeConfig());
       expect(result.current).toStrictEqual({});
     });
-    it('returns expected object when nothing but the light variant is defined', () => {
+    it('returns expected object when only core is defined', () => {
+      jest.spyOn(config, 'getSiteConfig').mockReturnValue({
+        ...baseSiteConfig,
+        theme: {
+          core: {
+            url: 'core.css',
+          },
+        },
+      });
+      const { result } = renderHook(() => useThemeConfig());
+      expect(result.current).toStrictEqual({
+        core: {
+          url: 'core.css',
+        },
+        defaults: undefined,
+        variants: undefined,
+      });
+    });
+    it('returns expected object when only a light variant is defined', () => {
       jest.spyOn(config, 'getSiteConfig').mockReturnValue({
         ...baseSiteConfig,
         theme: {
@@ -53,7 +71,6 @@ describe('useThemeConfig', () => {
         }
       });
     });
-
     it('returns expected object when configuration is valid', () => {
       jest.spyOn(config, 'getSiteConfig').mockReturnValue({
         ...baseSiteConfig,

runtime/react/hooks/theme/useThemeConfig.ts

@@ -13,8 +13,8 @@ import { isEmptyObject } from './utils';
  *
  * const themeConfig = useThemeConfig();
  * if (themeConfig) {
- *   console.log(themeConfig.core.url); // Outputs the URL of the brand theme CSS
- *   console.log(themeConfig.variants['dark'].url); // Outputs the URL of the dark theme variant CSS
+ *   console.log(themeConfig.core.url); // Outputs the URL of theme's core CSS
+ *   console.log(themeConfig.variants['dark'].url); // Outputs the URL of the theme's dark variant CSS
  * }
  */
 const useThemeConfig = (): Theme => useMemo(() => {

runtime/react/hooks/theme/useThemeVariants.ts

@@ -74,7 +74,7 @@ const useThemeVariants = ({
 
     // Iterate over each theme variant URLs and inject them into the HTML document, if each doesn't already exist.
     Object.entries(themeVariants).forEach(([themeVariant, { url }]) => {
-      // If there is no config for the theme variant URL, set the theme variant to complete and continue.
+      // If the config for the theme variant does not have a URL, set the variant to complete and continue.
       if (!url) {
         setIsThemeVariantComplete(true);
         return;

runtime/testing/mockMessages.ts

@@ -18,7 +18,6 @@ const messages = {
   ru: {},
   th: {},
   uk: {},
-  vi: {},
 };
 
 export default messages;