export const iconOnlySpacing = {
  '&&': {
    padding: '0px'
  },
  '& > span': {
    margin: '0px'
  }
};
const getStyles = (property, {
  appearance = 'default',
  state = 'default',
  mode = 'light'
}) => {
  if (!property[appearance] || !property[appearance][state]) {
    return 'initial';
  }
  return property[appearance][state][mode];
};
const backgroundVisualRefresh = {
  danger: {
    default: {
      light: 'inherit',
      dark: 'inherit'
    },
    hover: {
      light: "var(--ds-background-danger-hovered, #FFD5D2)",
      dark: "var(--ds-background-danger-hovered, #FFD5D2)"
    },
    active: {
      light: "var(--ds-background-danger-pressed, #FFB8B2)",
      dark: "var(--ds-background-danger-pressed, #FFB8B2)"
    }
  }
};
const colorVisualRefresh = {
  danger: {
    default: {
      light: "var(--ds-icon-subtle, #505258)",
      dark: "var(--ds-icon-subtle, #505258)"
    },
    hover: {
      light: "var(--ds-icon-danger, #C9372C)",
      dark: "var(--ds-icon-danger, #C9372C)"
    },
    active: {
      light: "var(--ds-icon-danger, #C9372C)",
      dark: "var(--ds-icon-danger, #C9372C)"
    }
  }
};

// Ignored via go/ees005
// eslint-disable-next-line @typescript-eslint/no-explicit-any
export const getButtonStyles = props => ({
  background: getStyles(backgroundVisualRefresh, props),
  color: getStyles(colorVisualRefresh, props)
});