chore(release): 1.8.0 [skip ci]

# [1.8.0](v1.7.3...v1.8.0) (2023-05-12)

### Features

* add overrideComponentsRootStyles helper ([93f46b0](93f46b0))

Author: semantic-release-bot

CHANGELOG.md

@@ -1,3 +1,10 @@
+# [1.8.0](https://github.com/ocadotechnology/codeforlife-package-javascript/compare/v1.7.3...v1.8.0) (2023-05-12)
+
+
+### Features
+
+* add overrideComponentsRootStyles helper ([93f46b0](https://github.com/ocadotechnology/codeforlife-package-javascript/commit/93f46b060ed7995cf243b4efd58590456dec1528))
+
 ## [1.7.3](https://github.com/ocadotechnology/codeforlife-package-javascript/compare/v1.7.2...v1.7.3) (2023-05-12)
 
 

lib/cjs/helpers.d.ts

@@ -1,9 +1,10 @@
 import React from 'react';
-import { DividerProps } from '@mui/material';
+import { DividerProps, Theme, ThemeOptions } from '@mui/material';
 export declare function openInNewTab(url: string, target?: string): void;
 export declare function insertDividerBetweenElements({ elements, dividerProps }: {
     elements: React.ReactElement[];
     dividerProps?: DividerProps;
 }): React.ReactElement[];
 export declare function stringToBoolean(value: string): boolean;
 export declare function getSearchParams(requiredParams?: Record<string, (value: string) => any>, optionalParams?: Record<string, (value: string) => any>): Record<string, any> | null;
+export declare function overrideComponentsRootStyles(keys: Array<keyof NonNullable<ThemeOptions['components']>>, rootStyleOverrides: Record<string, any>, theme?: Theme): Theme;

lib/cjs/helpers.js

@@ -14,7 +14,7 @@ var __importDefault = (this && this.__importDefault) || function (mod) {
     return (mod && mod.__esModule) ? mod : { "default": mod };
 };
 Object.defineProperty(exports, "__esModule", { value: true });
-exports.getSearchParams = exports.stringToBoolean = exports.insertDividerBetweenElements = exports.openInNewTab = void 0;
+exports.overrideComponentsRootStyles = exports.getSearchParams = exports.stringToBoolean = exports.insertDividerBetweenElements = exports.openInNewTab = void 0;
 var react_1 = __importDefault(require("react"));
 var react_router_dom_1 = require("react-router-dom");
 var material_1 = require("@mui/material");
@@ -55,3 +55,24 @@ function getSearchParams(requiredParams, optionalParams) {
     }));
 }
 exports.getSearchParams = getSearchParams;
+function overrideComponentsRootStyles(keys, rootStyleOverrides, theme) {
+    var _a;
+    theme = theme !== null && theme !== void 0 ? theme : (0, material_1.useTheme)();
+    var components = (_a = theme.components) !== null && _a !== void 0 ? _a : {};
+    components = __assign(__assign({}, components), Object.fromEntries(keys.map(function (key) {
+        var _a;
+        var component = (_a = components[key]) !== null && _a !== void 0 ? _a : {};
+        ;
+        var styleOverrides = ('styleOverrides' in component) ? component.styleOverrides : {};
+        component = __assign(__assign({}, component), { styleOverrides: __assign(__assign({}, styleOverrides), { root: function (_a) {
+                    var ownerState = _a.ownerState;
+                    return (__assign(__assign(__assign({}, (typeof styleOverrides.root === 'function' &&
+                        styleOverrides.root({ ownerState: ownerState }))), (typeof styleOverrides.root === 'object' &&
+                        styleOverrides.root)), rootStyleOverrides));
+                } }) });
+        return [key, component];
+    })));
+    return (0, material_1.createTheme)(theme, { components: components });
+}
+exports.overrideComponentsRootStyles = overrideComponentsRootStyles;
+;

lib/esm/helpers.d.ts

@@ -1,9 +1,10 @@
 import React from 'react';
-import { DividerProps } from '@mui/material';
+import { DividerProps, Theme, ThemeOptions } from '@mui/material';
 export declare function openInNewTab(url: string, target?: string): void;
 export declare function insertDividerBetweenElements({ elements, dividerProps }: {
     elements: React.ReactElement[];
     dividerProps?: DividerProps;
 }): React.ReactElement[];
 export declare function stringToBoolean(value: string): boolean;
 export declare function getSearchParams(requiredParams?: Record<string, (value: string) => any>, optionalParams?: Record<string, (value: string) => any>): Record<string, any> | null;
+export declare function overrideComponentsRootStyles(keys: Array<keyof NonNullable<ThemeOptions['components']>>, rootStyleOverrides: Record<string, any>, theme?: Theme): Theme;

lib/esm/helpers.js

@@ -11,7 +11,7 @@ var __assign = (this && this.__assign) || function () {
 };
 import React from 'react';
 import { useSearchParams } from 'react-router-dom';
-import { Divider } from '@mui/material';
+import { Divider, useTheme, createTheme } from '@mui/material';
 export function openInNewTab(url, target) {
     if (target === void 0) { target = '_blank'; }
     window.open(url, target);
@@ -45,3 +45,23 @@ export function getSearchParams(requiredParams, optionalParams) {
         return [key, value(searchParams.get(key))];
     }));
 }
+export function overrideComponentsRootStyles(keys, rootStyleOverrides, theme) {
+    var _a;
+    theme = theme !== null && theme !== void 0 ? theme : useTheme();
+    var components = (_a = theme.components) !== null && _a !== void 0 ? _a : {};
+    components = __assign(__assign({}, components), Object.fromEntries(keys.map(function (key) {
+        var _a;
+        var component = (_a = components[key]) !== null && _a !== void 0 ? _a : {};
+        ;
+        var styleOverrides = ('styleOverrides' in component) ? component.styleOverrides : {};
+        component = __assign(__assign({}, component), { styleOverrides: __assign(__assign({}, styleOverrides), { root: function (_a) {
+                    var ownerState = _a.ownerState;
+                    return (__assign(__assign(__assign({}, (typeof styleOverrides.root === 'function' &&
+                        styleOverrides.root({ ownerState: ownerState }))), (typeof styleOverrides.root === 'object' &&
+                        styleOverrides.root)), rootStyleOverrides));
+                } }) });
+        return [key, component];
+    })));
+    return createTheme(theme, { components: components });
+}
+;