useResizeObserver

const [flg, { toggle }] = useBoolean()

const [ref, rect] = useResizeObserver<HTMLButtonElement>()

return (
  <>
    <Text>{JSON.stringify(rect)}</Text>

    <Button
      ref={ref}
      mt="md"
      onClick={toggle}
      w={flg ? "xl" : "sm"}
      h={flg ? "xl" : "sm"}
    >
      Click me to toggle the boolean value
    </Button>
  </>
)