@lexical/selection
This package contains selection helpers for Lexical.
Methods
$cloneContents
Clones the Lexical nodes in the selection, returning a map of Key -> LexicalNode and a list containing the keys
of all direct children of the RootNode. Useful for insertion/transfer operations, such as copy and paste.
export function $cloneContents(
selection: RangeSelection | NodeSelection | GridSelection,
): {
nodeMap: Array<[NodeKey, LexicalNode]>;
range: Array<NodeKey>;
};
getStyleObjectFromCSS
Given a CSS string, returns an object from the style cache.
export function getStyleObjectFromCSS(css: string): {
[key: string]: string;
} | null;
$patchStyleText
Applies the provided styles to the TextNodes in the provided Selection. Key names in the patch argument should be
the valid CSS properties (i.e., kebab-case).
export function $patchStyleText(
selection: RangeSelection | GridSelection,
patch: {
[key: string]: string;
},
): void;
$getSelectionStyleValueForProperty
Given a selection and a valid CSS property name, returns the current value of that property for TextNodes in the Selection, if set. If not set, it returns the defaultValue. If all TextNodes do not have the same value, it returns an empty string.
export function $getSelectionStyleValueForProperty(
selection: RangeSelection,
styleProperty: string,
defaultValue: string,
): string;
$moveCaretSelection
Moves the selection according to the arguments.
export function $moveCaretSelection(
selection: RangeSelection,
isHoldingShift: boolean,
isBackward: boolean,
granularity: 'character' | 'word' | 'lineboundary',
): void;
$isParentElementRTL
Returns true if the parent of the Selection anchor node is in Right-To-Left mode, false if not.
export function $isParentElementRTL(selection: RangeSelection): boolean;
$moveCharacter
Wraps $moveCaretSelection, using character granularity and accounting for RTL mode.
export function $moveCharacter(
selection: RangeSelection,
isHoldingShift: boolean,
isBackward: boolean,
): void;
$selectAll
Expands the current Selection to cover all of the content in the editor.
export function $selectAll(selection: RangeSelection): void;
$wrapLeafNodesInElements
Attempts to wrap all leaf nodes in the Selection in ElementNodes returned from createElement. If wrappingElement is provided, all of the wrapped leaves are appended to the wrappingElement. It attempts to append the resulting sub-tree to the nearest safe insertion target.
export function $wrapLeafNodesInElements(
selection: RangeSelection,
createElement: () => ElementNode,
wrappingElement?: ElementNode,
): void;
$isAtNodeEnd
Returns true if the provided point offset is in the last possible position.
export function $isAtNodeEnd(point: Point): boolean;
$shouldOverrideDefaultCharacterSelection
Returns true if default character selection should be overridden, false if not. Used with DecoratorNodes
export function $shouldOverrideDefaultCharacterSelection(
selection: RangeSelection,
isBackward: boolean,
): boolean;
0.4.0 (September 3, 2022)
Breaking Changes
Renamed isReadOnly API to isEditable
editor.isReadyOnly -> editor.isEditable()
editor.setReadyOnly -> editor.setEditable()
editor.registerReadOnlyListener -> editor.registerEditableListener()
editor config { readOnly: true } -> { editable: boolean }
https://github.com/facebook/lexical/pull/2912
Markdown Transformers Require Dependencies
The "dependencies" property is now required for custom markdown Element and TextMatch Transformers. It takes an array of LexicalNode subclasses and
asserts that they're available in the editor when transforms are registered.
https://github.com/facebook/lexical/pull/2910
Selection Updates when isEditable is false (previous ReadOnly mode)
Lexical will now track and update selection in response to DOM selectionchange events when editor.isEditable is false. This is necessary for enabling some behavior
such as commenting via marks, but may cause other indirect changes such as update listeners firing when they didn't previously.
- Ensure editor states are cloned if read only (#2936) Dominic Gannaway
- Prevent nested editor event duplication (#2935) Dominic Gannaway
- Avoid preventing default for copy events when there is no selection (#2930) Dominic Gannaway
- Non-Editable Mode Playground Improvements (#2927) Acy Watson
- fix: do not import LexicalTypeaheadMenuPlugin from src folder (#2928) Eric Charles
- Change read only mode API to editable mode (#2912) Dominic Gannaway
- Fix typo (#2925) Tjaart van der Walt
- Remove redundant readonly checks. (#2921) Acy Watson
- allow selection in readonly mode (#2920) Acy Watson
- Remove $getEditor (#2919) Dominic Gannaway
- Use window of current default view (#2918) Dominic Gannaway
- Fix bad CSS on content editable container (#2917) Dominic Gannaway
- Ensure we only mutate a non-readonly editor state (#2915) Dominic Gannaway
- Fix failing build (#2916) John Flockton
- Read only validation server (#2899) Dominic Gannaway
- Add serialized node type exports (#2914) Matthew Lin
- Provide markdown plugin node dependencies (#2910) Dominic Gannaway
- Fixed typo (#2908) Heesung Jang
- Add Flow Types for AutoEmbedPlugin and TypeaheadPlugin (#2904) Tyler Bainbridge
- Fix link pasting (#2903) Maksim Horbachevsky
- Attempt transform of NodeSelection to RangeSelection on mouseDown (#2901) Gerard Rovira
- chore: add e2e tests for maxlength plugin (#2478) Adithya Vardhan
- Added sanitizer to FloatingLinkEditor (#2900) Heesung Jang
- Rename website folder (#2902) John Flockton
- remove unnecessary text append (#2898) John Flockton
- Fix Lexical package main entry points (#2897) Dominic Gannaway
- Fix overriding keyboard controls on internal decorator (#2895) Dominic Gannaway
- Allow code highlighting to run without active selection (#2891) Maksim Horbachevsky
- Fix editor content clipping bug (#2890) Dominic Gannaway
- LexicalTypeaheadMenuPlugin - Increase priority for keyboard commands (#2885) Theo Tillberg
- Remove redundant css property (#2888) Adam Kona
- Playground: Fix collab connect/disconnect toggling (#2887) Maksim Horbachevsky
- Improve heuristics around node selection and keyboard navigation (#2884) Dominic Gannaway
- Don't merge history entries from different editors (#2873) Acy Watson
- Exported DEFAULT_TRANSFORMERS array in react LexicalMarkdownShortcutPlugin (#2878) Kevin Ansfield
- Replaced
addTransform
with registerNodeTransform
in transforms doc (#2882) Kevin Ansfield - add example for additional nodes in plugin (#2879) Stefan Huber
- add the corresponding import to react doc (#2881) Stefan Huber
- Fix playground visual styling (#2876) Dominic Gannaway
- chore(deps): bump minimist in /packages/lexical-website-new (#2744) dependabot[bot]
- chore(deps): bump terser from 5.14.1 to 5.14.2 (#2869) dependabot[bot]
- Change linebreak node handling in insertNodes (#2857) Acy Watson
- Add some React Docs (#2858) Acy Watson
- fix delete backward bug (#2870) Dominic Gannaway
- add watch mode for auto-gen doc comments in dev (#2859) Acy Watson
- Update package-lock.json (#2866) ANDRI H.U
- Update package-lock.json (#2865) ANDRI H.U
- Fix issue with emoji (#2853) John Flockton
- Adjust Typeahead Styles (#2846) Tyler Bainbridge
- revert inadvertent change (#2849) Acy Watson
- Fix small type issue (#2847) John Flockton
- Wider (#2848) John Flockton
- Add autogenerated TypeDoc docs (#2837) Acy Watson
- fix: set cursor grab when image can be dragged (#2831) 子瞻 Luci
- fix(lexical-playground): two issues with scrolling-related scenarios (#2724) 子瞻 Luci
- fix: add fallback for code formatting (#2833) Adithya Vardhan
- rename local variables (#2840) Acy Watson
- fix broken links in docs (#2839) Reid Barber
- Fixing grammar on RootNode documentation (#2838) Aaron Freeland
- fix: transfer format and indent info on wrap (#2832) Adithya Vardhan
- fixed getStyleObjectFromRawCSS to handle css values with a colon (#2814) Hayden Warmington
- Add Panel to Display Props for DevTools Nodes (#2803) Will