- Use line count (12+) instead of DOM height measurement for collapse threshold
- Handle missing dictionary gracefully for server-side rendering
- Add addToHistory:false to toggleCodeBlockCollapse command
- Move .code-block class name to EditorStyleHelper
- Use neutral button variant for collapse toggle, show on hover/focus
- Fix fade overlay border-radius and inset, clip line numbers via clip-path
- Remove suppressAutoExpand hack; preventDefault already handles it
Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com>
* Initial plan
* Add hide/show completed items feature for checkbox lists
- Add id attribute to checkbox_list nodes
- Create CheckboxListNodeView with toggle button
- Store hide state in localStorage per user and list
- Add CSS styles for wrapper and toggle button
- Hide completed items when state is active
Co-authored-by: tommoor <380914+tommoor@users.noreply.github.com>
* Address code review feedback - improve boolean handling and default values
- Change id default from undefined to null for consistent serialization
- Use !! for boolean coercion instead of === true for Storage.get
- More robust handling of truthy values
Co-authored-by: tommoor <380914+tommoor@users.noreply.github.com>
* Refactor
---------
Co-authored-by: copilot-swe-agent[bot] <198982749+Copilot@users.noreply.github.com>
Co-authored-by: tommoor <380914+tommoor@users.noreply.github.com>
Co-authored-by: Tom Moor <tom@getoutline.com>
* fix: modify input rules for heading to wrap it in a toggle block
* fix: leave heading node untouched
* feat: add toggle block menu item
* feat: first prototype
* toggle_head and toggle_body
* fix: indent toggle block
* fix: cleanup
* fix: allow only one heading or one para inside toggle head
* fix: cleanup
* fix: cursor becomes invisible as soon as toggle block is inserted
This happened because the containing paragraph had ~0px as width which
hid the cursor. I attemped setting the `style.minWidth` to 1px for the
containing `span` and cursor became visible. Hence, set the `flexGrow`
prop so that it occupies all the avaible space.
* fix: keep the toggle button vertically center-aligned
Adjusts the toggle button and keeps it center-aligned vertically as the toggle head's
content node changes from, say a paragraph to a heading(of any level),
or the other way around...
* chore: style using css
* fix: nesting of toggle blocks
`toggleWrap` resorted to lifting out the active node when attempting
to create a new nested toggle block inside existing toggle block, which
made it impossible to nest toggle block. Hence, bypassing the
`toggleWrap` flow in favor of `wrapIn`, which provides nesting of toggle
blocks.
* fix: assign unique id to each toggle head node
This will be later used to persist toggle state of the toggle block
* feat: attempt at using node view for toggle block
* fix: get rid of nanoid, we can use existing uuid pkg
* feat: plugin to manage toggling behaviour
This includes a plugin which, for now handles the following behaviours:
1. Sync collapsed state from localStorage, and correspondingly initialize
decorations for all the toggle block nodes in doc
2. Handle the fold/unfold behaviour of toggle block, triggered through
the toggle button from within the node view
* fix: don't trigger toggle behavior if secondary button on mouse is pressed
* fix: restore decorations which are removed upon `joinBackward`
When the selection is at the start of block node just
after the toggle block node, pressing backspace triggers `joinBackward`
command which attempts to "join" this block node with the toggle block
node just before it. The `joinBackward` command works by adding a
replacement step, which, in turn drops the decorations in the affected
range. As a result, the toggle block collapses. In order to prevent the
collapse, we restore back the dropped decoration to its corresponding
node(if it exists).
* chore: can find spec using id now
* chore: this.name in favor of hardcoding
* fix: collapse all children of toggle block except the first
As a result of setting `content: block+` for the toggle block node, all
its children are rendered flat in DOM, making it difficult to distinguish which
one corresponds to its first child node. This, in turn, makes it hard to
identify which one should not be collapsed when pressing the toggle
button to collapse. The solution here is to wrap the first child node in
a separate DOM node via a decoration. So, hopefully, we don't need to
break up `toggle_block` node as one containing `toggle_head` and
`toggle_body` nodes and setting `content: block+` should suffice.
* fix: properly restore lost decorations
A weird issue surfaced when a toggle block was erased and then the erase
was undone. It was observed that all the toggle blocks ended up being
collapsed and the one restored by undo had lost the decoration on first
child(which prevents first child from hiding), and, as a result ended up
with all its children hidden.
Here, we collect all dropped decorations in a single array and later add them
back in a single pass.
* fix: we don't yet need and as nodes
* fix: command mapped to `Backspace` key for `ToggleBlock` failed to invoke
It happened because of `Math` node being placed before `ToggleBlock` in
the array of exported nodes, which caused the `Math` node's `Backspace`
handling command to _successfully_ run before `ToggleBlock` node's
`Backspace` handling command. Therefore, moving `ToggleBlock` before
`Math` fixed the issue.
* fix: nested toggle blocks behaving differently than top level ones
It was observed that the decoration which wraps the first child of a
toggle block in a separate DOM wasn't being restored as and when
expected for nested toggle blocks while it worked fine for top level
toggle blocks. The reason was that the `findBlockNodes` skips the nested
blocks in its default behavior, so, passing `descend` as `true` fixed
the issue.
* feat: lift all children up upon backspacing at the start of toggle block
* fix: remove/reapply decorations which get misaligned as a result of doc
change
The decoration which is applied to the first child of toggle block, may
get misaligned and go out of sync with the corresponding decoration on
the toggle block as a result of document changes. Here, we simply remove
*all* the decorations and then reapply to their target i.e, first child of each
toggle block.
We're trading off perf with implementation simplicity here since we
don't actually need to remove all decos, only the misaligned ones.
An alternate solution here might be to map the first child decoration
in accordance with corresponding decoration on the toggle block, such
that the first child deco _never_ goes out of sync with its parent
decoration. As for now, not sure how that could be achieved.
* fix: bring cursor out and set at the end of toggle block head upon folding
* fix: cleanup
* fix: if cursor ends up within the hidden range of toggle block while it is folded, immediately unfold it
* fix: check parentNode
* feat: `prependParagraph` and `splitHead`
* fix: cleanup
* fix: handle `Delete` when the node just after the cursor is a toggle
block
* fix: cleanup
* fix: restrict toggle block head to contain heading or paragraph
Certain behavioral aspects of toggle block are implemented assuming head
to be a heading or paragraph, for simplicity. Makes sense for majority
of use cases but still something presumptuous about user expectation.
Proposition is to lauch it with this restriction and see if the users
actually start requesting otherwise. Till then, this keeps things
simple.
* feat: `Tab` into a toggle block, `Shift-Tab` out of toggle block
As part of this, we've modified handling `Enter` within a toggle block
in a way that prevents it to trigger `liftEmptyBlock`, so that the
cursor remains within the toggle block body and is only taken out of it
when pressing `Shift-Tab` combo.
* fix: Toggle block not unfolding when a node having `block+` content
attempted to `Tab` into it
* feat: beautification
* feat: markdown for `toggle_block`
This declares markdown spec for a toggle block, which enables users to
download a doc containing toggle blocks, as markdown. Also, supports
importing a markdown doc containing markdown corresponding to a toggle
block.
* fix: margins between toggle block contents
* fix: `Action.INIT` for publicly shared and deleted docs
It was observed that decorations weren't initialized for publicly shared
and deleted docs because of init being under the `docChanged` cond. This
change fixes the issue.
* fix: all toggle blocks end up folded when navigated from collection to
doc page
This happened because `{ fold: true }` was forcibly set. This is fixed
by applying decorations in accordance with the fold state fetched from local storage.
* fix: disable overflow being set to scroll on Brave
* fix: cleanup
* fix: prevent joining two toggle blocks when backspaced from the start of
a text block between them
Consider two toggle blocks with a text block between
them. If backspaced from the beginning of the text block, the toggle
block below is joined to the toggle block before along with the text
block, because of https://github.com/ProseMirror/prosemirror-commands/blob/20c7d42ab8b5d8642fb9efc6261b7541c9dc23c2/src/commands.ts#L468-L469. On the contrary, what's desirable is just joining back of the text block, retaining the toggle block below as it is.
* fix: sync collapsed state across browser tabs
* fix: cleanup
* fix: upon unfold, append an empty para if toggle block's body is empty
* fix: unfold upon `Enter` if the toggle block body is empty
* feat: placeholder
* feat: inputRule
* feat: `Mod-Enter` shortcut to toggle
* fix: do not split when body is empty
* fix: do not unfold is head is empty
* fix: assign uuid to newly split toggle block
* feat: list keyboard shortcuts
* fix: replace with `wrapIn`
* fix: `container_toggle_block` -> `container_toggle`
* fix: importing a markdown doc with toggle blocks let to them being created without ids
* fix: pressing `Enter` at the end of list item within toggle block should
create a new list item below
* fix: repeated backspacing from an empty list item within toggle block
* fix: prevent joining back when input rule is matched
* fix: prevent button from shrinking when an image is added under content area
* fix: tsc
* Fixes:
1. Toggle block starts off unfolded when created
2. Trigger `liftEmptyBlock` when a toggle block consists of just an empty head, without any body
3. `Shift-Tab` behavior confuses when all nodes following the cursor position, inclusive of the one holding cursor, are empty. It seems at first, that it should simply outdent except it doesn't, because the node holding cursor isn't the `lastChild` of toggle block.
So, `Shift-Tab` behavior is modified such that all nodes following the cursor, up till the last node of toggle block, should be lifted out of it
* Fixes:
1. Upon pressing Enter, lift out all children of toggle block if cursor lies at the start,
there's no text content
2. Prevent lifting out of an empty block when it's a direct child of a toggle
block
* fix: lint
* fix: placeholder to inform how to exit toggle block
* fix: prevent tables within toggle block from horizontally scrolling
* fix: align toggle block with lists
* fix: push toggle block down if it ends up as the first child of a list item
* fix: don't consider toggle body empty if it consists of an empty table or notice
* fix: CollapsedIcon
* fix: Delete press
* fix: mainly early return when `deleteBarrier` or `joinMaybeClear`
succeed, rest is cleanup
* fix: rename
* fix: simplify commands
* fix: simplify commands
* fix: remove unused commands
* fix: lint
* chore: cleanup `splitBlockPreservingBody`
* chore: `sinkBlockInto` -> `indentBlock` & `liftConsecutiveBlocks` ->
`dedentBlocks`
* fix: cleanup related to `getUtils`
* fix: simplify `bodyIsEmpty`
* fix: no need of separate func
* fix: `bodyIsEmpty` -> `ToggleBlock.isBodyEmpty` && `headIsEmpty` ->
`ToggleBlock.isHeadEmpty`
* fix: cleanup
* fix: move to utils
* fix: update comment
* fix: rename
* fix: update comment
* fix: update comment
* fix: comments
* fix: cleanup
* fix: `splitBlock` was problematic here because it would run for block
nodes other than toggle block. As an example, consider a `blockquote` containing and empty
para. Here, `liftEmptyBlock` should run upon `Enter`, instead
`splitBlock` runs. Same goes for other nodes like task lists. This
commit fixes the issue.
* fix: wrap heading and its children together within toggle block
* trigger ci
* fix: copy for used funcs from sorted-array-functions
* fix: remove pkg
* fix: remove pkg
* fix: rearrage dep
* fix: restore yarn.lock from main branch
* fix: restore yarn.lock from main branch
* feat: triggering toggle block on an already wrapped toggle block should unwrap it
* fix: get rid of `HeadingTracker` in favor of directly querying doc
* fix: headings under toggle blocks weren't tracked in toc
* fix: don't hide the anchor associated with a heading otherwise the heading can't be scrolled to
* fix: unfold toggle block when hidden heading is clicked from toc
* fix: backspacing into an unfolded toggle block should attempt to join with the last node of body
* `Tab` in a selected `embed` within a folded toggle block. Notice that toggle block remains folded. It should be unfolded as the `embed` is pushed inside. Same goes for some other nodes like `math_block`
* Can only `Tab` in and `Shift-Tab` out once when a node of type `attachment|video|hr` is the last node of a toggle block. Beyond once, pressing those keys have no effect.
* fix: Server build
* refactor
* Combine enum
* perf: Merge plugins, avoid multiple appendTransaction
* Remove getUtils
* fix: Default new toggle blocks to closed
* fix: Infinite loop
* refactor: Separate ToggleBlockView
* Centralize class names
* fix: Align nested headings with lists
* fix: Toggle block disclosure different sizes
* fix: Toggle flash when clicking fold button while focus within toggle content
* refactor: Plugin keys
* Exit toggle block when pressing Enter in the last empty paragraph within the body
* Placeholders
* fix: Fallback line-height, font-size for empty title
* fix: Incorrect decoration on title node change
* doc
* fix: Enter in last list item in toggle body exits
* fix: Allow toggling headings in diff viewer
* fix: Toggle button animation on first load
---------
Co-authored-by: Tom Moor <tom@getoutline.com>
* feat: enable commenting on image nodes
* chore: make anchorPlugin a top level plugin
* fix: className
* fix: review
* fix: tsc
* fix: checks
* Tweak menu order to match
---------
Co-authored-by: Tom Moor <tom@getoutline.com>
* Header toggling, resizable columns
* Allow all blocks in table cells, disable column resizing in read-only
* Fixed dynamic scroll shadows
* Refactor, scroll styling
* fix scrolling, tweaks
* fix: Table layout lost on sort
* fix: Caching of grip decorators
* refactor
* stash
* fix first render shadows
* stash
* First add column grip, styles
* Just add column/row click handlers left
* fix: isTableSelected for single cell table
* Refactor mousedown handlers
* fix: 'Add row before' command missing on first row
* fix overflow on rhs
* fix: Error clicking column grip when menu is open
* Hide table controls when printing
* Restore table header background
* fix: Header behavior when adding columns and rows at the edges
* Tweak header styling
* fix: Serialize and parsing of column attributes when copy/pasting
fix: Column width is lost when changing column alignment
Tom Moor