46 lines
1.1 KiB
TypeScript
46 lines
1.1 KiB
TypeScript
import { Theme } from './createTheme';
|
|
import { Components } from './components';
|
|
|
|
export interface ThemeWithProps {
|
|
components?: Components<Omit<Theme, 'components'>>;
|
|
}
|
|
|
|
export type ThemedProps<Theme, Name extends keyof any> = Theme extends {
|
|
components: Record<Name, { defaultProps: infer Props }>;
|
|
}
|
|
? Props
|
|
: {};
|
|
|
|
/**
|
|
* Merges input `props` with the `defaultProps` for a component that were defined in the theme.
|
|
*
|
|
* The `defaultProps` are defined in the theme under `theme.components[componentName].defaultProps`.
|
|
*
|
|
* @example
|
|
*
|
|
* ```tsx
|
|
* const createTheme = () => ({
|
|
* components: {
|
|
* MuiStat: {
|
|
* defaultProps: {
|
|
* variant: 'outlined',
|
|
* },
|
|
* },
|
|
* },
|
|
* });
|
|
*
|
|
* function Stat(props) {
|
|
* const themeProps = useThemeProps({ props, name: 'MuiStat' });
|
|
* return <div {...themeProps} />;
|
|
* }
|
|
* ```
|
|
*
|
|
* @param params.props The input props
|
|
* @param params.name The name of the component as defined in the theme
|
|
*/
|
|
export default function useThemeProps<
|
|
Theme extends ThemeWithProps,
|
|
Props,
|
|
Name extends keyof any,
|
|
>(params: { props: Props; name: Name }): Props & ThemedProps<Theme, Name>;
|