@rochimeiji/unpam-sso

Native JavaScript iframe embedder for UNPAM SSO login button - no dependencies required.

Installation

npm install @rochimeiji/unpam-sso

Usage

ES6 Modules

import { embedButtonLogin } from '@rochimeiji/unpam-sso';

// Basic usage
embedButtonLogin('login-container');

// With options
embedButtonLogin('login-container', {
  env: 'prod', // 'dev' or 'prod'
  lang: 'en',  // 'id' or 'en'
  size: 'lg',  // 'sm', 'md', or 'lg'
  width: '300px',
  className: 'my-login-widget'
});

HTML Script Tag

<script type="module">
  import { embedButtonLogin } from 'https://unpkg.com/@rochimeiji/unpam-sso@latest/index.js';
  
  embedButtonLogin('login-container', {
    env: 'prod',
    lang: 'id',
    size: 'md'
  });
</script>

<div id="login-container"></div>

API

embedButtonLogin(elementId, options)

Embeds an iframe-based login button/widget into a target element.

Parameters

• elementId (string): The id of the target HTML element
• options (Object, optional): Configuration options
  • env (string): Environment - 'dev' or 'prod'
  • url (string): Custom iframe src URL (overrides env)
  • width (string): CSS width (e.g. '300px')
  • height (string): CSS height (e.g. '80px')
  • className (string): Additional CSS class for the iframe
  • style (Object): Inline style object for the iframe
  • sandbox (string): Sandbox attribute value
  • title (string): Title attribute for accessibility
  • lang (string): Language parameter ('id' or 'en'). Defaults to 'id'
  • size (string): Size parameter ('sm', 'md', or 'lg'). Defaults to 'md'
    • sm: 32px height
    • md: 40px height
    • lg: 48px height

Environment URLs

• Development: https://devsso.unpam.ac.id/login-button
• Production: https://auth.unpam.ac.id/login-button

Features

• ✅ No dependencies
• ✅ Native JavaScript ES6 modules
• ✅ Automatic domain detection
• ✅ Multiple language support (Indonesian/English)
• ✅ Responsive sizing options
• ✅ URL validation before iframe creation
• ✅ Error handling and logging

License

MIT