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

add table of content support

Browse Source
This commit is contained in:
Hans Pagel
2020-09-27 10:29:01 +02:00
parent bcef08ce2a
commit 149ce56ad8
18 changed files with 66 additions and 19 deletions
Download Patch File Download Diff File Expand all files Collapse all files

1
docs/gridsome.config.js
View File

@@ -25,6 +25,7 @@ module.exports = {
plugins: [
'@gridsome/remark-prismjs',
'remark-container',
'remark-toc',
],
remark: {
autolinkHeadings: {

1
docs/package.json
View File

@@ -20,6 +20,7 @@
"react": "^16.13.1",
"react-dom": "^16.13.1",
"remark-container": "^0.1.2",
"remark-toc": "^7.0.0",
"typescript": "^4.0.3",
"vue-github-button": "^1.1.2",
"y-indexeddb": "^9.0.5",

0
docs/src/demos/General/Installation/index.vue → docs/src/demos/Overview/Installation/index.vue
View File

2
docs/src/docPages/api/editor.md
View File

@@ -1,6 +1,8 @@
# Editor
This class is a central building block of tiptap. It does most of the heavy lifting of creating a working [ProseMirror](https://ProseMirror.net/) editor such as creating the [`EditorView`](https://ProseMirror.net/docs/ref/#view.EditorView), setting the initial [`EditorState`](https://ProseMirror.net/docs/ref/#state.Editor_State) and so on.
## Table of Contents
## Configuration
| Setting | Type | Default | Description |
| ------------------ | --------------- | ----------- | ----------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- |

2
docs/src/docPages/api/events.md
View File

@@ -1,6 +1,8 @@
# Events
The editor fires a few different events that you can hook into. There are two ways to register event listeners:
## Table of Contents
## Option 1: Right-away
You can define your event listeners on a new editor instance right-away:

2
docs/src/docPages/api/extensions.md
View File

@@ -1,6 +1,8 @@
# Extensions
Extensions are the way to add functionality to tiptap. By default tiptap comes bare, without any of them, but we have a long list of extensions that are ready to be used with tiptap.
## Table of Contents
## A minimalist set of extensions
You’ll need at least three extensions: `Document`, `Paragraph` and `Text`. See [an example of a tiptap version for minimalists](/examples/minimalist).

2
docs/src/docPages/api/keyboard-shortcuts.md
View File

@@ -7,6 +7,8 @@ Modifiers can be given in any order. `Shift`, `Alt`, `Control` and `Cmd` are rec
You can use `Mod` as a shorthand for `Cmd` on Mac and `Control` on other platforms.
## Table of Contents
## Overwrite keyboard shortcuts
```js

2
docs/src/docPages/api/schema.md
View File

@@ -5,6 +5,8 @@ This schema is *very* strict. You can’t use any HTML element or attribute that
Let me give you one example: If you paste something like `This is <strong>important</strong>` into tiptap, don’t have any extension that handles `strong` tags registered, you’ll only see `This is important` – without the strong tags.
## Table of Contents
## How a schema looks like
The most simple schema for a typical *ProseMirror* editor is looking something like that:

6
docs/src/docPages/guide/build-your-editor.md
View File

@@ -1,9 +1,9 @@
# Configuration
In its simplest version tiptap comes very raw. There is no menu, no buttons, no styling. That’s intended. See tiptap as your building blocks to build exactly the editor you would like to have.
## Adding a menu
## Table of Contents
## Adding a menu
Let’s start to add your first button to the editor. Once initiated the editor has a powerful API. The so called *commands* allow you to modify selected text (and tons of other things). Here is an example with one single button:
<demo name="SimpleMenuBar" highlight="5-11" />
@@ -13,11 +13,9 @@ To mark selected text bold we can use `this.editor.bold`. There a ton of other c
You might wonder what features tiptap supports out of the box. In the above example we added the `@tiptap/starter-kit`. That already includes support for paragraphs, text, bold, italic, inline code and code blocks. There are a lot more, but you have to explicitly import them. You will learn how that works in the next example.
### Related Links
* [List of available commands](/api/commands)
## Configure extensions
You are free to choose which parts of tiptap you want to use. Tiptap has support for different nodes (paragraphs, blockquotes, tables and many more) and different marks (bold, italic, links). If you want to explicitly configure what kind of nodes and marks are allowed and which are not allowed, you can configure those.
Note that `Document`, `Paragraph` and `Text` are required. Otherwise you won’t be able to add any plain text.

4
docs/src/docPages/guide/configuration.md
View File

@@ -1,9 +1,9 @@
# Configuration
tiptap is all about customization. There are a ton of options to configure the behavior and functionality of the editor. Most of those settings can be set before creating the Editor. Give tiptap a JSON with all the settings you would like to overwrite.
## Overwrite the default settings
## Table of Contents
## Overwrite the default settings
See an example with `autoFocus: true` here:
```js

2
docs/src/docPages/guide/custom-extensions.md
View File

@@ -1,6 +1,8 @@
# Custom Extensions
Let’s extend tiptap with a custom extension!
## Table of Contents
## Option 1: Change defaults
Let’s say you want to change the keyboard shortcuts for the bullet list. You should start by looking at [the source code of the `BulletList` extension](https://github.com/ueberdosis/tiptap-next/blob/main/packages/extension-bullet-list/index.ts) and find the default you’d like to change. In that case, the keyboard shortcut, and just that.

2
docs/src/docPages/guide/custom-styling.md
View File

@@ -1,6 +1,8 @@
# Custom styling
Tiptap is renderless, that doesn’t mean there is no styling provided. You can decided how your editor should look like.
## Table of Contents
## Option 1: Style the plain HTML
The whole editor is rendered inside of a container with the class `.ProseMirror`. You can use that to scope your styling to the editor content:

5
docs/src/docPages/guide/getting-started.md
View File

@@ -1,9 +1,9 @@
# Getting started
tiptap is framework-agnostic and works with Vue.js and React. It even works with plain JavaScript, if that’s your thing. To keep everything as small as possible, we put the code to use tiptap with those frameworks in different packages.
## 1. Install the dependencies
## Table of Contents
## 1. Install the dependencies
We assume you already have a [Vue.js](https://cli.vuejs.org/) (or [Nuxt.js](https://nuxtjs.org/)) project. To connect tiptap with Vue.js you are going to need an adapter. You can install tiptap for Vue.js as a dependency in your project:
```bash
@@ -17,7 +17,6 @@ yarn add @tiptap/vue @tiptap/vue-starter-kit
The `@tiptap/vue-starter-kit` includes a few basics you would probably need anyway. Cool, you have got everything in place to set up tiptap! 🙌
## 2. Create a new component
Create a new Vue component (you can call it `<Tiptap />`) and add the following content. This is the fastest way to get tiptap up and running with Vue.js. It will give you a very basic version of tiptap, without any buttons. No worries, you will be able to add more functionality soon.
<demo name="Guide/GettingStarted" />

6
docs/src/docPages/overview/contributing.md
View File

@@ -1,20 +1,18 @@
# Contributing
Tiptap would be nothing without its lively community. Contributions have always been and will always be welcome. Here is a little bit you should know, before you send your contribution:
## Examples
## Table of Contents
## Examples
* Improved documentation, e. g. fixing typos, new sections, further explanation …)
* New features for existing extensions, e. g. a new option
* New extensions, which don’t require changes to the core or other core extensions
* Well explained, non-breaking changes to the core
## Code style
There is a eslint config, that ensures a consistent code style. To check for errors, run `$ yarn run lint`. That’ll be checked when you send a pull request. Make sure it’s passing, before sending a pull request.
## Testing
All your pull requests will automatically run all our existing tests. Make sure that they all pass. Run all tests locally with `$ yarn run test` or run single tests (e. g. when writing new ones) with `$ yarn run test:open`.
Any further questions? Create a new issue or discussion in the repository. We’ll get back to you.

4
docs/src/docPages/overview/installation.md
View File

@@ -1,6 +1,8 @@
# Installation
You’re free to use tiptap with the framework of your choice. Depending on what you want to do, there are a few different ways to install tiptap in your project. Choose the way that fits your workflow.
## Table of Contents
## Option 1: Vanilla JavaScript
Use tiptap with vanilla JavaScript for a very lightweight and raw experience. If you feel like it, you can even use it to connect tiptap with other frameworks not mentioned here.
@@ -49,7 +51,7 @@ yarn add @tiptap/core @tiptap/vue @tiptap/vue-starter-kit
Create a new component and add the following content to get a basic version of tiptap:
<demo name="General/Installation" />
<demo name="Overview/Installation" />
<!-- ## Option 3: CodeSandbox

2
docs/src/docPages/overview/upgrade-guide.md
View File

@@ -1,5 +1,7 @@
# Upgrade Guide
## Table of Contents
## Reasons to upgrade to tiptap 2.x
Yes, it’s tedious work to upgrade your favorite text editor to a new API, but we made sure you’ve got enough reasons to upgrade to the newest version

6
docs/src/layouts/App/base.scss
View File

@@ -116,4 +116,8 @@ blockquote {
hr {
margin: 1rem 0;
}
}
}
#table-of-contents {
display: none;
}

36
yarn.lock
View File

@@ -2245,6 +2245,13 @@
resolved "https://registry.yarnpkg.com/@types/json5/-/json5-0.0.29.tgz#ee28707ae94e11d2b827bcbe5270bcea7f3e71ee"
integrity sha1-7ihweulOEdK4J7y+UnC86n8+ce4=
"@types/mdast@^3.0.3":
version "3.0.3"
resolved "https://registry.yarnpkg.com/@types/mdast/-/mdast-3.0.3.tgz#2d7d671b1cd1ea3deb306ea75036c2a0407d2deb"
integrity sha512-SXPBMnFVQg1s00dlMCc/jCdvPqdE4mXaMMCeRlxLDmTAEoegHT53xKtkDnzDTOcmMHUfcjyf36/YYZ6SxRdnsw==
dependencies:
"@types/unist" "*"
"@types/minimatch@*":
version "3.0.3"
resolved "https://registry.yarnpkg.com/@types/minimatch/-/minimatch-3.0.3.tgz#3dca0e3f33b200fc7d1139c0cd96c1268cadfd9d"
@@ -2417,7 +2424,7 @@
resolved "https://registry.yarnpkg.com/@types/tough-cookie/-/tough-cookie-4.0.0.tgz#fef1904e4668b6e5ecee60c52cc6a078ffa6697d"
integrity sha512-I99sngh224D0M7XgW1s120zxCt3VYQ3IQsuw3P3jbq5GG4yc79+ZjyKznyOGIQrflfylLgcfekeZW/vk0yng6A==
"@types/unist@*", "@types/unist@^2.0.0", "@types/unist@^2.0.2":
"@types/unist@*", "@types/unist@^2.0.0", "@types/unist@^2.0.2", "@types/unist@^2.0.3":
version "2.0.3"
resolved "https://registry.yarnpkg.com/@types/unist/-/unist-2.0.3.tgz#9c088679876f374eb5983f150d4787aa6fb32d7e"
integrity sha512-FvUupuM3rlRsRtCN+fDudtmytGO6iHJuuRKS1Ss0pG5z8oX0diNEw94UEL7hgDbpN94rgaK5R7sWm6RrSkZuAQ==
@@ -6735,7 +6742,7 @@ github-from-package@0.0.0:
resolved "https://registry.yarnpkg.com/github-from-package/-/github-from-package-0.0.0.tgz#97fb5d96bfde8973313f20e8288ef9a167fa64ce"
integrity sha1-l/tdlr/eiXMxPyDoKI75oWf6ZM4=
github-slugger@^1.0.0:
github-slugger@^1.0.0, github-slugger@^1.2.1:
version "1.3.0"
resolved "https://registry.yarnpkg.com/github-slugger/-/github-slugger-1.3.0.tgz#9bd0a95c5efdfc46005e82a906ef8e2a059124c9"
integrity sha512-gwJScWVNhFYSRDvURk/8yhcFBee6aFjye2a7Lhb2bUyRulpIoek9p0I9Kt7PT67d/nUlZbFu8L9RLiA0woQN8Q==
@@ -9136,11 +9143,24 @@ mdast-util-to-hast@^4.0.0:
unist-util-visit "^1.1.0"
xtend "^4.0.1"
mdast-util-to-string@^1.0.0:
mdast-util-to-string@^1.0.0, mdast-util-to-string@^1.0.5:
version "1.1.0"
resolved "https://registry.yarnpkg.com/mdast-util-to-string/-/mdast-util-to-string-1.1.0.tgz#27055500103f51637bd07d01da01eb1967a43527"
integrity sha512-jVU0Nr2B9X3MU4tSK7JP1CMkSvOj7X5l/GboG1tKRw52lLF1x2Ju92Ms9tNetCcbfX3hzlM73zYo2NKkWSfF/A==
mdast-util-toc@^5.0.0:
version "5.0.3"
resolved "https://registry.yarnpkg.com/mdast-util-toc/-/mdast-util-toc-5.0.3.tgz#5fb1503e3655688929d596799a6910cc6548e420"
integrity sha512-A3xzcgC1XFHK0+abFmbINOxjwo7Bi0Nsfp3yTgTy5JHo2q2V6YZ5BVJreDWoK3szcLlSMvHqe8WPbjY50wAkow==
dependencies:
"@types/mdast" "^3.0.3"
"@types/unist" "^2.0.3"
extend "^3.0.2"
github-slugger "^1.2.1"
mdast-util-to-string "^1.0.5"
unist-util-is "^4.0.0"
unist-util-visit "^2.0.0"
mdn-data@2.0.4:
version "2.0.4"
resolved "https://registry.yarnpkg.com/mdn-data/-/mdn-data-2.0.4.tgz#699b3c38ac6f1d728091a64650b65d388502fd5b"
@@ -11929,6 +11949,14 @@ remark-squeeze-paragraphs@^3.0.2:
dependencies:
mdast-squeeze-paragraphs "^3.0.0"
remark-toc@^7.0.0:
version "7.0.0"
resolved "https://registry.yarnpkg.com/remark-toc/-/remark-toc-7.0.0.tgz#d0f455b63fed00cccfe08050d75c2abef4508e38"
integrity sha512-NyW/W7ttlj003eFXeIgq7eV2bffTQuO48PyC9zbh/RhTA/QaHJOAgJ4qvaRwKAVMWSBIh4W/5nZFWQ4rceV3fw==
dependencies:
"@types/unist" "^2.0.3"
mdast-util-toc "^5.0.0"
remove-trailing-separator@^1.0.1:
version "1.1.0"
resolved "https://registry.yarnpkg.com/remove-trailing-separator/-/remove-trailing-separator-1.1.0.tgz#c24bce2a283adad5bc3f58e0d48249b92379d8ef"
@@ -14027,7 +14055,7 @@ unist-util-visit@^1.0.0, unist-util-visit@^1.0.1, unist-util-visit@^1.1.0, unist
dependencies:
unist-util-visit-parents "^2.0.0"
unist-util-visit@^2.0.1:
unist-util-visit@^2.0.0, unist-util-visit@^2.0.1:
version "2.0.3"
resolved "https://registry.yarnpkg.com/unist-util-visit/-/unist-util-visit-2.0.3.tgz#c3703893146df47203bb8a9795af47d7b971208c"
integrity sha512-iJ4/RczbJMkD0712mGktuGpm/U4By4FfDonL7N/9tATGIF4imikjOuagyMY53tnZq3NP6BcmlrHhEKAfGWjh7Q==