How to use the react-color.ChromePicker function in react-color

import * as React from 'react';
import Dialog from '~/components/general/dialog';
import Link from '~/components/general/link';
import {updateMessagesNavigationLabel, removeMessagesNavigationLabel, UpdateMessagesNavigationLabelTriggerType, RemoveMessagesNavigationLabelTriggerType} from '~/actions/main-function/messages';
import { MessagesType, MessagesNavigationItemType } from '~/reducers/main-function/messages';
import {connect, Dispatch} from 'react-redux';
import {bindActionCreators} from 'redux';
import {ColorResult} from 'react-color';
//Another weird typescript bug, won't import properly
const ChromePicker:any = require('react-color').ChromePicker;
import {AnyActionType} from '~/actions';
import {i18nType } from '~/reducers/base/i18n';
import {StateType} from '~/reducers';
import '~/sass/elements/form-elements.scss';
import Button from '~/components/general/button';
import '~/sass/elements/glyph.scss';
import '~/sass/elements/color-picker.scss';

const KEYCODES = {
  ENTER: 13
}

interface CommunicatorLabelUpdateDialogProps {
  children: React.ReactElement,
  label: MessagesNavigationItemType,
  isOpen?: boolean,

value: function titleRender() {
            return React.createElement(react_color_1.ChromePicker, { label: "hex", onChange: this.handleColorChange.bind(this), onChangeComplete: this.handleColorChangeComplete.bind(this), color: this.props.color });
        }
    }, {

import * as React from 'react';
import Dialog from '~/components/general/dialog';
import Link from '~/components/general/link';
import {connect, Dispatch} from 'react-redux';
import {bindActionCreators} from 'redux';
import {ColorResult} from 'react-color';
//Another weird typescript bug, won't import properly
const ChromePicker:any = require('react-color').ChromePicker;
import {AnyActionType} from '~/actions';
import {i18nType } from '~/reducers/base/i18n';

import '~/sass/elements/container.scss';
import '~/sass/elements/form-elements.scss';
import { GuiderUserLabelType } from '~/reducers/main-function/guider';
import { UpdateGuiderFilterLabelTriggerType, RemoveGuiderFilterLabelTriggerType, updateGuiderFilterLabel, removeGuiderFilterLabel } from '~/actions/main-function/guider';
import GuiderLabelShareDialog from './label-share-dialog';
import {StateType} from '~/reducers';
import Button from '~/components/general/button';

const KEYCODES = {
  ENTER: 13
}

interface GuiderLabelUpdateDialogProps {

import * as React from 'react';
import Dialog from '~/components/general/dialog';
import Link from '~/components/general/link';
import {connect, Dispatch} from 'react-redux';
import {bindActionCreators} from 'redux';
import {ColorResult} from 'react-color';
//Another weird typescript bug, won't import properly
const ChromePicker:any = require('react-color').ChromePicker;
import {AnyActionType} from '~/actions';
import {i18nType } from '~/reducers/base/i18n';

import '~/sass/elements/form-elements.scss';
import '~/sass/elements/form.scss';

import { GuiderUserLabelType } from '~/reducers/main-function/guider';
import { UpdateGuiderFilterLabelTriggerType, RemoveGuiderFilterLabelTriggerType, updateGuiderFilterLabel, removeGuiderFilterLabel } from '~/actions/main-function/guider';
import GuiderLabelShareDialog from './label-share';
import {StateType} from '~/reducers';
import Button from '~/components/general/button';
import '~/sass/elements/glyph.scss';
import '~/sass/elements/color-picker.scss';

const KEYCODES = {
  ENTER: 13