Easyteam Embedded
GuidesAPIWhite-Label UIs
GuidesAPIWhite-Label UIs
  1. Integration
  • Integration
    • Easyteam Components
    • iframe Components
    • React Web Components
    • React Native Components
  • Component Reference
    • Time Clock Reference
    • Employees List Reference
    • Timesheets Reference
    • Shift Form Reference
    • Shift Notes Reference
    • Weekly Schedules Reference
    • Agenda Schedule Reference
    • Time Off Policies Settings Reference
    • Time Off Single Policy Reference
    • Organization Settings Reference
  • Themes
    • UI Customization
  1. Integration

iframe Components

The iframe integration provides a fast, secure way to embed workforce management features into any web application.

Getting Started#

Use the EasyTeamLauncher component to initialize Easyteam as an iframe. You can quickly deploy fully-functional components while maintaining your platform's branding.
Install the launcher package from npm:

Basic Implementation#

Render Components#

The launcher supports multiple web components, render a specific screen using the run command with a value from the Pages enum.
Time Sheets
Settings

Navigation and State Management#

The launcher provides methods to control component navigation and state. Read about each component's reference page for the possible parameters.

Parameters#

Pass the following parameters to control global behavior of components:
employees contains the current status and details of all employees in the system. Mandatory.
locations - contains the current status of your business locations and the assignment of employees to locations.
roles - A collection of roles for your employees and their related compensation.
theme gives complete control over all design aspects, positioning, fonts and colors of the component. Read morein UI Customization reference.
onEvent allows to subscribe to events that happen inside the iframe and the components. Read more below.
customFonts overrides the fonts.
timesheet, settings and others parameters control specific behavior and feature flags on each component.

Event Handling#

Subscribe to component events to integrate with your platform:

Updating data#

The EasyTeamLauncher component maintains a bidirectional data flow with its embedded iframe. When you update the data props passed to the component, it automatically synchronizes these changes with the iframe content.

Next Steps#

1.
Review our White-Label UI reference for details about each component
2.
Explore UI Customization options
đź’ˇ
Need help with specific integration scenarios? Our support team is available to assist with your implementation.
Modified at 2025-06-23 22:20:09
Previous
Easyteam Components
Next
React Web Components