import type { GlobalTheme } from '../global';

const getListTheme = (theme: GlobalTheme) => {
  const colors = {
    checkedListItemContainerBackground: theme.colors.decorativeSecondarySurface,
    listItemContainerBackground: theme.colors.defaultGlobalSurface,
    leadingStatus: {
      danger: theme.colors.error,
      info: theme.colors.info,
      success: theme.colors.success,
      warning: theme.colors.warning,
      archived: theme.colors.archived,
    },
  };

  const space = {
    listItemContainerPadding: theme.space.medium,
    leadingStatusMarginRight: theme.space.small,
    prefixContainerMarginRight: theme.space.small,
    suffixContainerMarginLeft: theme.space.small,
    childrenContainerTopMargin: theme.space.small,
  };

  const radii = {
    item: theme.radii.medium,
    basicItem: theme.radii.base,
    leadingStatus: theme.radii.rounded,
  };

  const shadows = {
    card: theme.shadows.default,
  };

  const widths = {
    leadingStatus: 8,
  };

  const opacity = {
    disabled: 0.38,
    enabled: 1,
  };

  return { colors, space, radii, widths, opacity, shadows };
};

export default getListTheme;