ianhitchman/tiptap
1
0
Fork 0
Code Issues Pull Requests Actions 1 Packages Projects Releases Wiki Activity

refactoring

Browse Source
This commit is contained in:
Hans Pagel
2021-02-05 18:13:51 +01:00
parent 07b2ea94be
commit 1c468b4542
2 changed files with 10 additions and 22 deletions
Download Patch File Download Diff File Expand all files Collapse all files

8
docs/src/docPages/api/extensions/focus.md
View File

@@ -16,10 +16,10 @@ yarn add @tiptap/extension-focus
``` ```
## Settings ## Settings
| Option | Type | Default | Description | | Option | Type | Default | Description |
| --------- | --------- | ------------- | ------------------------------------------------------ | | --------- | -------- | ------------- | ---------------------------------------------------------------------------- |
| className | `String` | `'has-focus'` | The class that is applied to the focused element. | | className | `String` | `'has-focus'` | The class that is applied to the focused element. |
| nested | `Boolean` | `false` | When enabled nested elements get the focus class, too. | | mode | `String` | `'all'` | Apply the class to `'all'`, the `'shallowest'` or the `'deepest'` node only. |
## Source code ## Source code
[packages/extension-focus/](https://github.com/ueberdosis/tiptap-next/blob/main/packages/extension-focus/) [packages/extension-focus/](https://github.com/ueberdosis/tiptap-next/blob/main/packages/extension-focus/)

24
packages/extension-focus/src/focus.ts
View File

@@ -4,9 +4,7 @@ import { DecorationSet, Decoration } from 'prosemirror-view'
export interface FocusOptions { export interface FocusOptions {
className: string, className: string,
start: 'deep' | 'shallow', mode: 'all' | 'deepest' | 'shallowest',
exact: boolean,
// levels: 'all' | number,
} }
export const FocusClasses = Extension.create({ export const FocusClasses = Extension.create({
@@ -14,9 +12,7 @@ export const FocusClasses = Extension.create({
defaultOptions: <FocusOptions>{ defaultOptions: <FocusOptions>{
className: 'has-focus', className: 'has-focus',
start: 'deep', mode: 'all',
exact: false,
// levels: 'all',
}, },
addProseMirrorPlugins() { addProseMirrorPlugins() {
@@ -35,7 +31,7 @@ export const FocusClasses = Extension.create({
// Maximum Levels // Maximum Levels
let maxLevels = 0 let maxLevels = 0
if (this.options.start === 'deep') { if (this.options.mode === 'deepest') {
doc.descendants((node, pos) => { doc.descendants((node, pos) => {
if (node.isText) { if (node.isText) {
return return
@@ -64,19 +60,11 @@ export const FocusClasses = Extension.create({
currentLevel += 1 currentLevel += 1
// const outOfScope = typeof this.options.levels === 'number' const outOfScope = (this.options.mode === 'deepest' && maxLevels - currentLevel > 0)
// && ( || (this.options.mode === 'shallowest' && currentLevel > 1)
// (this.options.start === 'deep' && maxLevels - currentLevel > this.options.levels)
// || (this.options.start === 'shallow' && currentLevel > this.options.levels)
// )
const outOfScope = this.options.exact
&& (
(this.options.start === 'deep' && maxLevels - currentLevel !== 0)
|| (this.options.start === 'shallow' && currentLevel > 1)
)
if (outOfScope) { if (outOfScope) {
return this.options.start === 'deep' return this.options.mode === 'deepest'
} }
decorations.push(Decoration.node(pos, pos + node.nodeSize, { decorations.push(Decoration.node(pos, pos + node.nodeSize, {