From 0137be75949f5a2645ce13272ca8d952dbbc0c6e Mon Sep 17 00:00:00 2001 From: Rom Grk Date: Fri, 9 Aug 2024 02:55:28 -0400 Subject: [PATCH] [core] Refactor system theme props (#43120) Co-authored-by: mnajdova --- .../src/useThemeProps/useThemeProps.js | 3 +- .../src/resolveProps/resolveProps.ts | 65 ++++++++++--------- 2 files changed, 36 insertions(+), 32 deletions(-) diff --git a/packages/mui-system/src/useThemeProps/useThemeProps.js b/packages/mui-system/src/useThemeProps/useThemeProps.js index d7c98f380eee85..ef628c06c837fb 100644 --- a/packages/mui-system/src/useThemeProps/useThemeProps.js +++ b/packages/mui-system/src/useThemeProps/useThemeProps.js @@ -7,6 +7,5 @@ export default function useThemeProps({ props, name, defaultTheme, themeId }) { if (themeId) { theme = theme[themeId] || theme; } - const mergedProps = getThemeProps({ theme, name, props }); - return mergedProps; + return getThemeProps({ theme, name, props }); } diff --git a/packages/mui-utils/src/resolveProps/resolveProps.ts b/packages/mui-utils/src/resolveProps/resolveProps.ts index fef2dbdb86f049..660d41ea18db6a 100644 --- a/packages/mui-utils/src/resolveProps/resolveProps.ts +++ b/packages/mui-utils/src/resolveProps/resolveProps.ts @@ -1,8 +1,8 @@ /** * Add keys, values of `defaultProps` that does not exist in `props` - * @param {object} defaultProps - * @param {object} props - * @returns {object} resolved props + * @param defaultProps + * @param props + * @returns resolved props */ export default function resolveProps< T extends { @@ -14,36 +14,41 @@ export default function resolveProps< >(defaultProps: T, props: T) { const output = { ...props }; - (Object.keys(defaultProps) as Array).forEach((propName) => { - if (propName.toString().match(/^(components|slots)$/)) { - output[propName] = { - ...(defaultProps[propName] as any), - ...(output[propName] as any), - }; - } else if (propName.toString().match(/^(componentsProps|slotProps)$/)) { - const defaultSlotProps = (defaultProps[propName] || {}) as T[keyof T]; - const slotProps = props[propName] as {} as T[keyof T]; - output[propName] = {} as T[keyof T]; + for (const key in defaultProps) { + if (Object.prototype.hasOwnProperty.call(defaultProps, key)) { + const propName = key as keyof T; - if (!slotProps || !Object.keys(slotProps)) { - // Reduce the iteration if the slot props is empty - output[propName] = defaultSlotProps; - } else if (!defaultSlotProps || !Object.keys(defaultSlotProps)) { - // Reduce the iteration if the default slot props is empty - output[propName] = slotProps; - } else { - output[propName] = { ...slotProps }; - Object.keys(defaultSlotProps).forEach((slotPropName) => { - (output[propName] as Record)[slotPropName] = resolveProps( - (defaultSlotProps as Record)[slotPropName], - (slotProps as Record)[slotPropName], - ); - }); + if (propName === 'components' || propName === 'slots') { + output[propName] = { + ...(defaultProps[propName] as any), + ...(output[propName] as any), + }; + } else if (propName === 'componentsProps' || propName === 'slotProps') { + const defaultSlotProps = defaultProps[propName] as T[keyof T] | undefined; + const slotProps = props[propName] as {} as T[keyof T] | undefined; + + if (!slotProps) { + output[propName] = defaultSlotProps || ({} as T[keyof T]); + } else if (!defaultSlotProps) { + output[propName] = slotProps; + } else { + output[propName] = { ...slotProps }; + + for (const slotKey in defaultSlotProps) { + if (Object.prototype.hasOwnProperty.call(defaultSlotProps, slotKey)) { + const slotPropName = slotKey; + (output[propName] as Record)[slotPropName] = resolveProps( + (defaultSlotProps as Record)[slotPropName], + (slotProps as Record)[slotPropName], + ); + } + } + } + } else if (output[propName] === undefined) { + output[propName] = defaultProps[propName]; } - } else if (output[propName] === undefined) { - output[propName] = defaultProps[propName]; } - }); + } return output; }