| Get a custom spaCy pipeline, tailor-made for your NLP problem by spaCy's core developers. Streamlined, production-ready, predictable and maintainable. Start by completing our 5-minute questionnaire to tell us what you need and we'll be in touch! **[Learn more →](https://explosion.ai/spacy-tailored-pipelines)** |
+| 
| Bespoke advice for problem solving, strategy and analysis for applied NLP projects. Services include data strategy, code reviews, pipeline design and annotation coaching. Curious? Fill in our 5-minute questionnaire to tell us what you need and we'll be in touch! **[Learn more →](https://explosion.ai/spacy-tailored-analysis)** |
[spacy 101]: https://spacy.io/usage/spacy-101
[new in v3.0]: https://spacy.io/usage/v3
@@ -59,6 +60,7 @@ open-source software, released under the MIT license.
[changelog]: https://spacy.io/usage#changelog
[contribute]: https://github.com/explosion/spaCy/blob/master/CONTRIBUTING.md
+
## 💬 Where to ask questions
The spaCy project is maintained by the [spaCy team](https://explosion.ai/about).
@@ -79,7 +81,7 @@ more people can benefit from it.
## Features
-- Support for **60+ languages**
+- Support for **70+ languages**
- **Trained pipelines** for different languages and tasks
- Multi-task learning with pretrained **transformers** like BERT
- Support for pretrained **word vectors** and embeddings
diff --git a/azure-pipelines.yml b/azure-pipelines.yml
index 4624b2eb2..0f7ea91f9 100644
--- a/azure-pipelines.yml
+++ b/azure-pipelines.yml
@@ -31,8 +31,8 @@ jobs:
inputs:
versionSpec: "3.7"
- script: |
- pip install flake8==3.9.2
- python -m flake8 spacy --count --select=E901,E999,F821,F822,F823 --show-source --statistics
+ pip install flake8==5.0.4
+ python -m flake8 spacy --count --select=E901,E999,F821,F822,F823,W605 --show-source --statistics
displayName: "flake8"
- job: "Test"
@@ -41,7 +41,7 @@ jobs:
matrix:
# We're only running one platform per Python version to speed up builds
Python36Linux:
- imageName: "ubuntu-latest"
+ imageName: "ubuntu-20.04"
python.version: "3.6"
# Python36Windows:
# imageName: "windows-latest"
@@ -50,7 +50,7 @@ jobs:
# imageName: "macos-latest"
# python.version: "3.6"
# Python37Linux:
- # imageName: "ubuntu-latest"
+ # imageName: "ubuntu-20.04"
# python.version: "3.7"
Python37Windows:
imageName: "windows-latest"
@@ -76,15 +76,24 @@ jobs:
# Python39Mac:
# imageName: "macos-latest"
# python.version: "3.9"
- Python310Linux:
- imageName: "ubuntu-latest"
- python.version: "3.10"
+ # Python310Linux:
+ # imageName: "ubuntu-latest"
+ # python.version: "3.10"
Python310Windows:
imageName: "windows-latest"
python.version: "3.10"
- Python310Mac:
- imageName: "macos-latest"
- python.version: "3.10"
+ # Python310Mac:
+ # imageName: "macos-latest"
+ # python.version: "3.10"
+ Python311Linux:
+ imageName: 'ubuntu-latest'
+ python.version: '3.11'
+ Python311Windows:
+ imageName: 'windows-latest'
+ python.version: '3.11'
+ Python311Mac:
+ imageName: 'macos-latest'
+ python.version: '3.11'
maxParallel: 4
pool:
vmImage: $(imageName)
@@ -92,20 +101,3 @@ jobs:
- template: .github/azure-steps.yml
parameters:
python_version: '$(python.version)'
- architecture: 'x64'
-
-# - job: "TestGPU"
-# dependsOn: "Validate"
-# strategy:
-# matrix:
-# Python38LinuxX64_GPU:
-# python.version: '3.8'
-# pool:
-# name: "LinuxX64_GPU"
-# steps:
-# - template: .github/azure-steps.yml
-# parameters:
-# python_version: '$(python.version)'
-# architecture: 'x64'
-# gpu: true
-# num_build_jobs: 24
diff --git a/build-constraints.txt b/build-constraints.txt
index cf5fe3284..c1e82f1b0 100644
--- a/build-constraints.txt
+++ b/build-constraints.txt
@@ -1,6 +1,9 @@
# build version constraints for use with wheelwright + multibuild
-numpy==1.15.0; python_version<='3.7'
-numpy==1.17.3; python_version=='3.8'
+numpy==1.15.0; python_version<='3.7' and platform_machine!='aarch64'
+numpy==1.19.2; python_version<='3.7' and platform_machine=='aarch64'
+numpy==1.17.3; python_version=='3.8' and platform_machine!='aarch64'
+numpy==1.19.2; python_version=='3.8' and platform_machine=='aarch64'
numpy==1.19.3; python_version=='3.9'
numpy==1.21.3; python_version=='3.10'
-numpy; python_version>='3.11'
+numpy==1.23.2; python_version=='3.11'
+numpy; python_version>='3.12'
diff --git a/extra/DEVELOPER_DOCS/Code Conventions.md b/extra/DEVELOPER_DOCS/Code Conventions.md
index eba466c46..7294ac38b 100644
--- a/extra/DEVELOPER_DOCS/Code Conventions.md
+++ b/extra/DEVELOPER_DOCS/Code Conventions.md
@@ -137,7 +137,7 @@ If any of the TODOs you've added are important and should be fixed soon, you sho
## Type hints
-We use Python type hints across the `.py` files wherever possible. This makes it easy to understand what a function expects and returns, and modern editors will be able to show this information to you when you call an annotated function. Type hints are not currently used in the `.pyx` (Cython) code, except for definitions of registered functions and component factories, where they're used for config validation.
+We use Python type hints across the `.py` files wherever possible. This makes it easy to understand what a function expects and returns, and modern editors will be able to show this information to you when you call an annotated function. Type hints are not currently used in the `.pyx` (Cython) code, except for definitions of registered functions and component factories, where they're used for config validation. Ideally when developing, run `mypy spacy` on the code base to inspect any issues.
If possible, you should always use the more descriptive type hints like `List[str]` or even `List[Any]` instead of only `list`. We also annotate arguments and return types of `Callable` – although, you can simplify this if the type otherwise gets too verbose (e.g. functions that return factories to create callbacks). Remember that `Callable` takes two values: a **list** of the argument type(s) in order, and the return values.
@@ -155,6 +155,13 @@ def create_callback(some_arg: bool) -> Callable[[str, int], List[str]]:
return callback
```
+For typing variables, we prefer the explicit format.
+
+```diff
+- var = value # type: Type
++ var: Type = value
+```
+
For model architectures, Thinc also provides a collection of [custom types](https://thinc.ai/docs/api-types), including more specific types for arrays and model inputs/outputs. Even outside of static type checking, using these types will make the code a lot easier to read and follow, since it's always clear what array types are expected (and what might go wrong if the output is different from the expected type).
```python
@@ -184,6 +191,8 @@ def load_model(name: str) -> "Language":
...
```
+Note that we typically put the `from typing` import statements on the first line(s) of the Python module.
+
## Structuring logic
### Positional and keyword arguments
@@ -268,6 +277,27 @@ If you have to use `try`/`except`, make sure to only include what's **absolutely
+ return [v.strip() for v in value.split(",")]
```
+### Numeric comparisons
+
+For numeric comparisons, as a general rule we always use `<` and `>=` and avoid the usage of `<=` and `>`. This is to ensure we consistently
+apply inclusive lower bounds and exclusive upper bounds, helping to prevent off-by-one errors.
+
+One exception to this rule is the ternary case. With a chain like
+
+```python
+if value >= 0 and value < max:
+ ...
+```
+
+it's fine to rewrite this to the shorter form
+
+```python
+if 0 <= value < max:
+ ...
+```
+
+even though this requires the usage of the `<=` operator.
+
### Iteration and comprehensions
We generally avoid using built-in functions like `filter` or `map` in favor of list or generator comprehensions.
@@ -444,10 +474,14 @@ spaCy uses the [`pytest`](http://doc.pytest.org/) framework for testing. Tests f
When adding tests, make sure to use descriptive names and only test for one behavior at a time. Tests should be grouped into modules dedicated to the same type of functionality and some test modules are organized as directories of test files related to the same larger area of the library, e.g. `matcher` or `tokenizer`.
-Regression tests are tests that refer to bugs reported in specific issues. They should live in the relevant module of the test suite, named according to the issue number (e.g., `test_issue1234.py`), and [marked](https://docs.pytest.org/en/6.2.x/example/markers.html#working-with-custom-markers) appropriately (e.g. `@pytest.mark.issue(1234)`). This system allows us to relate tests for specific bugs back to the original reported issue, which is especially useful if we introduce a regression and a previously passing regression tests suddenly fails again. When fixing a bug, it's often useful to create a regression test for it first.
+Regression tests are tests that refer to bugs reported in specific issues. They should live in the relevant module of the test suite, named according to the issue number (e.g., `test_issue1234.py`), and [marked](https://docs.pytest.org/en/6.2.x/example/markers.html#working-with-custom-markers) appropriately (e.g. `@pytest.mark.issue(1234)`). This system allows us to relate tests for specific bugs back to the original reported issue, which is especially useful if we introduce a regression and a previously passing regression tests suddenly fails again. When fixing a bug, it's often useful to create a regression test for it first.
The test suite also provides [fixtures](https://github.com/explosion/spaCy/blob/master/spacy/tests/conftest.py) for different language tokenizers that can be used as function arguments of the same name and will be passed in automatically. Those should only be used for tests related to those specific languages. We also have [test utility functions](https://github.com/explosion/spaCy/blob/master/spacy/tests/util.py) for common operations, like creating a temporary file.
+### Testing Cython Code
+
+If you're developing Cython code (`.pyx` files), those extensions will need to be built before the test runner can test that code - otherwise it's going to run the tests with stale code from the last time the extension was built. You can build the extensions locally with `python setup.py build_ext -i`.
+
### Constructing objects and state
Test functions usually follow the same simple structure: they set up some state, perform the operation you want to test and `assert` conditions that you expect to be true, usually before and after the operation.
diff --git a/extra/DEVELOPER_DOCS/ExplosionBot.md b/extra/DEVELOPER_DOCS/ExplosionBot.md
new file mode 100644
index 000000000..606fe93a0
--- /dev/null
+++ b/extra/DEVELOPER_DOCS/ExplosionBot.md
@@ -0,0 +1,56 @@
+# Explosion-bot
+
+Explosion-bot is a robot that can be invoked to help with running particular test commands.
+
+## Permissions
+
+Only maintainers have permissions to summon explosion-bot. Each of the open source repos that use explosion-bot has its own team(s) of maintainers, and only github users who are members of those teams can successfully run bot commands.
+
+## Running robot commands
+
+To summon the robot, write a github comment on the issue/PR you wish to test. The comment must be in the following format:
+
+```
+@explosion-bot please test_gpu
+```
+
+Some things to note:
+
+- The `@explosion-bot please` must be the beginning of the command - you cannot add anything in front of this or else the robot won't know how to parse it. Adding anything at the end aside from the test name will also confuse the robot, so keep it simple!
+- The command name (such as `test_gpu`) must be one of the tests that the bot knows how to run. The available commands are documented in the bot's [workflow config](https://github.com/explosion/spaCy/blob/master/.github/workflows/explosionbot.yml#L26) and must match exactly one of the commands listed there.
+- The robot can't do multiple things at once, so if you want it to run multiple tests, you'll have to summon it with one comment per test.
+
+### Examples
+
+- Execute spaCy slow GPU tests with a custom thinc branch from a spaCy PR:
+
+ ```
+ @explosion-bot please test_slow_gpu --thinc-branch | Header 1 | Header 2 |
|---|---|
| Column 1 | Column 2 |
+
+ + +{' '} + + +
+ ++ + +{' '} + + +
+ +## Components + +### Table {id="table"} + +> #### Markdown +> +> ```markdown +> | Header 1 | Header 2 | +> | -------- | -------- | +> | Column 1 | Column 2 | +> ``` +> +> #### JSX +> +> ```markup +>| Header 1 | Header 2 |
|---|---|
| Column 1 | Column 2 |
```markdown
diff --git a/website/docs/usage/training.md b/website/docs/usage/training.mdx
similarity index 95%
rename from website/docs/usage/training.md
rename to website/docs/usage/training.mdx
index f46f0052b..6cda975cb 100644
--- a/website/docs/usage/training.md
+++ b/website/docs/usage/training.mdx
@@ -15,15 +15,17 @@ menu:
- ['Internal API', 'api']
---
-## Introduction to training {#basics hidden="true"}
-
-import Training101 from 'usage/101/\_training.md'
+## Introduction to training {id="basics",hidden="true"}
+
+
+ + Get a custom spaCy pipeline, tailor-made for your NLP problem by + spaCy's core developers. + +
+
+
+ Prodigy is an annotation tool so efficient that data + scientists can do the annotation themselves, enabling a new level of rapid + iteration. Whether you're working on entity recognition, intent + detection or image classification, Prodigy can help you{' '} + train and evaluate your models faster. +
- spaCy's new project system gives you a smooth path from prototype to + spaCy's new project system gives you a smooth path from prototype to production. It lets you keep track of all those{' '} data transformation, preprocessing and{' '} training steps, so you can make sure your project is always @@ -236,13 +243,15 @@ const Landing = ({ data }) => { button="See what's new" small > - spaCy v3.0 features all new transformer-based pipelines that - bring spaCy's accuracy right up to the current state-of-the-art - . You can use any pretrained transformer to train your own pipelines, and even - share one transformer between multiple components with{' '} - multi-task learning. Training is now fully configurable and - extensible, and you can define your own custom models using{' '} - PyTorch, TensorFlow and other frameworks. +
+ spaCy v3.0 features all new transformer-based pipelines{' '} + that bring spaCy's accuracy right up to the current{' '} + state-of-the-art. You can use any pretrained transformer to + train your own pipelines, and even share one transformer between multiple + components with multi-task learning. Training is now fully + configurable and extensible, and you can define your own custom models using{' '} + PyTorch, TensorFlow and other frameworks. +
+
+
+ In this free and interactive online course you’ll learn how + to use spaCy to build advanced natural language understanding systems, using + both rule-based and machine learning approaches. It includes{' '} + 55 exercises featuring videos, slide decks, multiple-choice + questions and interactive coding practice in the browser. +
- spaCy v3.0 introduces transformer-based pipelines that bring spaCy's
+ spaCy v3.0 introduces transformer-based pipelines that bring spaCy's
accuracy right up to the current state-of-the-art. You can
also use a CPU-optimized pipeline, which is less accurate but much cheaper
to run.
@@ -285,33 +296,8 @@ const Landing = ({ data }) => {
)
-export const Pre = props => {
- return {props.children}
+export default CodeBlock
+
+export const Pre = (props) => {
+ return {props.children}
}
export const InlineCode = ({ wrap = false, className, children, ...props }) => {
- const codeClassNames = classNames(classes.inlineCode, className, {
- [classes.wrap]: wrap || (isString(children) && children.length >= WRAP_THRESHOLD),
+ const codeClassNames = classNames(classes['inline-code'], className, {
+ [classes['wrap']]: wrap || (isString(children) && children.length >= WRAP_THRESHOLD),
})
return (
@@ -68,39 +80,76 @@ export const TypeAnnotation = ({ lang = 'python', link = true, children }) => {
const code = Array.isArray(children) ? children.join('') : children || ''
const [rawText, meta] = code.split(/(?= \(.+\)$)/)
const rawStr = rawText.replace(/\./g, TMP_DOT)
- const rawHtml = lang === 'none' || !code ? code : highlightCode(lang, rawStr)
+ const rawHtml =
+ lang === 'none' || !code ? code : Prism.highlight(rawStr, Prism.languages[lang], lang)
const html = rawHtml.replace(new RegExp(TMP_DOT, 'g'), '.').replace(/\n/g, ' ')
const result = htmlToReact(html)
const elements = Array.isArray(result) ? result : [result]
const annotClassNames = classNames(
'type-annotation',
`language-${lang}`,
- classes.inlineCode,
- classes.typeAnnotation,
+ classes['inline-code'],
+ classes['type-annotation'],
{
- [classes.wrap]: code.length >= WRAP_THRESHOLD,
+ [classes['wrap']]: code.length >= WRAP_THRESHOLD,
}
)
return (
-
+
{elements.map((el, i) => (
{linkType(el, !!link)}
))}
- {meta && {meta}}
-
+ {meta && {meta}}
+
)
}
-function replacePrompt(line, prompt, isFirst = false) {
- let result = line
- const hasPrompt = result.startsWith(`${prompt} `)
- const showPrompt = hasPrompt || isFirst
- if (hasPrompt) result = result.slice(2)
- return result && showPrompt ? `${result}` : result
+const splitLines = (children) => {
+ const listChildrenPerLine = []
+
+ if (typeof children === 'string') {
+ listChildrenPerLine.push(...children.split('\n'))
+ } else {
+ listChildrenPerLine.push([])
+ let indexLine = 0
+ if (Array.isArray(children)) {
+ children.forEach((child) => {
+ if (typeof child === 'string' && child.includes('\n')) {
+ const listString = child.split('\n')
+ listString.forEach((string, index) => {
+ listChildrenPerLine[indexLine].push(string)
+
+ if (index !== listString.length - 1) {
+ indexLine += 1
+ listChildrenPerLine[indexLine] = []
+ }
+ })
+ } else {
+ listChildrenPerLine[indexLine].push(child)
+ }
+ })
+ } else {
+ listChildrenPerLine[indexLine].push(children)
+ indexLine += 1
+ listChildrenPerLine[indexLine] = []
+ }
+ }
+
+ const listLine = listChildrenPerLine[listChildrenPerLine.length - 1]
+ if (listLine === '' || (listLine.length === 1 && listLine[0] === '')) {
+ listChildrenPerLine.pop()
+ }
+
+ return listChildrenPerLine.map((childrenPerLine, index) => (
+ <>
+ {childrenPerLine}
+ {index !== listChildrenPerLine.length - 1 && '\n'}
+
+ ))
}
function parseArgs(raw) {
- let args = raw.split(' ').filter(arg => arg)
+ let args = raw.split(' ').filter((arg) => arg)
const result = {}
while (args.length) {
let opt = args.shift()
@@ -120,208 +169,219 @@ function parseArgs(raw) {
return result
}
-function convertLine(line, i) {
- const cliRegex = /^(\$ )?python -m spacy/
- if (cliRegex.test(line)) {
- const text = line.replace(cliRegex, '')
- const args = parseArgs(text)
- const cmd = Object.keys(args).map((key, i) => {
- const value = args[key]
- return value === null || value === true || i === 0 ? key : `${key} ${value}`
- })
- return (
-
-
- python -m
- {' '}
- spacy{' '}
- {cmd.map((item, j) => {
- const isCmd = j === 0
- const url = isCmd ? `/api/cli#${item.replace(' ', '-')}` : null
- const isAbstract = isString(item) && /^\[(.+)\]$/.test(item)
- const itemClassNames = classNames(classes.cliArg, {
- [classes.cliArgHighlight]: isCmd,
- [classes.cliArgEmphasis]: isAbstract,
- })
- const text = isAbstract ? item.slice(1, -1) : item
- return (
-
- {j !== 0 && ' '}
-
-
- {text}
-
-
-
- )
- })}
-
- )
+const flattenReact = (children) => {
+ if (children === null || children === undefined || children === false) {
+ return []
}
- const htmlLine = replacePrompt(highlightCode('bash', line), '$')
- return htmlToReact(htmlLine)
+
+ if (typeof children === 'string') {
+ return [children]
+ }
+
+ if (children.props) {
+ return flattenReact(children.props.children)
+ }
+
+ return children.flatMap(flattenReact)
}
-function formatCode(html, lang, prompt) {
- if (lang === 'cli') {
- const lines = html
- .trim()
- .split('\n')
- .map(line =>
- line
- .split(' | ')
- .map((l, i) => convertLine(l, i))
- .map((l, j) => (
-
- {j !== 0 && | }
- {l}
-
- ))
- )
- return lines.map((line, i) => (
-
- {i !== 0 &&
}
- {line}
-
- ))
+const checkoutForComment = (line) => {
+ const lineParts = line.split(' # ')
+
+ if (lineParts.length !== 2) {
+ return line
}
- const result = html
- .split('\n')
- .map((line, i) => {
- let newLine = prompt ? replacePrompt(line, prompt, i === 0) : line
- if (lang === 'diff' && !line.startsWith('<')) {
- newLine = highlightCode('python', line)
- }
- return newLine
- })
- .join('\n')
- return htmlToReact(result)
+
+ return (
+ <>
+ {lineParts[0]}
+ {` `}
+
+ {`# `}
+ {lineParts[1]}
+
+
+ )
+}
+
+const handlePromot = ({ lineFlat, prompt }) => {
+ const lineWithoutPrompt = lineFlat.slice(prompt.length + 1)
+
+ const cliRegex = /^python -m spacy/
+
+ if (!cliRegex.test(lineWithoutPrompt)) {
+ return {checkoutForComment(lineWithoutPrompt)}
+ }
+
+ const text = lineWithoutPrompt.replace(cliRegex, '')
+ const args = parseArgs(text)
+ const cmd = Object.keys(args).map((key, i) => {
+ const value = args[key]
+ return value === null || value === true || i === 0 ? key : `${key} ${value}`
+ })
+ return (
+
+ python -m spacy{' '}
+ {cmd.map((item, j) => {
+ const isCmd = j === 0
+ const url = isCmd ? `/api/cli#${item.replace(' ', '-')}` : null
+ const isAbstract = isString(item) && /^\[(.+)\]$/.test(item)
+ const itemClassNames = classNames(classes['cli-arg'], {
+ [classes['cli-arg-highlight']]: isCmd,
+ [classes['cli-arg-emphasis']]: isAbstract,
+ })
+ const text = isAbstract ? item.slice(1, -1) : item
+ return (
+
+ {j !== 0 && ' '}
+
+
+ {text}
+
+
+
+ )
+ })}
+
+ )
+}
+
+const convertLine = ({ line, prompt, lang }) => {
+ const lineFlat = flattenReact(line).join('')
+ if (lineFlat.startsWith(`${prompt} `)) {
+ return handlePromot({ lineFlat, prompt })
+ }
+
+ return lang === 'none' || !lineFlat ? (
+ lineFlat
+ ) : (
+
+ )
+}
+
+const addLineHighlight = (children, highlight) => {
+ if (!highlight) {
+ return children
+ }
+ const listHighlight = rangeParser(highlight)
+
+ if (listHighlight.length === 0) {
+ return children
+ }
+
+ return children.map((child, index) => {
+ const isHighlight = listHighlight.includes(index + 1)
+ return (
+
+ {child}
+
+ )
+ })
+}
+
+export const CodeHighlighted = ({ children, highlight, lang }) => {
+ const [html, setHtml] = useState()
+
+ useEffect(
+ () =>
+ setHtml(
+ addLineHighlight(
+ splitLines(children).map((line) => convertLine({ line, prompt: '$', lang })),
+ highlight
+ )
+ ),
+ [children, highlight, lang]
+ )
+
+ return <>{html}
}
export class Code extends React.Component {
- state = { Juniper: null }
-
static defaultProps = {
lang: 'none',
executable: null,
- github: false,
}
static propTypes = {
lang: PropTypes.string,
title: PropTypes.string,
executable: PropTypes.oneOf(['true', 'false', true, false, null]),
- github: PropTypes.oneOf(['true', 'false', true, false, null]),
+ github: PropTypes.string,
prompt: PropTypes.string,
highlight: PropTypes.string,
className: PropTypes.string,
children: PropTypes.node,
}
- updateJuniper() {
- if (this.state.Juniper == null && window.Juniper !== null) {
- this.setState({ Juniper: window.Juniper })
- }
- }
-
- componentDidMount() {
- this.updateJuniper()
- }
-
- componentDidUpdate() {
- this.updateJuniper()
- }
-
render() {
- const {
- lang,
- title,
- executable,
- github,
- prompt,
- wrap,
- highlight,
- className,
- children,
- } = this.props
- const codeClassNames = classNames(classes.code, className, `language-${lang}`, {
- [classes.wrap]: !!highlight || !!wrap || lang === 'cli',
- [classes.cli]: lang === 'cli',
+ const { lang, title, executable, github, wrap, highlight, className, children } = this.props
+ const codeClassNames = classNames(classes['code'], className, `language-${lang}`, {
+ [classes['wrap']]: !!highlight || !!wrap || lang === 'cli',
+ [classes['cli']]: lang === 'cli',
})
- const ghClassNames = classNames(codeClassNames, classes.maxHeight)
- const { Juniper } = this.state
+ const ghClassNames = classNames(codeClassNames, classes['max-height'])
if (github) {
- return
+
{children}
)
}
- const codeText = Array.isArray(children) ? children.join('') : children || ''
- const highlightRange = highlight ? rangeParser.parse(highlight).filter(n => n > 0) : []
- const rawHtml = ['none', 'cli'].includes(lang)
- ? codeText
- : highlightCode(lang, codeText, highlightRange)
- const html = formatCode(rawHtml, lang, prompt)
return (
<>
- {title && {title}
}
- {html}
+ {title && {title}
}
+
+
+ {children}
+
+
)
}
}
-const JuniperWrapper = ({ Juniper, title, lang, children }) => (
- {
- const { binderUrl, binderBranch, binderVersion } = data.site.siteMetadata
- const juniperTitle = title || 'Editable Code'
- return (
-
-
- {juniperTitle}
-
- spaCy v{binderVersion} · Python 3 · via{' '}
-
- Binder
-
-
-
+const JuniperWrapper = ({ title, lang, children }) => {
+ const { binderUrl, binderVersion } = siteMetadata
+ const juniperTitle = title || 'Editable Code'
+ return (
+
+
+ {juniperTitle}
+
+ spaCy v{binderVersion} · Python 3 · via{' '}
+
+ Binder
+
+
+
-
- {children}
-
-
- )
- }}
- />
-)
-
-const query = graphql`
- query JuniperQuery {
- site {
- siteMetadata {
- binderUrl
- binderBranch
- binderVersion
- }
- }
- }
-`
+
+ {children}
+
+
+ )
+}
diff --git a/website/src/components/copy.js b/website/src/components/copy.js
index e622c0f84..4caabac98 100644
--- a/website/src/components/copy.js
+++ b/website/src/components/copy.js
@@ -1,4 +1,4 @@
-import React, { useState, useRef } from 'react'
+import React, { useState, useRef, useEffect } from 'react'
import Icon from './icon'
import classes from '../styles/copy.module.sass'
@@ -16,7 +16,11 @@ export function copyToClipboard(ref, callback) {
export default function CopyInput({ text, prefix }) {
const isClient = typeof window !== 'undefined'
- const supportsCopy = isClient && document.queryCommandSupported('copy')
+ const [supportsCopy, setSupportsCopy] = useState(false)
+
+ useEffect(() => {
+ setSupportsCopy(isClient && document.queryCommandSupported('copy'))
+ }, [isClient])
const textareaRef = useRef()
const [copySuccess, setCopySuccess] = useState(false)
const onClick = () => copyToClipboard(textareaRef, setCopySuccess)
diff --git a/website/src/components/dropdown.js b/website/src/components/dropdown.js
index ae5c42415..bccf4ccd0 100644
--- a/website/src/components/dropdown.js
+++ b/website/src/components/dropdown.js
@@ -1,17 +1,18 @@
import React from 'react'
import PropTypes from 'prop-types'
import classNames from 'classnames'
-import { navigate } from 'gatsby'
+import { useRouter } from 'next/router'
import classes from '../styles/dropdown.module.sass'
export default function Dropdown({ defaultValue, className, onChange, children }) {
+ const router = useRouter()
const defaultOnChange = ({ target }) => {
const isExternal = /((http(s?)):\/\/|mailto:)/gi.test(target.value)
if (isExternal) {
window.location.href = target.value
} else {
- navigate(target.value)
+ router.push(target.value)
}
}
return (
diff --git a/website/src/components/embed.js b/website/src/components/embed.js
index 9f959bc99..53f4e9184 100644
--- a/website/src/components/embed.js
+++ b/website/src/components/embed.js
@@ -1,11 +1,12 @@
import React, { Fragment } from 'react'
import PropTypes from 'prop-types'
import classNames from 'classnames'
+import ImageNext from 'next/image'
import Link from './link'
import Button from './button'
import { InlineCode } from './code'
-import { markdownToReact } from './util'
+import { MarkdownToReact } from './util'
import classes from '../styles/embed.module.sass'
@@ -57,18 +58,12 @@ SoundCloud.propTypes = {
color: PropTypes.string,
}
-function formatHTML(html) {
- const encoded = encodeURIComponent(html)
- return `${encoded}`
-}
-
-const Iframe = ({ title, src, html, width = 800, height = 300 }) => {
- const source = html ? `data:text/html,${formatHTML(html)}` : src
+const Iframe = ({ title, src, width = 800, height = 300 }) => {
return (