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

const getChipTheme = (theme: GlobalTheme) => {
  const colors = {
    secondaryBackground: theme.colors.decorativeSecondarySurface,
    filledBackground: theme.colors.defaultGlobalSurface,
    wrapperSelectedBorder: 'transparent',
    outlinedDefaultBackground: theme.colors.defaultGlobalSurface,
    outlinedSelectedBackground: theme.colors.secondaryOutline,
    outlinedSelectedBorder: theme.colors.primaryOutline,
    outlinedDefaultBorder: theme.colors.disabledOnDefaultGlobalSurface,
  };

  const space = {
    wrapperHorizontalPadding: theme.space.smallMedium,
    wrapperVerticalPadding: theme.space.small,
    compactWrapperHorizontalPadding: theme.space.small,
    compactWrapperVerticalPadding: theme.space.xsmall,
    iconWrapperHorizontalMargin: theme.space.small,
  };

  const radii = {
    wrapper: theme.radii.rounded,
  };

  const borderWidths = {
    wrapper: theme.borderWidths.base,
    icon: theme.borderWidths.medium,
    outlinedDefaultBorder: theme.borderWidths.base,
  };

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

  const fontSizes = {
    icon: theme.fontSizes.small,
  };

  return {
    colors,
    space,
    radii,
    borderWidths,
    shadows,
    fontSizes,
  };
};

export default getChipTheme;