Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Table actions #68

Merged
merged 4 commits into from
Feb 6, 2020
Merged

Table actions #68

merged 4 commits into from
Feb 6, 2020

Conversation

eivindw
Copy link
Collaborator

@eivindw eivindw commented Feb 5, 2020

Some actions and example buttons for table editing:

  • Insert table
  • Delete table
  • Add/delete row
  • Add/delete cell

@@ -7,6 +7,7 @@ import { RenderElementTableOptions, TableType } from './types';
const StyledTable = styled.table`
margin: 10px 0;
border-collapse: collapse;
width: 100%;
Copy link
Collaborator Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Full table width fits better as long as we can't position other elements next to the table anyway. Maybe this could be configurable?

Copy link
Member

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Yes resizing the table, the columns and the rows would be nice in the future.

@@ -3,12 +3,33 @@ import { boolean } from '@storybook/addon-knobs';
import { createEditor } from 'slate';
import { withHistory } from 'slate-history';
import { Slate, withReact } from 'slate-react';

import {
BorderAll,
Copy link
Collaborator Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Random choice of icons for the example buttons..

@zbeyens zbeyens self-requested a review February 5, 2020 08:40
<HeadingToolbar>
<ToolbarMark format={MARK_BOLD} icon={<FormatBold />} />
<ToolbarTable action={insertTable} icon={<BorderAll />} />
<ToolbarTable action={deleteTable} icon={<BorderClear />} />
Copy link
Member

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

In the future we can add a floating delete button.

Confluence example:
image

GitBook example (in the sidebar):
image

Copy link
Member

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

@zbeyens zbeyens merged commit cd300ce into udecode:master Feb 6, 2020
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Projects
None yet
Development

Successfully merging this pull request may close these issues.

2 participants