Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Patchwork PR for Updating SDK Docs with Claude #14

Open
wants to merge 20 commits into
base: claude-only-index-run
Choose a base branch
from
Open
Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
20 commits
Select commit Hold shift + click to select a range
dfafd41
Patched /Users/codelion/Documents/GitHub/stack/docs/fern/docs/pages/s…
Aug 20, 2024
4983dad
Patched /Users/codelion/Documents/GitHub/stack/docs/fern/docs/pages/s…
Aug 20, 2024
3364a1c
Patched /Users/codelion/Documents/GitHub/stack/docs/fern/docs/pages/s…
Aug 20, 2024
0df1de7
Patched /Users/codelion/Documents/GitHub/stack/docs/fern/docs/pages/s…
Aug 20, 2024
4b57c99
Patched /Users/codelion/Documents/GitHub/stack/docs/fern/docs/pages/s…
Aug 20, 2024
522bb41
Patched /Users/codelion/Documents/GitHub/stack/docs/fern/docs/pages/s…
Aug 20, 2024
db665fd
Patched /Users/codelion/Documents/GitHub/stack/docs/fern/docs/pages/s…
Aug 20, 2024
7443fbe
Patched /Users/codelion/Documents/GitHub/stack/docs/fern/docs/pages/s…
Aug 20, 2024
6ba09b2
Patched /Users/codelion/Documents/GitHub/stack/docs/fern/docs/pages/s…
Aug 20, 2024
99c1d56
Patched /Users/codelion/Documents/GitHub/stack/docs/fern/docs/pages/s…
Aug 20, 2024
afa9ab1
Patched /Users/codelion/Documents/GitHub/stack/docs/fern/docs/pages/s…
Aug 20, 2024
e23aab4
Patched /Users/codelion/Documents/GitHub/stack/docs/fern/docs/pages/s…
Aug 20, 2024
7063328
Patched /Users/codelion/Documents/GitHub/stack/docs/fern/docs/pages/s…
Aug 20, 2024
e7689df
Patched /Users/codelion/Documents/GitHub/stack/docs/fern/docs/pages/s…
Aug 20, 2024
b87caa4
Patched /Users/codelion/Documents/GitHub/stack/docs/fern/docs/pages/s…
Aug 20, 2024
3197cc1
Patched /Users/codelion/Documents/GitHub/stack/docs/fern/docs/pages/s…
Aug 20, 2024
6678112
Patched /Users/codelion/Documents/GitHub/stack/docs/fern/docs/pages/s…
Aug 20, 2024
0113f5d
Patched /Users/codelion/Documents/GitHub/stack/docs/fern/docs/pages/s…
Aug 20, 2024
5281487
Patched /Users/codelion/Documents/GitHub/stack/docs/fern/docs/pages/s…
Aug 20, 2024
a43cbea
Patched /Users/codelion/Documents/GitHub/stack/docs/fern/docs/pages/s…
Aug 20, 2024
File filter

Filter by extension

Filter by extension

Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
23 changes: 23 additions & 0 deletions docs/fern/docs/pages/sdk/account-settings.mdx
Original file line number Diff line number Diff line change
@@ -0,0 +1,23 @@
---
title: AccountSettings
---

# AccountSettings

Renders an account settings component with various sections. Can be displayed as a full page or embedded.

## Parameters

- `fullPage` (optional): `boolean` - Determines whether to render the component as a full page. Defaults to `false`.

## Example

```tsx
import { AccountSettings } from '@stackframe/stack';

// Render as embedded component
<AccountSettings />

// Render as full page
<AccountSettings fullPage={true} />
```
35 changes: 35 additions & 0 deletions docs/fern/docs/pages/sdk/auth-page.mdx
Original file line number Diff line number Diff line change
@@ -0,0 +1,35 @@
---
title: AuthPage
---

# AuthPage

Renders an authentication page for sign-in or sign-up, with various configuration options.

## Parameters

- `fullPage` (optional): `boolean` - Whether to render the auth page in full-page mode. Default is `false`.
- `type`: `'sign-in' | 'sign-up'` - The type of authentication page to render.
- `automaticRedirect` (optional): `boolean` - Whether to automatically redirect after successful authentication.
- `mockProject` (optional): `object` - Mock project configuration for testing purposes.
- `config`: `object`
- `signUpEnabled`: `boolean`
- `credentialEnabled`: `boolean`
- `magicLinkEnabled`: `boolean`
- `oauthProviders`: `{ id: string }[]`

## Example

