import React from 'react'
import ArrowIcon from 'icons/ArrowIcon'
import { SelectableState } from 'src/state/SelectionState'
import { ActiveOptionProps } from './typings'

export function defaultRenderActiveAfterText(props: ActiveOptionProps, state: SelectableState) {
  // isAnimated <- has dom ref issues
  return <ArrowIcon up={state.isVisible} down={!state.isVisible} breed={'arrowV1'} />
}

export function defaultRenderActiveBeforeText(props: ActiveOptionProps, state: SelectableState) {
  return ''
}