Skip to content

Commit 84fa6ba

Browse files
elbakerinoelbakerino
committed
Merge branch 'develop'
2 parents 9d40b4c + 1435476 commit 84fa6ba

File tree

6 files changed

+76
-54
lines changed

6 files changed

+76
-54
lines changed

‎apps/demo/src/pages/PageInput.tsx‎

Lines changed: 10 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -121,7 +121,10 @@ export const PageInput: React.ComponentType = () => {
121121
CodeMirror={CustomCodeMirror}
122122
ViewerBox={ViewerBoxRouter}
123123
onChange={handleOnChange}
124-
extensions={extensions}
124+
codeMirrorProps={{
125+
extensions: extensions,
126+
variant: 'embed',
127+
}}
125128
textValue={textValue}
126129
bigSize={bigSize}
127130
processing={processing}
@@ -138,8 +141,12 @@ export const PageInput: React.ComponentType = () => {
138141
overflowY: 'auto',
139142
scrollbarWidth: 'thin',
140143
maxHeight: {md: '100%'},
141-
// viewer with bigger paddings for headline buttons
142-
px: {md: 2, lg: 3},
144+
py: 2,
145+
px: {
146+
xs: 2,
147+
// bigger paddings for linkable headline buttons
148+
lg: 3,
149+
},
143150
backgroundColor: 'background.paper',
144151
}}
145152
>

‎apps/sandbox/package.json‎

Lines changed: 7 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -26,6 +26,12 @@
2626
"@codemirror/language-data": "^6.1.0",
2727
"@codemirror/legacy-modes": "^6.1.0",
2828
"@codemirror/search": "^6.0.0",
29+
"@codemirror/lint": "^6.0.0",
30+
"@codemirror/autocomplete": "^6.0.0",
31+
"@lezer/lezer": "^1.0.0",
32+
"@lezer/common": "^1.0.0",
33+
"@lezer/markdown": "^1.0.0",
34+
"@lezer/highlight": "^1.0.0",
2935
"@codemirror/state": "^6.0.0",
3036
"@codemirror/view": "^6.0.0",
3137
"@content-ui/input": "^0.2.1",
@@ -64,7 +70,7 @@
6470
"vite": "^4.5.14"
6571
},
6672
"scripts": {
67-
"start": "tsc && cross-env NODE_ENV=development vite",
73+
"start": "cross-env NODE_ENV=development vite",
6874
"build": "tsc && cross-env NODE_ENV=production vite build"
6975
}
7076
}

‎apps/sandbox/src/components/CustomCodeMirror.tsx‎

Lines changed: 0 additions & 37 deletions
Original file line numberDiff line numberDiff line change
@@ -23,12 +23,6 @@ import { json } from '@codemirror/lang-json'
2323
import { javascript } from '@codemirror/lang-javascript'
2424
import { html } from '@codemirror/lang-html'
2525
import { css } from '@codemirror/lang-css'
26-
import { python } from '@codemirror/lang-python'
27-
import { wast } from '@codemirror/lang-wast'
28-
import { rust } from '@codemirror/lang-rust'
29-
import { xml } from '@codemirror/lang-xml'
30-
import { php } from '@codemirror/lang-php'
31-
import { MariaSQL, Cassandra, MySQL, PostgreSQL, MSSQL, StandardSQL, sql } from '@codemirror/lang-sql'
3226
import { markdown, markdownLanguage } from '@codemirror/lang-markdown'
3327
import { languages } from '@codemirror/language-data'
3428
import { lezer } from '@codemirror/lang-lezer'
@@ -105,11 +99,6 @@ export const getHighlight = (lang: string | undefined): Extension | undefined =>
10599
case 'twig':
106100
case 'html':
107101
return html()
108-
case 'rss':
109-
case 'wsl':
110-
case 'xsd':
111-
case 'xml':
112-
return xml()
113102
case 'bash':
114103
case 'sh':
115104
case 'zsh':
@@ -132,32 +121,6 @@ export const getHighlight = (lang: string | undefined): Extension | undefined =>
132121
return StreamLanguage.define(yaml)
133122
case 'css':
134123
return css()
135-
case 'python':
136-
return python()
137-
case 'wast':
138-
return wast()
139-
case 'rust':
140-
return rust()
141-
case 'injectablephp':
142-
case 'php':
143-
return php()
144-
case 'mysql':
145-
return sql({dialect: MySQL})
146-
case 'ms sql':
147-
case 'mssql':
148-
return sql({dialect: MSSQL})
149-
case 'mariasql':
150-
return sql({dialect: MariaSQL})
151-
case 'postgresql':
152-
return sql({dialect: PostgreSQL})
153-
case 'cassandra':
154-
case 'cql':
155-
return sql({dialect: Cassandra})
156-
case 'bigquery':
157-
case 'standardsql':
158-
return sql({dialect: StandardSQL})
159-
case 'sql':
160-
return sql()
161124
case 'md':
162125
case 'markdown':
163126
return mdLang

‎apps/sandbox/src/pages/PageInput.tsx‎

