import * as React from 'react' ; import DropList from '../../components/DropList' ; import Icon from '../../components/Icon' ; import i18n from '../../i18n' ; import { PluginComponent , PluginProps } from '../Plugin' ; import TableList from './table' ; interface State { show : boolean ; } interface Props extends PluginProps { config : { maxRow ? : number ; maxCol ? : number ; } ; } export default class Table extends PluginComponent < State , Props > { static pluginName = 'table' ; static defaultConfig = { maxRow : 6 , maxCol : 6 , } ; constructor ( props ) { super ( props ) ; this . show = this . show . bind ( this ) ; this . hide = this . hide . bind ( this ) ; this . state = { show : false , } ; } private show ( ) { this . setState ( { show : true , } ) ; } private hide ( ) { this . setState ( { show : false , } ) ; } render ( ) { const config = this . editorConfig . table || this . props . config ; return ( < span className = "button button-type-table" title = { i18n . get ( 'btnTable' ) } onMouseEnter = { this . show } onMouseLeave = { this . hide } > < Icon type = "grid" / > < DropList show = { this . state . show } onClose = { this . hide } > < TableList visibility = { this . state . show } maxRow = { config . maxRow } maxCol = { config . maxCol } onSetTable = { ( option ) => this . editor . insertMarkdown ( 'table' , option ) } /> < /DropList> < /span>); } }