diff --git a/plugins/bui-themer/src/components/BuiThemerPage/BuiThemerPage.tsx b/plugins/bui-themer/src/components/BuiThemerPage/BuiThemerPage.tsx index 0328a3e6d6..8fb72eda1c 100644 --- a/plugins/bui-themer/src/components/BuiThemerPage/BuiThemerPage.tsx +++ b/plugins/bui-themer/src/components/BuiThemerPage/BuiThemerPage.tsx @@ -14,6 +14,21 @@ * limitations under the License. */ +/* + +IMPLEMENTATION PLAN: + +- create a utility that converts the MUI theme palette into printed CSS variables +populating the variables in packages/ui/src/css/core.css +- the conversion utility will be created in an adjacent `convertMuiToBuiTheme` file, which defines a `convertMuiToBuiTheme` function that accepts a MUI theme instance and returns CSS in text format +- create tests for the conversion utility +- Create a page that shows the generated CSS variables and allows the user to copy them +- The page should show coverted CSS variables for all installed themes in the app, which can be acquired via the AppThemeApi, defined at packages/core-plugin-api/src/apis/definitions/AppThemeApi.ts +- The AppThemeApi can be accessed via the useApi(appThemeApiRef) hook +- The app themes only provide a `Provider` component that in turn provides the MUI theme. The theme can be accessed by wrapping the component in the theme's `Provider` component and then using the `useTheme` hook from MUI + +*/ + export function BuiThemerPage() { return
TODO
; }