feat: customize sidemenu #143
Merged
Conversation
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
# Conflicts: # packages/react/src/BlockSideMenu/components/BlockSideMenu.tsx # packages/react/src/BlockSideMenu/components/ColorPickerMenu.tsx
|
The latest updates on your projects. Learn more about Vercel for Git ↗︎
|
YousefED
commented
Apr 3, 2023
packages/react/src/BlockSideMenu/components/DefaultButtons/BlockColorsButton.tsx
Outdated
Show resolved
Hide resolved
YousefED
commented
Apr 3, 2023
packages/react/src/BlockSideMenu/components/DefaultButtons/BlockColorsButton.tsx
Outdated
Show resolved
Hide resolved
This reverts commit ee61bd0.
Merged
YousefED
commented
Apr 18, 2023
packages/core/src/extensions/DraggableBlocks/BlockSideMenuFactoryTypes.ts
Outdated
Show resolved
Hide resolved
YousefED
commented
Apr 18, 2023
YousefED
added a commit
that referenced
this pull request
Apr 19, 2023
* simplify formattingtoolbar * Fixed React component types and added customizable formatting toolbar factory * Finished formatting toolbar customization with old props * Changed formatting toolbar props to use BlockNoteEditor * Fixed text alignment with basic selection object * Fixed block nesting tests * Removed multiple block shorthand for updateBlock * Added comments * Removed redundant useCallback hooks * Split `getActiveLink` to get text & url separately * Removed unnecessary functions and `useCallback` hooks * removed unnecessary `focus` calls * Small fix * Inline code style fix * Added docs * Small update * Made selection undefined if nothing is selected * Added selection docs * Added styling docs * Added nesting & un-nesting docs * Small fix * Added selection demo * Minor fixes * fix: hyperlink creation menu losing focus on click (#168) * Doc changes & cleanup * feat: customizable sidemenu (#143) * simplify colorpicker * Added basic mouse cursor position * Added drag handle menu customization API * Copied changes from PR and minor improvements * Small changes * Added `DragHandleMenuItem` component * Fixed side menu unnecessary updates * Removed unnecessary state * Cleaned up code * Changed how the side menu gets the hovered block * Added side menu image * Added docs * Fixed comments in demo * Made all menus/toolbars scroll with page * Revert "Made all menus/toolbars scroll with page" This reverts commit ee61bd0. * Removed `editor` from dynamic props * Documentation changes * Small cleanup * Vanilla example fix --------- Co-authored-by: Matthew Lipski <matthewlipski@gmail.com> Co-authored-by: Matthew Lipski <50169049+matthewlipski@users.noreply.github.com> --------- Co-authored-by: Matthew Lipski <matthewlipski@gmail.com> Co-authored-by: Matthew Lipski <50169049+matthewlipski@users.noreply.github.com>
5 tasks
fogle
pushed a commit
to fogle/BlockNote
that referenced
this pull request
May 20, 2023
* simplify formattingtoolbar * Fixed React component types and added customizable formatting toolbar factory * Finished formatting toolbar customization with old props * Changed formatting toolbar props to use BlockNoteEditor * Fixed text alignment with basic selection object * Fixed block nesting tests * Removed multiple block shorthand for updateBlock * Added comments * Removed redundant useCallback hooks * Split `getActiveLink` to get text & url separately * Removed unnecessary functions and `useCallback` hooks * removed unnecessary `focus` calls * Small fix * Inline code style fix * Added docs * Small update * Made selection undefined if nothing is selected * Added selection docs * Added styling docs * Added nesting & un-nesting docs * Small fix * Added selection demo * Minor fixes * fix: hyperlink creation menu losing focus on click (TypeCellOS#168) * Doc changes & cleanup * feat: customizable sidemenu (TypeCellOS#143) * simplify colorpicker * Added basic mouse cursor position * Added drag handle menu customization API * Copied changes from PR and minor improvements * Small changes * Added `DragHandleMenuItem` component * Fixed side menu unnecessary updates * Removed unnecessary state * Cleaned up code * Changed how the side menu gets the hovered block * Added side menu image * Added docs * Fixed comments in demo * Made all menus/toolbars scroll with page * Revert "Made all menus/toolbars scroll with page" This reverts commit ee61bd0. * Removed `editor` from dynamic props * Documentation changes * Small cleanup * Vanilla example fix --------- Co-authored-by: Matthew Lipski <matthewlipski@gmail.com> Co-authored-by: Matthew Lipski <50169049+matthewlipski@users.noreply.github.com> --------- Co-authored-by: Matthew Lipski <matthewlipski@gmail.com> Co-authored-by: Matthew Lipski <50169049+matthewlipski@users.noreply.github.com>
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment
Add this suggestion to a batch that can be applied as a single commit.
This suggestion is invalid because no changes were made to the code.
Suggestions cannot be applied while the pull request is closed.
Suggestions cannot be applied while viewing a subset of changes.
Only one suggestion per line can be applied in a batch.
Add this suggestion to a batch that can be applied as a single commit.
Applying suggestions on deleted lines is not supported.
You must change the existing code in this line in order to create a valid suggestion.
Outdated suggestions cannot be applied.
This suggestion has been applied or marked resolved.
Suggestions cannot be applied from pending reviews.
Suggestions cannot be applied on multi-line comments.
Suggestions cannot be applied while the pull request is queued to merge.
Suggestion cannot be applied right now. Please check back later.
For customizing the BlockSideMenu, I think we can follow a similar approach as described in #142. We can make the default menu contents customizable allowing users to pass custom content for
<Menu.Dropdown className={classes.root}>. This would make the entire dropdown menu customizable, while keeping it very simple.Note that in this design, if users would want to customize more (i.e.: add a button besides the draghandle / plus button), they'd still need to provide a custom factory.
As a first start I simplified the Color Menu. @matthewlipski I know you were having some issues with this earlier, could you check if this approach doesn't have any of the bugs you encountered earlier?
Menu.Itemwrapper (e.g.:BlockNoteMenuItem) that automatically callssetDragHandleMenuOpened(false); props.unfreezeMenu();inonClick, so users don't need to do this manually