Can a single unified theme file be passed to the Flex config to style both the Flex UI and plugins using Paste's CustomizationProvider?

[WillCKyle]

Can I provide a single theme file to the Flex Config to be used by both the Flex UI and and by Paste's CustomizationProvider within plugins? Or do I need to create one theme for Flex Config and a separate theme for Paste to use? The reason I ask is that the theme object described in Paste documentation looks completely different from the theme object accepted by Flex. Can I create and maintain a single theme file that is used in both contexts?

[TheSisb]

Hi @WillCKyle,

The Paste team isn't very familiar with the Flex API so you may want to check with the Flex team directly. I did some digging for you anyways, here's what I found:

---

In Flex 2.0 you can follow this instruction to set the theme globally: https://www.twilio.com/docs/flex/developer/ui/overview-of-flex-ui-programmability-options#theming-flex-ui

It would look like this in your main plugin file:

import { Theme as PasteTheme } from "@twilio-paste/core/theme";

...

async init(flex, manager) {
  flex.setProviders({
	PasteThemeProvider: PasteTheme.Provider,
  });
}

and in your custom components:

import { withTheme } from "@twilio/flex-ui";

...

export default withTheme(withTaskContext(MyComponent));

Based on the link you shared, it looks like you were looking at the Flex 1.x documentation. If you're still on that version, the only way would be to create a self-hosted Flex application and wrap everything inside a Paste theme provider.

---

I apologize if this isn't helpful enough. For any follow-up I'd suggest checking in with your Flex rep.