@tightrope-dev/link-component
v0.1.4
Published
Embeddable credential collection component for Tightrope integrations
Downloads
21
Readme
@tightrope-dev/link-component
Embeddable credential collection component for Tightrope integrations.
Installation
npm install @tightrope-dev/link-componentUsage
React/Next.js
import { Link } from '@tightrope-dev/link-component';
import '@tightrope-dev/link-component/styles.css';
function App() {
// Get your link token from the Tightrope API
const linkToken = await fetch("api.tightrope.dev/link_token", {
method: 'POST',
headers: {
'Content-Type': 'application/json',
},
}).then(response => response.json()).then(data => data.link_token);
return (
<Link
linkToken={linkToken}
/>
);
}CDN (UMD)
<!DOCTYPE html>
<html>
<body>
<div id="root"></div>
<script crossorigin src="https://unpkg.com/react@19/umd/react.production.min.js"></script>
<script crossorigin src="https://unpkg.com/react-dom@19/umd/react-dom.production.min.js"></script>
<script src="https://unpkg.com/@tightrope-dev/link-component/dist/index.umd.js"></script>
<script>
const { Link } = TightropeLink;
ReactDOM.render(
React.createElement(Link, {
linkToken: 'your-link-token-here'
}),
document.getElementById('root')
);
</script>
</body>
</html>Props
| Prop | Type | Default | Description |
|------|------|---------|-------------|
| linkToken | string | Required | Link token for credential submission |
| apiBaseUrl | string | "" | Base URL for API endpoints |
| onSuccess | (data) => void | undefined | Callback when credentials submitted successfully |
| onError | (error) => void | undefined | Callback when an error occurs |
| theme | "light" \| "dark" | "light" | Theme preference |
| className | string | "" | Additional CSS classes |
| showTokenBadge | boolean | true | Show token badge in header |
| title | string | "Tightrope Link" | Card title |
| description | string | undefined | Card description |
License
MIT