```tsx
import { AuthPage } from '@stackframe/stack';

// Basic usage
<AuthPage type='sign-in' />

// Full page sign-up with automatic redirect
<AuthPage
fullPage={true}
type='sign-up'
automaticRedirect={true}
/>
```
26 changes: 26 additions & 0 deletions docs/fern/docs/pages/sdk/credential-sign-in.mdx
Original file line number Diff line number Diff line change
@@ -0,0 +1,26 @@
---
title: CredentialSignIn
---

# CredentialSignIn

A React component for handling user sign-in with email and password credentials. It provides a form with email and password inputs, error handling, and submission functionality.

## Parameters

This component doesn't accept any parameters.

## Example

```tsx
import { CredentialSignIn } from '@stackframe/stack';

function SignInPage() {
return (
<div>
<h1>Sign In</h1>
<CredentialSignIn />
</div>
);
}
```
26 changes: 26 additions & 0 deletions docs/fern/docs/pages/sdk/credential-sign-up.mdx
Original file line number Diff line number Diff line change
@@ -0,0 +1,26 @@
---
title: CredentialSignUp
---

# CredentialSignUp

Renders a sign-up form component with email and password fields. Handles form submission and validation.

## Parameters

This component does not accept any parameters.

## Example

```tsx
import { CredentialSignUp } from '@stackframe/stack';

function SignUpPage() {
return (
<div>
<h1>Sign Up</h1>
<CredentialSignUp />
</div>
);
}
```
27 changes: 27 additions & 0 deletions docs/fern/docs/pages/sdk/email-verification.mdx
Original file line number Diff line number Diff line change
@@ -0,0 +1,27 @@
---
title: EmailVerification
---

# EmailVerification

Renders an email verification component based on the provided verification code and page layout preference.

## Parameters

- `searchParams` (optional): `Record<string, string>` - An object containing search parameters. It should have a `code` property for the verification code.
- `fullPage` (optional): `boolean` - Determines whether to render the component in full-page mode. Default is `false`.

## Example

```tsx
import { EmailVerification } from '@stackframe/stack';

// Basic usage
<EmailVerification />

// With search params and full-page mode
<EmailVerification
searchParams={{ code: 'abc123' }}
fullPage={true}
/>
```
23 changes: 23 additions & 0 deletions docs/fern/docs/pages/sdk/forgot-password.mdx
Original file line number Diff line number Diff line change
@@ -0,0 +1,23 @@
---
title: ForgotPassword
---

# ForgotPassword

A component for handling the forgot password functionality. It displays different views based on the user's state and whether a reset email has been sent.

## Parameters

- `fullPage` (optional): `boolean` - Determines if the component should be displayed in full-page mode. Defaults to `false`.

## Example

```tsx
import { ForgotPassword } from '@stackframe/stack';

// Default usage
<ForgotPassword />

// Full-page mode
<ForgotPassword fullPage={true} />
```
26 changes: 26 additions & 0 deletions docs/fern/docs/pages/sdk/magic-link-sign-in.mdx
Original file line number Diff line number Diff line change
@@ -0,0 +1,26 @@
---
title: MagicLinkSignIn
---

# MagicLinkSignIn

A React component for magic link sign-in functionality. It handles form submission and displays the sign-in form.

## Parameters

This component doesn't accept any parameters.

## Example

```tsx
import { MagicLinkSignIn } from '@stackframe/stack';

function SignInPage() {
return (
<div>
<h1>Sign In</h1>
<MagicLinkSignIn />
</div>
);
}
```
37 changes: 37 additions & 0 deletions docs/fern/docs/pages/sdk/message-card.mdx
Original file line number Diff line number Diff line change
@@ -0,0 +1,37 @@
---
title: MessageCard
---

# MessageCard

A component for displaying a card with a title, optional content, and action buttons.

## Parameters

- `title`: `string` - The title of the message card.
- `children` (optional): `React.ReactNode` - The content to be displayed in the card.
- `fullPage` (optional): `boolean` - Whether to display the card in full-page mode. Default is `false`.
- `primaryButtonText` (optional): `string` - The text for the primary action button.
- `primaryAction` (optional): `() => Promise<void> | void` - The function to be called when the primary button is clicked.
- `secondaryButtonText` (optional): `string` - The text for the secondary action button.
- `secondaryAction` (optional): `() => Promise<void> | void` - The function to be called when the secondary button is clicked.

## Example

```tsx
import { MessageCard } from '@stackframe/stack';

function ExampleComponent() {
return (
<MessageCard
title='Welcome'
primaryButtonText='Get Started'
primaryAction={() => console.log('Primary action clicked')}
secondaryButtonText='Learn More'
secondaryAction={() => console.log('Secondary action clicked')}
>
<p>This is an example message card.</p>
</MessageCard>
);
}
```
32 changes: 32 additions & 0 deletions docs/fern/docs/pages/sdk/oauth-button-group.mdx
Original file line number Diff line number Diff line change
@@ -0,0 +1,32 @@
---
title: OAuthButtonGroup
---

