[react] feat: Added docs for components/Admin
This commit is contained in:
joostdecock
parent
6d9cbf55c2
commit
5ec2a2a1da
7 changed files with 255 additions and 70 deletions
|
|
@ -21,6 +21,23 @@ import {
|
|||
MsetCard,
|
||||
NewSet as NewSetExample,
|
||||
Newsletter as NewsletterExample,
|
||||
Password as PasswordExample,
|
||||
Pattern,
|
||||
PatternCard,
|
||||
Patterns as PatternsExample,
|
||||
Reddit as RedditExample,
|
||||
Reload as ReloadExample,
|
||||
Remove as RemoveExample,
|
||||
Restrict as RestrictExample,
|
||||
Set as SetExample,
|
||||
Sets as SetsExample,
|
||||
Tiktok as TiktokExample,
|
||||
Twitch as TwitchExample,
|
||||
Units as UnitsExample,
|
||||
UserId as UserIdExample,
|
||||
Username as UsernameExample,
|
||||
UserRole as UserRoleExample,
|
||||
Website as WebsiteExample,
|
||||
} from '@freesewing/react/components/Account'
|
||||
|
||||
const AccountStatusExample = () => (
|
||||
|
|
@ -32,10 +49,30 @@ const AccountStatusExample = () => (
|
|||
</tr>
|
||||
</thead>
|
||||
<tbody>
|
||||
<tr><td>-2</td><td><AccountStatus status={-2} /></td></tr>
|
||||
<tr><td>-1</td><td><AccountStatus status={-1} /></td></tr>
|
||||
<tr><td>0</td><td><AccountStatus status={0} /></td></tr>
|
||||
<tr><td>1</td><td><AccountStatus status={1} /></td></tr>
|
||||
<tr>
|
||||
<td>-2</td>
|
||||
<td>
|
||||
<AccountStatus status={-2} />
|
||||
</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td>-1</td>
|
||||
<td>
|
||||
<AccountStatus status={-1} />
|
||||
</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td>0</td>
|
||||
<td>
|
||||
<AccountStatus status={0} />
|
||||
</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td>1</td>
|
||||
<td>
|
||||
<AccountStatus status={1} />
|
||||
</td>
|
||||
</tr>
|
||||
</tbody>
|
||||
</table>
|
||||
)
|
||||
|
|
@ -48,9 +85,10 @@ const BookmarkButtonExample = () => (
|
|||
/>
|
||||
)
|
||||
|
||||
const MsetCardExample = () => (
|
||||
<MsetCard set={{ name: 'Example Set'}} />
|
||||
)
|
||||
const MsetCardExample = () => <MsetCard set={{ name: 'Example Set' }} />
|
||||
|
||||
const PatternExample = () => <Pattern id={1} />
|
||||
const PatternCardExample = () => <PatternCard pattern={{ name: 'Example pattern' }} size="sm" />
|
||||
|
||||
export {
|
||||
AccountStatusExample,
|
||||
|
|
@ -74,5 +112,21 @@ export {
|
|||
MsetCardExample,
|
||||
NewSetExample,
|
||||
NewsletterExample,
|
||||
PasswordExample,
|
||||
PatternExample,
|
||||
PatternCardExample,
|
||||
PatternsExample,
|
||||
RedditExample,
|
||||
ReloadExample,
|
||||
RemoveExample,
|
||||
RestrictExample,
|
||||
SetExample,
|
||||
SetsExample,
|
||||
TiktokExample,
|
||||
TwitchExample,
|
||||
UnitsExample,
|
||||
UserIdExample,
|
||||
UsernameExample,
|
||||
UserRoleExample,
|
||||
WebsiteExample,
|
||||
}
|
||||
|
||||
|
|
|
|||
|
|
@ -4,7 +4,7 @@ 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 { MiniNote } from '@freesewing/react/components/Mini'
|
||||
import {
|
||||
jsdocAccountStatus as jsdocAccount,
|
||||
jsdocAccountStatus,
|
||||
|
|
@ -28,6 +28,23 @@ import {
|
|||
jsdocMsetCard,
|
||||
jsdocNewSet,
|
||||
jsdocNewsletter,
|
||||
jsdocPassword,
|
||||
jsdocPattern,
|
||||
jsdocPatternCard,
|
||||
jsdocPatterns,
|
||||
jsdocReddit,
|
||||
jsdocReload,
|
||||
jsdocRemove,
|
||||
jsdocRestrict,
|
||||
jsdocSet,
|
||||
jsdocSets,
|
||||
jsdocTiktok,
|
||||
jsdocTwitch,
|
||||
jsdocUnits,
|
||||
jsdocUserId,
|
||||
jsdocUsername,
|
||||
jsdocUserRole,
|
||||
jsdocWebsite,
|
||||
} from '@site/prebuild/jsdoc/components.account.mjs'
|
||||
import {
|
||||
AccountStatusExample,
|
||||
|
|
@ -51,154 +68,224 @@ import {
|
|||
MsetCardExample,
|
||||
NewSetExample,
|
||||
NewsletterExample,
|
||||
PasswordExample,
|
||||
PatternExample,
|
||||
PatternCardExample,
|
||||
PatternsExample,
|
||||
RedditExample,
|
||||
ReloadExample,
|
||||
RemoveExample,
|
||||
RestrictExample,
|
||||
SetExample,
|
||||
SetsExample,
|
||||
TiktokExample,
|
||||
TwitchExample,
|
||||
UnitsExample,
|
||||
UserIdExample,
|
||||
UsernameExample,
|
||||
UserRoleExample,
|
||||
WebsiteExample,
|
||||
} 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)
|
||||
- [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)
|
||||
|
||||
- [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.
|
||||
#### 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
|
||||
|
||||
<ComponentDocs docs={jsdocPassword} example={PasswordExample} />
|
||||
|
||||
## Pattern
|
||||
|
||||
<ComponentDocs docs={jsdocPattern} example={PatternExample} />
|
||||
|
||||
## PatternCard
|
||||
|
||||
<ComponentDocs docs={jsdocPatternCard} example={PatternCardExample} />
|
||||
|
||||
## Patterns
|
||||
|
||||
<ComponentDocs docs={jsdocPatterns} example={PatternsExample} />
|
||||
|
||||
## Reddit
|
||||
|
||||
<ComponentDocs docs={jsdocReddit} example={RedditExample} />
|
||||
|
||||
## Reload
|
||||
|
||||
<ComponentDocs docs={jsdocReload} example={ReloadExample} />
|
||||
|
||||
## Remove
|
||||
|
||||
<ComponentDocs docs={jsdocRemove} example={RemoveExample} />
|
||||
|
||||
## Restrict
|
||||
|
||||
<ComponentDocs docs={jsdocRestrict} example={RestrictExample} />
|
||||
|
||||
## Set
|
||||
|
||||
<ComponentDocs docs={jsdocSet} example={SetExample} />
|
||||
|
||||
## Sets
|
||||
|
||||
<ComponentDocs docs={jsdocSets} example={SetsExample} />
|
||||
|
||||
## Tiktok
|
||||
|
||||
<ComponentDocs docs={jsdocTiktok} example={TiktokExample} />
|
||||
|
||||
## Twitch
|
||||
|
||||
<ComponentDocs docs={jsdocTwitch} example={TwitchExample} />
|
||||
|
||||
## Units
|
||||
|
||||
<ComponentDocs docs={jsdocUnits} example={UnitsExample} />
|
||||
|
||||
## UserId
|
||||
|
||||
<ComponentDocs docs={jsdocUserId} example={UserIdExample} />
|
||||
|
||||
## Username
|
||||
|
||||
<ComponentDocs docs={jsdocUsername} example={UsernameExample} />
|
||||
|
||||
## UserRole
|
||||
|
||||
<ComponentDocs docs={jsdocUserRole} example={UserRoleExample} />
|
||||
|
||||
## Website
|
||||
|
||||
</DocusaurusDoc>
|
||||
<ComponentDocs docs={jsdocWebsite} example={WebsiteExample} />
|
||||
|
||||
</DocusaurusDoc>
|
||||
|
|
|
|||
|
|
@ -2,6 +2,31 @@
|
|||
title: Admin
|
||||
---
|
||||
|
||||
:::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 {
|
||||
jsdocSubscriberAdministration,
|
||||
jsdocUserAdministration,
|
||||
} from '@site/prebuild/jsdoc/components.admin.mjs'
|
||||
import {
|
||||
UserAdministration,
|
||||
SubscriberAdministration
|
||||
} from '@freesewing/react/components/Admin'
|
||||
|
||||
<DocusaurusDoc>
|
||||
|
||||
The **Admin** component family provides the following components:
|
||||
|
||||
- [SubscriberAdministration ](#subscriberadministration)
|
||||
- [UserAdministration ](#useradministration)
|
||||
|
||||
## SubscriberAdministration
|
||||
|
||||
<ComponentDocs docs={jsdocSubscriberAdministration} example={SubscriberAdministration} />
|
||||
|
||||
## UserAdministration
|
||||
|
||||
<ComponentDocs docs={jsdocUserAdministration} example={UserAdministration} />
|
||||
|
||||
</DocusaurusDoc>
|
||||
|
||||
|
|
|
|||
|
|
@ -6,9 +6,7 @@ import { MiniNote } from '@freesewing/react/components/Mini'
|
|||
|
||||
export const IconButtonExample = () => (
|
||||
<>
|
||||
<MiniNote>
|
||||
Note that this component will take up the full width made available to it.
|
||||
</MiniNote>
|
||||
<MiniNote>Note that this component will take up the full width made available to it.</MiniNote>
|
||||
<Highlight language="js">
|
||||
{[
|
||||
`import { FingerprintIcon, WarningIcon } from '@freesewing/react/components/Icon'`,
|
||||
|
|
@ -36,4 +34,3 @@ export const IconButtonExample = () => (
|
|||
</IconButton>
|
||||
</>
|
||||
)
|
||||
|
||||
|
|
|
|||
Loading…
Add table
Add a link
Reference in a new issue