# Preskok Auth Button (/buttons/preskok-auth-button)





<ComponentPreview name="preskok-auth-button-preskok-demo" description="Preskok authentication button with various intents and options." />

## Installation [#installation]

<CodeTabs>
  <TabsList>
    <TabsTrigger id="cli">
      CLI
    </TabsTrigger>

    <TabsTrigger id="manual">
      Manual
    </TabsTrigger>
  </TabsList>

  <TabsContent id="cli">
    ```bash
    npx shadcn@latest add @preskok/preskok-auth-button
    ```
  </TabsContent>

  <TabsContent id="manual">
    <Steps>
      <Step>
        Copy and paste the following code into your project.

        <ComponentSource name="preskok-auth-button" title="registry/preskok/ui/preskok-ui/preskok-auth-button.tsx" />
      </Step>

      <Step>
        Update the import paths to match your project setup.
      </Step>
    </Steps>
  </TabsContent>
</CodeTabs>

## Usage [#usage]

```tsx
import { PreskokAuthButton } from "@/components/ui/preskok-ui/preskok-auth-button"

export function PreskokAuthButtonDemo() {
  return (
    <PreskokAuthButton
      onPress={() => {
        // Handle Preskok authentication
      }}
    />
  )
}
```

## Props [#props]

All standard Button props are supported, plus:

| Prop     | Type     | Default                   | Description                              |
| -------- | -------- | ------------------------- | ---------------------------------------- |
| `label`  | `string` | `"Continue with Preskok"` | Custom label for accessibility           |
| `intent` | `string` | `"outline"`               | Button intent (primary, secondary, etc.) |

## Examples [#examples]

<ComponentPreview name="preskok-auth-button-preskok-demo" description="Different intents, custom labels, and an onPress handler state." />