docusaurus-live-brython 3.0.0-beta.5 → 3.0.0-beta.7

package/lib/theme/CodeBlock/index.jsx

@@ -1,8 +1,8 @@
 import React from 'react';
 import CodeBlock from '@theme-init/CodeBlock';
 import ExecutionEnvironment from '@docusaurus/ExecutionEnvironment';
-import CodeEditor from '../CodeEditor';
-import ScriptContext from '../CodeEditor/WithScript/Store';
+import CodeEditor from 'docusaurus-live-brython/theme/CodeEditor';
+import ScriptContext from 'docusaurus-live-brython/theme/CodeEditor/WithScript/Store';
 const sanitizedTitle = (id) => {
     if (!id) {
         return;

package/lib/theme/CodeEditor/Actions/DownloadCode.jsx

@@ -1,6 +1,6 @@
 import * as React from 'react';
-import { useScript, useStore } from '../WithScript/Store';
-import Button from '../Button';
+import { useScript, useStore } from 'docusaurus-live-brython/theme/CodeEditor/WithScript/Store';
+import Button from 'docusaurus-live-brython/theme/CodeEditor/Button';
 import { translate } from '@docusaurus/Translate';
 const DownloadCode = (props) => {
     const { store } = useScript();

package/lib/theme/CodeEditor/Actions/Reset.jsx

@@ -1,6 +1,6 @@
 import * as React from 'react';
-import { useScript, useStore } from '../WithScript/Store';
-import Button from '../Button';
+import { useScript, useStore } from 'docusaurus-live-brython/theme/CodeEditor/WithScript/Store';
+import Button from 'docusaurus-live-brython/theme/CodeEditor/Button';
 import { translate } from '@docusaurus/Translate';
 const Reset = () => {
     const { store } = useScript();

package/lib/theme/CodeEditor/Actions/RunCode.jsx

@@ -1,6 +1,6 @@
 import * as React from 'react';
-import { useScript, useStore } from '../WithScript/Store';
-import Button, { Color } from '../Button';
+import { useScript, useStore } from 'docusaurus-live-brython/theme/CodeEditor/WithScript/Store';
+import Button, { Color } from 'docusaurus-live-brython/theme/CodeEditor/Button';
 import { translate } from '@docusaurus/Translate';
 import styles from './styles.module.css';
 import clsx from 'clsx';

package/lib/theme/CodeEditor/Actions/ShowRaw.jsx

@@ -1,6 +1,6 @@
 import * as React from 'react';
-import { useScript, useStore } from '../WithScript/Store';
-import Button, { Color } from '../Button';
+import { useScript, useStore } from 'docusaurus-live-brython/theme/CodeEditor/WithScript/Store';
+import Button, { Color } from 'docusaurus-live-brython/theme/CodeEditor/Button';
 import { translate } from '@docusaurus/Translate';
 const ShowRaw = () => {
     const { store } = useScript();

package/lib/theme/CodeEditor/Actions/ShowSyncStatus.jsx

@@ -1,7 +1,7 @@
 import * as React from 'react';
-import { useScript, useStore } from '../WithScript/Store';
-import Icon, { Color } from '../Icon';
-import { Status } from '../WithScript/Types';
+import { useScript, useStore } from 'docusaurus-live-brython/theme/CodeEditor/WithScript/Store';
+import Icon, { Color } from 'docusaurus-live-brython/theme/CodeEditor/Icon';
+import { Status } from 'docusaurus-live-brython/theme/CodeEditor/WithScript/Types';
 const ShowSyncStatus = () => {
     const { store } = useScript();
     const isLoaded = useStore(store, (state) => state.isLoaded);

package/lib/theme/CodeEditor/BrythonCommunicator.jsx

@@ -1,6 +1,6 @@
 import * as React from "react";
-import { BRYTHON_NOTIFICATION_EVENT, DOM_ELEMENT_IDS } from "./constants";
-import { useScript, useStore } from './WithScript/Store';
+import { BRYTHON_NOTIFICATION_EVENT, DOM_ELEMENT_IDS } from "docusaurus-live-brython/theme/CodeEditor/constants";
+import { useScript, useStore } from 'docusaurus-live-brython/theme/CodeEditor/WithScript/Store';
 const BrythonCommunicator = () => {
     const { store } = useScript();
     const codeId = useStore(store, (state) => state.codeId);

package/lib/theme/CodeEditor/Button/index.d.ts

@@ -1,5 +1,5 @@
 import * as React from 'react';
-import * as Icons from '../Icon/icons';
+import * as Icons from 'docusaurus-live-brython/theme/CodeEditor/Icon/icons';
 export declare enum Color {
     Primary = "button--primary",
     Secondary = "button--secondary",

package/lib/theme/CodeEditor/Button/index.jsx

@@ -1,7 +1,7 @@
 import * as React from 'react';
 import styles from './styles.module.css';
 import clsx from 'clsx';
-import Icon from '../Icon';
+import Icon from 'docusaurus-live-brython/theme/CodeEditor/Icon';
 export var Color;
 (function (Color) {
     Color["Primary"] = "button--primary";

package/lib/theme/CodeEditor/CodeHistory/index.jsx

@@ -4,9 +4,9 @@ import styles from './styles.module.css';
 import { Prism } from 'prism-react-renderer';
 import Slider from 'rc-slider';
 import 'rc-slider/assets/index.css';
-import { useScript, useStore } from '../WithScript/Store';
+import { useScript, useStore } from 'docusaurus-live-brython/theme/CodeEditor/WithScript/Store';
 import Translate, { translate } from '@docusaurus/Translate';
-import Button from '../Button';
+import Button from 'docusaurus-live-brython/theme/CodeEditor/Button';
 import DiffViewer from 'react-diff-viewer';
 import Details from '@theme/Details';
 const highlightSyntax = (str) => {

package/lib/theme/CodeEditor/Editor/EditorAce.jsx

@@ -1,7 +1,7 @@
 import * as React from 'react';
 import clsx from 'clsx';
 import styles from './styles.module.css';
-import { DOM_ELEMENT_IDS } from '../constants';
+import { DOM_ELEMENT_IDS } from 'docusaurus-live-brython/theme/CodeEditor/constants';
 import AceEditor from 'react-ace';
 import 'ace-builds/src-noconflict/ext-searchbox';
 import 'ace-builds/src-noconflict/mode-python';
@@ -10,7 +10,7 @@ import 'ace-builds/src-noconflict/mode-svg';
 import 'ace-builds/src-noconflict/theme-dracula';
 import 'ace-builds/src-noconflict/ext-language_tools';
 import 'ace-builds/webpack-resolver';
-import { useScript, useStore } from '../WithScript/Store';
+import { useScript, useStore } from 'docusaurus-live-brython/theme/CodeEditor/WithScript/Store';
 const ALIAS_LANG_MAP_ACE = {
     mpy: 'python',
 };

package/lib/theme/CodeEditor/Editor/Header/index.jsx

@@ -1,12 +1,12 @@
 import * as React from 'react';
 import clsx from 'clsx';
 import styles from './styles.module.css';
-import { useScript, useStore } from '../../WithScript/Store';
-import ShowSyncStatus from '../../Actions/ShowSyncStatus';
-import Reset from '../../Actions/Reset';
-import DownloadCode from '../../Actions/DownloadCode';
-import ShowRaw from '../../Actions/ShowRaw';
-import RunCode from '../../Actions/RunCode';
+import { useScript, useStore } from 'docusaurus-live-brython/theme/CodeEditor/WithScript/Store';
+import ShowSyncStatus from 'docusaurus-live-brython/theme/CodeEditor/Actions/ShowSyncStatus';
+import Reset from 'docusaurus-live-brython/theme/CodeEditor/Actions/Reset';
+import DownloadCode from 'docusaurus-live-brython/theme/CodeEditor/Actions/DownloadCode';
+import ShowRaw from 'docusaurus-live-brython/theme/CodeEditor/Actions/ShowRaw';
+import RunCode from 'docusaurus-live-brython/theme/CodeEditor/Actions/RunCode';
 const Header = (props) => {
     const { store } = useScript();
     const hasEdits = useStore(store, (state) => state.hasEdits);

package/lib/theme/CodeEditor/Editor/Result/Graphics/Canvas.d.ts

@@ -1,3 +1,3 @@
 import * as React from 'react';
-declare const CanvasResult: () => React.JSX.Element;
-export default CanvasResult;
+declare const Canvas: () => React.JSX.Element;
+export default Canvas;

package/lib/theme/CodeEditor/Editor/Result/Graphics/Canvas.jsx

@@ -1,9 +1,9 @@
 import * as React from 'react';
-import { DOM_ELEMENT_IDS } from '../../../constants';
-import GraphicsResult from '.';
+import { DOM_ELEMENT_IDS } from 'docusaurus-live-brython/theme/CodeEditor/constants';
+import Graphics from 'docusaurus-live-brython/theme/CodeEditor/Editor/Result/Graphics';
 import styles from './styles.module.css';
-import { useScript, useStore } from '../../../WithScript/Store';
-import Button from '../../../Button';
+import { useScript, useStore } from 'docusaurus-live-brython/theme/CodeEditor/WithScript/Store';
+import Button from 'docusaurus-live-brython/theme/CodeEditor/Button';
 const downloadCanvas = (canvasId) => {
     const canvas = document.getElementById(canvasId);
     if (!canvas) {
@@ -21,11 +21,11 @@ const downloadCanvas = (canvasId) => {
     downloadLink.click();
     document.body.removeChild(downloadLink);
 };
-const CanvasResult = () => {
+const Canvas = () => {
     const { store } = useScript();
     // const { codeId } = useStore(store, (state) => ({codeId: state.codeId}));
     const codeId = useStore(store, (state) => state.codeId);
-    return (<GraphicsResult controls={<Button icon='Download' iconSize='12px' onClick={() => {
+    return (<Graphics controls={<Button icon='Download' iconSize='12px' onClick={() => {
                 downloadCanvas(DOM_ELEMENT_IDS.canvasContainer(codeId));
             }} title="Download SVG" className={styles.slimStrippedButton}/>} main={<canvas id={DOM_ELEMENT_IDS.canvasContainer(codeId)} width="500" height="500" style={{
                 display: 'block',
@@ -33,4 +33,4 @@ const CanvasResult = () => {
                 height: '500px'
             }}></canvas>}/>);
 };
-export default CanvasResult;
+export default Canvas;

package/lib/theme/CodeEditor/Editor/Result/Graphics/Turtle.d.ts

@@ -1,3 +1,3 @@
 import * as React from 'react';
-declare const TurtleResult: () => React.JSX.Element;
-export default TurtleResult;
+declare const Turtle: () => React.JSX.Element;
+export default Turtle;

package/lib/theme/CodeEditor/Editor/Result/Graphics/Turtle.jsx

@@ -1,16 +1,16 @@
 import * as React from 'react';
 import styles from './styles.module.css';
-import { DOM_ELEMENT_IDS } from '../../../constants';
-import GraphicsResult from '.';
-import { saveSvg } from '../../utils/saveSvg';
-import { useScript, useStore } from '../../../WithScript/Store';
-import Button from '../../../Button';
+import { DOM_ELEMENT_IDS } from 'docusaurus-live-brython/theme/CodeEditor/constants';
+import Graphics from 'docusaurus-live-brython/theme/CodeEditor/Editor/Result/Graphics';
+import { saveSvg } from 'docusaurus-live-brython/theme/CodeEditor/Editor/utils/saveSvg';
+import { useScript, useStore } from 'docusaurus-live-brython/theme/CodeEditor/WithScript/Store';
+import Button from 'docusaurus-live-brython/theme/CodeEditor/Button';
 import clsx from 'clsx';
-const TurtleResult = () => {
+const Turtle = () => {
     const { store } = useScript();
     const codeId = useStore(store, (state) => state.codeId);
     const code = useStore(store, (state) => state.code);
-    return (<GraphicsResult controls={<React.Fragment>
+    return (<Graphics controls={<React.Fragment>
                     <Button icon='AnimationPlay' onClick={() => {
                 const turtleResult = document.getElementById(DOM_ELEMENT_IDS.turtleSvgContainer(codeId));
                 if (turtleResult) {
@@ -25,4 +25,4 @@ const TurtleResult = () => {
             }} title="Download SVG" className={styles.slimStrippedButton}/>
                 </React.Fragment>}/>);
 };
-export default TurtleResult;
+export default Turtle;

package/lib/theme/CodeEditor/Editor/Result/Graphics/index.d.ts

@@ -3,5 +3,5 @@ interface Props {
     controls?: JSX.Element;
     main?: JSX.Element;
 }
-declare const GraphicsResult: (props: Props) => React.JSX.Element;
-export default GraphicsResult;
+declare const Graphics: (props: Props) => React.JSX.Element;
+export default Graphics;

package/lib/theme/CodeEditor/Editor/Result/Graphics/index.jsx

@@ -1,12 +1,12 @@
 import * as React from 'react';
 import styles from './styles.module.css';
-import { DOM_ELEMENT_IDS } from '../../../constants';
+import { DOM_ELEMENT_IDS } from 'docusaurus-live-brython/theme/CodeEditor/constants';
 import Draggable from 'react-draggable';
-import { checkForButtonClick } from '../../utils/checkForButtonClick';
-import { useScript, useStore } from '../../../WithScript/Store';
-import Button from '../../../Button';
+import { checkForButtonClick } from 'docusaurus-live-brython/theme/CodeEditor/Editor/utils/checkForButtonClick';
+import { useScript, useStore } from 'docusaurus-live-brython/theme/CodeEditor/WithScript/Store';
+import Button from 'docusaurus-live-brython/theme/CodeEditor/Button';
 import clsx from 'clsx';
-const GraphicsResult = (props) => {
+const Graphics = (props) => {
     const { store } = useScript();
     const codeId = useStore(store, (state) => state.codeId);
     return (<Draggable onStop={checkForButtonClick} positionOffset={{ x: 0, y: '-50%' }}>
@@ -26,4 +26,4 @@ const GraphicsResult = (props) => {
             </div>
         </Draggable>);
 };
-export default GraphicsResult;
+export default Graphics;

package/lib/theme/CodeEditor/Editor/Result/index.jsx

@@ -2,7 +2,7 @@ import * as React from 'react';
 import styles from './styles.module.css';
 // @ts-ignore
 import CodeBlock from '@theme/CodeBlock';
-import { useScript, useStore } from '../../WithScript/Store';
+import { useScript, useStore } from 'docusaurus-live-brython/theme/CodeEditor/WithScript/Store';
 const Result = (props) => {
     const { store } = useScript();
     const logs = useStore(store, (state) => state.logs);

package/lib/theme/CodeEditor/Editor/index.jsx

@@ -1,12 +1,12 @@
 import * as React from "react";
-import { DOM_ELEMENT_IDS, } from "../constants";
-import { useScript, useStore } from '../WithScript/Store';
-import Result from "./Result";
-import TurtleResult from "./Result/Graphics/Turtle";
-import CanvasResult from "./Result/Graphics/Canvas";
-import GraphicsResult from "./Result/Graphics";
-import Header from "./Header";
-import EditorAce from "./EditorAce";
+import { DOM_ELEMENT_IDS, } from "docusaurus-live-brython/theme/CodeEditor/constants";
+import { useScript, useStore } from 'docusaurus-live-brython/theme/CodeEditor/WithScript/Store';
+import Result from "docusaurus-live-brython/theme/CodeEditor/Editor/Result";
+import Turtle from "docusaurus-live-brython/theme/CodeEditor/Editor/Result/Graphics/Turtle";
+import Canvas from "docusaurus-live-brython/theme/CodeEditor/Editor/Result/Graphics/Canvas";
+import Graphics from "docusaurus-live-brython/theme/CodeEditor/Editor/Result/Graphics";
+import Header from "docusaurus-live-brython/theme/CodeEditor/Editor/Header";
+import EditorAce from "docusaurus-live-brython/theme/CodeEditor/Editor/EditorAce";
 const Editor = (props) => {
     const { store } = useScript();
     const lang = useStore(store, (state) => state.lang);
@@ -22,9 +22,9 @@ const Editor = (props) => {
           <Result />
           <div id={DOM_ELEMENT_IDS.outputDiv(codeId)}></div>
           {isGraphicsmodalOpen && (<>
-              {hasTurtleOutput && (<TurtleResult />)}
-              {hasCanvasOutput && (<CanvasResult />)}
-              {!hasCanvasOutput && !hasTurtleOutput && (<GraphicsResult />)}
+              {hasTurtleOutput && (<Turtle />)}
+              {hasCanvasOutput && (<Canvas />)}
+              {!hasCanvasOutput && !hasTurtleOutput && (<Graphics />)}
             </>)}
         </>}
     </React.Fragment>);

package/lib/theme/CodeEditor/Editor/utils/saveSvg.js

@@ -1,4 +1,4 @@
-import { removeAnimations } from "./svgWithoutAnimations";
+import { removeAnimations } from "docusaurus-live-brython/theme/CodeEditor/Editor/utils/svgWithoutAnimations";
 const duration = (anim) => {
     const dur = anim.getAttribute('dur') || '';
     if (/ms$/.test(dur)) {

package/lib/theme/CodeEditor/Icon/index.d.ts

@@ -1,5 +1,5 @@
 import * as React from 'react';
-import * as Icons from './icons';
+import * as Icons from 'docusaurus-live-brython/theme/CodeEditor/Icon/icons';
 export declare enum Color {
     Primary = "var(--ifm-color-primary)",
     Secondary = "var(--ifm-color-secondary)",

package/lib/theme/CodeEditor/Icon/index.jsx

@@ -1,5 +1,5 @@
 import * as React from 'react';
-import * as Icons from './icons';
+import * as Icons from 'docusaurus-live-brython/theme/CodeEditor/Icon/icons';
 import styles from './styles.module.css';
 import clsx from 'clsx';
 export var Color;

package/lib/theme/CodeEditor/WithScript/Storage.d.ts

@@ -1,3 +1,3 @@
-import type { StorageSlot, StoredScript } from "./Types";
+import type { StorageSlot, StoredScript } from "docusaurus-live-brython/theme/CodeEditor/WithScript/Types";
 export declare const getStorageScript: (storage: StorageSlot) => StoredScript | undefined;
 export declare const syncStorageScript: (script: StoredScript, storage: StorageSlot) => boolean;

package/lib/theme/CodeEditor/WithScript/Store.jsx

@@ -1,12 +1,12 @@
 import React, { useCallback } from "react";
 import { useSyncExternalStore } from "react";
 import { v4 as uuidv4 } from 'uuid';
-import { checkCanvasOutput, checkGraphicsOutput, checkTurtleOutput, getPreCode, sanitizePyScript } from "./helpers";
+import { checkCanvasOutput, checkGraphicsOutput, checkTurtleOutput, getPreCode, sanitizePyScript } from "docusaurus-live-brython/theme/CodeEditor/WithScript/helpers";
 import { ReactContextError, createStorageSlot } from "@docusaurus/theme-common";
 import { usePluginData } from "@docusaurus/useGlobalData";
-import { DOM_ELEMENT_IDS } from "../constants";
+import { DOM_ELEMENT_IDS } from "docusaurus-live-brython/theme/CodeEditor/constants";
 import throttle from 'lodash/throttle';
-import { getStorageScript, syncStorageScript } from "./Storage";
+import { getStorageScript, syncStorageScript } from "docusaurus-live-brython/theme/CodeEditor/WithScript/Storage";
 import { Status } from "./Types";
 export const createStore = (props, libDir, syncMaxOnceEvery) => {
     const canSave = !!props.id;

package/lib/theme/CodeEditor/index.jsx

@@ -1,11 +1,11 @@
 import * as React from 'react';
 import styles from './styles.module.css';
-import Editor from './Editor';
-import BrythonCommunicator from './BrythonCommunicator';
+import Editor from 'docusaurus-live-brython/theme/CodeEditor/Editor';
+import BrythonCommunicator from 'docusaurus-live-brython/theme/CodeEditor/BrythonCommunicator';
 import clsx from 'clsx';
-import { useScript, useStore } from './WithScript/Store';
+import { useScript, useStore } from 'docusaurus-live-brython/theme/CodeEditor/WithScript/Store';
 import BrowserOnly from '@docusaurus/BrowserOnly';
-import CodeHistory from './CodeHistory';
+import CodeHistory from 'docusaurus-live-brython/theme/CodeEditor/CodeHistory';
 const PyAceEditor = (props) => {
     const { store } = useScript();
     const lang = useStore(store, (state) => state.lang);

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "docusaurus-live-brython",
-  "version": "3.0.0-beta.5",
+  "version": "3.0.0-beta.7",
   "description": "Docusaurus live code block component for python.",
   "publishConfig": {
     "access": "public"
@@ -9,12 +9,62 @@
   "types": "lib/index.d.ts",
   "sideEffects": false,
   "exports": {
+    "./theme/CodeEditor/Editor": {
+      "types": "./lib/theme/CodeEditor/Editor/index.d.ts",
+      "default": "./lib/theme/CodeEditor/Editor/index.jsx"
+    },
+    "./theme/CodeEditor/Editor/Result": {
+      "types": "./lib/theme/CodeEditor/Editor/Result/index.d.ts",
+      "default": "./lib/theme/CodeEditor/Editor/Result/index.jsx"
+    },
+    "./theme/CodeEditor/Editor/Header": {
+      "types": "./lib/theme/CodeEditor/Editor/Header/index.d.ts",
+      "default": "./lib/theme/CodeEditor/Editor/Header/index.jsx"
+    },
+    "./theme/CodeEditor/Editor/Result/Graphics": {
+      "types": "./lib/theme/CodeEditor/Editor/Result/Graphics/index.d.ts",
+      "default": "./lib/theme/CodeEditor/Editor/Result/Graphics/index.jsx"
+    },
+    "./theme/CodeEditor/CodeHistory": {
+      "types": "./lib/theme/CodeEditor/CodeHistory/index.d.ts",
+      "default": "./lib/theme/CodeEditor/CodeHistory/index.jsx"
+    },
+    "./theme/CodeEditor/Icon": {
+      "types": "./lib/theme/CodeEditor/Icon/index.d.ts",
+      "default": "./lib/theme/CodeEditor/Icon/index.jsx"
+    },
+    "./theme/CodeEditor/Button": {
+      "types": "./lib/theme/CodeEditor/Button/index.d.ts",
+      "default": "./lib/theme/CodeEditor/Button/index.jsx"
+    },
+    "./theme/CodeEditor/*": {
+      "types": "./lib/theme/CodeEditor/*.d.ts",
+      "default": "./lib/theme/CodeEditor/*.jsx"
+    },
+    "./theme/CodeEditor/constants": {
+      "types": "./lib/theme/CodeEditor/constants.d.ts",
+      "default": "./lib/theme/CodeEditor/constants.js"
+    },
+    "./theme/CodeEditor/Editor/utils": {
+      "types": "./lib/theme/CodeEditor/Editor/utils/*.d.ts",
+      "default": "./lib/theme/CodeEditor/Editor/utils/*.js"
+    },
+    "./theme/CodeEditor/WithScript": {
+      "types": "./lib/theme/CodeEditor/WithScript/*.d.ts",
+      "default": "./lib/theme/CodeEditor/WithScript/*.js"
+    },
+    "./theme/CodeEditor": {
+      "types": "./lib/theme/CodeEditor/index.d.ts",
+      "default": "./lib/theme/CodeEditor/index.jsx"
+    },
+    "./theme/CodeEditor/Icon/icons": {
+      "types": "./lib/theme/CodeEditor/Icon/icons.d.ts",
+      "default": "./lib/theme/CodeEditor/Icon/icons.js"
+    },
     ".": {
       "types": "./lib/index.d.ts",
       "default": "./lib/index.js"
-    },
-    "./lib/*": "./lib/*",
-    "./src/*": "./src/*"
+    }
   },
   "scripts": {
     "build": "tsc --build && node ./bin/copyUntypedFiles.js && prettier --config ./.prettierrc --write \"lib/theme/**/*.js\"",

package/src/theme/CodeBlock/index.tsx

@@ -3,9 +3,9 @@ import CodeBlock, {type Props as CodeBlockType} from '@theme-init/CodeBlock';
 // @ts-ignore
 import type { WrapperProps } from '@docusaurus/types';
 import ExecutionEnvironment from '@docusaurus/ExecutionEnvironment';
-import CodeEditor from '../CodeEditor';
+import CodeEditor from 'docusaurus-live-brython/theme/CodeEditor';
 
-import ScriptContext from '../CodeEditor/WithScript/Store';
+import ScriptContext from 'docusaurus-live-brython/theme/CodeEditor/WithScript/Store';
 
 
 type Props = WrapperProps<typeof CodeBlockType>;

package/src/theme/CodeEditor/Actions/DownloadCode.tsx

@@ -1,6 +1,6 @@
 import * as React from 'react';
-import { useScript, useStore } from '../WithScript/Store';
-import Button, { Color } from '../Button';
+import { useScript, useStore } from 'docusaurus-live-brython/theme/CodeEditor/WithScript/Store';
+import Button, { Color } from 'docusaurus-live-brython/theme/CodeEditor/Button';
 import { translate } from '@docusaurus/Translate';
 
 

package/src/theme/CodeEditor/Actions/Reset.tsx

@@ -1,6 +1,6 @@
 import * as React from 'react';
-import { useScript, useStore } from '../WithScript/Store';
-import Button, { Color } from '../Button';
+import { useScript, useStore } from 'docusaurus-live-brython/theme/CodeEditor/WithScript/Store';
+import Button, { Color } from 'docusaurus-live-brython/theme/CodeEditor/Button';
 import { translate } from '@docusaurus/Translate';
 
 const Reset = () => {

package/src/theme/CodeEditor/Actions/RunCode.tsx

@@ -1,6 +1,6 @@
 import * as React from 'react';
-import { useScript, useStore } from '../WithScript/Store';
-import Button, { Color } from '../Button';
+import { useScript, useStore } from 'docusaurus-live-brython/theme/CodeEditor/WithScript/Store';
+import Button, { Color } from 'docusaurus-live-brython/theme/CodeEditor/Button';
 import { translate } from '@docusaurus/Translate';
 import styles from './styles.module.css';
 import clsx from 'clsx';

package/src/theme/CodeEditor/Actions/ShowRaw.tsx

@@ -1,6 +1,6 @@
 import * as React from 'react';
-import { useScript, useStore } from '../WithScript/Store';
-import Button, { Color } from '../Button';
+import { useScript, useStore } from 'docusaurus-live-brython/theme/CodeEditor/WithScript/Store';
+import Button, { Color } from 'docusaurus-live-brython/theme/CodeEditor/Button';
 import { translate } from '@docusaurus/Translate';
 
 const ShowRaw = () => {

package/src/theme/CodeEditor/Actions/ShowSyncStatus.tsx

@@ -1,7 +1,7 @@
 import * as React from 'react';
-import { useScript, useStore } from '../WithScript/Store';
-import Icon, { Color } from '../Icon';
-import { Status } from '../WithScript/Types';
+import { useScript, useStore } from 'docusaurus-live-brython/theme/CodeEditor/WithScript/Store';
+import Icon, { Color } from 'docusaurus-live-brython/theme/CodeEditor/Icon';
+import { Status } from 'docusaurus-live-brython/theme/CodeEditor/WithScript/Types';
 
 const ShowSyncStatus = () => {
     const { store } = useScript();

package/src/theme/CodeEditor/BrythonCommunicator.tsx

@@ -1,7 +1,7 @@
 import * as React from "react";
-import { BRYTHON_NOTIFICATION_EVENT, DOM_ELEMENT_IDS } from "./constants";
-import { useScript, useStore } from './WithScript/Store';
-import { type LogMessage } from './WithScript/Types';
+import { BRYTHON_NOTIFICATION_EVENT, DOM_ELEMENT_IDS } from "docusaurus-live-brython/theme/CodeEditor/constants";
+import { useScript, useStore } from 'docusaurus-live-brython/theme/CodeEditor/WithScript/Store';
+import { type LogMessage } from 'docusaurus-live-brython/theme/CodeEditor/WithScript/Types';
 
 const BrythonCommunicator = () => {
     const { store } = useScript();

package/src/theme/CodeEditor/Button/index.tsx

@@ -1,8 +1,8 @@
 import * as React from 'react';
-import * as Icons from '../Icon/icons';
+import * as Icons from 'docusaurus-live-brython/theme/CodeEditor/Icon/icons';
 import styles from './styles.module.css';
 import clsx from 'clsx';
-import Icon from '../Icon';
+import Icon from 'docusaurus-live-brython/theme/CodeEditor/Icon';
 
 export enum Color {
     Primary = 'button--primary',

package/src/theme/CodeEditor/CodeHistory/index.tsx

@@ -4,9 +4,9 @@ import styles from './styles.module.css';
 import { Prism } from 'prism-react-renderer';
 import Slider from 'rc-slider';
 import 'rc-slider/assets/index.css';
-import { useScript, useStore } from '../WithScript/Store';
+import { useScript, useStore } from 'docusaurus-live-brython/theme/CodeEditor/WithScript/Store';
 import Translate, { translate } from '@docusaurus/Translate';
-import Button from '../Button';
+import Button from 'docusaurus-live-brython/theme/CodeEditor/Button';
 import DiffViewer from 'react-diff-viewer';
 import Details from '@theme/Details';
 

package/src/theme/CodeEditor/Editor/EditorAce.tsx

@@ -1,7 +1,7 @@
 import * as React from 'react';
 import clsx from 'clsx';
 import styles from './styles.module.css';
-import { DOM_ELEMENT_IDS } from '../constants';
+import { DOM_ELEMENT_IDS } from 'docusaurus-live-brython/theme/CodeEditor/constants';
 import AceEditor from 'react-ace';
 import 'ace-builds/src-noconflict/ext-searchbox';
 import 'ace-builds/src-noconflict/mode-python';
@@ -10,7 +10,7 @@ import 'ace-builds/src-noconflict/mode-svg';
 import 'ace-builds/src-noconflict/theme-dracula';
 import 'ace-builds/src-noconflict/ext-language_tools';
 import 'ace-builds/webpack-resolver';
-import { useScript, useStore } from '../WithScript/Store';
+import { useScript, useStore } from 'docusaurus-live-brython/theme/CodeEditor/WithScript/Store';
 // import 'ace-builds/src-noconflict/theme-textmate';
 // import('ace-builds/src-noconflict/snippets/python'),
 

package/src/theme/CodeEditor/Editor/Header/index.tsx

@@ -1,12 +1,12 @@
 import * as React from 'react';
 import clsx from 'clsx';
 import styles from './styles.module.css';
-import { useScript, useStore } from '../../WithScript/Store';
-import ShowSyncStatus from '../../Actions/ShowSyncStatus';
-import Reset from '../../Actions/Reset';
-import DownloadCode from '../../Actions/DownloadCode';
-import ShowRaw from '../../Actions/ShowRaw';
-import RunCode from '../../Actions/RunCode';
+import { useScript, useStore } from 'docusaurus-live-brython/theme/CodeEditor/WithScript/Store';
+import ShowSyncStatus from 'docusaurus-live-brython/theme/CodeEditor/Actions/ShowSyncStatus';
+import Reset from 'docusaurus-live-brython/theme/CodeEditor/Actions/Reset';
+import DownloadCode from 'docusaurus-live-brython/theme/CodeEditor/Actions/DownloadCode';
+import ShowRaw from 'docusaurus-live-brython/theme/CodeEditor/Actions/ShowRaw';
+import RunCode from 'docusaurus-live-brython/theme/CodeEditor/Actions/RunCode';
 
 interface Props {
     slim: boolean;

package/src/theme/CodeEditor/Editor/Result/Graphics/Canvas.tsx

@@ -1,9 +1,9 @@
 import * as React from 'react';
-import { DOM_ELEMENT_IDS } from '../../../constants';
-import GraphicsResult from '.';
+import { DOM_ELEMENT_IDS } from 'docusaurus-live-brython/theme/CodeEditor/constants';
+import Graphics from 'docusaurus-live-brython/theme/CodeEditor/Editor/Result/Graphics';
 import styles from './styles.module.css';
-import { useScript, useStore } from '../../../WithScript/Store';
-import Button from '../../../Button';
+import { useScript, useStore } from 'docusaurus-live-brython/theme/CodeEditor/WithScript/Store';
+import Button from 'docusaurus-live-brython/theme/CodeEditor/Button';
 
 const downloadCanvas = (canvasId: string) => {
     const canvas = document.getElementById(canvasId) as HTMLCanvasElement;
@@ -25,13 +25,13 @@ const downloadCanvas = (canvasId: string) => {
     document.body.removeChild(downloadLink);
   };
 
-const CanvasResult = () => {
+const Canvas = () => {
     const { store } = useScript();
     // const { codeId } = useStore(store, (state) => ({codeId: state.codeId}));
     const codeId = useStore(store, (state) => state.codeId);
 
     return (
-        <GraphicsResult
+        <Graphics
             controls={
                 <Button
                     icon='Download'
@@ -58,4 +58,4 @@ const CanvasResult = () => {
     )
 };
 
-export default CanvasResult;
+export default Canvas;

package/src/theme/CodeEditor/Editor/Result/Graphics/Turtle.tsx

@@ -1,18 +1,18 @@
 import * as React from 'react';
 import styles from './styles.module.css';
-import { DOM_ELEMENT_IDS } from '../../../constants';
-import GraphicsResult from '.';
-import { saveSvg } from '../../utils/saveSvg';
-import { useScript, useStore } from '../../../WithScript/Store';
-import Button, { Color } from '../../../Button';
+import { DOM_ELEMENT_IDS } from 'docusaurus-live-brython/theme/CodeEditor/constants';
+import Graphics from 'docusaurus-live-brython/theme/CodeEditor/Editor/Result/Graphics';
+import { saveSvg } from 'docusaurus-live-brython/theme/CodeEditor/Editor/utils/saveSvg';
+import { useScript, useStore } from 'docusaurus-live-brython/theme/CodeEditor/WithScript/Store';
+import Button from 'docusaurus-live-brython/theme/CodeEditor/Button';
 import clsx from 'clsx';
 
-const TurtleResult = () => {
+const Turtle = () => {
     const { store } = useScript();
     const codeId = useStore(store, (state) => state.codeId);
     const code = useStore(store, (state) => state.code);
     return (
-        <GraphicsResult
+        <Graphics
             controls={
                 <React.Fragment>
                     <Button
@@ -45,4 +45,4 @@ const TurtleResult = () => {
     )
 }
 
-export default TurtleResult;
+export default Turtle;

package/src/theme/CodeEditor/Editor/Result/Graphics/index.tsx

@@ -1,16 +1,16 @@
 import * as React from 'react';
 import styles from './styles.module.css';
-import { DOM_ELEMENT_IDS } from '../../../constants';
+import { DOM_ELEMENT_IDS } from 'docusaurus-live-brython/theme/CodeEditor/constants';
 import Draggable from 'react-draggable';
-import { checkForButtonClick } from '../../utils/checkForButtonClick';
-import { useScript, useStore } from '../../../WithScript/Store';
-import Button from '../../../Button';
+import { checkForButtonClick } from 'docusaurus-live-brython/theme/CodeEditor/Editor/utils/checkForButtonClick';
+import { useScript, useStore } from 'docusaurus-live-brython/theme/CodeEditor/WithScript/Store';
+import Button from 'docusaurus-live-brython/theme/CodeEditor/Button';
 import clsx from 'clsx';
 interface Props {
     controls?: JSX.Element;
     main?: JSX.Element;
 }
-const GraphicsResult = (props: Props) => {
+const Graphics = (props: Props) => {
     const { store } = useScript();
     const codeId = useStore(store, (state) => state.codeId);
     return (
@@ -44,4 +44,4 @@ const GraphicsResult = (props: Props) => {
     );
 };
 
-export default GraphicsResult;
+export default Graphics;

package/src/theme/CodeEditor/Editor/Result/index.tsx

@@ -2,7 +2,7 @@ import * as React from 'react';
 import styles from './styles.module.css';
 // @ts-ignore
 import CodeBlock from '@theme/CodeBlock';
-import { useScript, useStore } from '../../WithScript/Store';
+import { useScript, useStore } from 'docusaurus-live-brython/theme/CodeEditor/WithScript/Store';
 
 interface Props {
 }

package/src/theme/CodeEditor/Editor/index.tsx

@@ -1,16 +1,14 @@
 import * as React from "react";
-import clsx from "clsx";
-import styles from "./styles.module.css";
 import {
   DOM_ELEMENT_IDS,
-} from "../constants";
-import { useScript, useStore } from '../WithScript/Store';
-import Result from "./Result";
-import TurtleResult from "./Result/Graphics/Turtle";
-import CanvasResult from "./Result/Graphics/Canvas";
-import GraphicsResult from "./Result/Graphics";
-import Header from "./Header";
-import EditorAce from "./EditorAce";
+} from "docusaurus-live-brython/theme/CodeEditor/constants";
+import { useScript, useStore } from 'docusaurus-live-brython/theme/CodeEditor/WithScript/Store';
+import Result from "docusaurus-live-brython/theme/CodeEditor/Editor/Result";
+import Turtle from "docusaurus-live-brython/theme/CodeEditor/Editor/Result/Graphics/Turtle";
+import Canvas from "docusaurus-live-brython/theme/CodeEditor/Editor/Result/Graphics/Canvas";
+import Graphics from "docusaurus-live-brython/theme/CodeEditor/Editor/Result/Graphics";
+import Header from "docusaurus-live-brython/theme/CodeEditor/Editor/Header";
+import EditorAce from "docusaurus-live-brython/theme/CodeEditor/Editor/EditorAce";
 
 interface Props {
   slim: boolean;
@@ -54,13 +52,13 @@ const Editor = (props: Props) => {
           {isGraphicsmodalOpen && (
             <>
               {hasTurtleOutput && (
-                <TurtleResult />
+                <Turtle />
               )}
               {hasCanvasOutput && (
-                <CanvasResult />
+                <Canvas />
               )}
               {!hasCanvasOutput && !hasTurtleOutput && (
-                <GraphicsResult />
+                <Graphics />
               )}
             </>
           )}
@@ -70,4 +68,4 @@ const Editor = (props: Props) => {
   );
 };
 
-export default Editor;
+export default Editor;

package/src/theme/CodeEditor/Editor/utils/saveSvg.ts

@@ -1,4 +1,4 @@
-import { removeAnimations } from "./svgWithoutAnimations";
+import { removeAnimations } from "docusaurus-live-brython/theme/CodeEditor/Editor/utils/svgWithoutAnimations";
 
 const duration = (anim: SVGAnimateElement) => {
   const dur = anim.getAttribute('dur') || '';

package/src/theme/CodeEditor/Editor/utils/svgWithoutAnimations.ts

@@ -1,4 +1,4 @@
-import { parse, RootNode, ElementNode, Node } from "svg-parser";
+import { parse, RootNode, Node } from "svg-parser";
 
 const objToAttr = (obj: Object) => {
   return Object.entries(obj || {})

package/src/theme/CodeEditor/Icon/index.tsx

@@ -1,5 +1,5 @@
 import * as React from 'react';
-import * as Icons from './icons';
+import * as Icons from 'docusaurus-live-brython/theme/CodeEditor/Icon/icons';
 import styles from './styles.module.css';
 import clsx from 'clsx';
 

package/src/theme/CodeEditor/WithScript/Storage.ts

@@ -1,4 +1,4 @@
-import type { StorageSlot, StoredScript } from "./Types";
+import type { StorageSlot, StoredScript } from "docusaurus-live-brython/theme/CodeEditor/WithScript/Types";
 
 export const getStorageScript = (storage: StorageSlot): StoredScript | undefined => {
     const storedCode = storage.get();

package/src/theme/CodeEditor/WithScript/Store.tsx

@@ -1,12 +1,12 @@
 import React, { useCallback } from "react";
 import { useSyncExternalStore } from "react";
 import { v4 as uuidv4 } from 'uuid';
-import { checkCanvasOutput, checkGraphicsOutput, checkTurtleOutput, getPreCode, sanitizePyScript } from "./helpers";
+import { checkCanvasOutput, checkGraphicsOutput, checkTurtleOutput, getPreCode, sanitizePyScript } from "docusaurus-live-brython/theme/CodeEditor/WithScript/helpers";
 import { ReactContextError, createStorageSlot } from "@docusaurus/theme-common";
 import { usePluginData } from "@docusaurus/useGlobalData";
-import { DOM_ELEMENT_IDS } from "../constants";
+import { DOM_ELEMENT_IDS } from "docusaurus-live-brython/theme/CodeEditor/constants";
 import throttle from 'lodash/throttle';
-import { getStorageScript, syncStorageScript } from "./Storage";
+import { getStorageScript, syncStorageScript } from "docusaurus-live-brython/theme/CodeEditor/WithScript/Storage";
 import { type InitState, type LogMessage, type Script, Status, type Store, type StoredScript, type Version } from "./Types";
 export const createStore = (props: InitState, libDir: string, syncMaxOnceEvery: number): Store => {
     const canSave = !!props.id;

package/src/theme/CodeEditor/index.tsx

@@ -1,12 +1,11 @@
 import * as React from 'react';
 import styles from './styles.module.css';
-import Editor from './Editor';
-import BrythonCommunicator from './BrythonCommunicator';
+import Editor from 'docusaurus-live-brython/theme/CodeEditor/Editor';
+import BrythonCommunicator from 'docusaurus-live-brython/theme/CodeEditor/BrythonCommunicator';
 import clsx from 'clsx';
-import useIsBrowser from '@docusaurus/useIsBrowser';
-import { useScript, useStore } from './WithScript/Store';
+import { useScript, useStore } from 'docusaurus-live-brython/theme/CodeEditor/WithScript/Store';
 import BrowserOnly from '@docusaurus/BrowserOnly';
-import CodeHistory from './CodeHistory';
+import CodeHistory from 'docusaurus-live-brython/theme/CodeEditor/CodeHistory';
 
 interface Props {
     slim: boolean;
@@ -55,3 +54,4 @@ const PyAceEditor = (props: Props) => {
 };
 
 export default PyAceEditor;
+