message: fix(modal): fix modal footer to use the forwardRef utility
diff: @@ -276,6 +276,8 @@ if (__DEV__) {
  ModalBody.displayName = "ModalBody"
  }
  +export interface ModalFooterProps extends PropsOf<typeof chakra.footer> {}
  +
  /**
  * ModalFooter
  *
  @@ -283,11 +285,15 @@ if (__DEV__) {
  *
  * @see Docs https://chakra-ui.com/components/modal
  */
  -export const ModalFooter: React.FC<PropsOf<typeof chakra.footer>> = (props) => {
  +export const ModalFooter = forwardRef<ModalFooterProps, "footer">(
  + function ModalFooter(props, ref) {
  + const { className, ...rest } = props
  + const _className = cx("chakra-modal__footer", className)
  const styles = useStyles()
  return (
  <chakra.footer
  - {...props}
  + ref={ref}
  + {...rest}
  __css={{
  display: "flex",
  alignItems: "center",
  @@ -295,10 +301,11 @@ export const ModalFooter: React.FC<PropsOf<typeof chakra.footer>> = (props) => {
  flex: 0,
  ...styles.footer,
  }}
  - className={cx("chakra-modal__footer", props.className)}
  + className={_className}
  />
  )
  -}
  + },
  +)
  if (__DEV__) {
  ModalFooter.displayName = "ModalFooter"
  