SimplifiedIQ Embed SDK

Mount SimplifiedIQ assessments, admin dashboards, and student portals into any website.

Install

npm install simplifiediq-embed

Quick Start

import { mountSimplifiedIQ, EmbedType } from 'simplifiediq-embed';

// Mount into a container element
await mountSimplifiedIQ('siq-app', {
  embedType: EmbedType.EXTERNAL_ASSESSMENT,
  assessmentId: 'YOUR_ASSESSMENT_ID'
});

Embed Types

| Enum Value | String Value | Required Fields | |---|---|---| | EmbedType.EXTERNAL_ASSESSMENT | 'external_assessment' | assessmentId | | EmbedType.ADMIN_LOGIN_WITH_AUTH | 'admin_login_with_auth' | authCode | | EmbedType.ADMIN_LOGIN | 'admin_login' | — | | EmbedType.STUDENT_LOGIN_WITH_AUTH | 'student_login_with_auth' | authCode | | EmbedType.STUDENT_LOGIN | 'student_login' | — | | EmbedType.STUDENT_AUTH_ASSESSMENT | 'student_auth_assessment' | authCode, assessmentId | | EmbedType.STUDENT_ASSESSMENT | 'student_assessment' | assessmentId |

Usage Examples

External Assessment (no login)

import { mountSimplifiedIQ, EmbedType } from 'simplifiediq-embed';

await mountSimplifiedIQ('siq-app', {
  embedType: EmbedType.EXTERNAL_ASSESSMENT,
  assessmentId: '64f1a2b3c4d5e6f7a8b9c0d1'
});

Admin SSO Login

await mountSimplifiedIQ('siq-app', {
  embedType: EmbedType.ADMIN_LOGIN_WITH_AUTH,
  authCode: 'your-sso-auth-code'
});

Admin Manual Login

await mountSimplifiedIQ('siq-app', {
  embedType: EmbedType.ADMIN_LOGIN
});

Student SSO Login

await mountSimplifiedIQ('siq-app', {
  embedType: EmbedType.STUDENT_LOGIN_WITH_AUTH,
  authCode: 'your-sso-auth-code'
});

Student Manual Login

await mountSimplifiedIQ('siq-app', {
  embedType: EmbedType.STUDENT_LOGIN
});

Student SSO + Direct Assessment

await mountSimplifiedIQ('siq-app', {
  embedType: EmbedType.STUDENT_AUTH_ASSESSMENT,
  authCode: 'your-sso-auth-code',
  assessmentId: '64f1a2b3c4d5e6f7a8b9c0d1'
});

Student Manual Login + Direct Assessment

await mountSimplifiedIQ('siq-app', {
  embedType: EmbedType.STUDENT_ASSESSMENT,
  assessmentId: '64f1a2b3c4d5e6f7a8b9c0d1'
});

Framework Examples

React

import { useEffect } from 'react';
import { mountSimplifiedIQ, unmountSimplifiedIQ, EmbedType } from 'simplifiediq-embed';

function AssessmentPage({ assessmentId }) {
  useEffect(() => {
    mountSimplifiedIQ('siq-app', {
      embedType: EmbedType.EXTERNAL_ASSESSMENT,
      assessmentId
    });

    return () => unmountSimplifiedIQ();
  }, [assessmentId]);

  return <div id="siq-app" style={{ width: '100%', height: '800px' }} />;
}

Vue 3

<template>
  <div id="siq-app" style="width: 100%; height: 800px"></div>
</template>

<script setup>
import { onMounted, onBeforeUnmount } from 'vue';
import { mountSimplifiedIQ, unmountSimplifiedIQ, EmbedType } from 'simplifiediq-embed';

const props = defineProps({
  assessmentId: { type: String, required: true }
});

onMounted(() => {
  mountSimplifiedIQ('siq-app', {
    embedType: EmbedType.EXTERNAL_ASSESSMENT,
    assessmentId: props.assessmentId
  });
});

onBeforeUnmount(() => unmountSimplifiedIQ());
</script>

Angular

import { Component, Input, OnInit, OnDestroy } from '@angular/core';
import { mountSimplifiedIQ, unmountSimplifiedIQ, EmbedType } from 'simplifiediq-embed';

@Component({
  selector: 'app-assessment',
  template: `<div id="siq-app" style="width: 100%; height: 800px"></div>`
})
export class AssessmentComponent implements OnInit, OnDestroy {
  @Input() assessmentId!: string;

  ngOnInit() {
    mountSimplifiedIQ('siq-app', {
      embedType: EmbedType.EXTERNAL_ASSESSMENT,
      assessmentId: this.assessmentId
    });
  }

  ngOnDestroy() {
    unmountSimplifiedIQ();
  }
}

API Reference

mountSimplifiedIQ(elementId, options)

Loads the embed script (if needed) and mounts SimplifiedIQ into the container.

| Parameter | Type | Description | |---|---|---| | elementId | string | ID of the container DOM element | | options.embedType | EmbedType \| string | Which embed flow to use | | options.authCode | string? | SSO auth code | | options.assessmentId | string? | Assessment ID |

Returns Promise<void>.

unmountSimplifiedIQ()

Tears down the app and releases media streams (camera, mic, screen share).

loadSimplifiedIQ()

Pre-loads the CDN script without mounting. Useful for warming up.

Returns Promise<void>.

CDN Alternative

If you don't need npm, use the <script> tag directly:

<div id="siq-app" style="width: 100%; height: 800px;"></div>
<script src="https://embed.simplifiediq.io/main.js"></script>
<script>
  window.mountSimplifiedIQ('siq-app', {
    embedType: 'external_assessment',
    assessmentId: 'YOUR_ASSESSMENT_ID'
  });
</script>

License

MIT