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

const getSwitchTheme = (theme: GlobalTheme) => {
  const colors = {
    backgroundColors: {
      checked: theme.colors.pressedSurface,
      unchecked: theme.colors.inactiveOnDefaultGlobalSurface,
      'disabled-checked': theme.colors.inactiveOnDefaultGlobalSurface,
      'disabled-unchecked': theme.colors.inactiveOnDefaultGlobalSurface,
    },
    thumb: theme.colors.white,
    selector: {
      background: theme.colors.neutralGlobalSurface,
      textBackground: theme.colors.decorativePrimarySurface,
    },
  };

  const sizes = {
    thumb: theme.sizes.medium,
    width: theme.sizes.xxxlarge,
    height: theme.sizes.large,
    selector: {
      height: theme.sizes.xxlarge,
    },
  };

  const spaces = {
    paddingHorizontal: theme.space.xsmall,
    selector: {
      iconPadding: theme.space.medium,
      wrapperHorizontalPadding: theme.space.xsmall,
    },
  };

  const radii = {
    rounded: theme.radii.rounded,
    selector: {
      default: theme.radii.rounded,
    },
  };

  return {
    colors,
    sizes,
    spaces,
    radii,
  };
};

export default getSwitchTheme;