@telus-uds/components-base 1.49.0 → 1.51.0

package/src/ThemeProvider/ThemeProvider.jsx

@@ -1,4 +1,4 @@
-import React, { createContext, useState } from 'react'
+import React, { createContext, useEffect, useState } from 'react'
 import PropTypes from 'prop-types'
 import { validateThemeTokensVersion } from './utils'
 import responsiveProps from '../utils/props/responsiveProps'
@@ -22,6 +22,12 @@ const defaultThemeOptions = {
 const ThemeProvider = ({ children, defaultTheme, themeOptions = {} }) => {
   const [theme, setTheme] = useState(defaultTheme)
 
+  useEffect(() => {
+    if (theme.metadata.name !== defaultTheme.metadata.name) {
+      setTheme(defaultTheme)
+    }
+  }, [theme.metadata.name, defaultTheme])
+
   const appliedThemeOptions = { ...defaultThemeOptions, ...themeOptions }
 
   // Validate the theme tokens version on every render.
@@ -42,7 +48,8 @@ ThemeProvider.propTypes = {
   children: PropTypes.node.isRequired,
   defaultTheme: PropTypes.shape({
     metadata: PropTypes.shape({
-      themeTokensVersion: PropTypes.string.isRequired
+      themeTokensVersion: PropTypes.string.isRequired,
+      name: PropTypes.string.isRequired
     }).isRequired
   }).isRequired,
   /**

package/src/Typography/Typography.jsx

@@ -105,6 +105,7 @@ const Typography = forwardRef(
     const textStyles = resolvedTextProps.style
       ? { ...resolvedTextProps.style, textDecorationLine }
       : { textDecorationLine }
+
     return block ? (
       <View ref={ref} {...containerProps}>
         <Text {...resolvedTextProps} style={textStyles}>