From 04ae5d9abf70dc4651eb816e7bb0005a44e31eca Mon Sep 17 00:00:00 2001 From: Hans Pagel Date: Mon, 8 Feb 2021 17:49:39 +0100 Subject: [PATCH 1/5] docs: update content --- docs/src/docPages/examples/tables.md | 4 ++++ docs/src/links.yaml | 1 - 2 files changed, 4 insertions(+), 1 deletion(-) diff --git a/docs/src/docPages/examples/tables.md b/docs/src/docPages/examples/tables.md index 43e6420c..491020cf 100644 --- a/docs/src/docPages/examples/tables.md +++ b/docs/src/docPages/examples/tables.md @@ -1,3 +1,7 @@ # Tables +:::pro Commercial use +Using the collaborative editing commercially? [Become a sponsor](/sponsor) to fund its development! +::: + diff --git a/docs/src/links.yaml b/docs/src/links.yaml index 2276dcda..5c806952 100644 --- a/docs/src/links.yaml +++ b/docs/src/links.yaml @@ -51,7 +51,6 @@ link: /guide/styling - title: Accessibility link: /guide/accessibility - type: draft - title: Export content link: /guide/content - title: Collaborative editing From 9c76db6cebb3077b88aad243035988375468ed5c Mon Sep 17 00:00:00 2001 From: Hans Pagel Date: Tue, 9 Feb 2021 22:48:14 +0100 Subject: [PATCH 2/5] Update README.md --- README.md | 4 ++-- 1 file changed, 2 insertions(+), 2 deletions(-) diff --git a/README.md b/README.md index 7283d7a6..11130e89 100644 --- a/README.md +++ b/README.md @@ -33,8 +33,8 @@ To check out some live examples, visit [next.tiptap.dev](https://next.tiptap.dev Please see [CONTRIBUTING](CONTRIBUTING.md) for details. ## Maintainers -- [Philipp Kühn](https://github.com/philippkuehn) (development) -- [Hans Pagel](https://github.com/hanspagel) (documentation) +- [Philipp Kühn](https://github.com/philippkuehn) (developer) +- [Hans Pagel](https://github.com/hanspagel) (maintainer) ## Premium Sponsors - [überdosis](https://ueberdosis.io/) From 90efee562265892d5110db5531501eca319c5e3e Mon Sep 17 00:00:00 2001 From: Hans Pagel Date: Wed, 10 Feb 2021 15:31:02 +0100 Subject: [PATCH 3/5] clean up --- docs/src/docPages/api/extensions/character-count.md | 2 +- docs/src/docPages/api/extensions/font-family.md | 2 +- docs/src/docPages/examples/book.md | 2 +- docs/src/docPages/examples/todo-app.md | 2 +- docs/src/docPages/experiments/color.md | 2 +- docs/src/docPages/experiments/commands.md | 2 +- docs/src/docPages/experiments/embeds.md | 2 +- docs/src/docPages/experiments/linter.md | 2 +- docs/src/docPages/experiments/placeholder.md | 2 +- 9 files changed, 9 insertions(+), 9 deletions(-) diff --git a/docs/src/docPages/api/extensions/character-count.md b/docs/src/docPages/api/extensions/character-count.md index 53d8ea5d..67baec25 100644 --- a/docs/src/docPages/api/extensions/character-count.md +++ b/docs/src/docPages/api/extensions/character-count.md @@ -22,4 +22,4 @@ yarn add @tiptap/extension-character-count [packages/extension-character-count/](https://github.com/ueberdosis/tiptap-next/blob/main/packages/extension-character-count/) ## Usage - + diff --git a/docs/src/docPages/api/extensions/font-family.md b/docs/src/docPages/api/extensions/font-family.md index 4b494a37..15c4817a 100644 --- a/docs/src/docPages/api/extensions/font-family.md +++ b/docs/src/docPages/api/extensions/font-family.md @@ -31,4 +31,4 @@ yarn add @tiptap/extension-text-style @tiptap/extension-font-family [packages/extension-font-family/](https://github.com/ueberdosis/tiptap-next/blob/main/packages/extension-font-family/) ## Usage - + diff --git a/docs/src/docPages/examples/book.md b/docs/src/docPages/examples/book.md index df946aff..df48cfc7 100644 --- a/docs/src/docPages/examples/book.md +++ b/docs/src/docPages/examples/book.md @@ -4,4 +4,4 @@ This demo has 150 paragraphs and more than 13,000 words, check the performance y Most of the processing is needed to check the active state of the buttons for the selection. If you’d like to optimize for really long texts, try to limit these checks in your toolbar. But honestly, we think it’s great already, isn’t it? - + diff --git a/docs/src/docPages/examples/todo-app.md b/docs/src/docPages/examples/todo-app.md index ef46ec77..b9661425 100644 --- a/docs/src/docPages/examples/todo-app.md +++ b/docs/src/docPages/examples/todo-app.md @@ -1,3 +1,3 @@ # Todo App - + diff --git a/docs/src/docPages/experiments/color.md b/docs/src/docPages/experiments/color.md index c828034a..5cc46027 100644 --- a/docs/src/docPages/experiments/color.md +++ b/docs/src/docPages/experiments/color.md @@ -2,4 +2,4 @@ ⚠️ Experiment - + diff --git a/docs/src/docPages/experiments/commands.md b/docs/src/docPages/experiments/commands.md index 62c1593d..f59d82ac 100644 --- a/docs/src/docPages/experiments/commands.md +++ b/docs/src/docPages/experiments/commands.md @@ -2,4 +2,4 @@ ⚠️ Experiment - + diff --git a/docs/src/docPages/experiments/embeds.md b/docs/src/docPages/experiments/embeds.md index 2b3cb3e5..1a55baea 100644 --- a/docs/src/docPages/experiments/embeds.md +++ b/docs/src/docPages/experiments/embeds.md @@ -2,4 +2,4 @@ ⚠️ Experiment - + diff --git a/docs/src/docPages/experiments/linter.md b/docs/src/docPages/experiments/linter.md index 37d083f8..e85aa7de 100644 --- a/docs/src/docPages/experiments/linter.md +++ b/docs/src/docPages/experiments/linter.md @@ -2,4 +2,4 @@ ⚠️ Experiment - + diff --git a/docs/src/docPages/experiments/placeholder.md b/docs/src/docPages/experiments/placeholder.md index fe2e669f..1a802fe4 100644 --- a/docs/src/docPages/experiments/placeholder.md +++ b/docs/src/docPages/experiments/placeholder.md @@ -2,4 +2,4 @@ ⚠️ Experiment - + From 8c3b35d0c0a6653657e3387026437408d6d18e95 Mon Sep 17 00:00:00 2001 From: Hans Pagel Date: Wed, 10 Feb 2021 15:48:20 +0100 Subject: [PATCH 4/5] add details experiment --- .../Experiments/Details/details-summary.ts | 29 ++++++++++ docs/src/demos/Experiments/Details/details.ts | 51 ++++++++++++++++ docs/src/demos/Experiments/Details/index.vue | 58 +++++++++++++++++++ docs/src/docPages/experiments.md | 1 + docs/src/docPages/experiments/details.md | 5 ++ 5 files changed, 144 insertions(+) create mode 100644 docs/src/demos/Experiments/Details/details-summary.ts create mode 100644 docs/src/demos/Experiments/Details/details.ts create mode 100644 docs/src/demos/Experiments/Details/index.vue create mode 100644 docs/src/docPages/experiments/details.md diff --git a/docs/src/demos/Experiments/Details/details-summary.ts b/docs/src/demos/Experiments/Details/details-summary.ts new file mode 100644 index 00000000..1a09a091 --- /dev/null +++ b/docs/src/demos/Experiments/Details/details-summary.ts @@ -0,0 +1,29 @@ +import { Node } from '@tiptap/core' + +export interface DetailsSummaryOptions { + HTMLAttributes: { + [key: string]: any + }, +} + +export default Node.create({ + name: 'detailsSummary', + + content: 'inline*', + + group: 'block', + + defaultOptions: { + HTMLAttributes: {}, + }, + + parseHTML() { + return [{ + tag: 'summary', + }] + }, + + renderHTML() { + return ['summary', 0] + }, +}) diff --git a/docs/src/demos/Experiments/Details/details.ts b/docs/src/demos/Experiments/Details/details.ts new file mode 100644 index 00000000..9627db1e --- /dev/null +++ b/docs/src/demos/Experiments/Details/details.ts @@ -0,0 +1,51 @@ +import { Node, mergeAttributes } from '@tiptap/core' + +export interface DetailsOptions { + HTMLAttributes: { + [key: string]: any + }, +} + +export default Node.create({ + name: 'details', + + content: 'detailsSummary block+', + + group: 'block', + + defaultOptions: { + HTMLAttributes: {}, + }, + + addAttributes() { + return { + open: { + default: true, + parseHTML: element => { + return { + open: element.hasAttribute('open'), + } + }, + renderHTML: attributes => { + if (!attributes.open) { + return null + } + + return { + open: '', + } + }, + }, + } + }, + + parseHTML() { + return [{ + tag: 'details', + }] + }, + + renderHTML({ HTMLAttributes }) { + return ['details', mergeAttributes(this.options.HTMLAttributes, HTMLAttributes), 0] + }, +}) diff --git a/docs/src/demos/Experiments/Details/index.vue b/docs/src/demos/Experiments/Details/index.vue new file mode 100644 index 00000000..37044446 --- /dev/null +++ b/docs/src/demos/Experiments/Details/index.vue @@ -0,0 +1,58 @@ + + + + + diff --git a/docs/src/docPages/experiments.md b/docs/src/docPages/experiments.md index 58c82a69..b19be942 100644 --- a/docs/src/docPages/experiments.md +++ b/docs/src/docPages/experiments.md @@ -9,6 +9,7 @@ Congratulations! You’ve found our playground with a list of experiments. Be aw * [Commands](/experiments/commands) * [Embeds](/experiments/embeds) * [Multiple editors](/experiments/multiple-editors) +* [Details](/experiments/details) ## Waiting for approval * [@tiptap/extension-placeholder](/experiments/placeholder) diff --git a/docs/src/docPages/experiments/details.md b/docs/src/docPages/experiments/details.md new file mode 100644 index 00000000..d0edff0a --- /dev/null +++ b/docs/src/docPages/experiments/details.md @@ -0,0 +1,5 @@ +# Details + +⚠️ Experiment + + From de234adb8be88ae48bbd3240b9bca13f8c0bb17c Mon Sep 17 00:00:00 2001 From: Hans Pagel Date: Wed, 10 Feb 2021 16:37:00 +0100 Subject: [PATCH 5/5] add node view to details experiment --- .../Experiments/Details/details-summary.ts | 2 +- docs/src/demos/Experiments/Details/details.ts | 54 ++++++++++++++++++- 2 files changed, 54 insertions(+), 2 deletions(-) diff --git a/docs/src/demos/Experiments/Details/details-summary.ts b/docs/src/demos/Experiments/Details/details-summary.ts index 1a09a091..03feeb49 100644 --- a/docs/src/demos/Experiments/Details/details-summary.ts +++ b/docs/src/demos/Experiments/Details/details-summary.ts @@ -11,7 +11,7 @@ export default Node.create({ content: 'inline*', - group: 'block', + // group: 'block', defaultOptions: { HTMLAttributes: {}, diff --git a/docs/src/demos/Experiments/Details/details.ts b/docs/src/demos/Experiments/Details/details.ts index 9627db1e..32103ccb 100644 --- a/docs/src/demos/Experiments/Details/details.ts +++ b/docs/src/demos/Experiments/Details/details.ts @@ -32,7 +32,7 @@ export default Node.create({ } return { - open: '', + open: 'open', } }, }, @@ -48,4 +48,56 @@ export default Node.create({ renderHTML({ HTMLAttributes }) { return ['details', mergeAttributes(this.options.HTMLAttributes, HTMLAttributes), 0] }, + + addNodeView() { + return ({ + node, + HTMLAttributes, + getPos, + editor, + }) => { + const { view } = editor + const item = document.createElement('details') + + item.addEventListener('click', event => { + // @ts-ignore + const { open } = event.target.parentElement as HTMLElement + // @ts-ignore + const { localName } = event.target + + if (typeof getPos === 'function' && localName === 'summary') { + view.dispatch(view.state.tr.setNodeMarkup(getPos(), undefined, { + open: !open, + })) + editor.commands.focus() + } + }) + + if (node.attrs.open) { + item.setAttribute('open', 'open') + } + + Object.entries(HTMLAttributes).forEach(([key, value]) => { + item.setAttribute(key, value) + }) + + return { + dom: item, + contentDOM: item, + update: updatedNode => { + if (updatedNode.type !== this.type) { + return false + } + + if (updatedNode.attrs.open) { + item.setAttribute('open', 'open') + } else { + item.removeAttribute('open') + } + + return true + }, + } + } + }, })