componentStyles () {
      const colorMode = this.colorMode

      // Pseudo styles
      const hoverColor = { light: 'blackAlpha.100', dark: 'whiteAlpha.100' }
      const activeColor = { light: 'blackAlpha.200', dark: 'whiteAlpha.200' }

      // Size styles
      const buttonSize = sizes[this.size] && sizes[this.size].button

      return {
        outline: 'none',
        h: buttonSize,
        w: buttonSize,
        disabled: this.isDisabled,
        cursor: 'pointer',
        _hover: { bg: hoverColor[colorMode] },
        _active: { bg: activeColor[colorMode] },
        position: 'absolute',
        top: '8px',
        right: '12px',
        ...baseProps
      }
    }
CCloseButton component

The button that closes the modal.

@extends CCloseButton
@see Docs https://vue.chakra-ui.com/modal