message: refactor: use style config
diff: -import { SystemStyleObject } from "@chakra-ui/styled-system"
  +import { SystemStyleObject, resolveStyleConfig } from "@chakra-ui/styled-system"
  import {
  + Dict,
  filterUndefined,
  memoizedGet as get,
  mergeWith,
  - runIfFn,
  omit,
  - Dict,
  } from "@chakra-ui/utils"
  import { useRef } from "react"
  import isEqual from "react-fast-compare"
  @@ -14,17 +13,8 @@ import { ThemingProps } from "./system.types"
  export function useStyleConfig(
  themeKey: string,
  - props: ThemingProps & Dict,
  - opts: { isMultiPart: true },
  -): Record<string, SystemStyleObject>
  -
  -export function useStyleConfig(
  - themeKey: string,
  - props?: ThemingProps & Dict,
  - opts?: { isMultiPart?: boolean },
  -): SystemStyleObject
  -
  -export function useStyleConfig(themeKey: any, props: any = {}, opts: any = {}) {
  + props: ThemingProps & Dict = {},
  +) {
  const { styleConfig: styleConfigProp, ...rest } = props
  const { theme, colorMode } = useChakra()
  @@ -44,25 +34,8 @@ export function useStyleConfig(themeKey: any, props: any = {}, opts: any = {}) {
  const stylesRef = useRef<StylesRef>({})
  if (styleConfig) {
  - const baseStyles = runIfFn(styleConfig.baseStyle ?? {}, mergedProps)
  -
  - const variants = runIfFn(
  - styleConfig.variants?.[mergedProps.variant] ?? {},
  - mergedProps,
  - )
  -
  - const sizes = runIfFn(
  - styleConfig.sizes?.[mergedProps.size] ?? {},
  - mergedProps,
  - )
  -
  - const styles = mergeWith({}, baseStyles, sizes, variants)
  -
  - if (opts?.isMultiPart && styleConfig.parts) {
  - styleConfig.parts.forEach((part: string) => {
  - styles[part] = styles[part] ?? {}
  - })
  - }
  + const getStyles = resolveStyleConfig(styleConfig)
  + const styles = getStyles(mergedProps)
  const isStyleEqual = isEqual(stylesRef.current, styles)
  @@ -74,6 +47,4 @@ export function useStyleConfig(themeKey: any, props: any = {}, opts: any = {}) {
  return stylesRef.current
  }
  -export function useMultiStyleConfig(themeKey: string, props: any) {
  - return useStyleConfig(themeKey, props, { isMultiPart: true })
  -}
  +export const useMultiStyleConfig = useStyleConfig
  