From 53d98b78e319ba2c412d29b945662f5d5504e1c0 Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?H=C3=A5kon=20Flatval?= <70905152+haakonflatval-cognite@users.noreply.github.com> Date: Wed, 25 Jan 2023 14:23:14 +0100 Subject: [PATCH] docs: use CodeMirror instead of react-live in doc snippets (#2903) * chore: use CodeMirror instead of react-live in doc snippets Co-authored-by: Savelii Novikov <45129444+Savokr@users.noreply.github.com> --- .../docs/components/LiveCodeSnippet.tsx | 135 ++++++---- .../docs/components/styles.module.css | 20 +- documentation/docs/examples/cad-3dobjects.mdx | 4 +- documentation/package.json | 5 + .../components/LiveCodeSnippet.tsx | 138 ++++++---- .../version-3.x/components/styles.module.css | 20 +- .../version-3.x/examples/cad-3dobjects.mdx | 4 +- .../components/LiveCodeSnippet.tsx | 135 ++++++---- .../version-4.x/components/styles.module.css | 20 +- .../version-4.x/examples/cad-3dobjects.mdx | 4 +- documentation/yarn.lock | 255 ++++++++++++++++++ 11 files changed, 526 insertions(+), 214 deletions(-) diff --git a/documentation/docs/components/LiveCodeSnippet.tsx b/documentation/docs/components/LiveCodeSnippet.tsx index c35499938e2..ed988e47b82 100644 --- a/documentation/docs/components/LiveCodeSnippet.tsx +++ b/documentation/docs/components/LiveCodeSnippet.tsx @@ -1,12 +1,42 @@ import * as React from 'react'; -import { LiveProvider, LiveEditor, LiveError, LivePreview } from 'react-live'; -import { PrismTheme } from 'prism-react-renderer'; -import clsx from 'clsx'; +import { useState } from 'react'; +import CodeMirror from '@uiw/react-codemirror'; +import { syntaxTree } from '@codemirror/language'; +import { EditorView } from '@codemirror/view'; +import { javascript } from '@codemirror/lang-javascript'; +import { material } from '@uiw/codemirror-theme-material'; import styles from './styles.module.css'; -import oceanicNext from 'prism-react-renderer/themes/oceanicNext'; -import useBaseUrl from '@docusaurus/useBaseUrl'; -const defaultCodeTheme = oceanicNext; +import clsx from 'clsx'; + +import { linter, Diagnostic } from "@codemirror/lint"; + + +function createLintProvider(setHasError: (hasError: boolean) => void) { + function lintProvider(view: EditorView): readonly Diagnostic[] { + const diagnostics: Diagnostic[] = []; + let anyError = false; + syntaxTree(view.state).iterate({ + enter: (node) => { + if (node.type.isError) { + anyError = true; + diagnostics.push({ + from: node.from, + to: node.to, + severity: "error", + message: "Syntax error", + }); + } + }, + }); + + setHasError(anyError); + + return diagnostics; + } + + return lintProvider; +} // Replacement for "import { customScope } from './customScope'" to avoid // build issues with React Server-side Rendering @@ -22,27 +52,8 @@ export type LiveCodeSnippetProps = { children: string; }; -export function LiveCodeSnippet(props: LiveCodeSnippetProps) { - const scope = { - ...customScope, - ...Object.keys(customScope.urls).reduce((acc, key) => { - acc[key] = useBaseUrl(customScope.urls[key]); - return acc; - }, {} as any), - }; - - const { children } = props; - return ( - { - const fullCode = ` +function transformCode(code: string): string { + return ` // make these things to be available in live-editor const viewer = window.viewer; const model = window.model; @@ -64,32 +75,46 @@ export function LiveCodeSnippet(props: LiveCodeSnippetProps) { } // User code starts here! ${code}`; - return ` - - `; - }} - scope={{ ...scope }} - theme={defaultCodeTheme} - > -
- Live Editor -
- -
- - -
- - ); } + +function onRunCode(code: string) { + const transformedCode = transformCode(code); + const customScopeNames = Object.keys(customScope); + const customScopeValues = Object.values(customScope); + new Function(...customScopeNames, transformedCode)(...customScopeValues); +} + +export const LiveCodeSnippet = (props: LiveCodeSnippetProps) => { + + let code: string = props.children; + function setCode(newCode: string) { + code = newCode; + } + + let [buttonEnabled, setButtonEnabled] = useState(true); + + const lintProvider = createLintProvider(v => setButtonEnabled(!v)); + + return (<> +
+ Live Editor +
+ + + ); +}; diff --git a/documentation/docs/components/styles.module.css b/documentation/docs/components/styles.module.css index c3af0b2624b..1e35fbc9ba0 100644 --- a/documentation/docs/components/styles.module.css +++ b/documentation/docs/components/styles.module.css @@ -10,20 +10,12 @@ color: var(--ifm-color-content-inverse); } -.codeSnippetPreviewHeader { - background: var(--ifm-color-emphasis-200); - color: var(--ifm-color-content); +.cmEditor { + font-size: 16px; + font-family: var(--ifm-font-family-monospace); + margin-bottom: 10px; } -.codeSnippetEditor { - font-family: var(--ifm-font-family-monospace) !important; -} - -.codeSnippetPreview { - margin-bottom: var(--ifm-leading); - border: 1px solid var(--ifm-color-emphasis-200); - border-bottom-left-radius: var(--ifm-global-radius); - border-bottom-right-radius: var(--ifm-global-radius); - position: relative; - padding: 1rem; +.runButton { + margin-bottom: 15px; } diff --git a/documentation/docs/examples/cad-3dobjects.mdx b/documentation/docs/examples/cad-3dobjects.mdx index ab34a697c20..99f7b9bcd1e 100644 --- a/documentation/docs/examples/cad-3dobjects.mdx +++ b/documentation/docs/examples/cad-3dobjects.mdx @@ -84,7 +84,7 @@ const skyBox = new THREE.Mesh( new THREE.MeshBasicMaterial({ side: THREE.BackSide, // Skybox texture from http://freepanorama.blogspot.com/2010/01/sky7-spherical.html - map: new THREE.TextureLoader().load(skyUrl), + map: new THREE.TextureLoader().load(urls.skyUrl), }) ); skyBox.position.copy(modelCenterAtSeaLevel); @@ -131,7 +131,7 @@ const skyBox = new THREE.Mesh( new THREE.MeshBasicMaterial({ side: THREE.BackSide, // Skybox texture from http://freepanorama.blogspot.com/2010/01/sky7-spherical.html - map: new THREE.TextureLoader().load(skyUrl), + map: new THREE.TextureLoader().load(urls.skyUrl), }) ); skyBox.position.copy(modelCenterAtSeaLevel); diff --git a/documentation/package.json b/documentation/package.json index 6a0c8147820..ce586b4f78e 100644 --- a/documentation/package.json +++ b/documentation/package.json @@ -25,9 +25,14 @@ }, "dependencies": { "@azure/msal-browser": "2.32.2", + "@codemirror/lang-javascript": "6.1.2", + "@codemirror/language": "6.4.0", + "@codemirror/view": "6.7.3", "@docusaurus/core": "2.2.0", "@docusaurus/preset-classic": "2.2.0", "@docusaurus/theme-live-codeblock": "2.2.0", + "@uiw/codemirror-theme-material": "4.19.7", + "@uiw/react-codemirror": "4.19.7", "clsx": "1.2.1", "cross-env": "7.0.3", "ieee754": "1.2.1", diff --git a/documentation/versioned_docs/version-3.x/components/LiveCodeSnippet.tsx b/documentation/versioned_docs/version-3.x/components/LiveCodeSnippet.tsx index fe4f6f9db06..66fe1e8476b 100644 --- a/documentation/versioned_docs/version-3.x/components/LiveCodeSnippet.tsx +++ b/documentation/versioned_docs/version-3.x/components/LiveCodeSnippet.tsx @@ -1,11 +1,42 @@ import * as React from 'react'; -import { LiveProvider, LiveEditor, LiveError, LivePreview } from 'react-live'; -import clsx from 'clsx'; +import { useState } from 'react'; +import CodeMirror from '@uiw/react-codemirror'; +import { syntaxTree } from '@codemirror/language'; +import { EditorView } from '@codemirror/view'; +import { javascript } from '@codemirror/lang-javascript'; +import { material } from '@uiw/codemirror-theme-material'; import styles from './styles.module.css'; -import oceanicNext from 'prism-react-renderer/themes/oceanicNext'; -import useBaseUrl from '@docusaurus/useBaseUrl'; -const defaultCodeTheme = oceanicNext; +import clsx from 'clsx'; + +import { linter, Diagnostic } from "@codemirror/lint"; + + +function createLintProvider(setHasError: (hasError: boolean) => void) { + function lintProvider(view: EditorView): readonly Diagnostic[] { + const diagnostics: Diagnostic[] = []; + let anyError = false; + syntaxTree(view.state).iterate({ + enter: (node) => { + if (node.type.isError) { + anyError = true; + diagnostics.push({ + from: node.from, + to: node.to, + severity: "error", + message: "Syntax error", + }); + } + }, + }); + + setHasError(anyError); + + return diagnostics; + } + + return lintProvider; +} // Replacement for "import { customScope } from './customScope'" to avoid // build issues with React Server-side Rendering @@ -21,27 +52,8 @@ export type LiveCodeSnippetProps = { children: string; }; -export function LiveCodeSnippet(props: LiveCodeSnippetProps) { - const scope = { - ...customScope, - ...Object.keys(customScope.urls).reduce((acc, key) => { - acc[key] = useBaseUrl(customScope.urls[key]); - return acc; - }, {} as any), - }; - - const { children } = props; - return ( - { - const fullCode = ` +function transformCode(code: string): string { + return ` // make these things to be available in live-editor const viewer = window.viewer; const model = window.model; @@ -54,8 +66,8 @@ export function LiveCodeSnippet(props: LiveCodeSnippetProps) { if (viewer) { resetViewerEventHandlers(viewer); - if (model instanceof Cognite3DModel) { - resetCognite3DModel(model); + if (model instanceof CogniteCadModel) { + resetCogniteCadModel(model); } } else { alert('Login is required to run examples'); @@ -63,32 +75,46 @@ export function LiveCodeSnippet(props: LiveCodeSnippetProps) { } // User code starts here! ${code}`; - return ` - - `; - }} - scope={{ ...scope }} - theme={defaultCodeTheme} - > -
- Live Editor -
- -
- - -
- - ); } + +function onRunCode(code: string) { + const transformedCode = transformCode(code); + const customScopeNames = Object.keys(customScope); + const customScopeValues = Object.values(customScope); + new Function(...customScopeNames, transformedCode)(...customScopeValues); +} + +export const LiveCodeSnippet = (props: LiveCodeSnippetProps) => { + + let code: string = props.children; + function setCode(newCode: string) { + code = newCode; + } + + let [buttonEnabled, setButtonEnabled] = useState(true); + + const lintProvider = createLintProvider(v => setButtonEnabled(!v)); + + return (<> +
+ Live Editor +
+ + + ); +}; diff --git a/documentation/versioned_docs/version-3.x/components/styles.module.css b/documentation/versioned_docs/version-3.x/components/styles.module.css index c3af0b2624b..1e35fbc9ba0 100644 --- a/documentation/versioned_docs/version-3.x/components/styles.module.css +++ b/documentation/versioned_docs/version-3.x/components/styles.module.css @@ -10,20 +10,12 @@ color: var(--ifm-color-content-inverse); } -.codeSnippetPreviewHeader { - background: var(--ifm-color-emphasis-200); - color: var(--ifm-color-content); +.cmEditor { + font-size: 16px; + font-family: var(--ifm-font-family-monospace); + margin-bottom: 10px; } -.codeSnippetEditor { - font-family: var(--ifm-font-family-monospace) !important; -} - -.codeSnippetPreview { - margin-bottom: var(--ifm-leading); - border: 1px solid var(--ifm-color-emphasis-200); - border-bottom-left-radius: var(--ifm-global-radius); - border-bottom-right-radius: var(--ifm-global-radius); - position: relative; - padding: 1rem; +.runButton { + margin-bottom: 15px; } diff --git a/documentation/versioned_docs/version-3.x/examples/cad-3dobjects.mdx b/documentation/versioned_docs/version-3.x/examples/cad-3dobjects.mdx index c2e2a65b43b..18dba6eafd8 100644 --- a/documentation/versioned_docs/version-3.x/examples/cad-3dobjects.mdx +++ b/documentation/versioned_docs/version-3.x/examples/cad-3dobjects.mdx @@ -84,7 +84,7 @@ const skyBox = new THREE.Mesh( new THREE.MeshBasicMaterial({ side: THREE.BackSide, // Skybox texture from http://freepanorama.blogspot.com/2010/01/sky7-spherical.html - map: new THREE.TextureLoader().load(skyUrl), + map: new THREE.TextureLoader().load(urls.skyUrl), }) ); skyBox.position.copy(modelCenterAtSeaLevel); @@ -131,7 +131,7 @@ const skyBox = new THREE.Mesh( new THREE.MeshBasicMaterial({ side: THREE.BackSide, // Skybox texture from http://freepanorama.blogspot.com/2010/01/sky7-spherical.html - map: new THREE.TextureLoader().load(skyUrl), + map: new THREE.TextureLoader().load(urls.skyUrl), }) ); skyBox.position.copy(modelCenterAtSeaLevel); diff --git a/documentation/versioned_docs/version-4.x/components/LiveCodeSnippet.tsx b/documentation/versioned_docs/version-4.x/components/LiveCodeSnippet.tsx index c35499938e2..ed988e47b82 100644 --- a/documentation/versioned_docs/version-4.x/components/LiveCodeSnippet.tsx +++ b/documentation/versioned_docs/version-4.x/components/LiveCodeSnippet.tsx @@ -1,12 +1,42 @@ import * as React from 'react'; -import { LiveProvider, LiveEditor, LiveError, LivePreview } from 'react-live'; -import { PrismTheme } from 'prism-react-renderer'; -import clsx from 'clsx'; +import { useState } from 'react'; +import CodeMirror from '@uiw/react-codemirror'; +import { syntaxTree } from '@codemirror/language'; +import { EditorView } from '@codemirror/view'; +import { javascript } from '@codemirror/lang-javascript'; +import { material } from '@uiw/codemirror-theme-material'; import styles from './styles.module.css'; -import oceanicNext from 'prism-react-renderer/themes/oceanicNext'; -import useBaseUrl from '@docusaurus/useBaseUrl'; -const defaultCodeTheme = oceanicNext; +import clsx from 'clsx'; + +import { linter, Diagnostic } from "@codemirror/lint"; + + +function createLintProvider(setHasError: (hasError: boolean) => void) { + function lintProvider(view: EditorView): readonly Diagnostic[] { + const diagnostics: Diagnostic[] = []; + let anyError = false; + syntaxTree(view.state).iterate({ + enter: (node) => { + if (node.type.isError) { + anyError = true; + diagnostics.push({ + from: node.from, + to: node.to, + severity: "error", + message: "Syntax error", + }); + } + }, + }); + + setHasError(anyError); + + return diagnostics; + } + + return lintProvider; +} // Replacement for "import { customScope } from './customScope'" to avoid // build issues with React Server-side Rendering @@ -22,27 +52,8 @@ export type LiveCodeSnippetProps = { children: string; }; -export function LiveCodeSnippet(props: LiveCodeSnippetProps) { - const scope = { - ...customScope, - ...Object.keys(customScope.urls).reduce((acc, key) => { - acc[key] = useBaseUrl(customScope.urls[key]); - return acc; - }, {} as any), - }; - - const { children } = props; - return ( - { - const fullCode = ` +function transformCode(code: string): string { + return ` // make these things to be available in live-editor const viewer = window.viewer; const model = window.model; @@ -64,32 +75,46 @@ export function LiveCodeSnippet(props: LiveCodeSnippetProps) { } // User code starts here! ${code}`; - return ` - - `; - }} - scope={{ ...scope }} - theme={defaultCodeTheme} - > -
- Live Editor -
- -
- - -
- - ); } + +function onRunCode(code: string) { + const transformedCode = transformCode(code); + const customScopeNames = Object.keys(customScope); + const customScopeValues = Object.values(customScope); + new Function(...customScopeNames, transformedCode)(...customScopeValues); +} + +export const LiveCodeSnippet = (props: LiveCodeSnippetProps) => { + + let code: string = props.children; + function setCode(newCode: string) { + code = newCode; + } + + let [buttonEnabled, setButtonEnabled] = useState(true); + + const lintProvider = createLintProvider(v => setButtonEnabled(!v)); + + return (<> +
+ Live Editor +
+ + + ); +}; diff --git a/documentation/versioned_docs/version-4.x/components/styles.module.css b/documentation/versioned_docs/version-4.x/components/styles.module.css index c3af0b2624b..1e35fbc9ba0 100644 --- a/documentation/versioned_docs/version-4.x/components/styles.module.css +++ b/documentation/versioned_docs/version-4.x/components/styles.module.css @@ -10,20 +10,12 @@ color: var(--ifm-color-content-inverse); } -.codeSnippetPreviewHeader { - background: var(--ifm-color-emphasis-200); - color: var(--ifm-color-content); +.cmEditor { + font-size: 16px; + font-family: var(--ifm-font-family-monospace); + margin-bottom: 10px; } -.codeSnippetEditor { - font-family: var(--ifm-font-family-monospace) !important; -} - -.codeSnippetPreview { - margin-bottom: var(--ifm-leading); - border: 1px solid var(--ifm-color-emphasis-200); - border-bottom-left-radius: var(--ifm-global-radius); - border-bottom-right-radius: var(--ifm-global-radius); - position: relative; - padding: 1rem; +.runButton { + margin-bottom: 15px; } diff --git a/documentation/versioned_docs/version-4.x/examples/cad-3dobjects.mdx b/documentation/versioned_docs/version-4.x/examples/cad-3dobjects.mdx index 1e0d593aed6..1f2e78e4e90 100644 --- a/documentation/versioned_docs/version-4.x/examples/cad-3dobjects.mdx +++ b/documentation/versioned_docs/version-4.x/examples/cad-3dobjects.mdx @@ -84,7 +84,7 @@ const skyBox = new THREE.Mesh( new THREE.MeshBasicMaterial({ side: THREE.BackSide, // Skybox texture from http://freepanorama.blogspot.com/2010/01/sky7-spherical.html - map: new THREE.TextureLoader().load(skyUrl), + map: new THREE.TextureLoader().load(urls.skyUrl), }) ); skyBox.position.copy(modelCenterAtSeaLevel); @@ -131,7 +131,7 @@ const skyBox = new THREE.Mesh( new THREE.MeshBasicMaterial({ side: THREE.BackSide, // Skybox texture from http://freepanorama.blogspot.com/2010/01/sky7-spherical.html - map: new THREE.TextureLoader().load(skyUrl), + map: new THREE.TextureLoader().load(urls.skyUrl), }) ); skyBox.position.copy(modelCenterAtSeaLevel); diff --git a/documentation/yarn.lock b/documentation/yarn.lock index d9e2835d4e2..6c44beacf98 100644 --- a/documentation/yarn.lock +++ b/documentation/yarn.lock @@ -2003,6 +2003,116 @@ __metadata: languageName: node linkType: hard +"@codemirror/autocomplete@npm:^6.0.0": + version: 6.4.0 + resolution: "@codemirror/autocomplete@npm:6.4.0" + dependencies: + "@codemirror/language": ^6.0.0 + "@codemirror/state": ^6.0.0 + "@codemirror/view": ^6.6.0 + "@lezer/common": ^1.0.0 + peerDependencies: + "@codemirror/language": ^6.0.0 + "@codemirror/state": ^6.0.0 + "@codemirror/view": ^6.0.0 + "@lezer/common": ^1.0.0 + checksum: 3470fee01da60d3d71b8b4f8728629c0f0441e704b8b828592f98c000d75fdb2c9077727e82685626cf45b95cadbc0c1a03968261df2f0cfb4162418b5f4dd1f + languageName: node + linkType: hard + +"@codemirror/commands@npm:^6.0.0, @codemirror/commands@npm:^6.1.0": + version: 6.2.0 + resolution: "@codemirror/commands@npm:6.2.0" + dependencies: + "@codemirror/language": ^6.0.0 + "@codemirror/state": ^6.2.0 + "@codemirror/view": ^6.0.0 + "@lezer/common": ^1.0.0 + checksum: 13475fcd348335b4c31e563cbe83b98fdaa99218da882e3fbe6bad66841c55a69030e4a1a5f475ba2607db194d3b43b91e38fd088f9f4196b1ed4eac5b523909 + languageName: node + linkType: hard + +"@codemirror/lang-javascript@npm:6.1.2": + version: 6.1.2 + resolution: "@codemirror/lang-javascript@npm:6.1.2" + dependencies: + "@codemirror/autocomplete": ^6.0.0 + "@codemirror/language": ^6.0.0 + "@codemirror/lint": ^6.0.0 + "@codemirror/state": ^6.0.0 + "@codemirror/view": ^6.0.0 + "@lezer/common": ^1.0.0 + "@lezer/javascript": ^1.0.0 + checksum: f4336b7efd44e4158b9979f0c23918184c897d0fe3e40b5414bd9243a9899ecdba4dfe13970fe5024a1894579af80cb4c5dd574c6c2b7bd7ff06d8c8cb88616b + languageName: node + linkType: hard + +"@codemirror/language@npm:6.4.0, @codemirror/language@npm:^6.0.0": + version: 6.4.0 + resolution: "@codemirror/language@npm:6.4.0" + dependencies: + "@codemirror/state": ^6.0.0 + "@codemirror/view": ^6.0.0 + "@lezer/common": ^1.0.0 + "@lezer/highlight": ^1.0.0 + "@lezer/lr": ^1.0.0 + style-mod: ^4.0.0 + checksum: 607072e234db59a9a21eb41b8777b62d68a55ed28298edc4f6aaedfcf52349db1fe3ff3e7747ccfc77f03757bad45ba9a657d59a0e9c67be1231902586dec7a3 + languageName: node + linkType: hard + +"@codemirror/lint@npm:^6.0.0": + version: 6.1.0 + resolution: "@codemirror/lint@npm:6.1.0" + dependencies: + "@codemirror/state": ^6.0.0 + "@codemirror/view": ^6.0.0 + crelt: ^1.0.5 + checksum: 1b5179c2c18e0eb96c68b47cd6832053a6aab80d6126cc250876fa848418c537417f0656cd6f442a0e5858830546fdef6bdcbb7b9773d92989795b52c7646011 + languageName: node + linkType: hard + +"@codemirror/search@npm:^6.0.0": + version: 6.2.3 + resolution: "@codemirror/search@npm:6.2.3" + dependencies: + "@codemirror/state": ^6.0.0 + "@codemirror/view": ^6.0.0 + crelt: ^1.0.5 + checksum: 7ab0ffab7992f5c6260313e06ec8935f55807b95ca86f0327154ea1ae0ab984cd22c2fc1a812bd6cace1db131785353689fbfd080d2e12c660e3db0295dec355 + languageName: node + linkType: hard + +"@codemirror/state@npm:^6.0.0, @codemirror/state@npm:^6.1.1, @codemirror/state@npm:^6.1.4, @codemirror/state@npm:^6.2.0": + version: 6.2.0 + resolution: "@codemirror/state@npm:6.2.0" + checksum: fdc99c773dc09c700dd02bf918f06132aa8d3069c262cc4eb6ca5c810ce24ae2d7e90719ae7630a8158fd263018de6d40bd78f312e6bfba754e737b64e6c6b3d + languageName: node + linkType: hard + +"@codemirror/theme-one-dark@npm:^6.0.0": + version: 6.1.0 + resolution: "@codemirror/theme-one-dark@npm:6.1.0" + dependencies: + "@codemirror/language": ^6.0.0 + "@codemirror/state": ^6.0.0 + "@codemirror/view": ^6.0.0 + "@lezer/highlight": ^1.0.0 + checksum: 7454742006f0ea23ed36b1c8e232d55bd1cdf6cd3c9b5ad7f7212a4b5fe7907eecaeb1d908fed2022c2ca5d667176c93e9f071c939d54449cfe740dc028a16d8 + languageName: node + linkType: hard + +"@codemirror/view@npm:6.7.3, @codemirror/view@npm:^6.0.0, @codemirror/view@npm:^6.6.0": + version: 6.7.3 + resolution: "@codemirror/view@npm:6.7.3" + dependencies: + "@codemirror/state": ^6.1.4 + style-mod: ^4.0.0 + w3c-keyname: ^2.2.4 + checksum: 37c0458cf45e52a1af9b9bef29108dd84bb91c6818ecad432d89627039d92f6b234b033cf14ecbc1c5b533694127478942fcc9641fdf52b9a1b20eccc018e27c + languageName: node + linkType: hard + "@cognite/potree-core@npm:^1.5.1": version: 1.5.2 resolution: "@cognite/potree-core@npm:1.5.2" @@ -2017,12 +2127,17 @@ __metadata: resolution: "@cognite/reveal-documentation@workspace:." dependencies: "@azure/msal-browser": 2.32.2 + "@codemirror/lang-javascript": 6.1.2 + "@codemirror/language": 6.4.0 + "@codemirror/view": 6.7.3 "@docusaurus/core": 2.2.0 "@docusaurus/preset-classic": 2.2.0 "@docusaurus/remark-plugin-npm2yarn": ^2.2.0 "@docusaurus/theme-live-codeblock": 2.2.0 "@types/react": 18.0.27 "@types/styled-components": 5.1.26 + "@uiw/codemirror-theme-material": 4.19.7 + "@uiw/react-codemirror": 4.19.7 clsx: 1.2.1 copyfiles: 2.4.1 cross-env: 7.0.3 @@ -2935,6 +3050,41 @@ __metadata: languageName: node linkType: hard +"@lezer/common@npm:^1.0.0": + version: 1.0.2 + resolution: "@lezer/common@npm:1.0.2" + checksum: bbcc58e07be02652bf0700d2856042ec089d5be0b95893d628b3e18192ade864fac83b61b19653e10b9f1472261a178b12318d934e9004edd5483a577c0db56b + languageName: node + linkType: hard + +"@lezer/highlight@npm:^1.0.0, @lezer/highlight@npm:^1.1.3": + version: 1.1.3 + resolution: "@lezer/highlight@npm:1.1.3" + dependencies: + "@lezer/common": ^1.0.0 + checksum: 90ec143ce46b32f6779c3b245f1b5a540d66686939816d3daed8318821acc4bc719466dc222336cfd483bf04a8de4fdc6f279e904cf114d4d9f786f9feccbbd8 + languageName: node + linkType: hard + +"@lezer/javascript@npm:^1.0.0": + version: 1.4.1 + resolution: "@lezer/javascript@npm:1.4.1" + dependencies: + "@lezer/highlight": ^1.1.3 + "@lezer/lr": ^1.3.0 + checksum: 634270116d5f1c278e2949d397845f41cac388dec7f0db593a3dc23e0fd4a1b73b9bf08f96fcf109fcd3d38c4b374d48676dce3261ff8ff83a85f5d6a37989f7 + languageName: node + linkType: hard + +"@lezer/lr@npm:^1.0.0, @lezer/lr@npm:^1.3.0": + version: 1.3.1 + resolution: "@lezer/lr@npm:1.3.1" + dependencies: + "@lezer/common": ^1.0.0 + checksum: 01b421b9724d43a00a97639344cd89c539e9740b7bedc8270882192e4205f68679e5b7c6837dde7756970a418bd4e710e4a778ab7c6713a2331bea3049232ca8 + languageName: node + linkType: hard + "@mdx-js/mdx@npm:^1.6.22": version: 1.6.22 resolution: "@mdx-js/mdx@npm:1.6.22" @@ -3752,6 +3902,75 @@ __metadata: languageName: node linkType: hard +"@uiw/codemirror-extensions-basic-setup@npm:4.19.7": + version: 4.19.7 + resolution: "@uiw/codemirror-extensions-basic-setup@npm:4.19.7" + dependencies: + "@codemirror/autocomplete": ^6.0.0 + "@codemirror/commands": ^6.0.0 + "@codemirror/language": ^6.0.0 + "@codemirror/lint": ^6.0.0 + "@codemirror/search": ^6.0.0 + "@codemirror/state": ^6.0.0 + "@codemirror/view": ^6.0.0 + peerDependencies: + "@codemirror/autocomplete": ">=6.0.0" + "@codemirror/commands": ">=6.0.0" + "@codemirror/language": ">=6.0.0" + "@codemirror/lint": ">=6.0.0" + "@codemirror/search": ">=6.0.0" + "@codemirror/state": ">=6.0.0" + "@codemirror/view": ">=6.0.0" + checksum: 4c32d3b41b78776fd41b229edc8777dff4137ff6125836df5a6573e01a0a74f2ae66293a09a3b095a1fbe660b2fc8b2bde93ba4aa92636702a74baea261fcf94 + languageName: node + linkType: hard + +"@uiw/codemirror-theme-material@npm:4.19.7": + version: 4.19.7 + resolution: "@uiw/codemirror-theme-material@npm:4.19.7" + dependencies: + "@uiw/codemirror-themes": 4.19.7 + checksum: bab21a224d39c16bf46b47164b5c89394e234ddc4ace4e1845949afaccf0e24c2eb1dbc238bc09a22890c5a09df768e10619db09c9c826b4d55fa68a6f997508 + languageName: node + linkType: hard + +"@uiw/codemirror-themes@npm:4.19.7": + version: 4.19.7 + resolution: "@uiw/codemirror-themes@npm:4.19.7" + dependencies: + "@codemirror/language": ^6.0.0 + "@codemirror/state": ^6.0.0 + "@codemirror/view": ^6.0.0 + peerDependencies: + "@codemirror/language": ">=6.0.0" + "@codemirror/state": ">=6.0.0" + "@codemirror/view": ">=6.0.0" + checksum: f316a8ec5bbc1982d5db192175d0d608217beb3f1e34f46fb9443628f6a00942291d0dcdbc575e167503fcd3fa062034ef3bbbf0d2cf5715fdbf8b667bfb4707 + languageName: node + linkType: hard + +"@uiw/react-codemirror@npm:4.19.7": + version: 4.19.7 + resolution: "@uiw/react-codemirror@npm:4.19.7" + dependencies: + "@babel/runtime": ^7.18.6 + "@codemirror/commands": ^6.1.0 + "@codemirror/state": ^6.1.1 + "@codemirror/theme-one-dark": ^6.0.0 + "@uiw/codemirror-extensions-basic-setup": 4.19.7 + codemirror: ^6.0.0 + peerDependencies: + "@babel/runtime": ">=7.11.0" + "@codemirror/state": ">=6.0.0" + "@codemirror/theme-one-dark": ">=6.0.0" + "@codemirror/view": ">=6.0.0" + codemirror: ">=6.0.0" + react: ">=16.8.0" + react-dom: ">=16.8.0" + checksum: 333c7b0c7181219bb0506cd956eb10fa07aad5f26d3c5a9e7b9875e6c60f1e9bf1c8f74bf160735c75b7dbe9e9b05879c17f5ea641e212ba8f454887f04b0e7e + languageName: node + linkType: hard + "@webassemblyjs/ast@npm:1.11.1": version: 1.11.1 resolution: "@webassemblyjs/ast@npm:1.11.1" @@ -5000,6 +5219,21 @@ __metadata: languageName: node linkType: hard +"codemirror@npm:^6.0.0": + version: 6.0.1 + resolution: "codemirror@npm:6.0.1" + dependencies: + "@codemirror/autocomplete": ^6.0.0 + "@codemirror/commands": ^6.0.0 + "@codemirror/language": ^6.0.0 + "@codemirror/lint": ^6.0.0 + "@codemirror/search": ^6.0.0 + "@codemirror/state": ^6.0.0 + "@codemirror/view": ^6.0.0 + checksum: 1a78f7077ac5801bdbff162aa0c61bf2b974603c7e9a477198c3ce50c789af674a061d7c293c58b73807eda345c2b5228c38ad2aabb9319d552d5486f785cbef + languageName: node + linkType: hard + "collapse-white-space@npm:^1.0.2": version: 1.0.6 resolution: "collapse-white-space@npm:1.0.6" @@ -5375,6 +5609,13 @@ __metadata: languageName: node linkType: hard +"crelt@npm:^1.0.5": + version: 1.0.5 + resolution: "crelt@npm:1.0.5" + checksum: 04a618c5878e12a14a9a328a49ff6e37bed76abb88b72e661c56b5f161d8a9aca133650da6bcbc5224ad1f7f43a69325627f209e92a21002986d52a8f844b367 + languageName: node + linkType: hard + "cross-env@npm:7.0.3": version: 7.0.3 resolution: "cross-env@npm:7.0.3" @@ -11998,6 +12239,13 @@ __metadata: languageName: node linkType: hard +"style-mod@npm:^4.0.0": + version: 4.0.0 + resolution: "style-mod@npm:4.0.0" + checksum: c19f73d660a94244f0715180a6141bf75d05e5b156cc956ba11970b83cd303c3f7edafe5fb61a3192da6186cc008bdcdd803a979070f9b64e13046463644043c + languageName: node + linkType: hard + "style-to-object@npm:0.3.0, style-to-object@npm:^0.3.0": version: 0.3.0 resolution: "style-to-object@npm:0.3.0" @@ -13026,6 +13274,13 @@ __metadata: languageName: node linkType: hard +"w3c-keyname@npm:^2.2.4": + version: 2.2.6 + resolution: "w3c-keyname@npm:2.2.6" + checksum: 59a31d23ca9953c01c99ed6695fee5b6ea36eb2412d76a21fe4302ab33a3f5cd96c006a763940b6115c3d042c16d3564eeee1156832217d028af0518098b3a42 + languageName: node + linkType: hard + "wait-on@npm:^6.0.1": version: 6.0.1 resolution: "wait-on@npm:6.0.1"