diff --git a/packages/react/components/SignUp/index.mjs b/packages/react/components/SignUp/index.mjs
index b1c426c69ea..c26e838ae00 100644
--- a/packages/react/components/SignUp/index.mjs
+++ b/packages/react/components/SignUp/index.mjs
@@ -27,7 +27,16 @@ import { EmailInput } from '@freesewing/react/components/Input'
import { IconButton } from '@freesewing/react/components/Button'
import { Spinner } from '@freesewing/react/components/Spinner'
import { Consent } from '@freesewing/react/components/Account'
+import { Popout } from '@freesewing/react/components/Popout'
+/**
+ * The SignUp component holds the entire sign-up form
+ *
+ * @component
+ * @param {object} props - All component props
+ * @param {boolean} [props.embed = false] - Set this tot rue to use a H2 level heading instead of H1 so the form can be embedded in an existing page
+ * @returns {JSX.Element}
+ */
export const SignUp = ({ embed = false }) => {
// State
const [email, setEmail] = useState('')
@@ -186,19 +195,31 @@ export const SignUp = ({ embed = false }) => {
)
}
+/**
+ * A component to handle the confirmation URL for a passwordless signup link (aka magic link).
+ *
+ * @component
+ * @param {object} props - All component props
+ * @param {function} [props.onSuccess = false] - A method to run when the sign in is successful
+ * @returns {JSX.Element}
+ */
export const SignUpConfirmation = ({ onSuccess = false }) => {
// State
const [id, setId] = useState()
+ const [error, setError] = useState(false)
const [check, setCheck] = useState()
// Effects
useEffect(() => {
const newId = getSearchParam('id')
+ if (!newId) setError('noId')
const newCheck = getSearchParam('check')
if (newId !== id) setId(newId)
if (newCheck !== check) setCheck(newCheck)
}, [id, check])
+ // Short-circuit errors
+ if (error === 'noId') return You seem to have arrived on this page in a way that is not supported
// If we do not (yet) have the data, show a loader
if (!id || !check)
return (
diff --git a/packages/react/mkdocs.sh b/packages/react/mkdocs.sh
index c39c3730b9d..c78e7e8b19f 100755
--- a/packages/react/mkdocs.sh
+++ b/packages/react/mkdocs.sh
@@ -33,3 +33,4 @@ jsdoc -c jsdoc.json components/Popout/* > ../../sites/dev/prebuild/jsdoc/react/c
jsdoc -c jsdoc.json components/Profile/* > ../../sites/dev/prebuild/jsdoc/react/components/profile.json
jsdoc -c jsdoc.json components/Role/* > ../../sites/dev/prebuild/jsdoc/react/components/role.json
jsdoc -c jsdoc.json components/SignIn/* > ../../sites/dev/prebuild/jsdoc/react/components/signin.json
+jsdoc -c jsdoc.json components/SignUp/* > ../../sites/dev/prebuild/jsdoc/react/components/signup.json
diff --git a/sites/dev/docs/reference/packages/react/components/signup/readme.mdx b/sites/dev/docs/reference/packages/react/components/signup/readme.mdx
index fa4e3a9cd48..c061147974c 100644
--- a/sites/dev/docs/reference/packages/react/components/signup/readme.mdx
+++ b/sites/dev/docs/reference/packages/react/components/signup/readme.mdx
@@ -2,6 +2,29 @@
title: SignUp
---
-:::note
-This page is yet to be created
-:::
+import { DocusaurusDoc } from '@freesewing/react/components/Docusaurus'
+import { ComponentDocs } from '@site/src/components/component-docs.js'
+import * as jsdoc from '@site/prebuild/jsdoc/components.signup.mjs'
+import { SignUp, SignUpConfirmation } from '@freesewing/react/components/SignUp'
+
+
+
+- [Components](#components)
+
+## Components
+
+The **SignUp** component family provides the following components:
+
+- [SignUp](#signup)
+- [SignUpConfirmation](#signupconfirmation)
+
+### SignUp
+
+
+
+### SignUpConfirmation
+
+
+
+
+