Skip to content

Commit c25fa7d

Browse files
committed
Docs refresh
1 parent 6cea535 commit c25fa7d

28 files changed

+1827
-1116
lines changed

.github/logo-dark.png

-30.8 KB
Binary file not shown.

.github/logo-light.png

-35.4 KB
Binary file not shown.

.github/logo.png

41.2 KB
Loading

README.md

+7-8
Original file line numberDiff line numberDiff line change
@@ -1,14 +1,11 @@
11
<p align="center">
2-
<a href="https://elilambnz.github.io/react-py/#gh-light-mode-only" target="_blank">
3-
<img src="./.github/logo-light.png" alt="react-py" width="350" height="70">
4-
</a>
5-
<a href="https://elilambnz.github.io/react-py/#gh-dark-mode-only" target="_blank">
6-
<img src="./.github/logo-dark.png" alt="react-py" width="350" height="70">
2+
<a href="https://elilambnz.github.io/react-py" target="_blank">
3+
<img src="./.github/logo.png" alt="react-py logo" width="70" height="70">
74
</a>
85
</p>
96

107
<p align="center">
11-
Effortlessly run Python code in your React apps. <a href="https://elilambnz.github.io/react-py">Try it out!</a>
8+
Effortlessly run Python code in your React apps.
129
</p>
1310

1411
<p align="center">
@@ -21,7 +18,9 @@
2118

2219
---
2320

