This repository has been archived on 2022-08-14. You can view files and clone it, but cannot push or open issues or pull requests.
Files
outline/frontend/menus/BlockMenu.js
Tom Moor 3613e01094 Insert block menu (#297)
* Insert block behavior

* Functional with horizontal rule

* Add list and image upload working

* Cleanup typing

* Closest to correct behavior so far

* Improve block insert on list

* Hide (+) after clicking menu item

* Bad merge
2017-10-17 20:22:20 -07:00

50 lines
1.3 KiB
JavaScript

// @flow
import React, { Component } from 'react';
import Icon from 'components/Icon';
import { observer } from 'mobx-react';
import { DropdownMenu, DropdownMenuItem } from 'components/DropdownMenu';
@observer class BlockMenu extends Component {
props: {
label?: React$Element<*>,
onPickImage: SyntheticEvent => void,
onInsertList: SyntheticEvent => void,
onInsertTodoList: SyntheticEvent => void,
onInsertBreak: SyntheticEvent => void,
};
render() {
const {
label,
onPickImage,
onInsertList,
onInsertTodoList,
onInsertBreak,
...rest
} = this.props;
return (
<DropdownMenu
style={{ marginRight: -70, marginTop: 5 }}
label={label}
{...rest}
>
<DropdownMenuItem onClick={onPickImage}>
<Icon type="Image" /> Add images
</DropdownMenuItem>
<DropdownMenuItem onClick={onInsertList}>
<Icon type="List" /> Start list
</DropdownMenuItem>
<DropdownMenuItem onClick={onInsertTodoList}>
<Icon type="CheckSquare" /> Start checklist
</DropdownMenuItem>
<DropdownMenuItem onClick={onInsertBreak}>
<Icon type="Minus" /> Add break
</DropdownMenuItem>
</DropdownMenu>
);
}
}
export default BlockMenu;