@ident-agency/agent-ui

Web components and UI toolkit for Ident.Agency agent interfaces.

Installation

npm install @ident-agency/agent-ui

Overview

This package provides Web components for building Ident.Agency interfaces:

• Custom elements for authentication and consent flows
• Theme-aware components

Usage

Import Web Components

import '@ident-agency/agent-ui/kit';

// Web components are now globally registered

Basic Usage

<!-- Simple connection component -->
<ia-connect
	client-id="your-app-id"
	redirect-uri="https://www.dev.ident.agency:5173"
	api-base-url="https://www.ident.agency"
	debug="true"
>
</ia-connect>

<!-- With custom scopes and transport -->
<ia-connect
	client-id="your-app-id"
	redirect-uri="https://www.dev.ident.agency:5173"
	api-base-url="https://www.ident.agency"
	scopes="read,write"
	transport="popup"
	debug="true"
>
</ia-connect>

Advanced Configuration

<!-- With event handling -->
<ia-connect
	id="ia-connector"
	client-id="your-app-id"
	redirect-uri="https://www.dev.ident.agency:5173"
	api-base-url="https://www.ident.agency"
	scopes="read,write,admin"
	transport="iframe"
	debug="true"
>
</ia-connect>

<script>
	const connector = document.getElementById('ia-connector');

	// Listen for connection events
	connector.addEventListener('connected', (event) => {
		console.log('Connected:', event.detail);
	});

	connector.addEventListener('error', (event) => {
		console.error('Connection error:', event.detail);
	});
</script>

Features

• 🎨 Theme Support - Light/dark mode with system preference detection
• 🔒 Consent UI - Built-in components for permission management
• 🎯 Web Standards - Works in any framework via custom elements

License

MIT

Repository

https://github.com/loremlabs/ident-agency-sdk

More Information

For more information on using the Ident.Agency SDK, visit the Ident.Agency website.