import { ViewStyle } from 'react-native';

import { IconType } from '~/components/icon';
import { color, spacing, typography } from '~/theme';

export const packageDetailsItemStyles = {
  bulletView: {
    height: '100%',
    marginTop: spacing[6] + spacing[0],
  } as ViewStyle,
  spacer: {
    marginRight: spacing[2],
  } as ViewStyle,
  subtitleView: {
    paddingTop: spacing[2], // Add extra space to be able to scroll
    paddingBottom: spacing[4], // Add extra space to be able to scroll

    flex: 1,
    flexDirection: 'row',
  } as ViewStyle,
  centerView: {
    paddingBottom: 0, // Remove extra space added by subtitleView
  } as ViewStyle,
};

export const PACKAGE_ITEM_RIGHT_ICON: IconType = {
  color: color.palette.gray,
  name: 'chevron-right',
  size: typography.fontSize[5],
};

export const IN_WAREHOUSE_ICON: IconType = {
  color: color.palette.dodgerBlue,
  name: 'checkmark-rounded-rectangle',
  size: typography.fontSize[4],
};

export const HAS_SIBLINGS_ICON: IconType = {
  color: color.palette.dodgerBlue,
  name: 'boxes-filled',
  size: typography.fontSize[4],
};