24-
> ✨ <a href="https://pyrepl.io">PyRepl.io</a> is a Python interpreter in your browser. Embed interactive Python examples in your documentation, blog posts, presentations and more. <a href="https://pyrepl.io">Get started for free.</a>
21+
## Try it out
22+
23+
You can try out `react-py` [in the playground](https://elilambnz.github.io/react-py/playground).
2524

2625
## Quickstart
2726

@@ -88,7 +87,7 @@ Most of the Python standard library is functional, except from some modules. The
8887

8988
_react-py_ is available under the MIT License.
9089

91-
## Contact
90+
## Maintainers
9291

9392
Eli Lamb - [elilambnz](https://github.com/elilambnz)
9493
James Ansley - [James-Ansley](https://github.com/James-Ansley)

website/docs/examples/playground.md renamed to website/docs/examples/debug.md

+1-1
Original file line numberDiff line numberDiff line change
@@ -3,7 +3,7 @@ sidebar_position: 0
33
draft: true
44
---
55

6-
# Playground
6+
# Debug
77

88
Used for testing bugs etc.
99

website/docusaurus.config.js

+5
Original file line numberDiff line numberDiff line change
@@ -80,6 +80,11 @@ const config = {
8080
position: 'left',
8181
label: 'Docs'
8282
},
83+
{
84+
to: '/playground',
85+
position: 'left',
86+
label: 'Playground'
87+
},
8388
{
8489
href: 'https://github.com/elilambnz/react-py',
8590
label: 'GitHub',

website/package-lock.json

+973-893
Some generated files are not rendered by default. Learn more about customizing how changed files appear on GitHub.

website/package.json

+5-6
Original file line numberDiff line numberDiff line change
@@ -15,8 +15,8 @@
1515
"typecheck": "tsc"
1616
},
1717
"dependencies": {
18-
"@docusaurus/core": "^3.1.1",
19-
"@docusaurus/preset-classic": "^3.1.1",
18+
"@docusaurus/core": "^3.4.0",
19+
"@docusaurus/preset-classic": "^3.4.0",
2020
"@easyops-cn/docusaurus-search-local": "^0.37.4",
2121
"@headlessui/react": "^1.7.7",
2222
"@heroicons/react": "^2.0.13",
@@ -33,11 +33,10 @@
3333
"tailwindcss": "^3.1.8"
3434
},
3535
"devDependencies": {
36-
"@docusaurus/module-type-aliases": "^3.1.1",
37-
"@docusaurus/tsconfig": "^3.1.1",
38-
"@docusaurus/types": "^3.1.1",
36+
"@docusaurus/module-type-aliases": "^3.4.0",
37+
"@docusaurus/tsconfig": "^3.4.0",
38+
"@docusaurus/types": "^3.4.0",
3939
"@tailwindcss/forms": "^0.5.3",
40-
"@tsconfig/docusaurus": "^1.0.5",
4140
"@types/react": "^18.2.55",
4241
"@types/react-dom": "^18.2.19",
4342
"prettier": "^2.8.1",

website/src/components/Console.tsx

+2-2
Original file line numberDiff line numberDiff line change
@@ -126,8 +126,8 @@ export default function Console() {
126126
</code>
127127
))}
128128
<div className="group relative flex items-center">
129-
<code className="text-gray-500">{getPrompt()}</code>
130-
<span className="text-gray-500 group-focus-within:hidden">|</span>
129+
<code className="text-zinc-500">{getPrompt()}</code>
130+
<span className="text-zinc-500 group-focus-within:hidden">|</span>
131131
<textarea
132132
ref={textArea}
133133
className={clsx(

website/src/components/Controls.tsx

+4-4
Original file line numberDiff line numberDiff line change
@@ -20,7 +20,7 @@ export default function Controls(props: ControlProps) {
2020
<div className="pointer-events-none z-10 -mb-16 flex justify-end p-2">
2121
<div className="pointer-events-auto space-x-2 rounded-md bg-white p-1 opacity-80 shadow-md hover:opacity-100">
2222
{isAwaitingInput && (
23-
<div className="inline-flex items-center rounded-md bg-sky-500 px-4 py-2 text-sm font-semibold leading-6 text-white shadow">
23+
<div className="inline-flex items-center rounded-md bg-lime-500 px-4 py-2 text-sm font-semibold leading-6 text-white shadow">
2424
<svg
2525
className="-ml-1 mr-3 h-5 w-5 animate-spin text-white"
2626
xmlns="http://www.w3.org/2000/svg"
@@ -52,16 +52,16 @@ export default function Controls(props: ControlProps) {
5252
onClick={item.onClick}
5353
disabled={item.disabled}
5454
className={clsx(
55-
'relative inline-flex items-center border border-none border-gray-300 bg-white px-4 py-2 text-sm font-medium text-gray-700 focus:z-10 focus:outline-none focus:ring-0',
55+
'relative inline-flex items-center border border-none border-zinc-300 bg-white px-4 py-2 text-sm font-medium text-zinc-700 focus:z-10 focus:outline-none focus:ring-0',
5656
!item.disabled
57-
? 'opacity-75 hover:cursor-pointer hover:bg-gray-50 hover:opacity-100'
57+
? 'opacity-75 hover:cursor-pointer hover:bg-zinc-50 hover:opacity-100'
5858
: 'opacity-50 hover:cursor-not-allowed',
5959
i === 0 && 'rounded-l-md',
6060
i === visibleItems.length - 1 && 'rounded-r-md'
6161
)}
6262
>
6363
<item.icon
64-
className="-ml-1 mr-2 h-5 w-5 text-gray-400"
64+
className="-ml-1 mr-2 h-5 w-5 text-zinc-400"
6565
aria-hidden="true"
6666
/>
6767
{item.label}
+49
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,49 @@
1+
import { Fragment } from 'react'
2+
import { Dialog, Transition } from '@headlessui/react'
3+
4+
function DialogEmpty({
5+
show,
6+
onClose,
7+
children
8+
}: React.PropsWithChildren<{
9+
show: boolean
10+
onClose: () => void
11+
}>) {
12+
return (
13+
<Transition.Root show={show} as={Fragment}>
14+
<Dialog as="div" className="relative z-10" onClose={onClose}>
15+
<Transition.Child
16+
as={Fragment}
17+
enter="ease-out duration-300"
18+
enterFrom="opacity-0"
19+
enterTo="opacity-100"
20+
leave="ease-in duration-200"
21+
leaveFrom="opacity-100"
22+
leaveTo="opacity-0"
23+
>
24+
<div className="fixed inset-0 bg-zinc-500 bg-opacity-75 transition-opacity" />
25+
</Transition.Child>
26+
27+
<div className="fixed inset-0 z-10 overflow-y-auto">
28+
<div className="flex min-h-full items-end justify-center p-4 sm:items-center sm:p-0">
29+
<Transition.Child
30+
as={Fragment}
31+
enter="ease-out duration-300"
32+
enterFrom="opacity-0 translate-y-4 sm:translate-y-0 sm:scale-95"
33+
enterTo="opacity-100 translate-y-0 sm:scale-100"
34+
leave="ease-in duration-200"
35+
leaveFrom="opacity-100 translate-y-0 sm:scale-100"
36+
leaveTo="opacity-0 translate-y-4 sm:translate-y-0 sm:scale-95"
37+
>
38+
<Dialog.Panel className="relative transform overflow-hidden rounded-lg bg-white shadow-xl transition-all dark:bg-neutral-800 sm:my-8">
39+
{children}
40+
</Dialog.Panel>
41+
</Transition.Child>
42+
</div>
43+
</div>
44+
</Dialog>
45+
</Transition.Root>
46+
)
47+
}
48+
49+
export default DialogEmpty

website/src/components/Editor.tsx

+47
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,47 @@
1+
import AceEditor from "react-ace";
2+
3+
import "ace-builds/src-noconflict/mode-python";
4+
import "ace-builds/src-noconflict/theme-textmate";
5+
import "ace-builds/src-noconflict/theme-twilight";
6+
import "ace-builds/src-noconflict/ext-language_tools";
7+
8+
const editorOptions = {
9+
enableBasicAutocompletion: true,
10+
enableLiveAutocompletion: true,
11+
highlightActiveLine: false,
12+
showPrintMargin: false,
13+
};
14+
15+
// eslint-disable-next-line @typescript-eslint/no-explicit-any
16+
const editorOnLoad = (editor: any) => {
17+
editor.renderer.setScrollMargin(10, 10, 0, 0);
18+
editor.moveCursorTo(0, 0);
19+
};
20+
21+
export default function Editor({
22+
theme,
23+
input,
24+
onChange,
25+
}: {
26+
theme: string;
27+
input: string;
28+
onChange: (value: string) => void;
29+
}) {
30+
return (
31+
<AceEditor
32+
value={input}
33+
mode="python"
34+
name="CodeBlock"
35+
fontSize="0.9rem"
36+
className="flex-1 overflow-clip"
37+
theme={theme === "dark" ? "twilight" : "textmate"}
38+
onChange={onChange}
39+
width="100%"
40+
height="100%"
41+
onLoad={editorOnLoad}
42+
editorProps={{ $blockScrolling: true }}
43+
setOptions={editorOptions}
44+
wrapEnabled={true}
45+
/>
46+
);
47+
}

0 commit comments

Comments
 (0)