Collection of hubert widgets which allow for Real-Time screening supported interviews
npm install @hubertai/interview-widget
The official Hubert interview web widget
Features included:
- Clients without an Applicant Tracking Systems (ATS) can use the Hubert Interview Platform to carry out and assist in their recruitment processes.
- Install on anywhere with the power of web components.
- Near native look and feel to match your website.
Using unpkg :
``html`
Using jsdelivr :
`html`
html
`Usage
There are 2 steps in order for the component to work as expected.
In your HTML, Template or JSX include the following
`html
Start interview
`> Important to note that even in your JSX, the props must be in kebab-case. (separated by a '-') since the interview widget is built on the native web components spec
Add a script to initialise the
hubert-apply component with the necessary props`html
`For information on the configuration object, see the Configuration section below.
Configuration
---
The configuration object is passed to the
init method of the hubert-apply component.| Name | Type | Description |
| ---- | ---- | ----------- |
| type |
ats \| no-ats | The type of the client. If you have an ATS, use ats. If you don't have an ATS, use no-ats. |#### No ATS Configuration
If you use
type: "no-ats" in the configuration object, you do not need to provide any additional configuration beyond the type property and the job-id attribute on the widget.#### ATS Configuration
If you use
type: "ats" in the configuration object, you will need to provide the following additional configuration.| Name | Type | Description |
| ---- | ---- | ----------- |
|
name | "intelliplan" \| "uniflex" | The name of your ATS (more support coming soon) |
| clientId | string | Your client ID registered with Hubert |
| jobTitle | string | The title to be displayed on our Pre-Interview page |#### Configuring with Intelliplan
If you are a user of the Intelliplan ATS, you will need to provide the following additional configuration.
| Name | Type | Description |
| ---- | ---- | ----------- |
|
jobAdId | string | Job AD ID attached to your Intelliplan specified job. |$3
These props will be passed ot the component directly in the HTML.| Name | Type | Default | Description |
| ---- | ---- | ------- | ----------- |
|
job-id | string | - | (required) The ID of the job you want to start an interview for. |
| disable-overlay | boolean | false | If set to true, the widget will not open in an overlay and will instead open in a new tab. |
| open-in | popup \| tab | popup | If set to popup, the widget will open in a popup window. If set to tab, the widget will open in a new tab. - When
disable-overlay is true,
open-in uses tab |
| locale | string | en_us | Sets the locale of the widget, however the language of the interview flow is not determined by this attribute.
Supported locales - en_us (default)
- sv_se
|
$3
You can style the widget to match your website's look and feel. Below are the CSS classes you would need to target.####
.hub-apply
Styles applied to main hub-apply ---
####
.hub-interview-frame-overlay`---