---
title: Account
---
import { DocusaurusDoc } from '@freesewing/react/components/Docusaurus'
import { ComponentDocs } from '@site/src/components/component-docs.js'
import { MiniNote} from '@freesewing/react/components/Mini'
import {
jsdocAccountStatus as jsdocAccount,
jsdocAccountStatus,
jsdocApikeys,
jsdocAvatar,
jsdocBio,
jsdocBookmarkButton,
jsdocBookmarks,
jsdocCompare,
jsdocConsent,
jsdocControl,
jsdocEmail,
jsdocEmailChangeConfirmation,
jsdocExport,
jsdocGithub,
jsdocImportSet,
jsdocInstagram,
jsdocLinks,
jsdocMastodon,
jsdocMfa,
jsdocMsetCard,
jsdocNewSet,
jsdocNewsletter,
} from '@site/prebuild/jsdoc/components.account.mjs'
import {
AccountStatusExample,
ApikeysExample,
AvatarExample,
BioExample,
BookmarkButtonExample,
BookmarksExample,
CompareExample,
ConsentExample,
ControlExample,
EmailExample,
EmailChangeConfirmationExample,
ExportExample,
GithubExample,
ImportSetExample,
InstagramExample,
LinksExample,
MastodonExample,
MfaExample,
MsetCardExample,
NewSetExample,
NewsletterExample,
} from './_examples.js'
<DocusaurusDoc>
The **Account** component family provides the following components:
- [AccountStatus ](#accountstatus)
- [Apikeys ](#apikeys)
- [Avatar ](#avatar)
- [Bio ](#bio)
- [BookmarkButton ](#bookmarkbutton)
- [Bookmarks ](#bookmarks)
- [Compare ](#compare)
- [Consent ](#consent)
- [Control ](#control)
- [Email ](#email)
- [EmailChangeConfirmation](#emailchanfirmation)
- [Export ](#export)
- [Github ](#github)
- [ImportSet ](#importset)
- [Instagram ](#instagram)
- [Links ](#links)
- [Mastodon ](#mastodon)
- [Mfa ](#mfa)
- [MsetCard ](#msetcard)
- [NewSet ](#newset)
- [Newsletter ](#newslett)
- [Password ](#password)
- [Pattern ](#pattern)
- [PatternCard ](#patterncard)
- [Patterns ](#patterns)
- [Reddit ](#reddit)
- [Reload ](#reload)
- [Remove ](#remove)
- [Restrict ](#restrict)
- [Set ](#set)
- [Sets ](#sets)
- [Tiktok ](#tiktok)
- [Twitch ](#twitch)
- [Units ](#units)
- [UserId ](#userid)
- [Username ](#username)
- [UserRole ](#userrole)
- [Website ](#website)
## AccountStatus
<ComponentDocs docs={jsdocAccountStatus} example={AccountStatusExample} />
## Apikeys
<ComponentDocs docs={jsdocApikeys} example={ApikeysExample} />
## Avatar
<ComponentDocs docs={jsdocAvatar} example={AvatarExample} />
## Bio
<ComponentDocs docs={jsdocBio} example={BioExample} />
## BookmarkButton
<ComponentDocs docs={jsdocBookmarkButton} example={BookmarkButtonExample} />
## Bookmarks
<ComponentDocs docs={jsdocBookmarks} example={BookmarksExample} />
## Compare
<ComponentDocs docs={jsdocCompare} example={CompareExample} />
## Consent
<ComponentDocs docs={jsdocConsent} example={ConsentExample} />
## Control
<ComponentDocs docs={jsdocControl} example={ControlExample} />
## Email
<ComponentDocs docs={jsdocEmail} example={EmailExample} />
## EmailChangeConfirmation
<MiniNote>
#### Requires a valid callback URL
This component will not work without the proper <code>id</code> and <code>check</code> URL paramters
that come from a email confirmation link sent out from the FreeSewing backend.
</MiniNote>
<ComponentDocs docs={jsdocEmailChangeConfirmation} example={EmailChangeConfirmationExample} />
## Export
<ComponentDocs docs={jsdocExport} example={ExportExample} />
## Github
<ComponentDocs docs={jsdocGithub} example={GithubExample} />
## ImportSet
<ComponentDocs docs={jsdocImportSet} example={ImportSetExample} />
## Instagram
<ComponentDocs docs={jsdocInstagram} example={InstagramExample} />
## Links
<ComponentDocs docs={jsdocLinks} example={LinksExample} />
## Mastodon
<ComponentDocs docs={jsdocMastodon} example={MastodonExample} />
## Mfa
<ComponentDocs docs={jsdocMfa} example={MfaExample} />
## MsetCard
<ComponentDocs docs={jsdocMsetCard} example={MsetCardExample} />
## NewSet
<ComponentDocs docs={jsdocNewSet} example={NewSetExample} />
## Newsletter
<ComponentDocs docs={jsdocNewsletter} example={NewsletterExample} />
## Password
## Pattern
## PatternCard
## Patterns
## Reddit
## Reload
## Remove
## Restrict
## Set
## Sets
## Tiktok
## Twitch
## Units
## UserId
## Username
## UserRole
## Website
</DocusaurusDoc>
