Merge pull request #132 from fcollonval/ft/apply-jp-theme-to-primer-r…

…eact First iteration to sync primer react with JupyterLab theme
datalayer · Dec 15, 2023 · f9091ad · f9091ad
2 parents 1e00076 + 2719398
commit f9091ad
Show file tree

Hide file tree

Showing 3 changed files with 598 additions and 1 deletion.
diff --git a/packages/react/package.json b/packages/react/package.json
@@ -128,6 +128,7 @@
     "@jupyterlab/translation-extension": "4.0.3",
     "@jupyterlab/ui-components-extension": "4.0.3",
     "@lumino/default-theme": "2.1.2",
+    "@primer/react": "0.0.0-20230912151940",
     "assert": "2.0.0",
     "bufferutil": "4.0.7",
     "codemirror": "6.0.1",

diff --git a/packages/react/src/jupyter/Jupyter.tsx b/packages/react/src/jupyter/Jupyter.tsx
@@ -12,6 +12,7 @@ import JupyterLabCss  from './lab/JupyterLabCss';
 import { getJupyterServerHttpUrl, getJupyterServerWsUrl, loadJupyterConfig } from './JupyterConfig';
 import defaultInjectableStore, { InjectableStore } from '../state/redux/Store';
 import { JupyterLabTheme } from "./lab/JupyterLabTheme";
+import defaultTheme from './theme';
 
 /**
  * Definition of the properties that can be passed
@@ -67,7 +68,7 @@ export const Jupyter = (props: JupyterProps) => {
       FallbackComponent={ErrorFallback}
       onReset={() => { console.log('Error Boundary reset has been invoked...'); }}
     >
-      <ThemeProvider colorMode={theme === 'light' ? "day" : "night"} dayScheme="light" nightScheme="dark_high_contrast">
+      <ThemeProvider theme={defaultTheme} colorMode={theme === 'light' ? 'day' : 'night'} dayScheme='jupyter' nightScheme='jupyter'>
         <BaseStyles>
           <Box color="fg.default" bg="canvas.default">
             { !config.insideJupyterLab && !disableCssLoading && <JupyterLabCss theme={theme}/> }