diff --git a/docs/02advanced/01life-game/index.mdx b/docs/02advanced/01life-game/index.mdx
index 7eba32fa8..1a3902bb8 100644
--- a/docs/02advanced/01life-game/index.mdx
+++ b/docs/02advanced/01life-game/index.mdx
@@ -80,7 +80,7 @@ import LifeGame from "@site/src/components/LifeGame/LifeGame";
## ライフゲームで遊んでみる
-ライフゲームを簡単に遊べるプログラムを作ってみました。下のマスをクリックすると、マスの色を反転することができます。これで少し遊ぶことでライフゲームの仕組みを理解してください。
+ライフゲームを簡単に遊べるプログラムを作ってみました。下のマスをクリックまたはタッチすると、マスの色を反転することができます。これで少し遊ぶことでライフゲームの仕組みを理解してください。
diff --git a/docs/03extras/04website/01npm/index.mdx b/docs/03extras/04website/01npm/index.mdx
index 99048327e..c81ecca04 100644
--- a/docs/03extras/04website/01npm/index.mdx
+++ b/docs/03extras/04website/01npm/index.mdx
@@ -9,7 +9,7 @@ import installCurl from "./install_curl.mp4";
## npm のインストール方法
-このシケプリは、Docusaurus という静的サイトジェネレーターを使っています。Docusaurus をインストールするには npm(Node Package Manager)というパッケージ管理ツールが必要です。また、他に必要なパッケージをインストールする時にも必須となります。npm は JavaScript の開発者によく使われています。
+このシケプリは、Docusaurus という静的サイトジェネレーターを使っています。Docusaurus を使うには npm(Node Package Manager)というパッケージ管理ツールが必要です。また、他に必要なパッケージをインストールする時にも必須となります。npm は JavaScript の開発者によく使われています。
下の動画を見ながら、インストールしてください。以下に概要を記しておきます。
@@ -17,43 +17,43 @@ import installCurl from "./install_curl.mp4";
- [nvm のウェブサイトの Install & Update Script の項](https://github.com/nvm-sh/nvm#install--update-script)に書かれているスクリプトをターミナル上で実行しましょう。次のようなスクリプトが書いてあるはずです。2022 年 11 月現在
-```shell
-curl -o- https://raw.githubusercontent.com/nvm-sh/nvm/v0.39.2/install.sh | bash
-```
+ ```shell
+ curl -o- https://raw.githubusercontent.com/nvm-sh/nvm/v0.39.2/install.sh | bash
+ ```
- ターミナルを再起動しましょう。ターミナル上で `exit` と入力して、ターミナルをもう一度開くことで再起動ができます。※ターミナルを再起動させないと次のコマンドを実行したときにエラーが出ます。
- 次のコマンドを実行してください。これは、nvm のバージョンを確認するコマンドです。
-```shell
-nvm -v
-```
+ ```shell
+ nvm -v
+ ```
- 次のように表示されたら、成功です。※2022 年 11 月現在
-```shell
-0.39.2
-```
+ ```shell
+ 0.39.2
+ ```
次に、nvm を用いて Node.js の安定版(LTS)をインストールします。
- 次のコマンドを実行してください。これは、Node.js の安定版(LTS)をインストールするコマンドです。
-```shell
-nvm install --lts
-```
+ ```shell
+ nvm install --lts
+ ```
- 次のコマンドを実行してください。これは、Node.js のバージョンを確認するコマンドです。
-```shell
-node -v
-```
+ ```shell
+ node -v
+ ```
- 次のように表示されたら、成功です。※2022 年 11 月現在
-```shell
-v18.12.1
-```
+ ```shell
+ v18.12.1
+ ```
@@ -64,6 +64,12 @@ v18.12.1
sudo apt -y install curl
```
+macOS の場合は、次のコマンドで curl をインストールできます。
+
+```shell
+brew install curl
+```
+
:::
diff --git a/docs/03extras/04website/02docusaurus/index.mdx b/docs/03extras/04website/02docusaurus/index.mdx
index 8a3b38da1..0911c8b5e 100644
--- a/docs/03extras/04website/02docusaurus/index.mdx
+++ b/docs/03extras/04website/02docusaurus/index.mdx
@@ -2,6 +2,7 @@
sidebar_position: 2
---
+import BrowserWindow from "@site/src/components/BrowserWindow";
import installDocusaurus from "./install_docusaurus.mp4";
import editDocusaurus from "./edit_docusaurus.mp4";
import LifeGame from "@site/src/components/LifeGame/LifeGame";
@@ -10,27 +11,27 @@ import LifeGame from "@site/src/components/LifeGame/LifeGame";
## Docusaurus のインストール方法
-ここでは、Docusaurus という静的サイトジェネレーターを使って実際にウェブサイトを作ってみます。Docusaurus は、さきほどインストールした npm を使うとコマンド一つで使うことができます。実は、npm を使えば、Docusaurus 以外にも様々なものをコマンド一つで簡単にインストールできます。下の動画を見ながら、インストールしてください。以下に概要を記しておきます。
+ここでは、Docusaurus という静的サイトジェネレーターを使って実際にウェブサイトを作ってみます。Docusaurus は、さきほどインストールした npm を使うとコマンド一つで使うことができます。実は、npm を使えば、Docusaurus 以外にも様々なものをコマンド一つで簡単にインストールできます。下の動画を見ながら、Docusaurus のプロジェクトを作成してください。以下に概要を記しておきます。
-- まず、適当に `projects` ファルダを作成して、ターミナルを起動してください。
+- まず、適当なフォルダ例えば `projects` フォルダを作成して、ターミナルを起動してください。
- ここで、次のコマンドを実行すると、Docusaurus のプロジェクトを作成することができます。(`my-website` のところを任意の文字にすることでプロジェクト名を決めることができます。)
-```shell
-npx create-docusaurus@latest my-website classic
-```
+ ```shell
+ npx create-docusaurus@latest my-website classic
+ ```
- `Ok to proceed? (y)` と聞かれるので、`y` と入力して `Enterキー` を押します。
- 次のコマンドを順に実行します。すると、ブラウザが自動的に開き、デフォルトのウェブサイトが現れます。
-```shell
-cd my-website
-```
+ ```shell
+ cd my-website
+ ```
-```shell
-npm start
-```
+ ```shell
+ npm start
+ ```
@@ -40,22 +41,22 @@ npm start
- まず、ターミナル上で `Ctrlキー` と `C` を同時に押して、先程起動した Docusaurus のサーバーを終了してください。
-- 次に、先程作成した Docusaurus のプロジェクトを VSCode で開きます。
+- 次に、先程作成した Docusaurus のプロジェクトフォルダを VSCode で開きます。
- ターミナルを起動します。
- もう一度次のコマンドを実行して、Docusaurus のサーバーを起動します。先程のようにブラウザが自動的に開きます。
-```shell
-npm start
-```
+ ```shell
+ npm start
+ ```
- では、実際に編集してみましょう。今回は、チュートリアルのはじめのページを編集してみます。`docs` ファルダの中の `intro.md` というフォルダを開いて、上から 5 行目の `# Tutorial Intro` というところを `# Hello from Docusaurus` と書き換えてみましょう。(先頭に `#` と書いてあるのは、ここは見出しだという命令です。実は、Docusaurus は Markdown という非常に簡単な形式で書くことができます。)ブラウザを見ると、自動で編集した内容がプレビューされているはずです。
:::info
-先程、Docusaurus は Markdown という形式で書くことができると書きました。ここで、Markdown 記法について少し紹介しておきます。詳しいことは、自分で調べてみてください。
+先程、Docusaurus は Markdown という形式で書くことができると書きました。ここで、Markdown 記法について少し紹介しておきます。より詳しいことは、自分で調べてみてください。
1. `#` と書くことで見出しを書くことができます。
@@ -63,31 +64,47 @@ npm start
# レベル 1 の見出し
```
+
+
# レベル 1 の見出し
+
+
2. `##` は `#` の一個下の見出しです。
```markdown
## レベル 2 の見出し
```
+
+
## レベル 2 の見出し
+
+
3. `**` で強調することができます。
```markdown
**強調**
```
+
+
**強調**
+
+
4. `>` とすることで引用することができます。
```markdown
- > hoge
+ > 引用
```
- > hoge
+
+
+ > 引用
+
+
5. 箇条書きは次のようにして書けます。
@@ -97,12 +114,16 @@ npm start
- アイテム 3
```
+
+
+
+
6. 番号付き箇条書きは次のようにして書けます。
```markdown
@@ -111,20 +132,28 @@ npm start
1. アイテム 3
```
+
+
- アイテム 1
- アイテム 2
- アイテム 3
+
+
7. バッククォート( `` ` `` )で囲むことでインラインコードを表示することができます。
```markdown
`コードテキスト`
```
+
+
`コードテキスト`
+
+
8. バッククォート 3 つで、コードブロックを表示することができます。
````markdown
@@ -133,55 +162,73 @@ npm start
```
````
+
+
```python
print("Hello World!")
```
+
+
9. リンクは次のようにして表すことができます。
```markdown
[Introduction to Algorithms](https://sikepuri-algorithm.github.io/)
```
+
+
[Introduction to Algorithms](https://sikepuri-algorithm.github.io/)
+
+
10. 画像は次のようにして表示することができます。もちろん相対パスも使えます。
```markdown

```
+
+

+
+
11. 実は、Markdown の中には HTML も書くことができます。
```markdown
```
+
+
+
+
:::
:::info
-実は、Docusaurus は Markdown だけでなく MDX でも書くことができます。MDX は、Markdown の中で JSX 記法 を使えるものです。JSX 記法 は、JavaScript の中に HTML を書くことができるものですが、なかなか奥が深くここでは説明できないので、自分で調べてみてください。
+実は、Docusaurus は Markdown だけでなく MDX でも書くことができます。MDX は、Markdown の中で JSX 記法 を使えるものです。JSX 記法 は、JavaScript の中に HTML を書くことができるものですが、JavaScript や HTML の知識が必要になるので、自分で調べてみてください。
-ちなみに、このシケプリではライフゲームのコンポーネントを作ったので、それを使うときはファイルの先頭で次のようにインポートしてから、次のように書くだけでライフゲームを表示できます w
+JavaScript を文書の中に書くことができるので、例えば次のような表現が可能です。
+
+```mdx live
+<>{2 * Math.PI}>
+```
+
+ちなみに、このシケプリではライフゲームのコンポーネントを作ったので、それを使うときはファイルの先頭で次のようにインポートしてから、次のように書くだけでライフゲームを表示できます(笑)
```markdown
import LifeGame from "@site/src/components/LifeGame/LifeGame";
```
-```mdx
+```mdx live
```
-
-
-
-
:::
diff --git a/docs/03extras/04website/03GitHub/index.mdx b/docs/03extras/04website/03GitHub/index.mdx
index 5c0cd391f..22996d2e6 100644
--- a/docs/03extras/04website/03GitHub/index.mdx
+++ b/docs/03extras/04website/03GitHub/index.mdx
@@ -61,7 +61,7 @@ GitHub はソースコードのホスティングサービスです。Git とい
cat id_ed25519.pub
```
-- 公開鍵をコピーしましょう。(動画では、`ssh-ed25519 AAAAC3NzaC1lZDI1NTE5AAAAIFwrVCiY5VvBvo5VRDIzkFZa0eprytqHmoWBS2GBbGpT`)
+- 公開鍵をコピーしましょう。(動画では、`ssh-ed25519 AAAA...bGpT`)
- GitHub で `Settings`、`SSH and GPG keys`、`SSH keys` の中の `New SSH key` をクリックして、`Title` に適当な名前、`Key` に先程コピーした公開鍵を入力して、`Add SSH key` をクリックすると GitHub に公開鍵が登録できます。
@@ -73,19 +73,19 @@ GitHub はソースコードのホスティングサービスです。Git とい
作成が終わったら、`SSH` をクリックして、右側にある文字をコピーしましょう。※`SSH` をクリックし忘れないように気をつけてください。
-次に、作成した Docusaurus のプロジェクトフォルダを VSCode で開いてそこで、次のコマンドを実行してください。
+次に、作成した Docusaurus のプロジェクトフォルダを VSCode で開いてそこで、次のコマンドを実行してください。これは、リポジトリをローカル上に作成する命令です。
```shell
git init
```
-次に、次のコマンドを実行して、先程作ったリポジトリとパソコン上のリポジトリを紐付けてください。
+次に、次のコマンドを実行して、先程作った GitHub 上で作ったリポジトリとローカル上のリポジトリを紐付けてください。
```shell
git remote add origin 先程コピーした文字
```
-次に、ステージングしましょう。これで、どのファイルを Git 上で管理するか決めることができます。`-A` はすべてを管理する命令です。`git add ファイル名` などのようにして個別にすることもできます。
+次に、ステージングしましょう。これは、どのファイルを Git 上で管理するか決めることができるコマンドです。`-A` はすべてを管理する命令です。`git add ファイル名` などのようにして個別に Git の管理下に含めることもできます。
```shell
git add -A
@@ -99,4 +99,6 @@ git commit -m "first commit"
最後に、ローカルのブランチをリモートリポジトリにプッシュしましょう。一回目だと、`Are you sure you want to continue connecting (yes/no/[fingerprint])?` と聞かれるので、`yes` と入力しましょう。これで、GitHub を開くと、ローカルのファイルが GitHub に保存されたことがわかります。
+一般的な開発では、ステージングとコミットを繰り返して、時々プッシュしていくような流れになります。
+
diff --git a/docs/03extras/04website/04deploy/index.mdx b/docs/03extras/04website/04deploy/index.mdx
index ee2abef10..92254b1ec 100644
--- a/docs/03extras/04website/04deploy/index.mdx
+++ b/docs/03extras/04website/04deploy/index.mdx
@@ -7,7 +7,7 @@ import deploy from "./deploy.mp4";
# Render にデプロイ
-Render は様々な Web アプリを簡単にデプロイできるプラットフォームです。実は、このシケプリは GitHub Pages を使っているのですが、GitHub Pages はソースコードを公開しないと使えないので、こちらを紹介しておきます。
+Render は様々な Web アプリを簡単にデプロイできるプラットフォームです。実は、このシケプリは Render ではなく GitHub Pages を使っているのですが、GitHub Pages はソースコードを公開しないと使えないので、こちらを紹介しておきます。
## Render の登録
@@ -17,8 +17,12 @@ Render は様々な Web アプリを簡単にデプロイできるプラット
## Render にデプロイ
-初めて使うときは、次の動画を参考に GitHub の連携をしないといけません。
+初めて使うときは、次の動画のように GitHub の連携をしないといけません。
-連携ができたら、動画のように入力してください。成功すると、用意された URL に作成した Web ページが表示されます。これは、世界中の人が URL を知っていればアクセスできます。
+連携ができたら、次のように入力してください。
+
+`Name` に好きな名前、`Build Command` に `npm ci && npm run build`、`Publish directory` に `build` と入力してください。
+
+成功すると、用意された URL に作成した Web ページが表示されます。これは、世界中の人が URL を知っていればアクセスできます。
diff --git a/docusaurus.config.js b/docusaurus.config.js
index 6a4996622..5e6a22415 100644
--- a/docusaurus.config.js
+++ b/docusaurus.config.js
@@ -144,6 +144,7 @@ const config = {
darkTheme: darkCodeTheme,
},
}),
+ themes: ["@docusaurus/theme-live-codeblock"],
};
module.exports = config;
diff --git a/package-lock.json b/package-lock.json
index 8e65221d5..50ba4791c 100644
--- a/package-lock.json
+++ b/package-lock.json
@@ -10,6 +10,7 @@
"dependencies": {
"@docusaurus/core": "^2.2.0",
"@docusaurus/preset-classic": "^2.2.0",
+ "@docusaurus/theme-live-codeblock": "^2.2.0",
"@emotion/react": "^11.10.5",
"@emotion/styled": "^11.10.5",
"@mdx-js/react": "^1.6.22",
@@ -2574,6 +2575,29 @@
"react-dom": "^16.8.4 || ^17.0.0"
}
},
+ "node_modules/@docusaurus/theme-live-codeblock": {
+ "version": "2.2.0",
+ "resolved": "https://registry.npmjs.org/@docusaurus/theme-live-codeblock/-/theme-live-codeblock-2.2.0.tgz",
+ "integrity": "sha512-4XRFxfZGcyqmbLmNbnbZ2ZOsoY7FYCJUZKsYW5yzhZYjmjGg7lkdJH5trt9otUoKBsZopBpPWvcDZwCu1SENYg==",
+ "dependencies": {
+ "@docusaurus/core": "2.2.0",
+ "@docusaurus/theme-common": "2.2.0",
+ "@docusaurus/theme-translations": "2.2.0",
+ "@docusaurus/utils-validation": "2.2.0",
+ "@philpl/buble": "^0.19.7",
+ "clsx": "^1.2.1",
+ "fs-extra": "^10.1.0",
+ "react-live": "2.2.3",
+ "tslib": "^2.4.0"
+ },
+ "engines": {
+ "node": ">=16.14"
+ },
+ "peerDependencies": {
+ "react": "^16.8.4 || ^17.0.0",
+ "react-dom": "^16.8.4 || ^17.0.0"
+ }
+ },
"node_modules/@docusaurus/theme-search-algolia": {
"version": "2.2.0",
"resolved": "https://registry.npmjs.org/@docusaurus/theme-search-algolia/-/theme-search-algolia-2.2.0.tgz",
@@ -3481,6 +3505,171 @@
"node": ">= 8"
}
},
+ "node_modules/@philpl/buble": {
+ "version": "0.19.7",
+ "resolved": "https://registry.npmjs.org/@philpl/buble/-/buble-0.19.7.tgz",
+ "integrity": "sha512-wKTA2DxAGEW+QffRQvOhRQ0VBiYU2h2p8Yc1oBNlqSKws48/8faxqKNIuub0q4iuyTuLwtB8EkwiKwhlfV1PBA==",
+ "dependencies": {
+ "acorn": "^6.1.1",
+ "acorn-class-fields": "^0.2.1",
+ "acorn-dynamic-import": "^4.0.0",
+ "acorn-jsx": "^5.0.1",
+ "chalk": "^2.4.2",
+ "magic-string": "^0.25.2",
+ "minimist": "^1.2.0",
+ "os-homedir": "^1.0.1",
+ "regexpu-core": "^4.5.4"
+ },
+ "bin": {
+ "buble": "bin/buble"
+ }
+ },
+ "node_modules/@philpl/buble/node_modules/acorn": {
+ "version": "6.4.2",
+ "resolved": "https://registry.npmjs.org/acorn/-/acorn-6.4.2.tgz",
+ "integrity": "sha512-XtGIhXwF8YM8bJhGxG5kXgjkEuNGLTkoYqVE+KMR+aspr4KGYmKYg7yUe3KghyQ9yheNwLnjmzh/7+gfDBmHCQ==",
+ "bin": {
+ "acorn": "bin/acorn"
+ },
+ "engines": {
+ "node": ">=0.4.0"
+ }
+ },
+ "node_modules/@philpl/buble/node_modules/acorn-class-fields": {
+ "version": "0.2.1",
+ "resolved": "https://registry.npmjs.org/acorn-class-fields/-/acorn-class-fields-0.2.1.tgz",
+ "integrity": "sha512-US/kqTe0H8M4LN9izoL+eykVAitE68YMuYZ3sHn3i1fjniqR7oQ3SPvuMK/VT1kjOQHrx5Q88b90TtOKgAv2hQ==",
+ "engines": {
+ "node": ">=4.8.2"
+ },
+ "peerDependencies": {
+ "acorn": "^6.0.0"
+ }
+ },
+ "node_modules/@philpl/buble/node_modules/acorn-dynamic-import": {
+ "version": "4.0.0",
+ "resolved": "https://registry.npmjs.org/acorn-dynamic-import/-/acorn-dynamic-import-4.0.0.tgz",
+ "integrity": "sha512-d3OEjQV4ROpoflsnUA8HozoIR504TFxNivYEUi6uwz0IYhBkTDXGuWlNdMtybRt3nqVx/L6XqMt0FxkXuWKZhw==",
+ "deprecated": "This is probably built in to whatever tool you're using. If you still need it... idk",
+ "peerDependencies": {
+ "acorn": "^6.0.0"
+ }
+ },
+ "node_modules/@philpl/buble/node_modules/ansi-styles": {
+ "version": "3.2.1",
+ "resolved": "https://registry.npmjs.org/ansi-styles/-/ansi-styles-3.2.1.tgz",
+ "integrity": "sha512-VT0ZI6kZRdTh8YyJw3SMbYm/u+NqfsAxEpWO0Pf9sq8/e94WxxOpPKx9FR1FlyCtOVDNOQ+8ntlqFxiRc+r5qA==",
+ "dependencies": {
+ "color-convert": "^1.9.0"
+ },
+ "engines": {
+ "node": ">=4"
+ }
+ },
+ "node_modules/@philpl/buble/node_modules/chalk": {
+ "version": "2.4.2",
+ "resolved": "https://registry.npmjs.org/chalk/-/chalk-2.4.2.tgz",
+ "integrity": "sha512-Mti+f9lpJNcwF4tWV8/OrTTtF1gZi+f8FqlyAdouralcFWFQWF2+NgCHShjkCb+IFBLq9buZwE1xckQU4peSuQ==",
+ "dependencies": {
+ "ansi-styles": "^3.2.1",
+ "escape-string-regexp": "^1.0.5",
+ "supports-color": "^5.3.0"
+ },
+ "engines": {
+ "node": ">=4"
+ }
+ },
+ "node_modules/@philpl/buble/node_modules/color-convert": {
+ "version": "1.9.3",
+ "resolved": "https://registry.npmjs.org/color-convert/-/color-convert-1.9.3.tgz",
+ "integrity": "sha512-QfAUtd+vFdAtFQcC8CCyYt1fYWxSqAiK2cSD6zDB8N3cpsEBAvRxp9zOGg6G/SHHJYAT88/az/IuDGALsNVbGg==",
+ "dependencies": {
+ "color-name": "1.1.3"
+ }
+ },
+ "node_modules/@philpl/buble/node_modules/color-name": {
+ "version": "1.1.3",
+ "resolved": "https://registry.npmjs.org/color-name/-/color-name-1.1.3.tgz",
+ "integrity": "sha512-72fSenhMw2HZMTVHeCA9KCmpEIbzWiQsjN+BHcBbS9vr1mtt+vJjPdksIBNUmKAW8TFUDPJK5SUU3QhE9NEXDw=="
+ },
+ "node_modules/@philpl/buble/node_modules/escape-string-regexp": {
+ "version": "1.0.5",
+ "resolved": "https://registry.npmjs.org/escape-string-regexp/-/escape-string-regexp-1.0.5.tgz",
+ "integrity": "sha512-vbRorB5FUQWvla16U8R/qgaFIya2qGzwDrNmCZuYKrbdSUMG6I1ZCGQRefkRVhuOkIGVne7BQ35DSfo1qvJqFg==",
+ "engines": {
+ "node": ">=0.8.0"
+ }
+ },
+ "node_modules/@philpl/buble/node_modules/has-flag": {
+ "version": "3.0.0",
+ "resolved": "https://registry.npmjs.org/has-flag/-/has-flag-3.0.0.tgz",
+ "integrity": "sha512-sKJf1+ceQBr4SMkvQnBDNDtf4TXpVhVGateu0t918bl30FnbE2m4vNLX+VWe/dpjlb+HugGYzW7uQXH98HPEYw==",
+ "engines": {
+ "node": ">=4"
+ }
+ },
+ "node_modules/@philpl/buble/node_modules/jsesc": {
+ "version": "0.5.0",
+ "resolved": "https://registry.npmjs.org/jsesc/-/jsesc-0.5.0.tgz",
+ "integrity": "sha512-uZz5UnB7u4T9LvwmFqXii7pZSouaRPorGs5who1Ip7VO0wxanFvBL7GkM6dTHlgX+jhBApRetaWpnDabOeTcnA==",
+ "bin": {
+ "jsesc": "bin/jsesc"
+ }
+ },
+ "node_modules/@philpl/buble/node_modules/regenerate-unicode-properties": {
+ "version": "9.0.0",
+ "resolved": "https://registry.npmjs.org/regenerate-unicode-properties/-/regenerate-unicode-properties-9.0.0.tgz",
+ "integrity": "sha512-3E12UeNSPfjrgwjkR81m5J7Aw/T55Tu7nUyZVQYCKEOs+2dkxEY+DpPtZzO4YruuiPb7NkYLVcyJC4+zCbk5pA==",
+ "dependencies": {
+ "regenerate": "^1.4.2"
+ },
+ "engines": {
+ "node": ">=4"
+ }
+ },
+ "node_modules/@philpl/buble/node_modules/regexpu-core": {
+ "version": "4.8.0",
+ "resolved": "https://registry.npmjs.org/regexpu-core/-/regexpu-core-4.8.0.tgz",
+ "integrity": "sha512-1F6bYsoYiz6is+oz70NWur2Vlh9KWtswuRuzJOfeYUrfPX2o8n74AnUVaOGDbUqVGO9fNHu48/pjJO4sNVwsOg==",
+ "dependencies": {
+ "regenerate": "^1.4.2",
+ "regenerate-unicode-properties": "^9.0.0",
+ "regjsgen": "^0.5.2",
+ "regjsparser": "^0.7.0",
+ "unicode-match-property-ecmascript": "^2.0.0",
+ "unicode-match-property-value-ecmascript": "^2.0.0"
+ },
+ "engines": {
+ "node": ">=4"
+ }
+ },
+ "node_modules/@philpl/buble/node_modules/regjsgen": {
+ "version": "0.5.2",
+ "resolved": "https://registry.npmjs.org/regjsgen/-/regjsgen-0.5.2.tgz",
+ "integrity": "sha512-OFFT3MfrH90xIW8OOSyUrk6QHD5E9JOTeGodiJeBS3J6IwlgzJMNE/1bZklWz5oTg+9dCMyEetclvCVXOPoN3A=="
+ },
+ "node_modules/@philpl/buble/node_modules/regjsparser": {
+ "version": "0.7.0",
+ "resolved": "https://registry.npmjs.org/regjsparser/-/regjsparser-0.7.0.tgz",
+ "integrity": "sha512-A4pcaORqmNMDVwUjWoTzuhwMGpP+NykpfqAsEgI1FSH/EzC7lrN5TMd+kN8YCovX+jMpu8eaqXgXPCa0g8FQNQ==",
+ "dependencies": {
+ "jsesc": "~0.5.0"
+ },
+ "bin": {
+ "regjsparser": "bin/parser"
+ }
+ },
+ "node_modules/@philpl/buble/node_modules/supports-color": {
+ "version": "5.5.0",
+ "resolved": "https://registry.npmjs.org/supports-color/-/supports-color-5.5.0.tgz",
+ "integrity": "sha512-QjVjwdXIt408MIiAqCX4oUKsgU2EqAGzs2Ppkm4aQYbjm+ZEWEcW4SfFNTr4uMNZma0ey4f5lgLrkB0aX0QMow==",
+ "dependencies": {
+ "has-flag": "^3.0.0"
+ },
+ "engines": {
+ "node": ">=4"
+ }
+ },
"node_modules/@polka/url": {
"version": "1.0.0-next.21",
"resolved": "https://registry.npmjs.org/@polka/url/-/url-1.0.0-next.21.tgz",
@@ -4495,7 +4684,6 @@
"version": "5.3.2",
"resolved": "https://registry.npmjs.org/acorn-jsx/-/acorn-jsx-5.3.2.tgz",
"integrity": "sha512-rq9s+JNhf0IChjtDXxllJ7g41oZk5SlXtp0LHwyA5cejwn7vKmKp4pPri6YEePv2PU65sAsegbXtIinmDFDXgQ==",
- "devOptional": true,
"peerDependencies": {
"acorn": "^6.0.0 || ^7.0.0 || ^8.0.0"
}
@@ -5111,6 +5299,137 @@
"node": "^6 || ^7 || ^8 || ^9 || ^10 || ^11 || ^12 || >=13.7"
}
},
+ "node_modules/buble": {
+ "version": "0.19.6",
+ "resolved": "https://registry.npmjs.org/buble/-/buble-0.19.6.tgz",
+ "integrity": "sha512-9kViM6nJA1Q548Jrd06x0geh+BG2ru2+RMDkIHHgJY/8AcyCs34lTHwra9BX7YdPrZXd5aarkpr/SY8bmPgPdg==",
+ "dependencies": {
+ "chalk": "^2.4.1",
+ "magic-string": "^0.25.1",
+ "minimist": "^1.2.0",
+ "os-homedir": "^1.0.1",
+ "regexpu-core": "^4.2.0",
+ "vlq": "^1.0.0"
+ },
+ "bin": {
+ "buble": "bin/buble"
+ }
+ },
+ "node_modules/buble/node_modules/ansi-styles": {
+ "version": "3.2.1",
+ "resolved": "https://registry.npmjs.org/ansi-styles/-/ansi-styles-3.2.1.tgz",
+ "integrity": "sha512-VT0ZI6kZRdTh8YyJw3SMbYm/u+NqfsAxEpWO0Pf9sq8/e94WxxOpPKx9FR1FlyCtOVDNOQ+8ntlqFxiRc+r5qA==",
+ "dependencies": {
+ "color-convert": "^1.9.0"
+ },
+ "engines": {
+ "node": ">=4"
+ }
+ },
+ "node_modules/buble/node_modules/chalk": {
+ "version": "2.4.2",
+ "resolved": "https://registry.npmjs.org/chalk/-/chalk-2.4.2.tgz",
+ "integrity": "sha512-Mti+f9lpJNcwF4tWV8/OrTTtF1gZi+f8FqlyAdouralcFWFQWF2+NgCHShjkCb+IFBLq9buZwE1xckQU4peSuQ==",
+ "dependencies": {
+ "ansi-styles": "^3.2.1",
+ "escape-string-regexp": "^1.0.5",
+ "supports-color": "^5.3.0"
+ },
+ "engines": {
+ "node": ">=4"
+ }
+ },
+ "node_modules/buble/node_modules/color-convert": {
+ "version": "1.9.3",
+ "resolved": "https://registry.npmjs.org/color-convert/-/color-convert-1.9.3.tgz",
+ "integrity": "sha512-QfAUtd+vFdAtFQcC8CCyYt1fYWxSqAiK2cSD6zDB8N3cpsEBAvRxp9zOGg6G/SHHJYAT88/az/IuDGALsNVbGg==",
+ "dependencies": {
+ "color-name": "1.1.3"
+ }
+ },
+ "node_modules/buble/node_modules/color-name": {
+ "version": "1.1.3",
+ "resolved": "https://registry.npmjs.org/color-name/-/color-name-1.1.3.tgz",
+ "integrity": "sha512-72fSenhMw2HZMTVHeCA9KCmpEIbzWiQsjN+BHcBbS9vr1mtt+vJjPdksIBNUmKAW8TFUDPJK5SUU3QhE9NEXDw=="
+ },
+ "node_modules/buble/node_modules/escape-string-regexp": {
+ "version": "1.0.5",
+ "resolved": "https://registry.npmjs.org/escape-string-regexp/-/escape-string-regexp-1.0.5.tgz",
+ "integrity": "sha512-vbRorB5FUQWvla16U8R/qgaFIya2qGzwDrNmCZuYKrbdSUMG6I1ZCGQRefkRVhuOkIGVne7BQ35DSfo1qvJqFg==",
+ "engines": {
+ "node": ">=0.8.0"
+ }
+ },
+ "node_modules/buble/node_modules/has-flag": {
+ "version": "3.0.0",
+ "resolved": "https://registry.npmjs.org/has-flag/-/has-flag-3.0.0.tgz",
+ "integrity": "sha512-sKJf1+ceQBr4SMkvQnBDNDtf4TXpVhVGateu0t918bl30FnbE2m4vNLX+VWe/dpjlb+HugGYzW7uQXH98HPEYw==",
+ "engines": {
+ "node": ">=4"
+ }
+ },
+ "node_modules/buble/node_modules/jsesc": {
+ "version": "0.5.0",
+ "resolved": "https://registry.npmjs.org/jsesc/-/jsesc-0.5.0.tgz",
+ "integrity": "sha512-uZz5UnB7u4T9LvwmFqXii7pZSouaRPorGs5who1Ip7VO0wxanFvBL7GkM6dTHlgX+jhBApRetaWpnDabOeTcnA==",
+ "bin": {
+ "jsesc": "bin/jsesc"
+ }
+ },
+ "node_modules/buble/node_modules/regenerate-unicode-properties": {
+ "version": "9.0.0",
+ "resolved": "https://registry.npmjs.org/regenerate-unicode-properties/-/regenerate-unicode-properties-9.0.0.tgz",
+ "integrity": "sha512-3E12UeNSPfjrgwjkR81m5J7Aw/T55Tu7nUyZVQYCKEOs+2dkxEY+DpPtZzO4YruuiPb7NkYLVcyJC4+zCbk5pA==",
+ "dependencies": {
+ "regenerate": "^1.4.2"
+ },
+ "engines": {
+ "node": ">=4"
+ }
+ },
+ "node_modules/buble/node_modules/regexpu-core": {
+ "version": "4.8.0",
+ "resolved": "https://registry.npmjs.org/regexpu-core/-/regexpu-core-4.8.0.tgz",
+ "integrity": "sha512-1F6bYsoYiz6is+oz70NWur2Vlh9KWtswuRuzJOfeYUrfPX2o8n74AnUVaOGDbUqVGO9fNHu48/pjJO4sNVwsOg==",
+ "dependencies": {
+ "regenerate": "^1.4.2",
+ "regenerate-unicode-properties": "^9.0.0",
+ "regjsgen": "^0.5.2",
+ "regjsparser": "^0.7.0",
+ "unicode-match-property-ecmascript": "^2.0.0",
+ "unicode-match-property-value-ecmascript": "^2.0.0"
+ },
+ "engines": {
+ "node": ">=4"
+ }
+ },
+ "node_modules/buble/node_modules/regjsgen": {
+ "version": "0.5.2",
+ "resolved": "https://registry.npmjs.org/regjsgen/-/regjsgen-0.5.2.tgz",
+ "integrity": "sha512-OFFT3MfrH90xIW8OOSyUrk6QHD5E9JOTeGodiJeBS3J6IwlgzJMNE/1bZklWz5oTg+9dCMyEetclvCVXOPoN3A=="
+ },
+ "node_modules/buble/node_modules/regjsparser": {
+ "version": "0.7.0",
+ "resolved": "https://registry.npmjs.org/regjsparser/-/regjsparser-0.7.0.tgz",
+ "integrity": "sha512-A4pcaORqmNMDVwUjWoTzuhwMGpP+NykpfqAsEgI1FSH/EzC7lrN5TMd+kN8YCovX+jMpu8eaqXgXPCa0g8FQNQ==",
+ "dependencies": {
+ "jsesc": "~0.5.0"
+ },
+ "bin": {
+ "regjsparser": "bin/parser"
+ }
+ },
+ "node_modules/buble/node_modules/supports-color": {
+ "version": "5.5.0",
+ "resolved": "https://registry.npmjs.org/supports-color/-/supports-color-5.5.0.tgz",
+ "integrity": "sha512-QjVjwdXIt408MIiAqCX4oUKsgU2EqAGzs2Ppkm4aQYbjm+ZEWEcW4SfFNTr4uMNZma0ey4f5lgLrkB0aX0QMow==",
+ "dependencies": {
+ "has-flag": "^3.0.0"
+ },
+ "engines": {
+ "node": ">=4"
+ }
+ },
"node_modules/buffer-from": {
"version": "1.1.2",
"resolved": "https://registry.npmjs.org/buffer-from/-/buffer-from-1.1.2.tgz",
@@ -5530,6 +5849,16 @@
"resolved": "https://registry.npmjs.org/commondir/-/commondir-1.0.1.tgz",
"integrity": "sha512-W9pAhw0ja1Edb5GVdIF1mjZw/ASI0AlShXM83UUGe2DVr5TdAPEA1OA8m/g8zWp9x6On7gqufY+FatDbC3MDQg=="
},
+ "node_modules/component-props": {
+ "version": "1.1.1",
+ "resolved": "https://registry.npmjs.org/component-props/-/component-props-1.1.1.tgz",
+ "integrity": "sha512-69pIRJs9fCCHRqCz3390YF2LV1Lu6iEMZ5zuVqqUn+G20V9BNXlMs0cWawWeW9g4Ynmg29JmkG6R7/lUJoGd1Q=="
+ },
+ "node_modules/component-xor": {
+ "version": "0.0.4",
+ "resolved": "https://registry.npmjs.org/component-xor/-/component-xor-0.0.4.tgz",
+ "integrity": "sha512-ZIt6sla8gfo+AFVRZoZOertcnD5LJaY2T9CKE2j13NJxQt/mUafD69Bl7/Y4AnpI2LGjiXH7cOfJDx/n2G9edA=="
+ },
"node_modules/compressible": {
"version": "2.0.18",
"resolved": "https://registry.npmjs.org/compressible/-/compressible-2.0.18.tgz",
@@ -6385,6 +6714,15 @@
"csstype": "^3.0.2"
}
},
+ "node_modules/dom-iterator": {
+ "version": "1.0.0",
+ "resolved": "https://registry.npmjs.org/dom-iterator/-/dom-iterator-1.0.0.tgz",
+ "integrity": "sha512-7dsMOQI07EMU98gQM8NSB3GsAiIeBYIPKpnxR3c9xOvdvBjChAcOM0iJ222I3p5xyiZO9e5oggkNaCusuTdYig==",
+ "dependencies": {
+ "component-props": "1.1.1",
+ "component-xor": "0.0.4"
+ }
+ },
"node_modules/dom-serializer": {
"version": "2.0.0",
"resolved": "https://registry.npmjs.org/dom-serializer/-/dom-serializer-2.0.0.tgz",
@@ -9456,6 +9794,14 @@
"node": ">=10"
}
},
+ "node_modules/magic-string": {
+ "version": "0.25.9",
+ "resolved": "https://registry.npmjs.org/magic-string/-/magic-string-0.25.9.tgz",
+ "integrity": "sha512-RmF0AsMzgt25qzqqLc1+MbHmhdx0ojF2Fvs4XnOqz2ZOBXzzkEwc/dJQZCYHAn7v1jbVOjAZfK8msRn4BxO4VQ==",
+ "dependencies": {
+ "sourcemap-codec": "^1.4.8"
+ }
+ },
"node_modules/make-dir": {
"version": "3.1.0",
"resolved": "https://registry.npmjs.org/make-dir/-/make-dir-3.1.0.tgz",
@@ -10349,6 +10695,14 @@
"node": ">= 0.8.0"
}
},
+ "node_modules/os-homedir": {
+ "version": "1.0.2",
+ "resolved": "https://registry.npmjs.org/os-homedir/-/os-homedir-1.0.2.tgz",
+ "integrity": "sha512-B5JU3cabzk8c67mRRd3ECmROafjYMXbuzlwtqdM8IbS8ktlTix8aFGb2bAGKrSRIlnfKwovGUUr72JUPyOb6kQ==",
+ "engines": {
+ "node": ">=0.10.0"
+ }
+ },
"node_modules/p-cancelable": {
"version": "1.1.0",
"resolved": "https://registry.npmjs.org/p-cancelable/-/p-cancelable-1.1.0.tgz",
@@ -11710,6 +12064,79 @@
"resolved": "https://registry.npmjs.org/react-lifecycles-compat/-/react-lifecycles-compat-3.0.4.tgz",
"integrity": "sha512-fBASbA6LnOU9dOU2eW7aQ8xmYBSXUIWr+UmF9b1efZBazGNO+rcXT/icdKnYm2pTwcRylVUYwW7H1PHfLekVzA=="
},
+ "node_modules/react-live": {
+ "version": "2.2.3",
+ "resolved": "https://registry.npmjs.org/react-live/-/react-live-2.2.3.tgz",
+ "integrity": "sha512-tpKruvfytNETuzO3o1mrQUj180GVrq35IE8F5gH1NJVPt4szYCx83/dOSCOyjgRhhc3gQvl0pQ3k/CjOjwJkKQ==",
+ "dependencies": {
+ "buble": "0.19.6",
+ "core-js": "^2.4.1",
+ "dom-iterator": "^1.0.0",
+ "prism-react-renderer": "^1.0.1",
+ "prop-types": "^15.5.8",
+ "react-simple-code-editor": "^0.10.0",
+ "unescape": "^1.0.1"
+ },
+ "engines": {
+ "node": ">= 0.12.0",
+ "npm": ">= 2.0.0"
+ }
+ },
+ "node_modules/react-live/node_modules/core-js": {
+ "version": "2.6.12",
+ "resolved": "https://registry.npmjs.org/core-js/-/core-js-2.6.12.tgz",
+ "integrity": "sha512-Kb2wC0fvsWfQrgk8HU5lW6U/Lcs8+9aaYcy4ZFc6DDlo4nZ7n70dEgE5rtR0oG6ufKDUnrwfWL1mXR5ljDatrQ==",
+ "deprecated": "core-js@<3.23.3 is no longer maintained and not recommended for usage due to the number of issues. Because of the V8 engine whims, feature detection in old core-js versions could cause a slowdown up to 100x even if nothing is polyfilled. Some versions have web compatibility issues. Please, upgrade your dependencies to the actual version of core-js.",
+ "hasInstallScript": true
+ },
+ "node_modules/react-live/node_modules/react": {
+ "version": "16.14.0",
+ "resolved": "https://registry.npmjs.org/react/-/react-16.14.0.tgz",
+ "integrity": "sha512-0X2CImDkJGApiAlcf0ODKIneSwBPhqJawOa5wCtKbu7ZECrmS26NvtSILynQ66cgkT/RJ4LidJOc3bUESwmU8g==",
+ "peer": true,
+ "dependencies": {
+ "loose-envify": "^1.1.0",
+ "object-assign": "^4.1.1",
+ "prop-types": "^15.6.2"
+ },
+ "engines": {
+ "node": ">=0.10.0"
+ }
+ },
+ "node_modules/react-live/node_modules/react-dom": {
+ "version": "16.14.0",
+ "resolved": "https://registry.npmjs.org/react-dom/-/react-dom-16.14.0.tgz",
+ "integrity": "sha512-1gCeQXDLoIqMgqD3IO2Ah9bnf0w9kzhwN5q4FGnHZ67hBm9yePzB5JJAIQCc8x3pFnNlwFq4RidZggNAAkzWWw==",
+ "peer": true,
+ "dependencies": {
+ "loose-envify": "^1.1.0",
+ "object-assign": "^4.1.1",
+ "prop-types": "^15.6.2",
+ "scheduler": "^0.19.1"
+ },
+ "peerDependencies": {
+ "react": "^16.14.0"
+ }
+ },
+ "node_modules/react-live/node_modules/react-simple-code-editor": {
+ "version": "0.10.0",
+ "resolved": "https://registry.npmjs.org/react-simple-code-editor/-/react-simple-code-editor-0.10.0.tgz",
+ "integrity": "sha512-bL5W5mAxSW6+cLwqqVWY47Silqgy2DKDTR4hDBrLrUqC5BXc29YVx17l2IZk5v36VcDEq1Bszu2oHm1qBwKqBA==",
+ "peerDependencies": {
+ "react": "^16.0.0",
+ "react-dom": "^16.0.0"
+ }
+ },
+ "node_modules/react-live/node_modules/scheduler": {
+ "version": "0.19.1",
+ "resolved": "https://registry.npmjs.org/scheduler/-/scheduler-0.19.1.tgz",
+ "integrity": "sha512-n/zwRWRYSUj0/3g/otKDRPMh6qv2SYMWNq85IEa8iZyAv8od9zDYpGSnpBEjNgcMNq6Scbu5KfIPxNF72R/2EA==",
+ "peer": true,
+ "dependencies": {
+ "loose-envify": "^1.1.0",
+ "object-assign": "^4.1.1"
+ }
+ },
"node_modules/react-loadable": {
"name": "@docusaurus/react-loadable",
"version": "5.5.2",
@@ -13119,6 +13546,11 @@
"source-map": "^0.6.0"
}
},
+ "node_modules/sourcemap-codec": {
+ "version": "1.4.8",
+ "resolved": "https://registry.npmjs.org/sourcemap-codec/-/sourcemap-codec-1.4.8.tgz",
+ "integrity": "sha512-9NykojV5Uih4lgo5So5dtw+f0JgJX30KCNI8gwhz2J9A15wD0Ml6tjHKwf6fTSa6fAdVBdZeNOs9eJ71qCk8vA=="
+ },
"node_modules/space-separated-tokens": {
"version": "1.1.5",
"resolved": "https://registry.npmjs.org/space-separated-tokens/-/space-separated-tokens-1.1.5.tgz",
@@ -13837,6 +14269,17 @@
"url": "https://github.com/sponsors/ljharb"
}
},
+ "node_modules/unescape": {
+ "version": "1.0.1",
+ "resolved": "https://registry.npmjs.org/unescape/-/unescape-1.0.1.tgz",
+ "integrity": "sha512-O0+af1Gs50lyH1nUu3ZyYS1cRh01Q/kUKatTOkSs7jukXE6/NebucDVxyiDsA9AQ4JC1V1jUH9EO8JX2nMDgGQ==",
+ "dependencies": {
+ "extend-shallow": "^2.0.1"
+ },
+ "engines": {
+ "node": ">=0.10.0"
+ }
+ },
"node_modules/unherit": {
"version": "1.1.3",
"resolved": "https://registry.npmjs.org/unherit/-/unherit-1.1.3.tgz",
@@ -14391,6 +14834,11 @@
"url": "https://opencollective.com/unified"
}
},
+ "node_modules/vlq": {
+ "version": "1.0.1",
+ "resolved": "https://registry.npmjs.org/vlq/-/vlq-1.0.1.tgz",
+ "integrity": "sha512-gQpnTgkubC6hQgdIcRdYGDSDc+SaujOdyesZQMv6JlfQee/9Mp0Qhnys6WxDWvQnL5WZdT7o2Ul187aSt0Rq+w=="
+ },
"node_modules/w3c-keyname": {
"version": "2.2.6",
"resolved": "https://registry.npmjs.org/w3c-keyname/-/w3c-keyname-2.2.6.tgz",
@@ -16886,6 +17334,22 @@
"utility-types": "^3.10.0"
}
},
+ "@docusaurus/theme-live-codeblock": {
+ "version": "2.2.0",
+ "resolved": "https://registry.npmjs.org/@docusaurus/theme-live-codeblock/-/theme-live-codeblock-2.2.0.tgz",
+ "integrity": "sha512-4XRFxfZGcyqmbLmNbnbZ2ZOsoY7FYCJUZKsYW5yzhZYjmjGg7lkdJH5trt9otUoKBsZopBpPWvcDZwCu1SENYg==",
+ "requires": {
+ "@docusaurus/core": "2.2.0",
+ "@docusaurus/theme-common": "2.2.0",
+ "@docusaurus/theme-translations": "2.2.0",
+ "@docusaurus/utils-validation": "2.2.0",
+ "@philpl/buble": "^0.19.7",
+ "clsx": "^1.2.1",
+ "fs-extra": "^10.1.0",
+ "react-live": "2.2.3",
+ "tslib": "^2.4.0"
+ }
+ },
"@docusaurus/theme-search-algolia": {
"version": "2.2.0",
"resolved": "https://registry.npmjs.org/@docusaurus/theme-search-algolia/-/theme-search-algolia-2.2.0.tgz",
@@ -17506,6 +17970,129 @@
"fastq": "^1.6.0"
}
},
+ "@philpl/buble": {
+ "version": "0.19.7",
+ "resolved": "https://registry.npmjs.org/@philpl/buble/-/buble-0.19.7.tgz",
+ "integrity": "sha512-wKTA2DxAGEW+QffRQvOhRQ0VBiYU2h2p8Yc1oBNlqSKws48/8faxqKNIuub0q4iuyTuLwtB8EkwiKwhlfV1PBA==",
+ "requires": {
+ "acorn": "^6.1.1",
+ "acorn-class-fields": "^0.2.1",
+ "acorn-dynamic-import": "^4.0.0",
+ "acorn-jsx": "^5.0.1",
+ "chalk": "^2.4.2",
+ "magic-string": "^0.25.2",
+ "minimist": "^1.2.0",
+ "os-homedir": "^1.0.1",
+ "regexpu-core": "^4.5.4"
+ },
+ "dependencies": {
+ "acorn": {
+ "version": "6.4.2",
+ "resolved": "https://registry.npmjs.org/acorn/-/acorn-6.4.2.tgz",
+ "integrity": "sha512-XtGIhXwF8YM8bJhGxG5kXgjkEuNGLTkoYqVE+KMR+aspr4KGYmKYg7yUe3KghyQ9yheNwLnjmzh/7+gfDBmHCQ=="
+ },
+ "acorn-class-fields": {
+ "version": "0.2.1",
+ "resolved": "https://registry.npmjs.org/acorn-class-fields/-/acorn-class-fields-0.2.1.tgz",
+ "integrity": "sha512-US/kqTe0H8M4LN9izoL+eykVAitE68YMuYZ3sHn3i1fjniqR7oQ3SPvuMK/VT1kjOQHrx5Q88b90TtOKgAv2hQ==",
+ "requires": {}
+ },
+ "acorn-dynamic-import": {
+ "version": "4.0.0",
+ "resolved": "https://registry.npmjs.org/acorn-dynamic-import/-/acorn-dynamic-import-4.0.0.tgz",
+ "integrity": "sha512-d3OEjQV4ROpoflsnUA8HozoIR504TFxNivYEUi6uwz0IYhBkTDXGuWlNdMtybRt3nqVx/L6XqMt0FxkXuWKZhw==",
+ "requires": {}
+ },
+ "ansi-styles": {
+ "version": "3.2.1",
+ "resolved": "https://registry.npmjs.org/ansi-styles/-/ansi-styles-3.2.1.tgz",
+ "integrity": "sha512-VT0ZI6kZRdTh8YyJw3SMbYm/u+NqfsAxEpWO0Pf9sq8/e94WxxOpPKx9FR1FlyCtOVDNOQ+8ntlqFxiRc+r5qA==",
+ "requires": {
+ "color-convert": "^1.9.0"
+ }
+ },
+ "chalk": {
+ "version": "2.4.2",
+ "resolved": "https://registry.npmjs.org/chalk/-/chalk-2.4.2.tgz",
+ "integrity": "sha512-Mti+f9lpJNcwF4tWV8/OrTTtF1gZi+f8FqlyAdouralcFWFQWF2+NgCHShjkCb+IFBLq9buZwE1xckQU4peSuQ==",
+ "requires": {
+ "ansi-styles": "^3.2.1",
+ "escape-string-regexp": "^1.0.5",
+ "supports-color": "^5.3.0"
+ }
+ },
+ "color-convert": {
+ "version": "1.9.3",
+ "resolved": "https://registry.npmjs.org/color-convert/-/color-convert-1.9.3.tgz",
+ "integrity": "sha512-QfAUtd+vFdAtFQcC8CCyYt1fYWxSqAiK2cSD6zDB8N3cpsEBAvRxp9zOGg6G/SHHJYAT88/az/IuDGALsNVbGg==",
+ "requires": {
+ "color-name": "1.1.3"
+ }
+ },
+ "color-name": {
+ "version": "1.1.3",
+ "resolved": "https://registry.npmjs.org/color-name/-/color-name-1.1.3.tgz",
+ "integrity": "sha512-72fSenhMw2HZMTVHeCA9KCmpEIbzWiQsjN+BHcBbS9vr1mtt+vJjPdksIBNUmKAW8TFUDPJK5SUU3QhE9NEXDw=="
+ },
+ "escape-string-regexp": {
+ "version": "1.0.5",
+ "resolved": "https://registry.npmjs.org/escape-string-regexp/-/escape-string-regexp-1.0.5.tgz",
+ "integrity": "sha512-vbRorB5FUQWvla16U8R/qgaFIya2qGzwDrNmCZuYKrbdSUMG6I1ZCGQRefkRVhuOkIGVne7BQ35DSfo1qvJqFg=="
+ },
+ "has-flag": {
+ "version": "3.0.0",
+ "resolved": "https://registry.npmjs.org/has-flag/-/has-flag-3.0.0.tgz",
+ "integrity": "sha512-sKJf1+ceQBr4SMkvQnBDNDtf4TXpVhVGateu0t918bl30FnbE2m4vNLX+VWe/dpjlb+HugGYzW7uQXH98HPEYw=="
+ },
+ "jsesc": {
+ "version": "0.5.0",
+ "resolved": "https://registry.npmjs.org/jsesc/-/jsesc-0.5.0.tgz",
+ "integrity": "sha512-uZz5UnB7u4T9LvwmFqXii7pZSouaRPorGs5who1Ip7VO0wxanFvBL7GkM6dTHlgX+jhBApRetaWpnDabOeTcnA=="
+ },
+ "regenerate-unicode-properties": {
+ "version": "9.0.0",
+ "resolved": "https://registry.npmjs.org/regenerate-unicode-properties/-/regenerate-unicode-properties-9.0.0.tgz",
+ "integrity": "sha512-3E12UeNSPfjrgwjkR81m5J7Aw/T55Tu7nUyZVQYCKEOs+2dkxEY+DpPtZzO4YruuiPb7NkYLVcyJC4+zCbk5pA==",
+ "requires": {
+ "regenerate": "^1.4.2"
+ }
+ },
+ "regexpu-core": {
+ "version": "4.8.0",
+ "resolved": "https://registry.npmjs.org/regexpu-core/-/regexpu-core-4.8.0.tgz",
+ "integrity": "sha512-1F6bYsoYiz6is+oz70NWur2Vlh9KWtswuRuzJOfeYUrfPX2o8n74AnUVaOGDbUqVGO9fNHu48/pjJO4sNVwsOg==",
+ "requires": {
+ "regenerate": "^1.4.2",
+ "regenerate-unicode-properties": "^9.0.0",
+ "regjsgen": "^0.5.2",
+ "regjsparser": "^0.7.0",
+ "unicode-match-property-ecmascript": "^2.0.0",
+ "unicode-match-property-value-ecmascript": "^2.0.0"
+ }
+ },
+ "regjsgen": {
+ "version": "0.5.2",
+ "resolved": "https://registry.npmjs.org/regjsgen/-/regjsgen-0.5.2.tgz",
+ "integrity": "sha512-OFFT3MfrH90xIW8OOSyUrk6QHD5E9JOTeGodiJeBS3J6IwlgzJMNE/1bZklWz5oTg+9dCMyEetclvCVXOPoN3A=="
+ },
+ "regjsparser": {
+ "version": "0.7.0",
+ "resolved": "https://registry.npmjs.org/regjsparser/-/regjsparser-0.7.0.tgz",
+ "integrity": "sha512-A4pcaORqmNMDVwUjWoTzuhwMGpP+NykpfqAsEgI1FSH/EzC7lrN5TMd+kN8YCovX+jMpu8eaqXgXPCa0g8FQNQ==",
+ "requires": {
+ "jsesc": "~0.5.0"
+ }
+ },
+ "supports-color": {
+ "version": "5.5.0",
+ "resolved": "https://registry.npmjs.org/supports-color/-/supports-color-5.5.0.tgz",
+ "integrity": "sha512-QjVjwdXIt408MIiAqCX4oUKsgU2EqAGzs2Ppkm4aQYbjm+ZEWEcW4SfFNTr4uMNZma0ey4f5lgLrkB0aX0QMow==",
+ "requires": {
+ "has-flag": "^3.0.0"
+ }
+ }
+ }
+ },
"@polka/url": {
"version": "1.0.0-next.21",
"resolved": "https://registry.npmjs.org/@polka/url/-/url-1.0.0-next.21.tgz",
@@ -18277,7 +18864,6 @@
"version": "5.3.2",
"resolved": "https://registry.npmjs.org/acorn-jsx/-/acorn-jsx-5.3.2.tgz",
"integrity": "sha512-rq9s+JNhf0IChjtDXxllJ7g41oZk5SlXtp0LHwyA5cejwn7vKmKp4pPri6YEePv2PU65sAsegbXtIinmDFDXgQ==",
- "devOptional": true,
"requires": {}
},
"acorn-walk": {
@@ -18735,6 +19321,109 @@
"update-browserslist-db": "^1.0.9"
}
},
+ "buble": {
+ "version": "0.19.6",
+ "resolved": "https://registry.npmjs.org/buble/-/buble-0.19.6.tgz",
+ "integrity": "sha512-9kViM6nJA1Q548Jrd06x0geh+BG2ru2+RMDkIHHgJY/8AcyCs34lTHwra9BX7YdPrZXd5aarkpr/SY8bmPgPdg==",
+ "requires": {
+ "chalk": "^2.4.1",
+ "magic-string": "^0.25.1",
+ "minimist": "^1.2.0",
+ "os-homedir": "^1.0.1",
+ "regexpu-core": "^4.2.0",
+ "vlq": "^1.0.0"
+ },
+ "dependencies": {
+ "ansi-styles": {
+ "version": "3.2.1",
+ "resolved": "https://registry.npmjs.org/ansi-styles/-/ansi-styles-3.2.1.tgz",
+ "integrity": "sha512-VT0ZI6kZRdTh8YyJw3SMbYm/u+NqfsAxEpWO0Pf9sq8/e94WxxOpPKx9FR1FlyCtOVDNOQ+8ntlqFxiRc+r5qA==",
+ "requires": {
+ "color-convert": "^1.9.0"
+ }
+ },
+ "chalk": {
+ "version": "2.4.2",
+ "resolved": "https://registry.npmjs.org/chalk/-/chalk-2.4.2.tgz",
+ "integrity": "sha512-Mti+f9lpJNcwF4tWV8/OrTTtF1gZi+f8FqlyAdouralcFWFQWF2+NgCHShjkCb+IFBLq9buZwE1xckQU4peSuQ==",
+ "requires": {
+ "ansi-styles": "^3.2.1",
+ "escape-string-regexp": "^1.0.5",
+ "supports-color": "^5.3.0"
+ }
+ },
+ "color-convert": {
+ "version": "1.9.3",
+ "resolved": "https://registry.npmjs.org/color-convert/-/color-convert-1.9.3.tgz",
+ "integrity": "sha512-QfAUtd+vFdAtFQcC8CCyYt1fYWxSqAiK2cSD6zDB8N3cpsEBAvRxp9zOGg6G/SHHJYAT88/az/IuDGALsNVbGg==",
+ "requires": {
+ "color-name": "1.1.3"
+ }
+ },
+ "color-name": {
+ "version": "1.1.3",
+ "resolved": "https://registry.npmjs.org/color-name/-/color-name-1.1.3.tgz",
+ "integrity": "sha512-72fSenhMw2HZMTVHeCA9KCmpEIbzWiQsjN+BHcBbS9vr1mtt+vJjPdksIBNUmKAW8TFUDPJK5SUU3QhE9NEXDw=="
+ },
+ "escape-string-regexp": {
+ "version": "1.0.5",
+ "resolved": "https://registry.npmjs.org/escape-string-regexp/-/escape-string-regexp-1.0.5.tgz",
+ "integrity": "sha512-vbRorB5FUQWvla16U8R/qgaFIya2qGzwDrNmCZuYKrbdSUMG6I1ZCGQRefkRVhuOkIGVne7BQ35DSfo1qvJqFg=="
+ },
+ "has-flag": {
+ "version": "3.0.0",
+ "resolved": "https://registry.npmjs.org/has-flag/-/has-flag-3.0.0.tgz",
+ "integrity": "sha512-sKJf1+ceQBr4SMkvQnBDNDtf4TXpVhVGateu0t918bl30FnbE2m4vNLX+VWe/dpjlb+HugGYzW7uQXH98HPEYw=="
+ },
+ "jsesc": {
+ "version": "0.5.0",
+ "resolved": "https://registry.npmjs.org/jsesc/-/jsesc-0.5.0.tgz",
+ "integrity": "sha512-uZz5UnB7u4T9LvwmFqXii7pZSouaRPorGs5who1Ip7VO0wxanFvBL7GkM6dTHlgX+jhBApRetaWpnDabOeTcnA=="
+ },
+ "regenerate-unicode-properties": {
+ "version": "9.0.0",
+ "resolved": "https://registry.npmjs.org/regenerate-unicode-properties/-/regenerate-unicode-properties-9.0.0.tgz",
+ "integrity": "sha512-3E12UeNSPfjrgwjkR81m5J7Aw/T55Tu7nUyZVQYCKEOs+2dkxEY+DpPtZzO4YruuiPb7NkYLVcyJC4+zCbk5pA==",
+ "requires": {
+ "regenerate": "^1.4.2"
+ }
+ },
+ "regexpu-core": {
+ "version": "4.8.0",
+ "resolved": "https://registry.npmjs.org/regexpu-core/-/regexpu-core-4.8.0.tgz",
+ "integrity": "sha512-1F6bYsoYiz6is+oz70NWur2Vlh9KWtswuRuzJOfeYUrfPX2o8n74AnUVaOGDbUqVGO9fNHu48/pjJO4sNVwsOg==",
+ "requires": {
+ "regenerate": "^1.4.2",
+ "regenerate-unicode-properties": "^9.0.0",
+ "regjsgen": "^0.5.2",
+ "regjsparser": "^0.7.0",
+ "unicode-match-property-ecmascript": "^2.0.0",
+ "unicode-match-property-value-ecmascript": "^2.0.0"
+ }
+ },
+ "regjsgen": {
+ "version": "0.5.2",
+ "resolved": "https://registry.npmjs.org/regjsgen/-/regjsgen-0.5.2.tgz",
+ "integrity": "sha512-OFFT3MfrH90xIW8OOSyUrk6QHD5E9JOTeGodiJeBS3J6IwlgzJMNE/1bZklWz5oTg+9dCMyEetclvCVXOPoN3A=="
+ },
+ "regjsparser": {
+ "version": "0.7.0",
+ "resolved": "https://registry.npmjs.org/regjsparser/-/regjsparser-0.7.0.tgz",
+ "integrity": "sha512-A4pcaORqmNMDVwUjWoTzuhwMGpP+NykpfqAsEgI1FSH/EzC7lrN5TMd+kN8YCovX+jMpu8eaqXgXPCa0g8FQNQ==",
+ "requires": {
+ "jsesc": "~0.5.0"
+ }
+ },
+ "supports-color": {
+ "version": "5.5.0",
+ "resolved": "https://registry.npmjs.org/supports-color/-/supports-color-5.5.0.tgz",
+ "integrity": "sha512-QjVjwdXIt408MIiAqCX4oUKsgU2EqAGzs2Ppkm4aQYbjm+ZEWEcW4SfFNTr4uMNZma0ey4f5lgLrkB0aX0QMow==",
+ "requires": {
+ "has-flag": "^3.0.0"
+ }
+ }
+ }
+ },
"buffer-from": {
"version": "1.1.2",
"resolved": "https://registry.npmjs.org/buffer-from/-/buffer-from-1.1.2.tgz",
@@ -19024,6 +19713,16 @@
"resolved": "https://registry.npmjs.org/commondir/-/commondir-1.0.1.tgz",
"integrity": "sha512-W9pAhw0ja1Edb5GVdIF1mjZw/ASI0AlShXM83UUGe2DVr5TdAPEA1OA8m/g8zWp9x6On7gqufY+FatDbC3MDQg=="
},
+ "component-props": {
+ "version": "1.1.1",
+ "resolved": "https://registry.npmjs.org/component-props/-/component-props-1.1.1.tgz",
+ "integrity": "sha512-69pIRJs9fCCHRqCz3390YF2LV1Lu6iEMZ5zuVqqUn+G20V9BNXlMs0cWawWeW9g4Ynmg29JmkG6R7/lUJoGd1Q=="
+ },
+ "component-xor": {
+ "version": "0.0.4",
+ "resolved": "https://registry.npmjs.org/component-xor/-/component-xor-0.0.4.tgz",
+ "integrity": "sha512-ZIt6sla8gfo+AFVRZoZOertcnD5LJaY2T9CKE2j13NJxQt/mUafD69Bl7/Y4AnpI2LGjiXH7cOfJDx/n2G9edA=="
+ },
"compressible": {
"version": "2.0.18",
"resolved": "https://registry.npmjs.org/compressible/-/compressible-2.0.18.tgz",
@@ -19624,6 +20323,15 @@
"csstype": "^3.0.2"
}
},
+ "dom-iterator": {
+ "version": "1.0.0",
+ "resolved": "https://registry.npmjs.org/dom-iterator/-/dom-iterator-1.0.0.tgz",
+ "integrity": "sha512-7dsMOQI07EMU98gQM8NSB3GsAiIeBYIPKpnxR3c9xOvdvBjChAcOM0iJ222I3p5xyiZO9e5oggkNaCusuTdYig==",
+ "requires": {
+ "component-props": "1.1.1",
+ "component-xor": "0.0.4"
+ }
+ },
"dom-serializer": {
"version": "2.0.0",
"resolved": "https://registry.npmjs.org/dom-serializer/-/dom-serializer-2.0.0.tgz",
@@ -21842,6 +22550,14 @@
"yallist": "^4.0.0"
}
},
+ "magic-string": {
+ "version": "0.25.9",
+ "resolved": "https://registry.npmjs.org/magic-string/-/magic-string-0.25.9.tgz",
+ "integrity": "sha512-RmF0AsMzgt25qzqqLc1+MbHmhdx0ojF2Fvs4XnOqz2ZOBXzzkEwc/dJQZCYHAn7v1jbVOjAZfK8msRn4BxO4VQ==",
+ "requires": {
+ "sourcemap-codec": "^1.4.8"
+ }
+ },
"make-dir": {
"version": "3.1.0",
"resolved": "https://registry.npmjs.org/make-dir/-/make-dir-3.1.0.tgz",
@@ -22467,6 +23183,11 @@
"word-wrap": "^1.2.3"
}
},
+ "os-homedir": {
+ "version": "1.0.2",
+ "resolved": "https://registry.npmjs.org/os-homedir/-/os-homedir-1.0.2.tgz",
+ "integrity": "sha512-B5JU3cabzk8c67mRRd3ECmROafjYMXbuzlwtqdM8IbS8ktlTix8aFGb2bAGKrSRIlnfKwovGUUr72JUPyOb6kQ=="
+ },
"p-cancelable": {
"version": "1.1.0",
"resolved": "https://registry.npmjs.org/p-cancelable/-/p-cancelable-1.1.0.tgz",
@@ -23399,6 +24120,66 @@
"resolved": "https://registry.npmjs.org/react-lifecycles-compat/-/react-lifecycles-compat-3.0.4.tgz",
"integrity": "sha512-fBASbA6LnOU9dOU2eW7aQ8xmYBSXUIWr+UmF9b1efZBazGNO+rcXT/icdKnYm2pTwcRylVUYwW7H1PHfLekVzA=="
},
+ "react-live": {
+ "version": "2.2.3",
+ "resolved": "https://registry.npmjs.org/react-live/-/react-live-2.2.3.tgz",
+ "integrity": "sha512-tpKruvfytNETuzO3o1mrQUj180GVrq35IE8F5gH1NJVPt4szYCx83/dOSCOyjgRhhc3gQvl0pQ3k/CjOjwJkKQ==",
+ "requires": {
+ "buble": "0.19.6",
+ "core-js": "^2.4.1",
+ "dom-iterator": "^1.0.0",
+ "prism-react-renderer": "^1.0.1",
+ "prop-types": "^15.5.8",
+ "react-simple-code-editor": "^0.10.0",
+ "unescape": "^1.0.1"
+ },
+ "dependencies": {
+ "core-js": {
+ "version": "2.6.12",
+ "resolved": "https://registry.npmjs.org/core-js/-/core-js-2.6.12.tgz",
+ "integrity": "sha512-Kb2wC0fvsWfQrgk8HU5lW6U/Lcs8+9aaYcy4ZFc6DDlo4nZ7n70dEgE5rtR0oG6ufKDUnrwfWL1mXR5ljDatrQ=="
+ },
+ "react": {
+ "version": "16.14.0",
+ "resolved": "https://registry.npmjs.org/react/-/react-16.14.0.tgz",
+ "integrity": "sha512-0X2CImDkJGApiAlcf0ODKIneSwBPhqJawOa5wCtKbu7ZECrmS26NvtSILynQ66cgkT/RJ4LidJOc3bUESwmU8g==",
+ "peer": true,
+ "requires": {
+ "loose-envify": "^1.1.0",
+ "object-assign": "^4.1.1",
+ "prop-types": "^15.6.2"
+ }
+ },
+ "react-dom": {
+ "version": "16.14.0",
+ "resolved": "https://registry.npmjs.org/react-dom/-/react-dom-16.14.0.tgz",
+ "integrity": "sha512-1gCeQXDLoIqMgqD3IO2Ah9bnf0w9kzhwN5q4FGnHZ67hBm9yePzB5JJAIQCc8x3pFnNlwFq4RidZggNAAkzWWw==",
+ "peer": true,
+ "requires": {
+ "loose-envify": "^1.1.0",
+ "object-assign": "^4.1.1",
+ "prop-types": "^15.6.2",
+ "scheduler": "^0.19.1"
+ }
+ },
+ "react-simple-code-editor": {
+ "version": "0.10.0",
+ "resolved": "https://registry.npmjs.org/react-simple-code-editor/-/react-simple-code-editor-0.10.0.tgz",
+ "integrity": "sha512-bL5W5mAxSW6+cLwqqVWY47Silqgy2DKDTR4hDBrLrUqC5BXc29YVx17l2IZk5v36VcDEq1Bszu2oHm1qBwKqBA==",
+ "requires": {}
+ },
+ "scheduler": {
+ "version": "0.19.1",
+ "resolved": "https://registry.npmjs.org/scheduler/-/scheduler-0.19.1.tgz",
+ "integrity": "sha512-n/zwRWRYSUj0/3g/otKDRPMh6qv2SYMWNq85IEa8iZyAv8od9zDYpGSnpBEjNgcMNq6Scbu5KfIPxNF72R/2EA==",
+ "peer": true,
+ "requires": {
+ "loose-envify": "^1.1.0",
+ "object-assign": "^4.1.1"
+ }
+ }
+ }
+ },
"react-loadable": {
"version": "npm:@docusaurus/react-loadable@5.5.2",
"resolved": "https://registry.npmjs.org/@docusaurus/react-loadable/-/react-loadable-5.5.2.tgz",
@@ -24478,6 +25259,11 @@
"source-map": "^0.6.0"
}
},
+ "sourcemap-codec": {
+ "version": "1.4.8",
+ "resolved": "https://registry.npmjs.org/sourcemap-codec/-/sourcemap-codec-1.4.8.tgz",
+ "integrity": "sha512-9NykojV5Uih4lgo5So5dtw+f0JgJX30KCNI8gwhz2J9A15wD0Ml6tjHKwf6fTSa6fAdVBdZeNOs9eJ71qCk8vA=="
+ },
"space-separated-tokens": {
"version": "1.1.5",
"resolved": "https://registry.npmjs.org/space-separated-tokens/-/space-separated-tokens-1.1.5.tgz",
@@ -24978,6 +25764,14 @@
"which-boxed-primitive": "^1.0.2"
}
},
+ "unescape": {
+ "version": "1.0.1",
+ "resolved": "https://registry.npmjs.org/unescape/-/unescape-1.0.1.tgz",
+ "integrity": "sha512-O0+af1Gs50lyH1nUu3ZyYS1cRh01Q/kUKatTOkSs7jukXE6/NebucDVxyiDsA9AQ4JC1V1jUH9EO8JX2nMDgGQ==",
+ "requires": {
+ "extend-shallow": "^2.0.1"
+ }
+ },
"unherit": {
"version": "1.1.3",
"resolved": "https://registry.npmjs.org/unherit/-/unherit-1.1.3.tgz",
@@ -25341,6 +26135,11 @@
"unist-util-stringify-position": "^2.0.0"
}
},
+ "vlq": {
+ "version": "1.0.1",
+ "resolved": "https://registry.npmjs.org/vlq/-/vlq-1.0.1.tgz",
+ "integrity": "sha512-gQpnTgkubC6hQgdIcRdYGDSDc+SaujOdyesZQMv6JlfQee/9Mp0Qhnys6WxDWvQnL5WZdT7o2Ul187aSt0Rq+w=="
+ },
"w3c-keyname": {
"version": "2.2.6",
"resolved": "https://registry.npmjs.org/w3c-keyname/-/w3c-keyname-2.2.6.tgz",
diff --git a/package.json b/package.json
index 76e4dde43..34a3c69cf 100644
--- a/package.json
+++ b/package.json
@@ -19,6 +19,7 @@
"dependencies": {
"@docusaurus/core": "^2.2.0",
"@docusaurus/preset-classic": "^2.2.0",
+ "@docusaurus/theme-live-codeblock": "^2.2.0",
"@emotion/react": "^11.10.5",
"@emotion/styled": "^11.10.5",
"@mdx-js/react": "^1.6.22",
diff --git a/src/components/BrowserWindow/index.tsx b/src/components/BrowserWindow/index.tsx
new file mode 100644
index 000000000..ddb9572c7
--- /dev/null
+++ b/src/components/BrowserWindow/index.tsx
@@ -0,0 +1,47 @@
+/**
+ * Copyright (c) Facebook, Inc. and its affiliates.
+ *
+ * This source code is licensed under the MIT license found in the
+ * LICENSE file in the root directory of this source tree.
+ */
+
+import React, { type ReactNode } from "react";
+import clsx from "clsx";
+
+import styles from "./styles.module.css";
+
+interface Props {
+ children: ReactNode;
+ minHeight: number;
+ url: string;
+}
+
+export default function BrowserWindow({
+ children,
+ minHeight,
+ url = "http://localhost:3000",
+}: Props): JSX.Element {
+ return (
+
+
+
+
+
+
+
+
+ {url}
+
+
+
+
+
{children}
+
+ );
+}
diff --git a/src/components/BrowserWindow/styles.module.css b/src/components/BrowserWindow/styles.module.css
new file mode 100644
index 000000000..257662579
--- /dev/null
+++ b/src/components/BrowserWindow/styles.module.css
@@ -0,0 +1,87 @@
+/**
+ * Copyright (c) Facebook, Inc. and its affiliates.
+ *
+ * This source code is licensed under the MIT license found in the
+ * LICENSE file in the root directory of this source tree.
+ */
+
+.browserWindow {
+ border: 3px solid var(--ifm-color-emphasis-200);
+ border-radius: var(--ifm-global-radius);
+ box-shadow: var(--ifm-global-shadow-lw);
+ margin-bottom: var(--ifm-leading);
+}
+
+.browserWindowHeader {
+ align-items: center;
+ background: var(--ifm-color-emphasis-200);
+ display: flex;
+ padding: 0.5rem 1rem;
+}
+
+.row::after {
+ content: "";
+ display: table;
+ clear: both;
+}
+
+.buttons {
+ white-space: nowrap;
+}
+
+.right {
+ align-self: center;
+ width: 10%;
+}
+
+[data-theme="light"] {
+ --ifm-background-color: #fff;
+}
+
+.browserWindowAddressBar {
+ flex: 1 0;
+ margin: 0 1rem 0 0.5rem;
+ border-radius: 12.5px;
+ background-color: var(--ifm-background-color);
+ color: var(--ifm-color-gray-800);
+ padding: 5px 15px;
+ font: 400 13px Arial, sans-serif;
+ user-select: none;
+}
+
+[data-theme="dark"] .browserWindowAddressBar {
+ color: var(--ifm-color-gray-300);
+}
+
+.dot {
+ margin-right: 6px;
+ margin-top: 4px;
+ height: 12px;
+ width: 12px;
+ background-color: #bbb;
+ border-radius: 50%;
+ display: inline-block;
+}
+
+.browserWindowMenuIcon {
+ margin-left: auto;
+}
+
+.bar {
+ width: 17px;
+ height: 3px;
+ background-color: #aaa;
+ margin: 3px 0;
+ display: block;
+}
+
+.browserWindowBody {
+ background-color: var(--ifm-background-color);
+ border-bottom-left-radius: inherit;
+ border-bottom-right-radius: inherit;
+ padding: 1rem;
+}
+
+.browserWindowBody *:last-child {
+ margin-bottom: 0;
+}
diff --git a/src/theme/ReactLiveScope/index.js b/src/theme/ReactLiveScope/index.js
new file mode 100644
index 000000000..cfa699703
--- /dev/null
+++ b/src/theme/ReactLiveScope/index.js
@@ -0,0 +1,20 @@
+import React from "react";
+import LifeGameTmp from "@site/src/components/LifeGame/LifeGame";
+// Add react-live imports you need here
+
+function LifeGame() {
+ return (
+ <>
+
+
+
+ >
+ );
+}
+
+const ReactLiveScope = {
+ React,
+ ...React,
+ LifeGame,
+};
+export default ReactLiveScope;