v4.0.0

New Theme Structure 🎉

Before

const base = {
  color: '#666666',
  colors: {},
  size: {
    small: '12px',
    medium: '24px',
    large: '48px',
    xlarge: '96px',
  },
};

After

const base = {
  global: {
    colors: {
      icon: '#666666',
    },
  },
  icon: {
    size: {
      small: '12px',
      medium: '24px',
      large: '48px',
      xlarge: '96px',
    },
  },
};

This allowed us to remove the ThemeContext specific to grommet-icons. Now you can just leverage the ThemeContext from styled-components.

  import { ThemeProvider} from 'styled-components';
  import { base, Close }  from 'grommet-icons';
  <ThemeProvider theme={base}>
      <Close />
  </ThemeProvider>

⚠️ Make sure to install grommet-styles as a peerDependency now.