-
Notifications
You must be signed in to change notification settings - Fork 16
Commit
This commit does not belong to any branch on this repository, and may belong to a fork outside of the repository.
Initial work on React exporter for Pretext
- Loading branch information
Showing
68 changed files
with
1,417 additions
and
106 deletions.
There are no files selected for viewing
Some generated files are not rendered by default. Learn more about how customized files appear on GitHub.
Oops, something went wrong.
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -1,6 +1,31 @@ | ||
if (typeof window === "undefined") { | ||
// @ts-ignore | ||
globalThis.window = globalThis; | ||
} | ||
|
||
/** | ||
* Global configuration object for DoenetML. | ||
*/ | ||
export const doenetGlobalConfig = { | ||
doenetWorkerUrl: new URL("/doenetml-worker/index.js", window.location.href) | ||
.href, | ||
doenetWorkerUrl: getWorkerUrl(), | ||
}; | ||
// We want this to be available in the global scope | ||
(window as any).doenetGlobalConfig = doenetGlobalConfig; | ||
|
||
/** | ||
* Attempt to resolve the URL of the doenet worker. This function falls back | ||
* to `doenet.org` if an error is thrown. | ||
* @returns | ||
*/ | ||
function getWorkerUrl() { | ||
try { | ||
return new URL( | ||
"/doenetml-worker/index.js", | ||
window?.location?.href || "https://doenet.org", | ||
).href; | ||
} catch (e) { | ||
// `window.location.href` may not be a valid URL. For example, in an iframe it | ||
// could be `about:srcdoc`. | ||
return "https://doenet.org/doenetml-worker/CoreWorker.js"; | ||
} | ||
} |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -0,0 +1,3 @@ | ||
# Doenet Components | ||
|
||
These components are for rendering interactive Doenet on a webpage |
File renamed without changes.
File renamed without changes.
File renamed without changes.
File renamed without changes.
File renamed without changes.
File renamed without changes.
File renamed without changes.
File renamed without changes.
File renamed without changes.
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
File renamed without changes.
File renamed without changes.
File renamed without changes.
File renamed without changes.
File renamed without changes.
File renamed without changes.
File renamed without changes.
File renamed without changes.
File renamed without changes.
File renamed without changes.
File renamed without changes.
File renamed without changes.
File renamed without changes.
File renamed without changes.
File renamed without changes.
File renamed without changes.
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -0,0 +1,4 @@ | ||
# Pretext Components | ||
|
||
These components are for rendering to PreTeXt XML (not for a webpage, but | ||
for recompilation with the PreTeXt compiler). |
12 changes: 12 additions & 0 deletions
12
packages/doenetml-prototype/src/renderers/pretext/_fragment.tsx
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -0,0 +1,12 @@ | ||
import React from "react"; | ||
import { BasicComponentWithPassthroughChildren } from "../types"; | ||
|
||
/** | ||
* A _Fragment component is a special component that cannot be directly authored. | ||
* It is meant to display references to existing content. | ||
*/ | ||
export const _Fragment: BasicComponentWithPassthroughChildren<{}> = ({ | ||
children, | ||
}) => { | ||
return <React.Fragment>{children}</React.Fragment>; | ||
}; |
13 changes: 13 additions & 0 deletions
13
packages/doenetml-prototype/src/renderers/pretext/_pass-through-with-tag.tsx
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -0,0 +1,13 @@ | ||
import React from "react"; | ||
import { BasicComponentWithPassthroughChildren } from "../types"; | ||
|
||
/** | ||
* A _PassThroughWithTag component is a special component that cannot be directly authored. | ||
* It will render `node` in directly as an XML element with the same name (e.g. if `node.name` is "p", it will render `<p>`). | ||
*/ | ||
export const _PassThroughWithTag: BasicComponentWithPassthroughChildren<{}> = ({ | ||
children, | ||
node, | ||
}) => { | ||
return React.createElement(node.name, node.attributes, children); | ||
}; |
19 changes: 19 additions & 0 deletions
19
packages/doenetml-prototype/src/renderers/pretext/answer.tsx
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -0,0 +1,19 @@ | ||
import React from "react"; | ||
import { BasicComponent } from "../types"; | ||
import { useAppSelector } from "../../state/hooks"; | ||
import { renderingOnServerSelector } from "../../state/redux-slices/global"; | ||
|
||
export const Answer: BasicComponent = ({ node }) => { | ||
const onServer = useAppSelector(renderingOnServerSelector); | ||
if (onServer) { | ||
return <span className="answer-input"></span>; | ||
} | ||
return ( | ||
<span className="answer-input"> | ||
<input type="text" /> | ||
<button type="button" className="answer-submit"> | ||
Submit | ||
</button> | ||
</span> | ||
); | ||
}; |
9 changes: 9 additions & 0 deletions
9
packages/doenetml-prototype/src/renderers/pretext/boolean.tsx
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -0,0 +1,9 @@ | ||
import React from "react"; | ||
import { BasicComponent } from "../types"; | ||
import type { BooleanProps } from "@doenet/doenetml-worker-rust"; | ||
|
||
type BooleanData = { props: BooleanProps }; | ||
|
||
export const Boolean: BasicComponent<BooleanData> = ({ node }) => { | ||
return <span>{node.data.props.value.toString()}</span>; | ||
}; |
13 changes: 13 additions & 0 deletions
13
packages/doenetml-prototype/src/renderers/pretext/choice-input.css
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -0,0 +1,13 @@ | ||
.doenet-document { | ||
.choice-input { | ||
label { | ||
@apply max-w-full block cursor-pointer rounded-md relative; | ||
} | ||
label:focus-within { | ||
@apply dn-outline -outline-offset-1; | ||
} | ||
input[type="radio"] { | ||
@apply me-2 ms-6 appearance-none radio; | ||
} | ||
} | ||
} |
39 changes: 39 additions & 0 deletions
39
packages/doenetml-prototype/src/renderers/pretext/choice-input.tsx
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -0,0 +1,39 @@ | ||
import React from "react"; | ||
import { BasicComponent } from "../types"; | ||
import { useAppSelector } from "../../state/hooks"; | ||
import { renderingOnServerSelector } from "../../state/redux-slices/global"; | ||
import "./choice-input.css"; | ||
import { elementsArraySelector } from "../../state/redux-slices/dast"; | ||
import { Radio, RadioGroup, RadioProvider } from "@ariakit/react"; | ||
import { flatDastChildrenToReactChildren } from "../element"; | ||
|
||
export const ChoiceInput: BasicComponent = ({ node }) => { | ||
const childrenIds = React.useMemo( | ||
() => | ||
node.children.filter( | ||
(n) => typeof n === "number", | ||
) as unknown[] as number[], | ||
[node.children], | ||
); | ||
const elements = useAppSelector(elementsArraySelector); | ||
|
||
const choiceChildren = childrenIds.flatMap((id) => { | ||
const choice = elements[id]; | ||
return choice.type === "element" && choice.name === "choice" | ||
? choice | ||
: []; | ||
}); | ||
|
||
return ( | ||
<RadioProvider> | ||
<RadioGroup className="choice-input"> | ||
{choiceChildren.map((child, i) => ( | ||
<label key={child.data.id}> | ||
<Radio value={child.data.id} /> | ||
{flatDastChildrenToReactChildren(child.children)} | ||
</label> | ||
))} | ||
</RadioGroup> | ||
</RadioProvider> | ||
); | ||
}; |
Oops, something went wrong.