Lines changed: 39 additions & 5 deletions
Original file line numberDiff line numberDiff line change
@@ -1,7 +1,11 @@
11
import { ViewerBoxRouter } from '@content-ui/md-mui/ViewerBoxRouter'
22
import { ContentParser } from '@content-ui/md/parser/ContentParser'
33
import { ContentSelectionProvider } from '@content-ui/react/ContentSelectionContext'
4-
import React from 'react'
4+
import { scrollIntoViewWithMargin } from '@content-ui/react/Utils/scrollIntoViewWithMargin'
5+
import Button from '@mui/material/Button'
6+
import IcVisibility from '@mui/icons-material/Visibility'
7+
import IcVisibilityOff from '@mui/icons-material/VisibilityOff'
8+
import React, { useRef, useState } from 'react'
59
import Grid from '@mui/material/Grid'
610
import { ContentInput } from '@content-ui/input/ContentInput'
711
import { CustomCodeMirror, getHighlight } from '../components/CustomCodeMirror.js'
@@ -48,9 +52,13 @@ With even more sentences, words and other things.
4852
`
4953

5054
export const PageInput: React.ComponentType = () => {
51-
const [value, setValue] = React.useState(md)
5255
const {breakpoints} = useTheme()
5356
const isMediumScreen = useMediaQuery(breakpoints.up('md'))
57+
58+
const scrollContainerRef = useRef<HTMLDivElement>(null)
59+
60+
const [value, setValue] = useState(md)
61+
5462
const {
5563
textValue,
5664
handleOnChange,
@@ -67,6 +75,7 @@ export const PageInput: React.ComponentType = () => {
6775
? 560
6876
: 180,
6977
adaptiveDelay: true,
78+
prioritizeLatest: false,
7079
autoProcess,
7180
onMount: true,
7281
processor: ContentParser,
@@ -77,6 +86,8 @@ export const PageInput: React.ComponentType = () => {
7786
return [...(highlight ? [highlight] : [])]
7887
}, [])
7988

89+
const [showAst, setShowAst] = useState(false)
90+
8091
return (
8192
<>
8293
<Box
@@ -92,6 +103,8 @@ export const PageInput: React.ComponentType = () => {
92103
>
93104
<SettingsProvider
94105
followEditor={isMediumScreen}
106+
scrollContainer={scrollContainerRef}
107+
onFollowElement={scrollIntoViewWithMargin}
95108
headlineLinkable
96109
headlineSelectable
97110
headlineSelectableOnHover
@@ -113,7 +126,10 @@ export const PageInput: React.ComponentType = () => {
113126
CodeMirror={CustomCodeMirror}
114127
ViewerBox={ViewerBoxRouter}
115128
onChange={handleOnChange}
116-
extensions={extensions}
129+
codeMirrorProps={{
130+
extensions: extensions,
131+
variant: 'embed',
132+
}}
117133
textValue={textValue}
118134
bigSize={bigSize}
119135
processing={processing}
@@ -124,20 +140,38 @@ export const PageInput: React.ComponentType = () => {
124140
/>
125141
</Grid>
126142
<Grid
143+
ref={scrollContainerRef}
127144
size={{xs: 12, md: 6}}
128145
sx={{
129146
overflowY: 'auto',
130147
scrollbarWidth: 'thin',
131148
maxHeight: {md: '100%'},
132-
// viewer with bigger paddings for headline buttons
133-
px: {md: 2, lg: 3},
149+
py: 2,
150+
px: {
151+
xs: 2,
152+
// bigger paddings for linkable headline buttons
153+
lg: 3,
154+
},
134155
backgroundColor: 'background.paper',
135156
}}
136157
>
137158
<ViewerBoxRouter
138159
outdated={outdated}
139160
processing={processing}
140161
/>
162+
<Button
163+
startIcon={showAst ? <IcVisibilityOff/> : <IcVisibility/>}
164+
onClick={() => setShowAst(s => !s)}
165+
variant={'outlined'}
166+
sx={{mt: 2, mb: 1}}
167+
>
168+
{'AST'}
169+
</Button>
170+
{showAst ?
171+
<CustomCodeMirror
172+
value={JSON.stringify(root || null, undefined, 4)}
173+
lang={'json'}
174+
/> : null}
141175
</Grid>
142176
</Grid>
143177
</SettingsProvider>

‎apps/sandbox/vite.config.ts‎

Lines changed: 14 additions & 8 deletions
Original file line numberDiff line numberDiff line change
@@ -1,10 +1,16 @@
1-
import { defineConfig } from "vite";
2-
import react from "@vitejs/plugin-react";
1+
import { defineConfig } from 'vite'
2+
import react from '@vitejs/plugin-react'
33

44
export default defineConfig({
5-
plugins: [react()],
6-
define: {
7-
"process.env.NODE_ENV": JSON.stringify("development"),
8-
// "process.env.NODE_ENV": JSON.stringify(process.env.NODE_ENV),
9-
},
10-
});
5+
plugins: [react()],
6+
define: {
7+
'process.env.NODE_ENV': JSON.stringify('development'),
8+
// "process.env.NODE_ENV": JSON.stringify(process.env.NODE_ENV),
9+
},
10+
11+
server: {
12+
// needed for codesandbox, which can be under hosted under any hostname,
13+
// https://github.com/vitejs/vite/security/advisories/GHSA-vg6x-rcgg-rjx6
14+
allowedHosts: true,
15+
},
16+
})

‎package-lock.json‎

Lines changed: 6 additions & 0 deletions
Some generated files are not rendered by default. Learn more about customizing how changed files appear on GitHub.

0 commit comments

Comments
 (0)