componentStyles () {
      const {
        orientation,
        trackPercent,
        size,
        color
      } = this.context

      const { thumbStyle } = useSliderStyle({
        trackPercent,
        orientation,
        color,
        size,
        theme: this.theme,
        colorMode: this.colorMode
      })

      return {
        d: 'flex',
        alignItems: 'center',
        outline: 'none',
        justifyContent: 'center',
        ...thumbStyle
      }
    }
CSliderThumb component

The thumb handler for the slider component

@extends CPseudoBox
@see Docs https://vue.chakra-ui.com/slider