# OAuthButtonGroup

Renders a group of OAuth buttons for sign-in or sign-up functionality.

## Parameters

- `type`: `'sign-in' | 'sign-up'` - Specifies whether the buttons are for sign-in or sign-up.
- `mockProject` (optional): `{ config: { oauthProviders: { id: string }[] } }` - Mocked project data for testing purposes.

## Example

```tsx
import { OAuthButtonGroup } from '@stackframe/stack';

// Basic usage
<OAuthButtonGroup type='sign-in' />

// With mock project data
const mockProject = {
config: {
oauthProviders: [
{ id: 'google' },
{ id: 'github' }
]
}
};
<OAuthButtonGroup type='sign-up' mockProject={mockProject} />
```
24 changes: 24 additions & 0 deletions docs/fern/docs/pages/sdk/oauth-button.mdx
Original file line number Diff line number Diff line change
@@ -0,0 +1,24 @@
---
title: OAuthButton
---

# OAuthButton

A customizable OAuth button component for sign-in or sign-up using various providers.

## Parameters

- `provider`: `string` - The OAuth provider (e.g., 'google', 'github', 'facebook', 'microsoft', 'spotify').
- `type`: `'sign-in' | 'sign-up'` - Determines whether the button is for sign-in or sign-up.

## Example

```tsx
import { OAuthButton } from '@stackframe/stack';

// Sign-in button for Google
<OAuthButton provider='google' type='sign-in' />

// Sign-up button for GitHub
<OAuthButton provider='github' type='sign-up' />
```
27 changes: 27 additions & 0 deletions docs/fern/docs/pages/sdk/password-reset.mdx
Original file line number Diff line number Diff line change
@@ -0,0 +1,27 @@
---
title: PasswordReset
---

# PasswordReset

A React component for handling password reset functionality. It validates the reset code and renders appropriate messages or the reset form.

## Parameters

- `searchParams`: `Record<string, string>` - An object containing search parameters, including the reset code.
- `fullPage` (optional): `boolean` - Determines if the component should render in full-page mode. Defaults to `false`.

## Example

```tsx
import { PasswordReset } from '@stackframe/stack';

function PasswordResetPage({ searchParams }) {
return <PasswordReset searchParams={searchParams} fullPage={true} />;
}

// Without fullPage option
function PasswordResetWidget({ searchParams }) {
return <PasswordReset searchParams={searchParams} />;
}
```
30 changes: 30 additions & 0 deletions docs/fern/docs/pages/sdk/selected-team-switcher.mdx
Original file line number Diff line number Diff line change
@@ -0,0 +1,30 @@
---
title: SelectedTeamSwitcher
---

# SelectedTeamSwitcher

A component for switching between teams in the Stack app. It displays a dropdown of available teams and handles team selection.

## Parameters

- `props`: `SelectedTeamSwitcherProps` - An object containing the following properties:
Copy link

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

This props should not be added

- `selectedTeam` (optional): The currently selected team.
- `noUpdateSelectedTeam` (optional): `boolean` - If true, prevents updating the selected team in the user's settings.
- `urlMap` (optional): `(team: Team) => string` - A function to generate a URL for the selected team.

## Example

```tsx
import { SelectedTeamSwitcher } from '@stackframe/stack';

function TeamSelector() {
return (
<SelectedTeamSwitcher
selectedTeam={currentTeam}
noUpdateSelectedTeam={false}
urlMap={(team) => `/team/${team.id}`}
/>
);
}
```
25 changes: 17 additions & 8 deletions docs/fern/docs/pages/sdk/sign-in.mdx
Original file line number Diff line number Diff line change
@@ -1,14 +1,23 @@
---
slug: sdk/sign-in
title: SignIn
---

The `SignIn` component is a pre-built UI element that displays all available sign-in methods as configured in the Stack dashboard.
# SignIn

<Note>
This component does not redirect a signed-in user. To achieve automatic redirection for signed-in users, you can use the `useUser` hook to check the user's sign-in status and perform the redirection if necessary.
</Note>
Renders a sign-in page component. Can be displayed as a full page or embedded within other content.

![Sign In Component](../imgs/sign-in.png)
## Parameters

## Props
- `fullPage` (boolean): Determines whether the component should occupy the full page. Default is `false`.
- `fullPage` (optional): `boolean` - Determines if the sign-in page should be rendered as a full page. Defaults to `false`.

## Example

```tsx
import { SignIn } from '@stackframe/stack';

// Embedded sign-in
const EmbeddedSignIn = () => <SignIn />;

// Full-page sign-in
const FullPageSignIn = () => <SignIn fullPage={true} />;
```
Loading