diff --git a/docs/1-trial-session/02-html/index.mdx b/docs/1-trial-session/02-html/index.mdx index f7fa54d7c..7ae880032 100644 --- a/docs/1-trial-session/02-html/index.mdx +++ b/docs/1-trial-session/02-html/index.mdx @@ -6,6 +6,8 @@ import createFileVideo from "./create-file.mp4"; import openInBrowserVideo from "./open-in-browser.mp4"; import showFileExtensionsVideo from "./show-file-extensions.mp4"; import reloadBrowserVideo from "./reload-browser.mp4"; +import excursionHtml from "!!raw-loader!./_samples/excursion/index.html"; +import formHtml from "!!raw-loader!./_samples/form/index.html"; Web開発に必ず用いられる言語があります。**HTML**とCSS、そしてJavaScriptです。これらは互いに異なる役割をもっています。まずは最も基本となるHTMLから学んでいきましょう。 @@ -155,7 +157,15 @@ VS Code上で作成したファイルは`index.html`でした。しかしなが ``` - + @@ -202,6 +212,14 @@ VS Code上で作成したファイルは`index.html`でした。しかしなが ``` - + diff --git a/docs/1-trial-session/03-css/_samples/first-css/index.html b/docs/1-trial-session/03-css/_samples/first-class/index.html similarity index 100% rename from docs/1-trial-session/03-css/_samples/first-css/index.html rename to docs/1-trial-session/03-css/_samples/first-class/index.html diff --git a/docs/1-trial-session/03-css/_samples/foo/index.html b/docs/1-trial-session/03-css/_samples/foo/index.html index 7b0a95807..e616bbb46 100644 --- a/docs/1-trial-session/03-css/_samples/foo/index.html +++ b/docs/1-trial-session/03-css/_samples/foo/index.html @@ -2,19 +2,10 @@ + Title -
- Foo -
+
Foo
diff --git a/docs/1-trial-session/03-css/_samples/foo/style.css b/docs/1-trial-session/03-css/_samples/foo/style.css new file mode 100644 index 000000000..90ea2c7c4 --- /dev/null +++ b/docs/1-trial-session/03-css/_samples/foo/style.css @@ -0,0 +1,7 @@ +#foo { + border: 1px solid #aaa; + border-radius: 10px; + margin: 30px; + padding: 30px; + box-shadow: 0px 0px 2px 1px #aaa; +} diff --git a/docs/1-trial-session/03-css/_samples/red-hello-world/index.html b/docs/1-trial-session/03-css/_samples/red-hello-world/index.html deleted file mode 100644 index a02ac1350..000000000 --- a/docs/1-trial-session/03-css/_samples/red-hello-world/index.html +++ /dev/null @@ -1,11 +0,0 @@ - - - - - - Title - - -
Hello World!
- - diff --git a/docs/1-trial-session/03-css/_samples/red-hello-world/style.css b/docs/1-trial-session/03-css/_samples/red-hello-world/style.css deleted file mode 100644 index 542be4874..000000000 --- a/docs/1-trial-session/03-css/_samples/red-hello-world/style.css +++ /dev/null @@ -1,3 +0,0 @@ -#greeting { - color: red; -} diff --git a/docs/1-trial-session/03-css/index.mdx b/docs/1-trial-session/03-css/index.mdx index 6ec61b5f0..f34ce28db 100644 --- a/docs/1-trial-session/03-css/index.mdx +++ b/docs/1-trial-session/03-css/index.mdx @@ -2,6 +2,11 @@ title: CSS --- +import yellowHelloCssHtml from "!!raw-loader!./_samples/yellow-hello-css/index.html"; +import yellowHelloCssCss from "!!raw-loader!./_samples/yellow-hello-css/style.css"; +import fooHtml from "!!raw-loader!./_samples/foo/index.html"; +import fooCss from "!!raw-loader!./_samples/foo/style.css"; + この節では、Web開発で用いられるもう一つの言語である、CSSについて学びます。CSSはWebサイトの「見た目」をつかさどる言語です。多くのHTML要素は、CSSを用いることで、その見た目を細かくカスタマイズすることができます。 ![Web開発で用いられる言語](../02-html/web-development-languages.drawio.svg) @@ -15,8 +20,6 @@ title: CSS
Hello World!
``` - - ![Hello World!](./red-hello-world.png) {/* prettier-ignore */} @@ -60,8 +63,6 @@ title: CSS } ``` - - ### `link`要素 ```html title="index.html" @@ -125,10 +126,18 @@ HTMLファイルとCSSファイルを分けて作成する場合、`style`属性 ``` + - - ## 演習問題2 次のような条件を満たす要素を選択するセレクタは何でしょうか。 @@ -183,6 +192,15 @@ HTMLファイルとCSSファイルを分けて作成する場合、`style`属性 } ``` - + diff --git a/docs/1-trial-session/06-variables/index.mdx b/docs/1-trial-session/06-variables/index.mdx index 6ab73f3dd..cbdd48813 100644 --- a/docs/1-trial-session/06-variables/index.mdx +++ b/docs/1-trial-session/06-variables/index.mdx @@ -2,6 +2,9 @@ title: 変数 --- +import counterHtml from "!!raw-loader!./_samples/counter/index.html"; +import counterJs from "!!raw-loader!./_samples/counter/script.js"; + ## 変数とは {/* prettier-ignore */} @@ -107,6 +110,15 @@ counter = counter + 1; document.write(counter); ``` - + diff --git a/docs/1-trial-session/07-boolean/index.mdx b/docs/1-trial-session/07-boolean/index.mdx index 43397e484..81363819a 100644 --- a/docs/1-trial-session/07-boolean/index.mdx +++ b/docs/1-trial-session/07-boolean/index.mdx @@ -2,6 +2,9 @@ title: 論理値と論理演算子 --- +import quizShowHtml from "!!raw-loader!./_samples/quiz-show/index.html"; +import quizShowJs from "!!raw-loader!./_samples/quiz-show/script.js"; + ## 論理値 {/* prettier-ignore */} @@ -92,11 +95,11 @@ document.write(takaoHeight < everestHeight < fujiHeight); document.write(takaoHeight = everestHeight); ``` - - - JavaScript で、数値と論理値に比較演算子を適用すると、`true`は`1`として、`false`は`0`として比較されます。 - `=`は代入演算子です。代入演算子の式が評価されると、右辺の値になります。 + + ::: ## 演習問題 @@ -131,6 +134,15 @@ const isTanakaWinner = tanakaScore >= 100 && tanakaScore - satoScore >= 20; document.write(isTanakaWinner); // true ``` - + diff --git a/docs/1-trial-session/08-if-statement/index.mdx b/docs/1-trial-session/08-if-statement/index.mdx index 6e21bb952..9057aec25 100644 --- a/docs/1-trial-session/08-if-statement/index.mdx +++ b/docs/1-trial-session/08-if-statement/index.mdx @@ -2,6 +2,9 @@ title: 条件分岐 --- +import theRightToVoteHtml from "!!raw-loader!./_samples/the-right-to-vote/index.html"; +import theRightToVoteJs from "!!raw-loader!./_samples/the-right-to-vote/script.js"; + ## if文 **if文**は、JavaScriptの**制御構造**で、特定の条件下のみで実行されるプログラムを記述することができます。 @@ -100,7 +103,16 @@ if (age < 18) { } ``` - + 4行目の式は`age >= 18 && age < 25`ではないかと思うかもしれませんが、上のように`age < 25`としても同じ結果になります。これは、if～else if～else構文では、一つ目の条件が満たされた場合、二つ目の条件は実行されないためです。 diff --git a/docs/1-trial-session/09-functions/_samples/max-no-else/index.html b/docs/1-trial-session/09-functions/_samples/index.html similarity index 100% rename from docs/1-trial-session/09-functions/_samples/max-no-else/index.html rename to docs/1-trial-session/09-functions/_samples/index.html diff --git a/docs/1-trial-session/09-functions/_samples/max-no-else/script.js b/docs/1-trial-session/09-functions/_samples/script.js similarity index 100% rename from docs/1-trial-session/09-functions/_samples/max-no-else/script.js rename to docs/1-trial-session/09-functions/_samples/script.js diff --git a/docs/1-trial-session/09-functions/index.mdx b/docs/1-trial-session/09-functions/index.mdx index ede6bbe7a..21791a1e6 100644 --- a/docs/1-trial-session/09-functions/index.mdx +++ b/docs/1-trial-session/09-functions/index.mdx @@ -3,6 +3,12 @@ title: 関数 --- import returnValueVideo from "./return-value.mp4"; +import multiplyHtml from "!!raw-loader!./_samples/multiply/index.html"; +import multiplyJs from "!!raw-loader!./_samples/multiply/script.js"; +import maxHtml from "!!raw-loader!./_samples/max/index.html"; +import maxJs from "!!raw-loader!./_samples/max/script.js"; +import mobilePhoneBillHtml from "!!raw-loader!./_samples/mobile-phone-bill/index.html"; +import mobilePhoneBillJs from "!!raw-loader!./_samples/mobile-phone-bill/script.js"; ## 処理の共通化 @@ -97,7 +103,16 @@ function multiply(a, b) { document.write(multiply(3, 4)); ``` - + @@ -187,7 +202,18 @@ function max(a, b) { } ``` - + + + :::note @@ -202,8 +228,6 @@ function max(a, b) { } ``` - - ::: @@ -238,6 +262,15 @@ function calculateCost(monthlyDataUsage) { document.write(calculateCost(3.5)); ``` - + diff --git a/docs/1-trial-session/10-loop/_samples/nested-loop/index.html b/docs/1-trial-session/10-loop/_samples/index.html similarity index 100% rename from docs/1-trial-session/10-loop/_samples/nested-loop/index.html rename to docs/1-trial-session/10-loop/_samples/index.html diff --git a/docs/1-trial-session/10-loop/_samples/nested-loop/script.js b/docs/1-trial-session/10-loop/_samples/script.js similarity index 100% rename from docs/1-trial-session/10-loop/_samples/nested-loop/script.js rename to docs/1-trial-session/10-loop/_samples/script.js diff --git a/docs/1-trial-session/10-loop/index.mdx b/docs/1-trial-session/10-loop/index.mdx index 3f5f8f2c7..29393e4c8 100644 --- a/docs/1-trial-session/10-loop/index.mdx +++ b/docs/1-trial-session/10-loop/index.mdx @@ -3,6 +3,14 @@ title: 繰り返し --- import whileLoopVideo from "./while-loop.mp4"; +import answerForHtml from "!!raw-loader!./_samples/answer-for/index.html"; +import answerForJs from "!!raw-loader!./_samples/answer-for/script.js"; +import productHtml from "!!raw-loader!./_samples/product/index.html"; +import productJs from "!!raw-loader!./_samples/product/script.js"; +import productAltHtml from "!!raw-loader!./_samples/product-alt/index.html"; +import productAltJs from "!!raw-loader!./_samples/product-alt/script.js"; +import isPrimeHtml from "!!raw-loader!./_samples/is-prime/index.html"; +import isPrimeJs from "!!raw-loader!./_samples/is-prime/script.js"; ## while文 @@ -102,7 +110,16 @@ for (let i = 1; i <= 10; i += 1) { document.write(sum); ``` - + @@ -149,7 +166,16 @@ for (let i = 1; i <= 10; i = i + 1) { document.write(product); ``` - + 別解 @@ -163,7 +189,16 @@ for (let i = 1; i <= 10; i += 1) { document.write(product); ``` - + @@ -205,6 +240,15 @@ document.write(checkPrime(57)); // false document.write(checkPrime(-1)); // false ``` - + diff --git a/docs/1-trial-session/11-array/index.mdx b/docs/1-trial-session/11-array/index.mdx index e6dd24f84..a50be9c67 100644 --- a/docs/1-trial-session/11-array/index.mdx +++ b/docs/1-trial-session/11-array/index.mdx @@ -2,6 +2,15 @@ title: 配列 --- +import arrayHtml from "!!raw-loader!./_samples/array/index.html"; +import arrayJs from "!!raw-loader!./_samples/array/script.js"; +import arraySumForOfHtml from "!!raw-loader!./_samples/array-sum-for-of/index.html"; +import arraySumForOfJs from "!!raw-loader!./_samples/array-sum-for-of/script.js"; +import arraySumSimpleForHtml from "!!raw-loader!./_samples/array-sum-simple-for/index.html"; +import arraySumSimpleForJs from "!!raw-loader!./_samples/array-sum-simple-for/script.js"; +import arrayMaxHtml from "!!raw-loader!./_samples/array-max/index.html"; +import arrayMaxJs from "!!raw-loader!./_samples/array-max/script.js"; + ## 配列 JavaScriptにおける配列は、複数の値を並べて一つにまとめた値です。`[`から`]`で囲まれた部分は配列を生成する式になります。 @@ -47,7 +56,16 @@ document.write([3, 2, 1][0]); `[3, 2, 1]`で配列が生成され、`[0]`で0番目の要素が指定されているので、`3`と表示されます。 - + @@ -129,7 +147,16 @@ for (const number of numbers) { document.write(`配列の合計値は ${sum} です。`); ``` - + 別解 @@ -146,7 +173,16 @@ for (let i = 0; i < numbers.length; i += 1) { document.write(`配列の合計値は ${sum} です。`); ``` - + @@ -194,6 +230,15 @@ document.write( 配列の長さにかかわらず配列の最初の値を使うような処理をする場合は、長さが0である空の配列を除外することを忘れないでください！ ::: - + diff --git a/docs/1-trial-session/12-object/index.mdx b/docs/1-trial-session/12-object/index.mdx index 74f7ac11f..78297a511 100644 --- a/docs/1-trial-session/12-object/index.mdx +++ b/docs/1-trial-session/12-object/index.mdx @@ -2,6 +2,15 @@ title: オブジェクト --- +import createUserObjectHtml from "!!raw-loader!./_samples/create-user-object/index.html"; +import createUserObjectJs from "!!raw-loader!./_samples/create-user-object/script.js"; +import changeBioPropertyHtml from "!!raw-loader!./_samples/change-bio-property/index.html"; +import changeBioPropertyJs from "!!raw-loader!./_samples/change-bio-property/script.js"; +import changeLanguagePropertyHtml from "!!raw-loader!./_samples/change-language-property/index.html"; +import changeLanguagePropertyJs from "!!raw-loader!./_samples/change-language-property/script.js"; +import averageScoreHtml from "!!raw-loader!./_samples/average-score/index.html"; +import averageScoreJs from "!!raw-loader!./_samples/average-score/script.js"; + ## オブジェクト JavaScriptで利用することができる値の種類として、これまで数値と文字列、論理値を扱いました。数値や文字列、論理値などの「それ以上分解できない」値のことを**プリミティブ**と呼びます。JavaScriptには、この他にも、**オブジェクト**と呼ばれる値が存在します。JavaScriptにおいて、プリミティブでない値はすべてオブジェクトです。 @@ -62,7 +71,16 @@ const user = { }; ``` - + @@ -104,7 +122,16 @@ user.bio = "JavaScriptでWebアプリを作っています。"; document.write(user.bio); // JavaScriptでWebアプリを作っています。 ``` - + @@ -157,7 +184,16 @@ user.settings.language = "English"; document.write(user.settings.language); // English ``` - + @@ -186,6 +222,15 @@ const averageScore = document.write(`平均点は${averageScore}点です。`); ``` - + diff --git a/docs/1-trial-session/13-dom/_samples/get-element-by-id/script.js b/docs/1-trial-session/13-dom/_samples/get-element-by-id/scripts.js similarity index 100% rename from docs/1-trial-session/13-dom/_samples/get-element-by-id/script.js rename to docs/1-trial-session/13-dom/_samples/get-element-by-id/scripts.js diff --git a/docs/1-trial-session/13-dom/index.mdx b/docs/1-trial-session/13-dom/index.mdx index c636a8215..d7d18a9ca 100644 --- a/docs/1-trial-session/13-dom/index.mdx +++ b/docs/1-trial-session/13-dom/index.mdx @@ -2,6 +2,17 @@ title: DOM --- +import goodEveningHtml from "!!raw-loader!./_samples/good-evening/index.html"; +import goodEveningJs from "!!raw-loader!./_samples/good-evening/script.js"; +import changeStylesHtml from "!!raw-loader!./_samples/change-styles/index.html"; +import changeStylesJs from "!!raw-loader!./_samples/change-styles/script.js"; +import addElementExerciseHtml from "!!raw-loader!./_samples/add-element-exercise/index.html"; +import addElementExerciseJs from "!!raw-loader!./_samples/add-element-exercise/script.js"; +import changeShoppingMemoHtml from "!!raw-loader!./_samples/change-shopping-memo/index.html"; +import changeShoppingMemoJs from "!!raw-loader!./_samples/change-shopping-memo/script.js"; +import fruitBasketHtml from "!!raw-loader!./_samples/fruit-basket/index.html"; +import fruitBasketJs from "!!raw-loader!./_samples/fruit-basket/script.js"; + ## HTML要素をJavaScriptで取得する {/* prettier-ignore */} @@ -63,7 +74,16 @@ const greetingType = document.getElementById("greeting-type"); greetingType.textContent = "evening"; ``` - + @@ -104,7 +124,16 @@ greetingElement.style.color = "yellow"; greetingElement.style.backgroundColor = "black"; ``` - + @@ -159,7 +188,16 @@ capElement.textContent = "帽子"; packingList.appendChild(capElement); ``` - + @@ -183,7 +221,16 @@ const targetItem = document.getElementById("item2"); targetItem.textContent = "レモン"; ``` - + @@ -214,6 +261,15 @@ for (const fruit of fruits) { } ``` - + diff --git a/docs/1-trial-session/14-events/index.mdx b/docs/1-trial-session/14-events/index.mdx index 4bebcc7ef..de3067b9c 100644 --- a/docs/1-trial-session/14-events/index.mdx +++ b/docs/1-trial-session/14-events/index.mdx @@ -4,6 +4,8 @@ title: イベント import handleClickVideo from "./handle-click.mp4"; import projectMovieForDom from "./project-movie-for-dom.mp4"; +import projectJackInABoxHtml from "!!raw-loader!./_samples/project-jack-in-a-box/index.html"; +import projectJackInABoxJs from "!!raw-loader!./_samples/project-jack-in-a-box/script.js"; ## 値としての関数 @@ -127,6 +129,15 @@ function onGreetingButtonClick() { buttonElement.onclick = onGreetingButtonClick; ``` - + diff --git a/docs/1-trial-session/15-project/index.mdx b/docs/1-trial-session/15-project/index.mdx index 769ac2ed8..bb02e8bd5 100644 --- a/docs/1-trial-session/15-project/index.mdx +++ b/docs/1-trial-session/15-project/index.mdx @@ -4,6 +4,10 @@ title: プロジェクト import omikujiVideo from "./omikuji.mp4"; import stopwatchVideo from "./stopwatch.mp4"; +import omikujiHtml from "!!raw-loader!./_samples/omikuji/index.html"; +import omikujiJs from "!!raw-loader!./_samples/omikuji/script.js"; +import stopwatchHtml from "!!raw-loader!./_samples/stopwatch/index.html"; +import stopwatchJs from "!!raw-loader!./_samples/stopwatch/script.js"; これまで学んできた知識を利用して、はじめてのWebアプリケーション作りに挑戦してみましょう。題材が思いつかない場合は、下の例を参考にしてみてください。 @@ -59,7 +63,20 @@ omikujiButton.onclick = omikuji; ### 解答例 - + + + + + ## ストップウォッチ @@ -128,4 +145,16 @@ stopButton.onclick = stop; ### 解答例 - + + + + diff --git a/package-lock.json b/package-lock.json index 65de06172..7f5a85c71 100644 --- a/package-lock.json +++ b/package-lock.json @@ -8,6 +8,7 @@ "name": "utcode-learn", "version": "0.0.0", "dependencies": { + "@codesandbox/sandpack-react": "^2.20.0", "@docusaurus/core": "^3.9.1", "@docusaurus/plugin-content-docs": "^3.9.1", "@docusaurus/preset-classic": "^3.9.1", @@ -34,6 +35,7 @@ "@docusaurus/types": "^3.9.1", "@types/react-slick": "^0.23.13", "prettier": "^3.6.2", + "raw-loader": "^4.0.2", "typescript": "^5.9.3" }, "engines": { @@ -2111,6 +2113,191 @@ "integrity": "sha512-YslZMgtJUyuMbZ+aKvfF3x1f5liK4mWNxghFRv7jqRR9C3R3fAOGTTKvxXDa2Y1s9zSbcpuO0cAxDYsc9SrXoQ==", "license": "Apache-2.0" }, + "node_modules/@codemirror/autocomplete": { + "version": "6.19.1", + "resolved": "https://registry.npmjs.org/@codemirror/autocomplete/-/autocomplete-6.19.1.tgz", + "integrity": "sha512-q6NenYkEy2fn9+JyjIxMWcNjzTL/IhwqfzOut1/G3PrIFkrbl4AL7Wkse5tLrQUUyqGoAKU5+Pi5jnnXxH5HGw==", + "license": "MIT", + "dependencies": { + "@codemirror/language": "^6.0.0", + "@codemirror/state": "^6.0.0", + "@codemirror/view": "^6.17.0", + "@lezer/common": "^1.0.0" + } + }, + "node_modules/@codemirror/commands": { + "version": "6.10.0", + "resolved": "https://registry.npmjs.org/@codemirror/commands/-/commands-6.10.0.tgz", + "integrity": "sha512-2xUIc5mHXQzT16JnyOFkh8PvfeXuIut3pslWGfsGOhxP/lpgRm9HOl/mpzLErgt5mXDovqA0d11P21gofRLb9w==", + "license": "MIT", + "dependencies": { + "@codemirror/language": "^6.0.0", + "@codemirror/state": "^6.4.0", + "@codemirror/view": "^6.27.0", + "@lezer/common": "^1.1.0" + } + }, + "node_modules/@codemirror/lang-css": { + "version": "6.3.1", + "resolved": "https://registry.npmjs.org/@codemirror/lang-css/-/lang-css-6.3.1.tgz", + "integrity": "sha512-kr5fwBGiGtmz6l0LSJIbno9QrifNMUusivHbnA1H6Dmqy4HZFte3UAICix1VuKo0lMPKQr2rqB+0BkKi/S3Ejg==", + "license": "MIT", + "dependencies": { + "@codemirror/autocomplete": "^6.0.0", + "@codemirror/language": "^6.0.0", + "@codemirror/state": "^6.0.0", + "@lezer/common": "^1.0.2", + "@lezer/css": "^1.1.7" + } + }, + "node_modules/@codemirror/lang-html": { + "version": "6.4.11", + "resolved": "https://registry.npmjs.org/@codemirror/lang-html/-/lang-html-6.4.11.tgz", + "integrity": "sha512-9NsXp7Nwp891pQchI7gPdTwBuSuT3K65NGTHWHNJ55HjYcHLllr0rbIZNdOzas9ztc1EUVBlHou85FFZS4BNnw==", + "license": "MIT", + "dependencies": { + "@codemirror/autocomplete": "^6.0.0", + "@codemirror/lang-css": "^6.0.0", + "@codemirror/lang-javascript": "^6.0.0", + "@codemirror/language": "^6.4.0", + "@codemirror/state": "^6.0.0", + "@codemirror/view": "^6.17.0", + "@lezer/common": "^1.0.0", + "@lezer/css": "^1.1.0", + "@lezer/html": "^1.3.12" + } + }, + "node_modules/@codemirror/lang-javascript": { + "version": "6.2.4", + "resolved": "https://registry.npmjs.org/@codemirror/lang-javascript/-/lang-javascript-6.2.4.tgz", + "integrity": "sha512-0WVmhp1QOqZ4Rt6GlVGwKJN3KW7Xh4H2q8ZZNGZaP6lRdxXJzmjm4FqvmOojVj6khWJHIb9sp7U/72W7xQgqAA==", + "license": "MIT", + "dependencies": { + "@codemirror/autocomplete": "^6.0.0", + "@codemirror/language": "^6.6.0", + "@codemirror/lint": "^6.0.0", + "@codemirror/state": "^6.0.0", + "@codemirror/view": "^6.17.0", + "@lezer/common": "^1.0.0", + "@lezer/javascript": "^1.0.0" + } + }, + "node_modules/@codemirror/language": { + "version": "6.11.3", + "resolved": "https://registry.npmjs.org/@codemirror/language/-/language-6.11.3.tgz", + "integrity": "sha512-9HBM2XnwDj7fnu0551HkGdrUrrqmYq/WC5iv6nbY2WdicXdGbhR/gfbZOH73Aqj4351alY1+aoG9rCNfiwS1RA==", + "license": "MIT", + "dependencies": { + "@codemirror/state": "^6.0.0", + "@codemirror/view": "^6.23.0", + "@lezer/common": "^1.1.0", + "@lezer/highlight": "^1.0.0", + "@lezer/lr": "^1.0.0", + "style-mod": "^4.0.0" + } + }, + "node_modules/@codemirror/lint": { + "version": "6.9.1", + "resolved": "https://registry.npmjs.org/@codemirror/lint/-/lint-6.9.1.tgz", + "integrity": "sha512-te7To1EQHePBQQzasDKWmK2xKINIXpk+xAiSYr9ZN+VB4KaT+/Hi2PEkeErTk5BV3PTz1TLyQL4MtJfPkKZ9sw==", + "license": "MIT", + "dependencies": { + "@codemirror/state": "^6.0.0", + "@codemirror/view": "^6.35.0", + "crelt": "^1.0.5" + } + }, + "node_modules/@codemirror/state": { + "version": "6.5.2", + "resolved": "https://registry.npmjs.org/@codemirror/state/-/state-6.5.2.tgz", + "integrity": "sha512-FVqsPqtPWKVVL3dPSxy8wEF/ymIEuVzF1PK3VbUgrxXpJUSHQWWZz4JMToquRxnkw+36LTamCZG2iua2Ptq0fA==", + "license": "MIT", + "dependencies": { + "@marijn/find-cluster-break": "^1.0.0" + } + }, + "node_modules/@codemirror/view": { + "version": "6.38.6", + "resolved": "https://registry.npmjs.org/@codemirror/view/-/view-6.38.6.tgz", + "integrity": "sha512-qiS0z1bKs5WOvHIAC0Cybmv4AJSkAXgX5aD6Mqd2epSLlVJsQl8NG23jCVouIgkh4All/mrbdsf2UOLFnJw0tw==", + "license": "MIT", + "dependencies": { + "@codemirror/state": "^6.5.0", + "crelt": "^1.0.6", + "style-mod": "^4.1.0", + "w3c-keyname": "^2.2.4" + } + }, + "node_modules/@codesandbox/nodebox": { + "version": "0.1.8", + "resolved": "https://registry.npmjs.org/@codesandbox/nodebox/-/nodebox-0.1.8.tgz", + "integrity": "sha512-2VRS6JDSk+M+pg56GA6CryyUSGPjBEe8Pnae0QL3jJF1mJZJVMDKr93gJRtBbLkfZN6LD/DwMtf+2L0bpWrjqg==", + "license": "SEE LICENSE IN ./LICENSE", + "dependencies": { + "outvariant": "^1.4.0", + "strict-event-emitter": "^0.4.3" + } + }, + "node_modules/@codesandbox/sandpack-client": { + "version": "2.19.8", + "resolved": "https://registry.npmjs.org/@codesandbox/sandpack-client/-/sandpack-client-2.19.8.tgz", + "integrity": "sha512-CMV4nr1zgKzVpx4I3FYvGRM5YT0VaQhALMW9vy4wZRhEyWAtJITQIqZzrTGWqB1JvV7V72dVEUCUPLfYz5hgJQ==", + "license": "Apache-2.0", + "dependencies": { + "@codesandbox/nodebox": "0.1.8", + "buffer": "^6.0.3", + "dequal": "^2.0.2", + "mime-db": "^1.52.0", + "outvariant": "1.4.0", + "static-browser-server": "1.0.3" + } + }, + "node_modules/@codesandbox/sandpack-client/node_modules/mime-db": { + "version": "1.54.0", + "resolved": "https://registry.npmjs.org/mime-db/-/mime-db-1.54.0.tgz", + "integrity": "sha512-aU5EJuIN2WDemCcAp2vFBfp/m4EAhWJnUNSSw0ixs7/kXbd6Pg64EmwJkNdFhB8aWt1sH2CTXrLxo/iAGV3oPQ==", + "license": "MIT", + "engines": { + "node": ">= 0.6" + } + }, + "node_modules/@codesandbox/sandpack-react": { + "version": "2.20.0", + "resolved": "https://registry.npmjs.org/@codesandbox/sandpack-react/-/sandpack-react-2.20.0.tgz", + "integrity": "sha512-takd1YpW/PMQ6KPQfvseWLHWklJovGY8QYj8MtWnskGKbjOGJ6uZfyZbcJ6aCFLQMpNyjTqz9AKNbvhCOZ1TUQ==", + "license": "Apache-2.0", + "dependencies": { + "@codemirror/autocomplete": "^6.4.0", + "@codemirror/commands": "^6.1.3", + "@codemirror/lang-css": "^6.0.1", + "@codemirror/lang-html": "^6.4.0", + "@codemirror/lang-javascript": "^6.1.2", + "@codemirror/language": "^6.3.2", + "@codemirror/state": "^6.2.0", + "@codemirror/view": "^6.7.1", + "@codesandbox/sandpack-client": "^2.19.8", + "@lezer/highlight": "^1.1.3", + "@react-hook/intersection-observer": "^3.1.1", + "@stitches/core": "^1.2.6", + "anser": "^2.1.1", + "clean-set": "^1.1.2", + "dequal": "^2.0.2", + "escape-carriage": "^1.3.1", + "lz-string": "^1.4.4", + "react-devtools-inline": "4.4.0", + "react-is": "^17.0.2" + }, + "peerDependencies": { + "react": "^16.8.0 || ^17 || ^18 || ^19", + "react-dom": "^16.8.0 || ^17 || ^18 || ^19" + } + }, + "node_modules/@codesandbox/sandpack-react/node_modules/react-is": { + "version": "17.0.2", + "resolved": "https://registry.npmjs.org/react-is/-/react-is-17.0.2.tgz", + "integrity": "sha512-w2GsyukL62IJnlaff/nRegPQR94C/XXamvMWmSHRJ4y7Ts/4ocGRmTHvOs8PSE6pB3dWOrD/nueuU5sduBsQ4w==", + "license": "MIT" + }, "node_modules/@colors/colors": { "version": "1.5.0", "resolved": "https://registry.npmjs.org/@colors/colors/-/colors-1.5.0.tgz", @@ -4503,6 +4690,69 @@ "integrity": "sha512-Vo+PSpZG2/fmgmiNzYK9qWRh8h/CHrwD0mo1h1DzL4yzHNSfWYujGTYsWGreD000gcgmZ7K4Ys6Tx9TxtsKdDw==", "license": "MIT" }, + "node_modules/@lezer/common": { + "version": "1.3.0", + "resolved": "https://registry.npmjs.org/@lezer/common/-/common-1.3.0.tgz", + "integrity": "sha512-L9X8uHCYU310o99L3/MpJKYxPzXPOS7S0NmBaM7UO/x2Kb2WbmMLSkfvdr1KxRIFYOpbY0Jhn7CfLSUDzL8arQ==", + "license": "MIT" + }, + "node_modules/@lezer/css": { + "version": "1.3.0", + "resolved": "https://registry.npmjs.org/@lezer/css/-/css-1.3.0.tgz", + "integrity": "sha512-pBL7hup88KbI7hXnZV3PQsn43DHy6TWyzuyk2AO9UyoXcDltvIdqWKE1dLL/45JVZ+YZkHe1WVHqO6wugZZWcw==", + "license": "MIT", + "dependencies": { + "@lezer/common": "^1.2.0", + "@lezer/highlight": "^1.0.0", + "@lezer/lr": "^1.3.0" + } + }, + "node_modules/@lezer/highlight": { + "version": "1.2.2", + "resolved": "https://registry.npmjs.org/@lezer/highlight/-/highlight-1.2.2.tgz", + "integrity": "sha512-z8TQwaBXXQIvG6i2g3e9cgMwUUXu9Ib7jo2qRRggdhwKpM56Dw3PM3wmexn+EGaaOZ7az0K7sjc3/gcGW7sz7A==", + "license": "MIT", + "dependencies": { + "@lezer/common": "^1.3.0" + } + }, + "node_modules/@lezer/html": { + "version": "1.3.12", + "resolved": "https://registry.npmjs.org/@lezer/html/-/html-1.3.12.tgz", + "integrity": "sha512-RJ7eRWdaJe3bsiiLLHjCFT1JMk8m1YP9kaUbvu2rMLEoOnke9mcTVDyfOslsln0LtujdWespjJ39w6zo+RsQYw==", + "license": "MIT", + "dependencies": { + "@lezer/common": "^1.2.0", + "@lezer/highlight": "^1.0.0", + "@lezer/lr": "^1.0.0" + } + }, + "node_modules/@lezer/javascript": { + "version": "1.5.4", + "resolved": "https://registry.npmjs.org/@lezer/javascript/-/javascript-1.5.4.tgz", + "integrity": "sha512-vvYx3MhWqeZtGPwDStM2dwgljd5smolYD2lR2UyFcHfxbBQebqx8yjmFmxtJ/E6nN6u1D9srOiVWm3Rb4tmcUA==", + "license": "MIT", + "dependencies": { + "@lezer/common": "^1.2.0", + "@lezer/highlight": "^1.1.3", + "@lezer/lr": "^1.3.0" + } + }, + "node_modules/@lezer/lr": { + "version": "1.4.2", + "resolved": "https://registry.npmjs.org/@lezer/lr/-/lr-1.4.2.tgz", + "integrity": "sha512-pu0K1jCIdnQ12aWNaAVU5bzi7Bd1w54J3ECgANPmYLtQKP0HBj2cE/5coBD66MT10xbtIuUr7tg0Shbsvk0mDA==", + "license": "MIT", + "dependencies": { + "@lezer/common": "^1.0.0" + } + }, + "node_modules/@marijn/find-cluster-break": { + "version": "1.0.2", + "resolved": "https://registry.npmjs.org/@marijn/find-cluster-break/-/find-cluster-break-1.0.2.tgz", + "integrity": "sha512-l0h88YhZFyKdXIFNfSWpyjStDjGHwZ/U7iobcK1cQQD8sejsONdQtTVU+1wVN1PBw40PiiHB1vA5S7VTfQiP9g==", + "license": "MIT" + }, "node_modules/@mdx-js/mdx": { "version": "3.1.1", "resolved": "https://registry.npmjs.org/@mdx-js/mdx/-/mdx-3.1.1.tgz", @@ -4867,6 +5117,12 @@ "node": ">= 8" } }, + "node_modules/@open-draft/deferred-promise": { + "version": "2.2.0", + "resolved": "https://registry.npmjs.org/@open-draft/deferred-promise/-/deferred-promise-2.2.0.tgz", + "integrity": "sha512-CecwLWx3rhxVQF6V4bAgPS5t+So2sTbPgAzafKkVizyi7tlwpcFpdFqq+wqF2OwNBmqFuu6tOyouTuxgpMfzmA==", + "license": "MIT" + }, "node_modules/@opentelemetry/api": { "version": "1.9.0", "resolved": "https://registry.npmjs.org/@opentelemetry/api/-/api-1.9.0.tgz", @@ -4933,6 +5189,28 @@ "url": "https://opencollective.com/popperjs" } }, + "node_modules/@react-hook/intersection-observer": { + "version": "3.1.2", + "resolved": "https://registry.npmjs.org/@react-hook/intersection-observer/-/intersection-observer-3.1.2.tgz", + "integrity": "sha512-mWU3BMkmmzyYMSuhO9wu3eJVP21N8TcgYm9bZnTrMwuM818bEk+0NRM3hP+c/TqA9Ln5C7qE53p1H0QMtzYdvQ==", + "license": "MIT", + "dependencies": { + "@react-hook/passive-layout-effect": "^1.2.0", + "intersection-observer": "^0.10.0" + }, + "peerDependencies": { + "react": ">=16.8" + } + }, + "node_modules/@react-hook/passive-layout-effect": { + "version": "1.2.1", + "resolved": "https://registry.npmjs.org/@react-hook/passive-layout-effect/-/passive-layout-effect-1.2.1.tgz", + "integrity": "sha512-IwEphTD75liO8g+6taS+4oqz+nnroocNfWVHWz7j+N+ZO2vYrc6PV1q7GQhuahL0IOR7JccFTsFKQ/mb6iZWAg==", + "license": "MIT", + "peerDependencies": { + "react": ">=16.8" + } + }, "node_modules/@sideway/address": { "version": "4.1.5", "resolved": "https://registry.npmjs.org/@sideway/address/-/address-4.1.5.tgz", @@ -4989,6 +5267,12 @@ "integrity": "sha512-m2bOd0f2RT9k8QJx1JN85cZYyH1RqFBdlwtkSlf4tBDYLCiiZnv1fIIwacK6cqwXavOydf0NPToMQgpKq+dVlA==", "license": "MIT" }, + "node_modules/@stitches/core": { + "version": "1.2.8", + "resolved": "https://registry.npmjs.org/@stitches/core/-/core-1.2.8.tgz", + "integrity": "sha512-Gfkvwk9o9kE9r9XNBmJRfV8zONvXThnm1tcuojL04Uy5uRyqg93DC83lDebl0rocZCfKSjUv+fWYtMQmEDJldg==", + "license": "MIT" + }, "node_modules/@svgr/babel-plugin-add-jsx-attribute": { "version": "8.0.0", "resolved": "https://registry.npmjs.org/@svgr/babel-plugin-add-jsx-attribute/-/babel-plugin-add-jsx-attribute-8.0.0.tgz", @@ -6323,6 +6607,12 @@ "algoliasearch": ">= 3.1 < 6" } }, + "node_modules/anser": { + "version": "2.3.2", + "resolved": "https://registry.npmjs.org/anser/-/anser-2.3.2.tgz", + "integrity": "sha512-PMqBCBvrOVDRqLGooQb+z+t1Q0PiPyurUQeZRR5uHBOVZcW8B04KMmnT12USnhpNX2wCPagWzLVppQMUG3u0Dw==", + "license": "MIT" + }, "node_modules/ansi-align": { "version": "3.0.1", "resolved": "https://registry.npmjs.org/ansi-align/-/ansi-align-3.0.1.tgz", @@ -6591,6 +6881,26 @@ "integrity": "sha512-3oSeUO0TMV67hN1AmbXsK4yaqU7tjiHlbxRDZOpH0KW9+CeX4bRAaX0Anxt0tx2MrpRpWwQaPwIlISEJhYU5Pw==", "license": "MIT" }, + "node_modules/base64-js": { + "version": "1.5.1", + "resolved": "https://registry.npmjs.org/base64-js/-/base64-js-1.5.1.tgz", + "integrity": "sha512-AKpaYlHn8t4SVbOHCy+b5+KKgvR4vrsD8vbvrbiQJps7fKDTkjkDry6ji0rUJjC0kzbNePLwzxq8iypo41qeWA==", + "funding": [ + { + "type": "github", + "url": "https://github.com/sponsors/feross" + }, + { + "type": "patreon", + "url": "https://www.patreon.com/feross" + }, + { + "type": "consulting", + "url": "https://feross.org/support" + } + ], + "license": "MIT" + }, "node_modules/baseline-browser-mapping": { "version": "2.8.8", "resolved": "https://registry.npmjs.org/baseline-browser-mapping/-/baseline-browser-mapping-2.8.8.tgz", @@ -6781,6 +7091,30 @@ "node": "^6 || ^7 || ^8 || ^9 || ^10 || ^11 || ^12 || >=13.7" } }, + "node_modules/buffer": { + "version": "6.0.3", + "resolved": "https://registry.npmjs.org/buffer/-/buffer-6.0.3.tgz", + "integrity": "sha512-FTiCpNxtwiZZHEZbcbTIcZjERVICn9yq/pDFkTl95/AxzD1naBctN7YO68riM/gLSDY7sdrMby8hofADYuuqOA==", + "funding": [ + { + "type": "github", + "url": "https://github.com/sponsors/feross" + }, + { + "type": "patreon", + "url": "https://www.patreon.com/feross" + }, + { + "type": "consulting", + "url": "https://feross.org/support" + } + ], + "license": "MIT", + "dependencies": { + "base64-js": "^1.3.1", + "ieee754": "^1.2.1" + } + }, "node_modules/buffer-from": { "version": "1.1.2", "resolved": "https://registry.npmjs.org/buffer-from/-/buffer-from-1.1.2.tgz", @@ -7163,6 +7497,12 @@ "node": ">=0.10.0" } }, + "node_modules/clean-set": { + "version": "1.1.2", + "resolved": "https://registry.npmjs.org/clean-set/-/clean-set-1.1.2.tgz", + "integrity": "sha512-cA8uCj0qSoG9e0kevyOWXwPaELRPVg5Pxp6WskLMwerx257Zfnh8Nl0JBH59d7wQzij2CK7qEfJQK3RjuKKIug==", + "license": "MIT" + }, "node_modules/clean-stack": { "version": "2.2.0", "resolved": "https://registry.npmjs.org/clean-stack/-/clean-stack-2.2.0.tgz", @@ -7632,6 +7972,12 @@ } } }, + "node_modules/crelt": { + "version": "1.0.6", + "resolved": "https://registry.npmjs.org/crelt/-/crelt-1.0.6.tgz", + "integrity": "sha512-VQ2MBenTq1fWZUH9DJNGti7kKv6EeAuYr3cLwxUWhIu1baTaXh4Ib5W2CqHVqib4/MqbYGJqiL3Zb8GJZr3l4g==", + "license": "MIT" + }, "node_modules/cross-spawn": { "version": "7.0.6", "resolved": "https://registry.npmjs.org/cross-spawn/-/cross-spawn-7.0.6.tgz", @@ -8141,6 +8487,19 @@ "integrity": "sha512-dp3s92+uNI1hWIpPGH3jK2kxE2lMjdXdr+DH8ynZHpd6PUlH6x6cbuXnoMmiNumznqaNO31xu9e79F0uuZ0JFg==", "license": "MIT" }, + "node_modules/d": { + "version": "1.0.2", + "resolved": "https://registry.npmjs.org/d/-/d-1.0.2.tgz", + "integrity": "sha512-MOqHvMWF9/9MX6nza0KgvFH4HpMU0EF5uUDXqX/BtxtU8NfB0QzRtJ8Oe/6SuS4kbhyzVJwjd97EA4PKrzJ8bw==", + "license": "ISC", + "dependencies": { + "es5-ext": "^0.10.64", + "type": "^2.7.2" + }, + "engines": { + "node": ">=0.12" + } + }, "node_modules/d3": { "version": "7.9.0", "resolved": "https://registry.npmjs.org/d3/-/d3-7.9.0.tgz", @@ -8973,6 +9332,18 @@ "node": ">=8" } }, + "node_modules/dotenv": { + "version": "16.6.1", + "resolved": "https://registry.npmjs.org/dotenv/-/dotenv-16.6.1.tgz", + "integrity": "sha512-uBq4egWHTcTt33a72vpSG0z3HnPuIl6NqYcTrKEg2azoEyl2hpW0zqlxysq2pK9HlDIHyHyakeYaYnSAwd8bow==", + "license": "BSD-2-Clause", + "engines": { + "node": ">=12" + }, + "funding": { + "url": "https://dotenvx.com" + } + }, "node_modules/dunder-proto": { "version": "1.0.1", "resolved": "https://registry.npmjs.org/dunder-proto/-/dunder-proto-1.0.1.tgz", @@ -9134,6 +9505,46 @@ "node": ">= 0.4" } }, + "node_modules/es5-ext": { + "version": "0.10.64", + "resolved": "https://registry.npmjs.org/es5-ext/-/es5-ext-0.10.64.tgz", + "integrity": "sha512-p2snDhiLaXe6dahss1LddxqEm+SkuDvV8dnIQG0MWjyHpcMNfXKPE+/Cc0y+PhxJX3A4xGNeFCj5oc0BUh6deg==", + "hasInstallScript": true, + "license": "ISC", + "dependencies": { + "es6-iterator": "^2.0.3", + "es6-symbol": "^3.1.3", + "esniff": "^2.0.1", + "next-tick": "^1.1.0" + }, + "engines": { + "node": ">=0.10" + } + }, + "node_modules/es6-iterator": { + "version": "2.0.3", + "resolved": "https://registry.npmjs.org/es6-iterator/-/es6-iterator-2.0.3.tgz", + "integrity": "sha512-zw4SRzoUkd+cl+ZoE15A9o1oQd920Bb0iOJMQkQhl3jNc03YqVjAhG7scf9C5KWRU/R13Orf588uCC6525o02g==", + "license": "MIT", + "dependencies": { + "d": "1", + "es5-ext": "^0.10.35", + "es6-symbol": "^3.1.1" + } + }, + "node_modules/es6-symbol": { + "version": "3.1.4", + "resolved": "https://registry.npmjs.org/es6-symbol/-/es6-symbol-3.1.4.tgz", + "integrity": "sha512-U9bFFjX8tFiATgtkJ1zg25+KviIXpgRvRHS8sau3GfhVzThRQrOeksPeT0BWW2MNZs1OEWJ1DPXOQMn0KKRkvg==", + "license": "ISC", + "dependencies": { + "d": "^1.0.2", + "ext": "^1.7.0" + }, + "engines": { + "node": ">=0.12" + } + }, "node_modules/esast-util-from-estree": { "version": "2.0.0", "resolved": "https://registry.npmjs.org/esast-util-from-estree/-/esast-util-from-estree-2.0.0.tgz", @@ -9175,6 +9586,12 @@ "node": ">=6" } }, + "node_modules/escape-carriage": { + "version": "1.3.1", + "resolved": "https://registry.npmjs.org/escape-carriage/-/escape-carriage-1.3.1.tgz", + "integrity": "sha512-GwBr6yViW3ttx1kb7/Oh+gKQ1/TrhYwxKqVmg5gS+BK+Qe2KrOa/Vh7w3HPBvgGf0LfcDGoY9I6NHKoA5Hozhw==", + "license": "MIT" + }, "node_modules/escape-goat": { "version": "4.0.0", "resolved": "https://registry.npmjs.org/escape-goat/-/escape-goat-4.0.0.tgz", @@ -9218,6 +9635,21 @@ "node": ">=8.0.0" } }, + "node_modules/esniff": { + "version": "2.0.1", + "resolved": "https://registry.npmjs.org/esniff/-/esniff-2.0.1.tgz", + "integrity": "sha512-kTUIGKQ/mDPFoJ0oVfcmyJn4iBDRptjNVIzwIFR7tqWXdVI9xfA2RMwY/gbSpJG3lkdWNEjLap/NqVHZiJsdfg==", + "license": "ISC", + "dependencies": { + "d": "^1.0.1", + "es5-ext": "^0.10.62", + "event-emitter": "^0.3.5", + "type": "^2.7.2" + }, + "engines": { + "node": ">=0.10" + } + }, "node_modules/esprima": { "version": "4.0.1", "resolved": "https://registry.npmjs.org/esprima/-/esprima-4.0.1.tgz", @@ -9406,6 +9838,16 @@ "node": ">= 0.8" } }, + "node_modules/event-emitter": { + "version": "0.3.5", + "resolved": "https://registry.npmjs.org/event-emitter/-/event-emitter-0.3.5.tgz", + "integrity": "sha512-D9rRn9y7kLPnJ+hMq7S/nhvoKwwvVJahBi2BPmx3bvbsEdK3W9ii8cBSGjP+72/LnM4n6fo3+dkCX5FeTQruXA==", + "license": "MIT", + "dependencies": { + "d": "1", + "es5-ext": "~0.10.14" + } + }, "node_modules/eventemitter3": { "version": "4.0.7", "resolved": "https://registry.npmjs.org/eventemitter3/-/eventemitter3-4.0.7.tgz", @@ -9547,6 +9989,15 @@ "integrity": "sha512-VO5fQUzZtI6C+vx4w/4BWJpg3s/5l+6pRQEHzFRM8WFi4XffSP1Z+4qi7GbjWbvRQEbdIco5mIMq+zX4rPuLrw==", "license": "MIT" }, + "node_modules/ext": { + "version": "1.7.0", + "resolved": "https://registry.npmjs.org/ext/-/ext-1.7.0.tgz", + "integrity": "sha512-6hxeJYaL110a9b5TEJSj0gojyHQAmA2ch5Os+ySCiA1QGdS697XWY1pzsrSjqA9LDEEgdB/KypIlR59RcLuHYw==", + "license": "ISC", + "dependencies": { + "type": "^2.7.2" + } + }, "node_modules/extend": { "version": "3.0.2", "resolved": "https://registry.npmjs.org/extend/-/extend-3.0.2.tgz", @@ -10875,6 +11326,26 @@ "postcss": "^8.1.0" } }, + "node_modules/ieee754": { + "version": "1.2.1", + "resolved": "https://registry.npmjs.org/ieee754/-/ieee754-1.2.1.tgz", + "integrity": "sha512-dcyqhDvX1C46lXZcVqCpK+FtMRQVdIMN6/Df5js2zouUsqG7I6sFxitIC+7KYK29KdXOLHdu9zL4sFnoVQnqaA==", + "funding": [ + { + "type": "github", + "url": "https://github.com/sponsors/feross" + }, + { + "type": "patreon", + "url": "https://www.patreon.com/feross" + }, + { + "type": "consulting", + "url": "https://feross.org/support" + } + ], + "license": "BSD-3-Clause" + }, "node_modules/ignore": { "version": "5.3.2", "resolved": "https://registry.npmjs.org/ignore/-/ignore-5.3.2.tgz", @@ -10984,6 +11455,13 @@ "node": ">=12" } }, + "node_modules/intersection-observer": { + "version": "0.10.0", + "resolved": "https://registry.npmjs.org/intersection-observer/-/intersection-observer-0.10.0.tgz", + "integrity": "sha512-fn4bQ0Xq8FTej09YC/jqKZwtijpvARlRp6wxL5WTA6yPe2YWSJ5RJh7Nm79rK2qB0wr6iDQzH60XGq5V/7u8YQ==", + "deprecated": "The Intersection Observer polyfill is no longer needed and can safely be removed. Intersection Observer has been Baseline since 2019.", + "license": "W3C-20150513" + }, "node_modules/invariant": { "version": "2.2.4", "resolved": "https://registry.npmjs.org/invariant/-/invariant-2.2.4.tgz", @@ -11796,6 +12274,15 @@ "integrity": "sha512-hWUAb2KqM3L7J5bcrngszzISY4BxrXn/Xhbb9TTCJYEGqlR1nG67/M14sp09+PTIRklobrn57IAxcdcO/ZFyNA==", "license": "MPL-1.1" }, + "node_modules/lz-string": { + "version": "1.5.0", + "resolved": "https://registry.npmjs.org/lz-string/-/lz-string-1.5.0.tgz", + "integrity": "sha512-h5bgJWpxJNswbU7qCrV0tIKQCaS3blPDrqKWx+QxzuzL1zGUzij9XCWLrSLsJPu5t+eWA/ycetzYAO5IOMcWAQ==", + "license": "MIT", + "bin": { + "lz-string": "bin/bin.js" + } + }, "node_modules/mark.js": { "version": "8.11.1", "resolved": "https://registry.npmjs.org/mark.js/-/mark.js-8.11.1.tgz", @@ -14423,6 +14910,12 @@ "integrity": "sha512-Yd3UES5mWCSqR+qNT93S3UoYUkqAZ9lLg8a7g9rimsWmYGK8cVToA4/sF3RrshdyV3sAGMXVUmpMYOw+dLpOuw==", "license": "MIT" }, + "node_modules/next-tick": { + "version": "1.1.0", + "resolved": "https://registry.npmjs.org/next-tick/-/next-tick-1.1.0.tgz", + "integrity": "sha512-CXdUiJembsNjuToQvxayPZF9Vqht7hewsvy2sOWafLvi2awflj9mOC6bHIg50orX8IJvWKY9wYQ/zB2kogPslQ==", + "license": "ISC" + }, "node_modules/no-case": { "version": "3.0.4", "resolved": "https://registry.npmjs.org/no-case/-/no-case-3.0.4.tgz", @@ -14717,6 +15210,12 @@ "integrity": "sha512-KiOAIsdpUTcAXuykya5fnVVT+/5uS0Q1mrkRHcF89tpieSmY33O/tmc54CqwA+bfhbtEfZUNLHaPUiB9X3jt1A==", "license": "MIT" }, + "node_modules/outvariant": { + "version": "1.4.0", + "resolved": "https://registry.npmjs.org/outvariant/-/outvariant-1.4.0.tgz", + "integrity": "sha512-AlWY719RF02ujitly7Kk/0QlV+pXGFDHrHf9O2OKqyqgBieaPOIeuSkL8sRK6j2WK+/ZAURq2kZsY0d8JapUiw==", + "license": "MIT" + }, "node_modules/p-cancelable": { "version": "3.0.0", "resolved": "https://registry.npmjs.org/p-cancelable/-/p-cancelable-3.0.0.tgz", @@ -16835,6 +17334,80 @@ "node": ">=0.10.0" } }, + "node_modules/raw-loader": { + "version": "4.0.2", + "resolved": "https://registry.npmjs.org/raw-loader/-/raw-loader-4.0.2.tgz", + "integrity": "sha512-ZnScIV3ag9A4wPX/ZayxL/jZH+euYb6FcUinPcgiQW0+UBtEv0O6Q3lGd3cqJ+GHH+rksEv3Pj99oxJ3u3VIKA==", + "dev": true, + "license": "MIT", + "dependencies": { + "loader-utils": "^2.0.0", + "schema-utils": "^3.0.0" + }, + "engines": { + "node": ">= 10.13.0" + }, + "funding": { + "type": "opencollective", + "url": "https://opencollective.com/webpack" + }, + "peerDependencies": { + "webpack": "^4.0.0 || ^5.0.0" + } + }, + "node_modules/raw-loader/node_modules/ajv": { + "version": "6.12.6", + "resolved": "https://registry.npmjs.org/ajv/-/ajv-6.12.6.tgz", + "integrity": "sha512-j3fVLgvTo527anyYyJOGTYJbG+vnnQYvE0m5mmkc1TK+nxAppkCLMIL0aZ4dblVCNoGShhm+kzE4ZUykBoMg4g==", + "dev": true, + "license": "MIT", + "dependencies": { + "fast-deep-equal": "^3.1.1", + "fast-json-stable-stringify": "^2.0.0", + "json-schema-traverse": "^0.4.1", + "uri-js": "^4.2.2" + }, + "funding": { + "type": "github", + "url": "https://github.com/sponsors/epoberezkin" + } + }, + "node_modules/raw-loader/node_modules/ajv-keywords": { + "version": "3.5.2", + "resolved": "https://registry.npmjs.org/ajv-keywords/-/ajv-keywords-3.5.2.tgz", + "integrity": "sha512-5p6WTN0DdTGVQk6VjcEju19IgaHudalcfabD7yhDGeA6bcQnmL+CpveLJq/3hvfwd1aof6L386Ougkx6RfyMIQ==", + "dev": true, + "license": "MIT", + "peerDependencies": { + "ajv": "^6.9.1" + } + }, + "node_modules/raw-loader/node_modules/json-schema-traverse": { + "version": "0.4.1", + "resolved": "https://registry.npmjs.org/json-schema-traverse/-/json-schema-traverse-0.4.1.tgz", + "integrity": "sha512-xbbCH5dCYU5T8LcEhhuh7HJ88HXuW3qsI3Y0zOZFKfZEHcpWiHU/Jxzk629Brsab/mMiHQti9wMP+845RPe3Vg==", + "dev": true, + "license": "MIT" + }, + "node_modules/raw-loader/node_modules/schema-utils": { + "version": "3.3.0", + "resolved": "https://registry.npmjs.org/schema-utils/-/schema-utils-3.3.0.tgz", + "integrity": "sha512-pN/yOAvcC+5rQ5nERGuwrjLlYvLTbCibnZ1I7B1LaiAz9BRBlE9GMgE/eqV30P7aJQUf7Ddimy/RsbYO/GrVGg==", + "dev": true, + "license": "MIT", + "dependencies": { + "@types/json-schema": "^7.0.8", + "ajv": "^6.12.5", + "ajv-keywords": "^3.5.2" + }, + "engines": { + "node": ">= 10.13.0" + }, + "funding": { + "type": "opencollective", + "url": "https://opencollective.com/webpack" + } + }, "node_modules/rc": { "version": "1.2.8", "resolved": "https://registry.npmjs.org/rc/-/rc-1.2.8.tgz", @@ -16884,6 +17457,15 @@ "react": ">=15" } }, + "node_modules/react-devtools-inline": { + "version": "4.4.0", + "resolved": "https://registry.npmjs.org/react-devtools-inline/-/react-devtools-inline-4.4.0.tgz", + "integrity": "sha512-ES0GolSrKO8wsKbsEkVeiR/ZAaHQTY4zDh1UW8DImVmm8oaGLl3ijJDvSGe+qDRKPZdPRnDtWWnSvvrgxXdThQ==", + "license": "MIT", + "dependencies": { + "es6-symbol": "^3" + } + }, "node_modules/react-dom": { "version": "19.1.1", "resolved": "https://registry.npmjs.org/react-dom/-/react-dom-19.1.1.tgz", @@ -18381,6 +18963,27 @@ "url": "https://github.com/sponsors/sindresorhus" } }, + "node_modules/static-browser-server": { + "version": "1.0.3", + "resolved": "https://registry.npmjs.org/static-browser-server/-/static-browser-server-1.0.3.tgz", + "integrity": "sha512-ZUyfgGDdFRbZGGJQ1YhiM930Yczz5VlbJObrQLlk24+qNHVQx4OlLcYswEUo3bIyNAbQUIUR9Yr5/Hqjzqb4zA==", + "license": "Apache-2.0", + "dependencies": { + "@open-draft/deferred-promise": "^2.1.0", + "dotenv": "^16.0.3", + "mime-db": "^1.52.0", + "outvariant": "^1.3.0" + } + }, + "node_modules/static-browser-server/node_modules/mime-db": { + "version": "1.54.0", + "resolved": "https://registry.npmjs.org/mime-db/-/mime-db-1.54.0.tgz", + "integrity": "sha512-aU5EJuIN2WDemCcAp2vFBfp/m4EAhWJnUNSSw0ixs7/kXbd6Pg64EmwJkNdFhB8aWt1sH2CTXrLxo/iAGV3oPQ==", + "license": "MIT", + "engines": { + "node": ">= 0.6" + } + }, "node_modules/statuses": { "version": "2.0.1", "resolved": "https://registry.npmjs.org/statuses/-/statuses-2.0.1.tgz", @@ -18396,6 +18999,12 @@ "integrity": "sha512-UGvjygr6F6tpH7o2qyqR6QYpwraIjKSdtzyBdyytFOHmPZY917kwdwLG0RbOjWOnKmnm3PeHjaoLLMie7kPLQw==", "license": "MIT" }, + "node_modules/strict-event-emitter": { + "version": "0.4.6", + "resolved": "https://registry.npmjs.org/strict-event-emitter/-/strict-event-emitter-0.4.6.tgz", + "integrity": "sha512-12KWeb+wixJohmnwNFerbyiBrAlq5qJLwIt38etRtKtmmHyDSoGlIqFE9wx+4IwG0aDjI7GV8tc8ZccjWZZtTg==", + "license": "MIT" + }, "node_modules/string_decoder": { "version": "1.3.0", "resolved": "https://registry.npmjs.org/string_decoder/-/string_decoder-1.3.0.tgz", @@ -18525,6 +19134,12 @@ "url": "https://github.com/sponsors/sindresorhus" } }, + "node_modules/style-mod": { + "version": "4.1.3", + "resolved": "https://registry.npmjs.org/style-mod/-/style-mod-4.1.3.tgz", + "integrity": "sha512-i/n8VsZydrugj3Iuzll8+x/00GH2vnYsk1eomD8QiRrSAeW6ItbCQDtfXCeJHd0iwiNagqjQkvpvREEPtW3IoQ==", + "license": "MIT" + }, "node_modules/style-to-js": { "version": "1.1.17", "resolved": "https://registry.npmjs.org/style-to-js/-/style-to-js-1.1.17.tgz", @@ -18894,6 +19509,12 @@ "license": "0BSD", "peer": true }, + "node_modules/type": { + "version": "2.7.3", + "resolved": "https://registry.npmjs.org/type/-/type-2.7.3.tgz", + "integrity": "sha512-8j+1QmAbPvLZow5Qpi6NCaN8FB60p/6x8/vfNqOk/hC+HuvFZhL4+WfekuhQLiqFZXOgQdrs3B+XxEmCc6b3FQ==", + "license": "ISC" + }, "node_modules/type-fest": { "version": "2.19.0", "resolved": "https://registry.npmjs.org/type-fest/-/type-fest-2.19.0.tgz", @@ -19564,6 +20185,12 @@ "integrity": "sha512-AyFQ0EVmsOZOlAnxoFOGOq1SQDWAB7C6aqMGS23svWAllfOaxbuFvcT8D1i8z3Gyn8fraVeZNNmN6e9bxxXkKw==", "license": "MIT" }, + "node_modules/w3c-keyname": { + "version": "2.2.8", + "resolved": "https://registry.npmjs.org/w3c-keyname/-/w3c-keyname-2.2.8.tgz", + "integrity": "sha512-dpojBhNsCNN7T82Tm7k26A6G9ML3NkhDsnw9n/eoxSRlVBB4CEtIQ/KTCLI2Fwf3ataSXRhYFkQi3SlnFwPvPQ==", + "license": "MIT" + }, "node_modules/watchpack": { "version": "2.4.4", "resolved": "https://registry.npmjs.org/watchpack/-/watchpack-2.4.4.tgz", diff --git a/package.json b/package.json index 955100434..ce8f3bf38 100644 --- a/package.json +++ b/package.json @@ -13,6 +13,7 @@ "format:check": "prettier --check ." }, "dependencies": { + "@codesandbox/sandpack-react": "^2.20.0", "@docusaurus/core": "^3.9.1", "@docusaurus/plugin-content-docs": "^3.9.1", "@docusaurus/preset-classic": "^3.9.1", @@ -54,6 +55,7 @@ "@docusaurus/types": "^3.9.1", "@types/react-slick": "^0.23.13", "prettier": "^3.6.2", + "raw-loader": "^4.0.2", "typescript": "^5.9.3" } } diff --git a/src/theme/MDXComponents.js b/src/theme/MDXComponents.js index bac48cc5a..10c5ea20c 100644 --- a/src/theme/MDXComponents.js +++ b/src/theme/MDXComponents.js @@ -11,6 +11,7 @@ import Details from "@theme/Details"; import Tabs from "@theme/Tabs"; import TabItem from "@theme/TabItem"; import CodeBlock from "@theme/CodeBlock"; +import { Sandpack } from "@codesandbox/sandpack-react"; // custom components import Answer from "@site/src/components/Answer"; @@ -27,6 +28,7 @@ export default { Tabs, TabItem, CodeBlock, + Sandpack, // export custom Components Answer,