Skip to contentSkip to navigationSkip to topbar
On this page

Flex UI 2.0.x Enhancements Overview


(information)

Info

This summary of features will continue to evolve as we make further enhancements to Flex UI 2.0.x. For details on how to migrate from Flex UI 1.x.x, see our migration guide. Also refer to the Flex UI Release Notes for v2.x.x for changes not outlined in this table.


Component library

component-library page anchor
Flex UI 1.0.xFlex UI 2.0.x
MaterialUI(link takes you to an external page)Twilio Paste(link takes you to an external page)

Enhancements in Flex UI 2.0.x: Built using Twilio Paste tokens, primitives, components, and compositions that are completely composable.


Enhancements in Flex UI 2.0.x: New tools provide some guardrails for your state management, helping you set up boilerplate code with better defaults.


Flex UI 1.0.xFlex UI 2.0.x
  • config.colorTheme
  • config.colorTheme.overrides
  • config.theme
  • config.theme.componentThemeOverride

Enhancements in Flex UI 2.0.x: New theming structure promotes consistency, customization, and web accessibility. See Theme and Branding for a list of configuration and property changes.


Flex UI 1.0.xFlex UI 2.0.x

Enhancements in Flex UI 2.0.x: Built on upgraded components and dependencies. Click the link for each Flex version to view the example package.json files. You can now use the Flex Plugin Library which includes ready-to-install plugins.


Flex UI 1.0.xFlex UI 2.0.x
  • Conversations SDK
  • Attachments configurable for each messaging channel
  • WhatsApp as a native channel
  • For Flex UI 2.4.x and newer, Facebook Messenger and Google Business Messages as native channels (Public Beta)

Enhancements in Flex UI 2.0.x: While Flex UI 2.0.x supports Legacy Messaging, you will need to use Flex Conversations and the new Interactions API. Issues with stale or 1-participant chats have been resolved by Flex Conversations. Read the Getting Started guide for a list of enhanced messaging features. For a list of identified Chat SDK properties and methods that have been changed, removed, or deprecated, see Conversations SDK in the migration guide.


Flex UI 1.0.xFlex UI 2.0.x
N/AWCAG 2.1 AA

Enhancements in Flex UI 2.0.x: Enables customers to conform with Web Content Accessibility Guidelines (WCAG) 2.1 AA(link takes you to an external page) with limited development work. See Flex UI web accessibility for more details.


Flex UI 1.0.xFlex UI 2.0.x
Introduced in 1.31.0Enabled for all minor versions

Enhancements in Flex UI 2.0.x: Flex UI will initialize with limited capabilities, even if some of the components like SDKs (TaskRouter, Conversations, Voice, or Sync) are down. See Degraded mode for more details.


User and Activity controls

user-and-activity-controls page anchor
Flex UI 1.0.xFlex UI 2.0.x

Enhancements in Flex UI 2.0.x: The User Controls component was split out into two components: user-controls now just refers to the little profile pic widget which opens up a popover with the Logout button, and activity displays the current activity and drops down to allow for selecting a different activity. These controls have been updated for easier access and improved programmability. As this is a potentially breaking change, see User and activity controls in the migration guide for more detailed steps on working with UI 2.0.x.


Enhancements in Flex UI 2.0.x: Moving to Flex Conversations offers more customization options for the Messaging UI. There is a new dynamic Component structure and default props. See Flex Messaging UI v2 changes for more details.


Flex UI 1.0.xFlex UI 2.0.x
N/ANew Actions and Flex Events TaskRouter SDK upgraded to ^0.5.9

Enhancements in Flex UI 2.0.x: In Flex UI 2.0.x, new Flex actions and events have been added to the Flex UI Actions Framework(link takes you to an external page) saving the need to access the TaskRouter SDK directly. See New Actions and Flex Events for TaskRouter SDK.


Flex UI 1.0.xFlex UI 2.0.x
  • Notifications.browser
  • warmTransfer
  • colorTheme
  • Notifications.enabled
  • Removed warmTransfer
  • theme

Enhancements in Flex UI 2.0.x: You need to update your AppConfig structure to utilize the new config structure's names and capabilities.


Flex UI 1.0.xFlex UI 2.0.x
Requires a message object(link takes you to an external page) in the payloadRequires a media file(link takes you to an external page) as it uses Twilio Conversations

Enhancements in Flex UI 2.0.x: Uses Twilio Conversations under the hood.


Flex UI 1.0.xFlex UI 2.0.x
Convention: InsightsPlayer:<action>Convention: InsightsPlayer<action>

Enhancements in Flex UI 2.0.x: See Renamed actions for the full list of renamed Insights Player actions.


Flex UI 1.0.xFlex UI 2.0.x
  • ApplyListFilters and ApplyListFiltersPayload
  • RemoveListFilters
  • SendMediaMessage and ChatActionSendMediaMessagePayload
  • AttachFile
  • Removed ApplyListFilters and ApplyListFiltersPayload
  • Removed RemoveListFilters
  • Deprecated SendMediaMessage
  • New AttachFiles allows an array of files to be passed

Enhancements in Flex UI 2.0.x: Some Flex actions have been removed, deprecated, and updated for flexibility.


Enhancements in Flex UI 2.0.x: Uses the Voice SDK which allows you to set Opus as your preferred codec. Opus generally requires less bandwidth and provides better audio quality in restrained network conditions. See Voice SDK in the migration guide for details on what's changed.


Flex UI 1.0.xFlex UI 2.0.x
yticaTokenUpdatedRemoved yticaTokenUpdated

Enhancements in Flex UI 2.0.x: Some Flex events have been removed.


Flex UI 1.0.xFlex UI 2.0.x
Legacy Dialpad Native Dialpad introduced in 1.18.0Flex Dialpad

Enhancements in Flex UI 2.0.x: Legacy Dialpad implementations are no longer supported. Please migrate to the native Flex Dialpad.

Need some help?

Terms of service

Copyright © 2024 Twilio Inc.