Customize react-dates component style with existing global classes

initialize.js

import 'react-dates/lib/css/_datepicker.css';

import ThemedStyleSheet from 'react-with-styles/lib/ThemedStyleSheet';
import DefaultTheme from 'react-dates/lib/theme/DefaultTheme';
import InterfaceWithOverrides from './path-to/InterfaceWithOverrides';

ThemedStyleSheet.registerInterface(InterfaceWithOverrides);
ThemedStyleSheet.registerTheme(DefaultTheme);

InterfaceWithOverrides.js

import CSSInterface from 'react-with-styles-interface-css';

const InterfaceWithOverrides = Object.create(CSSInterface);
const OVERRIDES_KEY = Symbol('overrides');
Object.assign(InterfaceWithOverrides, {
  [OVERRIDES_KEY]: [],
  addOverride(override) {
    this[OVERRIDES_KEY].push(override);
  },
  resolve(...args) {
    let attrs = false;
    const found = this[OVERRIDES_KEY].some((override) => {
      attrs = override(...args);
      return Boolean(attrs);
    });
    if (found) {
      return attrs;
    }

    return CSSInterface.resolve.call(this, ...args);
  },
});

export default InterfaceWithOverrides;

MyComponent.js

import InterfaceWithOverrides from './path-to/InterfaceWithOverrides';

InterfaceWithOverrides.addOverride(([styles]) => {
  if (styles[0] === 'DateInput_input') {
    return {
      className: cx('input'),
    };
  }
  if (styles[0] === 'DateInput') {
    return {};
  }
  return null;
});

// ...