theme: separate out base theme constructs

Signed-off-by: Patrik Oldsberg <poldsberg@gmail.com>

packages/theme/src/base/createBaseThemeOptions.ts

@@ -14,8 +14,8 @@
  * limitations under the License.
  */
 
-import { PageTheme, PageThemeSelector } from '../types';
-import { pageTheme as defaultPageThemes } from '../pageTheme';
+import { PageTheme, PageThemeSelector } from './types';
+import { pageTheme as defaultPageThemes } from './pageTheme';
 
 const DEFAULT_HTML_FONT_SIZE = 16;
 const DEFAULT_FONT_FAMILY =
@@ -55,35 +55,35 @@ export function createBaseThemeOptions<PaletteOptions>(
     typography: {
       htmlFontSize,
       fontFamily,
-      h6: {
+      h1: {
+        fontSize: 54,
         fontWeight: 700,
-        fontSize: 20,
-        marginBottom: 2,
-      },
-      h5: {
-        fontWeight: 700,
-        fontSize: 24,
-        marginBottom: 4,
-      },
-      h4: {
-        fontWeight: 700,
-        fontSize: 28,
-        marginBottom: 6,
-      },
-      h3: {
-        fontSize: 32,
-        fontWeight: 700,
-        marginBottom: 6,
+        marginBottom: 10,
       },
       h2: {
         fontSize: 40,
         fontWeight: 700,
         marginBottom: 8,
       },
-      h1: {
-        fontSize: 54,
+      h3: {
+        fontSize: 32,
         fontWeight: 700,
-        marginBottom: 10,
+        marginBottom: 6,
+      },
+      h4: {
+        fontWeight: 700,
+        fontSize: 28,
+        marginBottom: 6,
+      },
+      h5: {
+        fontWeight: 700,
+        fontSize: 24,
+        marginBottom: 4,
+      },
+      h6: {
+        fontWeight: 700,
+        fontSize: 20,
+        marginBottom: 2,
       },
     },
     page: pageTheme[defaultPageTheme],

packages/theme/src/base/index.ts

@@ -0,0 +1,23 @@
+/*
+ * Copyright 2022 The Backstage Authors
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *     http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+
+export { createBaseThemeOptions } from './createBaseThemeOptions';
+export { colorVariants, genPageTheme, pageTheme, shapes } from './pageTheme';
+export type {
+  BackstagePaletteAdditions,
+  PageTheme,
+  PageThemeSelector,
+} from './types';

packages/theme/src/compat/UnifiedTheme.tsx

@@ -28,9 +28,9 @@ import {
   ThemeOptions as ThemeOptionsV5,
 } from '@mui/material/styles';
 import { transformV5ComponentThemesToV4 } from './overrides';
-import { PageTheme } from '../types';
+import { PageTheme } from '../base/types';
 import { defaultComponentThemes } from '../v5';
-import { createBaseThemeOptions } from './createBaseThemeOptions';
+import { createBaseThemeOptions } from '../base/createBaseThemeOptions';
 import { UnifiedTheme } from './types';
 
 export class UnifiedThemeHolder implements UnifiedTheme {

packages/theme/src/index.ts

@@ -21,14 +21,9 @@
  */
 
 export * from './compat';
+export * from './base';
 export * from './v4';
 export * from './v5';
-export { colorVariants, genPageTheme, pageTheme, shapes } from './pageTheme';
-export type {
-  BackstagePaletteAdditions,
-  PageTheme,
-  PageThemeSelector,
-} from './types';
 
 import {
   createV4Theme,

packages/theme/src/v4/baseTheme.ts

@@ -18,7 +18,7 @@ import { createTheme as createMuiTheme } from '@material-ui/core/styles';
 import { Theme, ThemeOptions } from '@material-ui/core';
 import { darken, lighten } from '@material-ui/core/styles/colorManipulator';
 import { Overrides } from '@material-ui/core/styles/overrides';
-import { pageTheme as defaultPageThemes } from '../pageTheme';
+import { pageTheme as defaultPageThemes } from '../base/pageTheme';
 import { SimpleV4ThemeOptions } from './types';
 
 const DEFAULT_HTML_FONT_SIZE = 16;

packages/theme/src/v4/themes.ts

@@ -15,7 +15,7 @@
  */
 
 import { createV4Theme } from './baseTheme';
-import { pageTheme } from '../pageTheme';
+import { pageTheme } from '../base/pageTheme';
 import { yellow } from '@material-ui/core/colors';
 
 /**

packages/theme/src/v4/types.ts

@@ -24,7 +24,7 @@ import {
   BackstageThemeAdditions,
   PageTheme,
   PageThemeSelector,
-} from '../types';
+} from '../base/types';
 
 /**
  * The full Backstage palette.

packages/theme/src/v5/types.ts

@@ -19,7 +19,7 @@ import {
   BackstagePaletteAdditions,
   BackstageThemeAdditions,
   PageTheme,
-} from '../types';
+} from '../base/types';
 
 /**
  * A simpler configuration for creating a new theme that just tweaks some parts