@dpa-it/dpa-id-partner-components NPM

DPA-ID Partner Components web components

Web components of the DPA ID partner components

Install

To add the package to your project run

npm install @dpa-it/dpa-id-partner-components

If you want to integrate it via a script tag add

    <script type="module" src="https://unpkg.com/@dpa-id-components/dpa-id-appswitcher@1.1.0/dist/dpa-id-appswitcher/dpa-id-appswitcher.esm.js"></script>  
	<script nomodule src="https://unpkg.com/@dpa-id-components/dpa-id-appswitcher@1.1.0/dist/dpa-id-appswitcher/dpa-id-appswitcher.js"></script>

Usage

When the necessary JS is loaded you can simply add

<dpa-id-appswitcher></dpa-id-appswitcher>
<dpa-id-usericon></dpa-id-usericon>

to your code.

Properties

Appswitcher

Property	Attribute	Description	Type	Default
`arrowDistanceRight`	`arrow-distance-right`	Distance of the arrow from the right border	`string`	`'1rem'`
`backgroundColor`	`background-color`	Color of the background	`string`	`'#fff'`
`fontColor`	`font-color`	Color of the font	`string`	`'rgb(33, 33, 33)'`
`iconColor`	`icon-color`	Color of the icon	`string`	`'rgb(33, 33, 33)'`
`outerSize`	`outer-size`	Inner size of the icon	`number`	`24`
`overlayRight`	`overlay-right`	Distance of the overlay from the right border of the wrapper	`string`	`'0'`
`overlayTop`	`overlay-top`	Distance of the overlay from the bottom border of the wrapper	`string`	`'30px'`

UserIcon

Property	Attribute	Description	Type	Default
`arrowDistanceRight`	`arrow-distance-right`	Distance of the arrow from the right border	`string`	`'1rem'`
`clientId`	`client-id`	Auth0 client ID, needed for logout	`string`	`''`
`firstname`	`firstname`	User firstname	`string`	`''`
`imgUrl`	`img-url`	Profile picture of the user to be displayed	`string`	`''`
`initials`	`initials`	User initials	`string`	`''`
`lastname`	`lastname`	User lastname	`string`	`''`
`logoutLabel`	`logout-label`	Button label to logout	`string`	`'Abmelden'`
`manageIdLabel`	`manage-id-label`	Button label that links to the DPA ID management dashboard	`string`	`'dpa ID verwalten'`
`overlayRight`	`overlay-right`	Distance of the overlay from the right border of the wrapper	`string`	`'0px'`
`overlayTop`	`overlay-top`	Distance of the overlay from the bottom border of the wrapper	`string`	`'30px'`
`service`	`service`	Service name (reflected to Useradmin myprofile URL as a parameter, if specified and not empty)	`string`	`''`
`size`	`size`	Icon size	`number`	`24`
`stageAuth0`	`stage-auth-0`	Stage of auth0 to refer to	`"dev" \\| "prod" \\| "staging"`	`'prod'`
`stageUseradmin`	`stage-useradmin`	Stage of user-administration to refer to	`"dev" \\| "prod" \\| "staging"`	`'prod'`