JupyteLab Theme + Remove Storybook from jupyter-react package (#352)

* docs: yarn

* fix: lint

* theme

* storybook: rm from react

* lint

* example: theme

* fix: theme

* fix: css

Author: echarles

docs/docs/develop/dev-environment/index.mdx

@@ -4,6 +4,27 @@
 
 🚨 Only Yarn v3 is supported - npm, pnpm, yarn v1... will not work, this is due to JupyterLab requirements.
 
+Create a `.yarnrc.yml` file in the root of your project to use `node_modules`.
+
+```yaml
+enableImmutableInstalls: false
+enableInlineBuilds: false
+enableTelemetry: false
+httpTimeout: 60000
+nodeLinker: node-modules
+npmRegistryServer: "https://registry.yarnpkg.com"
+
+# This will fix the build error with @lerna/legacy-package-management
+# See https://github.com/lerna/repro/pull/11
+packageExtensions:
+  "@lerna/legacy-package-management@*":
+    dependencies:
+      "@lerna/child-process": "*"
+      "js-yaml": "*"
+      "rimraf": "*"
+    peerDependencies:
+      "nx": "*"
+```
 :::
 
 Choose the way you want to develop Jupyter UI:

packages/react/.storybook/custom.css

@@ -1,6 +1,6 @@
 {
   "name": "@datalayer/jupyter-react",
-  "version": "0.19.3",
+  "version": "0.19.7",
   "description": "Jupyter React - React.js components 100% compatible with Jupyter.",
   "license": "MIT",
   "main": "lib/index.js",
@@ -59,10 +59,7 @@
     "typedoc": "typedoc ./src",
     "watch": "run-p watch:src watch:labextension",
     "watch:labextension": "jupyter labextension watch .",
-    "watch:src": "tsc -w",
-    "storybook": "storybook dev -p 6006",
-    "storybook:ci": "storybook dev -p 6006 --ci --quiet",
-    "build:storybook": "storybook build"
+    "watch:src": "tsc -w"
   },
   "dependencies": {
     "@codemirror/lang-python": "^6.0.1",
@@ -170,16 +167,6 @@
     "@mermaid-js/mermaid-zenuml": "0.2.0",
     "@playwright/test": "^1.40.1",
     "@primer/octicons-react": "^19.8.0",
-    "@storybook/addon-essentials": "^8.0.10",
-    "@storybook/addon-interactions": "^8.0.10",
-    "@storybook/addon-links": "^8.0.10",
-    "@storybook/addon-onboarding": "^8.0.10",
-    "@storybook/addon-themes": "^8.0.10",
-    "@storybook/blocks": "^8.0.10",
-    "@storybook/manager-api": "^8.0.10",
-    "@storybook/react": "^8.0.10",
-    "@storybook/react-webpack5": "^8.0.10",
-    "@storybook/test": "^8.0.10",
     "@types/codemirror": "^5.60.4",
     "@types/jest": "^29.4.0",
     "@types/marked": "^4.0.1",
@@ -218,7 +205,6 @@
     "process": "^0.11.10",
     "rimraf": "^3.0.2",
     "source-map-loader": "^5.0.0",
-    "storybook": "^8.0.10",
     "stream": "^0.0.2",
     "stream-browserify": "^2.0.2",
     "style-loader": "^2.0.0",
@@ -295,7 +281,6 @@
     "**/*.d.ts",
     "tests",
     "**/__tests__",
-    "stories",
     "playwright.config.ts"
   ],
   "eslintConfig": {

packages/react/.storybook/main.ts

@@ -501,13 +501,11 @@ export const Notebook = (props: INotebookProps) => {
             );
           })}
         </Box>
-        {/* {isLoading ? (
+        {isLoading ?
           <Loader />
-        ) : (
+        :
           <Box>{adapter && <Lumino id={id}>{adapter.panel}</Lumino>}</Box>
-        )} */}
-        <Loader />
-        <Box>{adapter && <Lumino id={id}>{adapter.panel}</Lumino>}</Box>
+        }
       </Box>
     </Box>
   );