ev-ui

import {EvUI} from 'ev-ui'

    render(){
        return(
            <EvUI>
                ваш код
            </EvUI>
        )
    }

Dialog.show(Comp)

import {Dialog} from 'ev-ui'
import {Comp} from 'comp.js'
const props={
    content:Comp, //Компонент или строка, обязательно
    mainBlur:false,// фон, где фильтр размывается, если 
    k1:{}, // любые другие реквизиты
    k2:{}
}
Dialog.show(props)

import {ContextMenu,Menu,Item} from 'ev-ui'

export default class Demo extends React.Component{


    /**
    * сначала отключите стандартное контекстное меню
    */
    componentDidMount(){
        window.oncontextmenu=(e)=>{
            e.preventDefault()
    
    }
    /**
    * затем привяжите функцию к событию onContextMenu узла.
    */
    onContextMenu(e){
        let menu=new Menu()
            .add(new MenuItem('Создать',()=>{})
                    .add(new MenuItem('A',()=>{}))
                    .add(new MenuItem('B',()=>{}))
                    .add(new MenuItem('C',()=>{}))
                )
            .add(new MenuItem('Редактировать',()=>{}))
            .add(новый MenuItem('Копировать',()=>{}))
            .add(новый MenuItem('Вырезать',()=>{}))
            // .add(новый MenuItem('Вырезать',()=>{})).type('disabled') // пункт меню будет отключен (серый цвет и ничего не делает при нажатии)
            .add(новый MenuItem('Вставить',()=>{}))
            .add(новый MenuItem('Удалить',()=>{}).type('remove'))
            
        menu.notEmpty() && ContextMenu.show({menu,left:e.pageX,top:e.pageY})
    }
    render(){
        return(
            <div onContextMenu={this.onContextMenu.bind(this)}>demo</div>
        )
    }
}

import {Confirm} from 'ev-ui'

Confirm.show(()=>{
    //вызывается при нажатии подтверждения
},()=>{
    // вызывается при нажатии отмены
})

    import {ActionTag} from 'ev-ui'
    //здесь используется значок antd для демонстрации, вы можете использовать другие, например FontAwesome...
    import {Icon} from 'antd'

    render(){
        return(
            <div style={{display:flex,flexDirection:row,alignItems:center}}>
                <ActionTag
                    iconField={<Icon type='plus'/>}
                    textField='Create'
                    onClick={()=>{}}
                    />
                {/* установить тип*/}
                <ActionTag
                    iconField={<Icon type='delete'/>}
                    textField='Remove'
                    type='danger'
                    onClick={()=>{}}
                    />
                {/* или установить размер*/}
                <ActionTag
                    iconField={<Icon type='edit'/>}
                    textField='Edit'
                    size='large'
                    onClick={()=>{}}
                    />
            </div>
        )
    }

import {Flow} from 'ev-ui'
const data=[
    {
        id:'0',
        name:'Flow0',
        tasks:[
            {point:0,name:'Task0',parent:[],children:[1]},
            {point:1,name:'Task1',parent:[0],children:[2,3]},
            {point:2,name:'Task2',parent:[1],children:[4]},
            {point:3,name:'Task3',parent:[1],children:[4]}
``` ```
export default class Process extends React.Component {

    state = {
        processes: data,
        selectedProcess: {}
    }

    onTaskChange(tasks) {
        //update the tasks
    }
    onCreate() {
        //create process
    }

    render() {
        return (
            <div className='left-nav'>
                {/* show the processes list */}
            </div>
            <div className='content'>
                <Flow tasks={this.state.selectedProcess.tasks} 
                    onChange={this.onTasksChange.bind(this)}
                    onFlowCreate={this.onCreate.bind(this)}
                    selectedProcess={this.state.selectedProcess || {}}/>
            </div>
        )
    }
}