type DotPlacement = 'top' | 'right' | 'bottom' | 'left'; export const getDotState = ({ active, dotPlacement, }: { active: boolean; dotPlacement: DotPlacement; }): 'activeRow' | 'defaultRow' | 'activeColumn' | 'defaultColumn' => { switch (dotPlacement) { case 'top': case 'bottom': return active === true ? 'activeRow' : 'defaultRow'; case 'right': case 'left': return active === true ? 'activeColumn' : 'defaultColumn'; } }; export const getDotDirection = ({ dotPlacement, }: { dotPlacement: DotPlacement; }): 'row' | 'column' => { switch (dotPlacement) { case 'top': case 'bottom': return 'row'; case 'right': case 'left': return 'column'; } }; export const getButtonPlacement = ({ dotPlacement, }: { dotPlacement: DotPlacement; }): 'middleRow' | 'leftColumn' | 'rightColumn' => { switch (dotPlacement) { case 'top': case 'bottom': return 'middleRow'; case 'right': return 'rightColumn'; case 'left': return 'leftColumn'; } };