import {StyleSheet} from 'react-native';
import {
  IconAlertCircle,
  IconCalendarDue,
  IconCheck,
  IconChevronDown,
  IconChevronLeft,
  IconChevronRight,
  IconEye,
  IconEyeClosed,
  IconPointFilled,
  IconSearch,
  IconX,
} from '@tabler/icons-react-native';
import {SPACING} from '@shared/theme';

export const INPUT_ICONS = {
  success: IconCheck,
  error: IconAlertCircle,
  clear: IconX,
  showEntry: IconEye,
  hideEntry: IconEyeClosed,
  down: IconChevronDown,
  search: IconSearch,
  calendar: IconCalendarDue,
  left: IconChevronLeft,
  right: IconChevronRight,
  bullet: IconPointFilled,
};

export const INPUT_SIZE_STYLES = StyleSheet.create({
  sm: {
    minHeight: 40,
    padding: SPACING.x1,
  },
  lg: {
    minHeight: 56,
    padding: SPACING.x2,
  },
});

export const INPUT_MIN_HEIGHT = 56;

export const INPUT_MAX_HEIGHT = 120;

export const TEXT_AREA_MIN_HEIGHT = 152;

export const INPUT_EXTRA_HEIGHT = 84;

export const INPUT_STYLES = StyleSheet.create({
  inputSpacing: {
    minHeight: INPUT_MIN_HEIGHT,
    maxHeight: INPUT_MAX_HEIGHT,
  },
  /**
   * Default input style for textarea
   */
  longInputSpacing: {
    alignItems: 'flex-start',
    minHeight: TEXT_AREA_MIN_HEIGHT,
    // To avoid inputSpacing default value
    maxHeight: 'auto',
  },
});
