Availability of different base themes in CustomizationProvider vs Theme.Provider - is this intentional?

[oscar8880]

Hey!

I have a query to do with the base themes that are available in the standard theme provider versus the customisable theme provider:

In the props for Theme.Provider, theme can be any of:

    DEFAULT: string;
    SENDGRID: string;
    FLEX: string;
    DARK: string;
    TWILIO: string;
    TWILIO_DARK: string;
    EVERGREEN: string;

but the props for CustomizationProvider limit baseTheme to two options:

baseTheme?: 'default' | 'dark'

Is this an intentional choice? Would you consider adding the extra base themes to CustomizationProvider? (I'd personally be interested in the Flex one mostly)

Many thanks!

Oscar

[SiTaggart]

Hey @oscar8880

This is indeed intentional, and it has a bit of a backstory.

When we first created Paste we launched with 3 themes, Console, Sendgrid and Flex. These were all designed so that each application could adopt Paste incrementally, making sure the components looked fairly sympathetic to the consuming apps visual design.

They were always designed as migration tools to get Twilio software to eventually look and feel the same. So we then created the Unified Design Language for Paste, which what we were all converging on towards. This is the "default" and "dark" themes.

The plan was always to deprecate the Sendgrid and Flex themes.

What actually transpired was that the Sendgrid theme didn't really look as sendgrid-ey as the new default theme. So, Sendgrid theme is actually just the default theme with Colfax as the typeface as they use it in their pre-login experiences. Product actually uses default. Flex adoption of Paste to a long while, and the Flex theme was never actually created, the application just jumped straight to default. So the Flex theme is just default. The Console theme got removed with the GA launch of Console.Zen. We never removed the Flex theme to save a breaking change, arguably that was an oversight.

We now have an evergreen theme, that is only to be used internally to migrate Segment to Paste. Once that's done, we're going to migrate everyone internally to the Twilio and Twilio Dark themes, which are brand new and part of this year's One Identity initiative.

The Default and Dark themes will continue to exist only to support open source and customer use in things like Flex, due to the Twilio San typeface licensing, which means customers can't use the Twilio type face in their self-hosted applications. They will ultimately be the same as the Twilio named themes, just minus the type face, which will remain Inter.

The Customization Provider is only designed to be used in programmable, configurable apps that customers can customize. It's not for internal use. As such, we're only going to support default and dark on the customization provider.

Ultimately, that means we only need to support a single design language which helps us with our overheads. We're just doing it in a way that is least disruptive to on-going work.

Hope that makes sense! Here's a little table to summarize.

Theme	Description	Plan
Sendgrid	Just the default theme with a different typeface	Being removed in the future
Flex	Just the default theme	Being removed in the future
Evergreen	Evergreen themed Paste for Segment migration	Being removed in the future
Twilio	Brand new Product Design Language for single identity	To be used by all Twilio, Sendgrid and Segment apps once launched
Twilio Dark	Dark version of the brand new Product Design Language for single identity	To be used by all Twilio, Sendgrid and Segment apps once launched
Default	Current design language, open source theme	This will be changed to be the same as the Twilio theme, but using Inter typeface, once we have completed the migration
Dark	Current design language, open source theme	This will be changed to be the same as the Twilio Dark theme, but using Inter typeface, once we have completed the migration

[oscar8880]

Hi @SiTaggart!

Wow that was quite the journey! Thanks for explaining the backstory that's super interesting to know, and it's made it clear that default is the way to go for what I'm doing. Thanks!