mirror of
https://github.com/ueberdosis/tiptap.git
synced 2025-01-18 06:03:22 +08:00
add redirects (easypeasy)
This commit is contained in:
parent
956f2b184a
commit
7468677614
@ -15,15 +15,15 @@ editor.bold()
|
||||
While that’s perfectly fine and does make the selected bold, you’d likely want to change multiple commands in one run. Let’s have a look at how that works.
|
||||
|
||||
### Chain commands
|
||||
Most commands can be executed combined to one call. First of all, that’s shorter than separate function call in most cases. Here is an example to make the selected text bold:
|
||||
Most commands can be combined to one call. That’s shorter than separate function calls in most cases. Here is an example to make the selected text bold:
|
||||
|
||||
```js
|
||||
editor.chain().bold().focus().run()
|
||||
```
|
||||
|
||||
The `.chain()` is required to start a new chain and the `.run()` is needed to actually execute all the commands in between. Between those two functions, this example combines to different commands.
|
||||
The `.chain()` is required to start a new chain and the `.run()` is needed to actually execute all the commands in between.
|
||||
|
||||
When a user clicks on a button outside of the content, the editor isn’t in focus anymore. That’s why you probably want to add a `.focus()` call to most of your commands, that brings back the focus to the editor and the user can continue to type.
|
||||
In the example above two different commands are executed at once. When a user clicks on a button outside of the content, the editor isn’t in focus anymore. That’s why you probably want to add a `.focus()` call to most of your commands. It brings back the focus to the editor, so the user can continue to type.
|
||||
|
||||
All chained commands are kind of queued up. They are combined to one single transaction. That means, the content is only updated once, also the `update` event is only triggered once.
|
||||
|
||||
|
@ -1,3 +0,0 @@
|
||||
# Examples
|
||||
|
||||
TODO: This page should redirect to [/examples/basic](/examples/basic).
|
@ -1,26 +0,0 @@
|
||||
# Monthly reports
|
||||
|
||||
## October 2020
|
||||
* Writing extensions for tiptap 2
|
||||
* 25 sponsors, $423/month
|
||||
* 102 hours, $7,140 development costs (at $70/hour)
|
||||
* Sponsored @calebporzio with $99
|
||||
* **Total -$6,816**
|
||||
|
||||
## September 2020
|
||||
* Developing the API of tiptap 2, writing the documentation
|
||||
* 125 hours, $8,750 development costs (at $70/hour)
|
||||
* Sponsored @calebporzio with $99
|
||||
* **Total -$8,849**
|
||||
|
||||
## August 2020
|
||||
* Setting up tiptap 2
|
||||
* 56 hours, $3,920 development costs (at $70/hour)
|
||||
* Sponsored @calebporzio with $99
|
||||
* **Total -$4,019**
|
||||
|
||||
## All time
|
||||
|
||||
* **Total -$19.684**
|
||||
|
||||
|
6
docs/src/docPages/open/2020-08.md
Normal file
6
docs/src/docPages/open/2020-08.md
Normal file
@ -0,0 +1,6 @@
|
||||
# August 2020
|
||||
* Setting up tiptap 2
|
||||
* 56 hours, $3,920 development costs (at $70/hour)
|
||||
* Sponsored @calebporzio with $99
|
||||
* **Total -$4,019**
|
||||
|
5
docs/src/docPages/open/2020-09.md
Normal file
5
docs/src/docPages/open/2020-09.md
Normal file
@ -0,0 +1,5 @@
|
||||
# September 2020
|
||||
* Developing the API of tiptap 2, writing the documentation
|
||||
* 125 hours, $8,750 development costs (at $70/hour)
|
||||
* Sponsored @calebporzio with $99
|
||||
* **Total -$8,849**
|
6
docs/src/docPages/open/2020-10.md
Normal file
6
docs/src/docPages/open/2020-10.md
Normal file
@ -0,0 +1,6 @@
|
||||
# October 2020
|
||||
* Writing extensions for tiptap 2
|
||||
* 25 sponsors, $423/month
|
||||
* 102 hours, $7,140 development costs (at $70/hour)
|
||||
* Sponsored @calebporzio with $99
|
||||
* **Total -$6,816**
|
@ -12,10 +12,20 @@ tiptap would be nothing without its lively community. Contributions have always
|
||||
* New extensions, which don’t require changes to the core or other core extensions
|
||||
* Well explained, non-breaking changes to the core
|
||||
|
||||
## Set up the development environment
|
||||
It’s not too hard to tinker around with the offical repository. You’ll need [Git](https://github.com/git-guides/install-git), [Node](https://nodejs.org/en/download/) and [Yarn](https://classic.yarnpkg.com/en/docs/install/#mac-stable) installed. Here is what you need to do then:
|
||||
|
||||
1. Copy the code to your local machine: `$ git clone git@github.com:ueberdosis/tiptap-next.git`
|
||||
2. Install dependencies: `$ yarn install`
|
||||
3. Start the development environment: `$ yarn start`
|
||||
4. Open http://localhost:3000 in your favorite browser.
|
||||
5. Start playing around!
|
||||
|
||||
## Our code style
|
||||
There is an 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, too. Make sure it’s passing, before sending a pull request.
|
||||
|
||||
## Testing for errors
|
||||
Your pull request will automatically execute all our existing tests. Make sure that they all pass, before sending a pull request. Run all tests locally with `$ yarn run test` or run single tests (e. g. when writing new ones) with `$ yarn run test:open`.
|
||||
|
||||
## Futher questions
|
||||
Any further questions? Create a new issue or discussion in the repository. We’ll get back to you.
|
||||
|
@ -15,7 +15,9 @@ Yes, it’s tedious work to upgrade your favorite text editor to a new API, but
|
||||
The new API will look pretty familiar too you, but there are a ton of changes though. To make the upgrade a little bit easier, here is everything you need to know:
|
||||
|
||||
### Upgrade to Vue.js 3
|
||||
…
|
||||
:::warning Work in progress
|
||||
We’re waiting for Gridsome to be compatible with Vue.js 3.
|
||||
:::
|
||||
|
||||
### Explicitly register the Document, Text and Paragraph extensions
|
||||
tiptap 1 tried to hide a few required extensions from you with the default setting `useBuiltInExtensions: true`. That setting has been removed and you’re required to import all extensions. Be sure to explicitly import at least the [Document](/api/nodes/document), [Paragraph](/api/nodes/paragraph) and [Text](/api/nodes/text) extensions.
|
||||
@ -71,7 +73,7 @@ const CustomExtension = createNode({
|
||||
})
|
||||
```
|
||||
|
||||
Don’t forget to call `create()` in the end! Read more about [all the nifty details building custom extensions](/guide/build-custom-extensions) in our guide.
|
||||
Read more about [all the nifty details building custom extensions](/guide/build-custom-extensions) in our guide.
|
||||
|
||||
### Renamed API methods
|
||||
[We renamed a lot of commands](/api/commands), hopefully you can migrate to the new API with search & replace. Here is a list of what changed:
|
||||
@ -81,12 +83,29 @@ Don’t forget to call `create()` in the end! Read more about [all the nifty det
|
||||
| ~~`…`~~ | `…` |
|
||||
|
||||
### Commands can be chained now
|
||||
Most commands can be combined to one call now. That’s shorter than separate function calls in most cases. Here is an example to make the selected text bold:
|
||||
|
||||
…
|
||||
```js
|
||||
editor.chain().bold().focus().run()
|
||||
```
|
||||
|
||||
The `.chain()` is required to start a new chain and the `.run()` is needed to actually execute all the commands in between. Read more about [the new tiptap commands](/api/commands) in our API documentation.
|
||||
|
||||
### .focus() isn’t called on every command anymore
|
||||
We tried to hide the `.focus()` command from you with tiptap 1 and executed that on every other command. That led to issues in specific use cases, where you want to run a command, but don’t want to focus the editor. With tiptap 2.x you have to explicitly call the `focus()` and you probably want to do that in a lot of places. Here is an example:
|
||||
We tried to hide the `.focus()` command from you with tiptap 1 and executed that on every command. That led to issues in specific use cases, where you want to run a command, but don’t want to focus the editor.
|
||||
|
||||
With tiptap 2.x you have to explicitly call the `focus()` and you probably want to do that in a lot of places. Here is an example:
|
||||
|
||||
```js
|
||||
editor.chain().focus().bold().run()
|
||||
```
|
||||
|
||||
### Collaborative editing
|
||||
The reference implementation for collaborative editing uses Y.js now. That’s a whole different thing. You still can use the tiptap 1 extension, but it’s up to you to adapt it to the new extension API. If you’ve done this, don’t forget to share it with us so we can link to it from here!
|
||||
|
||||
Read more about [the new collaborative editing experience](/guide/collaborative-editing) in our guide.
|
||||
|
||||
### Become a sponsor
|
||||
tiptap wouldn’t exist without the funding of its community. If you fell in love with tiptap, don’t forget to [become a sponsor](/sponsor) and make the [maintenance, development and support](/open) sustainable.
|
||||
|
||||
In exchange, we’ll take you into our hearts, invite you to private repositories, add a `sponsor 💖` label to your issues and pull requests and more.
|
||||
|
@ -1,78 +1,4 @@
|
||||
<template>
|
||||
<!-- <div class="app">
|
||||
<header class="app__header">
|
||||
<div class="app__header-inner">
|
||||
<g-link class="app__logo" to="/">
|
||||
{{ $static.metadata.siteName }}
|
||||
</g-link>
|
||||
<div>
|
||||
<input class="search" type="search" placeholder="Search">
|
||||
<a href="https://github.com/sponsors/ueberdosis">
|
||||
Sponsor
|
||||
</a>
|
||||
<github-button
|
||||
href="https://github.com/ueberdosis/tiptap"
|
||||
data-show-count="true"
|
||||
aria-label="Star ueberdosis/tiptap on GitHub"
|
||||
/>
|
||||
<button
|
||||
class="app__menu-icon"
|
||||
@click="menuIsVisible = true"
|
||||
v-if="!menuIsVisible"
|
||||
>
|
||||
<icon name="menu" />
|
||||
</button>
|
||||
<button
|
||||
class="app__close-icon"
|
||||
@click="menuIsVisible = false"
|
||||
v-if="menuIsVisible"
|
||||
>
|
||||
<icon name="close" />
|
||||
</button>
|
||||
</div>
|
||||
</div>
|
||||
</header>
|
||||
<div class="app__content">
|
||||
<div class="app__sidebar-wrapper" :class="{ 'is-mobile-visible': menuIsVisible }">
|
||||
<nav class="app__sidebar">
|
||||
<div class="app__link-group" v-for="(linkGroup, i) in linkGroups" :key="i">
|
||||
<div class="app__link-group-title">
|
||||
{{ linkGroup.title }}
|
||||
</div>
|
||||
<ul class="app__link-list">
|
||||
<li v-for="(item, j) in linkGroup.items" :key="j">
|
||||
<g-link :class="{ 'app__link': true, 'app__link--draft': item.draft === true, 'app__link--with-children': item.items }" :to="item.link" :exact="item.link === '/'">
|
||||
{{ item.title }}
|
||||
</g-link>
|
||||
|
||||
<ul v-if="item.items" class="app__link-list">
|
||||
<li v-for="(item, k) in item.items" :key="k">
|
||||
<g-link :class="{ 'app__link': true, 'app__link--draft': item.draft === true }" :to="item.link" exact>
|
||||
{{ item.title }}
|
||||
</g-link>
|
||||
</li>
|
||||
</ul>
|
||||
</li>
|
||||
</ul>
|
||||
</div>
|
||||
</nav>
|
||||
</div>
|
||||
<main class="app__main">
|
||||
<slot />
|
||||
<p>
|
||||
<br>
|
||||
<a :href="editLink" target="_blank">
|
||||
<span>Edit this page on GitHub</span>
|
||||
</a>
|
||||
</p>
|
||||
<p>
|
||||
Made with 🖤 by <a href="https://twitter.com/_ueberdosis">überdosis</a>
|
||||
</p>
|
||||
<page-navigation />
|
||||
</main>
|
||||
</div>
|
||||
</div> -->
|
||||
|
||||
<div class="app">
|
||||
<div class="app__sidebar">
|
||||
<div class="app__title">
|
||||
@ -156,13 +82,35 @@
|
||||
</div>
|
||||
<ul class="app__link-list">
|
||||
<li v-for="(item, j) in linkGroup.items" :key="j">
|
||||
<g-link :class="{ 'app__link': true, 'app__link--draft': item.draft === true, 'app__link--premium': item.premium === true, 'app__link--with-children': item.items }" :to="item.link" :exact="item.link === '/'">
|
||||
<g-link
|
||||
:class="{
|
||||
'app__link': true,
|
||||
'app__link--exact': $router.currentRoute.path === item.link,
|
||||
'app__link--active': $router.currentRoute.path.startsWith(item.link),
|
||||
'app__link--draft': item.draft === true,
|
||||
'app__link--pro': item.pro === true,
|
||||
'app__link--new': item.new === true,
|
||||
'app__link--with-children': !!item.items
|
||||
}"
|
||||
:to="item.redirect || item.link"
|
||||
>
|
||||
{{ item.title }}
|
||||
</g-link>
|
||||
|
||||
<ul v-if="item.items" class="app__link-list">
|
||||
<li v-for="(item, k) in item.items" :key="k">
|
||||
<g-link :class="{ 'app__link': true, 'app__link--draft': item.draft === true, 'app__link--premium': item.premium === true }" :to="item.link" exact>
|
||||
<g-link
|
||||
:class="{
|
||||
'app__link': true,
|
||||
'app__link--exact': $router.currentRoute.path === item.link,
|
||||
'app__link--active': $router.currentRoute.path.startsWith(item.link),
|
||||
'app__link--draft': item.draft === true,
|
||||
'app__link--pro': item.pro === true,
|
||||
'app__link--new': item.new === true,
|
||||
}"
|
||||
:to="item.link"
|
||||
exact
|
||||
>
|
||||
{{ item.title }}
|
||||
</g-link>
|
||||
</li>
|
||||
|
@ -195,7 +195,7 @@ $menuBreakPoint: 800px;
|
||||
display: block;
|
||||
}
|
||||
|
||||
.active + &__link-list {
|
||||
.app__link--active + &__link-list {
|
||||
display: block;
|
||||
}
|
||||
|
||||
@ -212,7 +212,7 @@ $menuBreakPoint: 800px;
|
||||
color: $colorWhite;
|
||||
}
|
||||
|
||||
&.active--exact {
|
||||
&--exact {
|
||||
color: $colorWhite;
|
||||
background-color: rgba($colorWhite, 0.05);
|
||||
}
|
||||
@ -231,7 +231,7 @@ $menuBreakPoint: 800px;
|
||||
}
|
||||
}
|
||||
|
||||
&--premium {
|
||||
&--pro {
|
||||
&::after {
|
||||
content: 'PRO';
|
||||
font-family: 'JetBrainsMono', monospace;
|
||||
@ -243,6 +243,18 @@ $menuBreakPoint: 800px;
|
||||
}
|
||||
}
|
||||
|
||||
&--new {
|
||||
&::after {
|
||||
content: 'NEW';
|
||||
font-family: 'JetBrainsMono', monospace;
|
||||
text-transform: uppercase;
|
||||
color: $colorGreen;
|
||||
background-color: rgba($colorGreen, 0.1);
|
||||
padding: 0 0.5em;
|
||||
border-radius: 5px;
|
||||
}
|
||||
}
|
||||
|
||||
&--with-children::after {
|
||||
content: '↓';
|
||||
color: rgba($colorWhite, 0.2);
|
||||
|
@ -6,11 +6,11 @@
|
||||
link: /overview/installation
|
||||
- title: Upgrade Guide
|
||||
link: /overview/upgrade-guide
|
||||
draft: true
|
||||
- title: Contributing
|
||||
link: /overview/contributing
|
||||
- title: Examples
|
||||
link: /examples
|
||||
redirect: /examples/basic
|
||||
items:
|
||||
- title: Basic
|
||||
link: /examples/basic
|
||||
@ -25,6 +25,7 @@
|
||||
draft: true
|
||||
- title: Todo App
|
||||
link: /examples/todo-app
|
||||
new: true
|
||||
- title: Read-only
|
||||
link: /examples/read-only
|
||||
- title: Minimalist
|
||||
@ -57,7 +58,7 @@
|
||||
- title: Collaborative editing
|
||||
link: /guide/collaborative-editing
|
||||
draft: true
|
||||
premium: true
|
||||
pro: true
|
||||
- title: Advanced node views
|
||||
link: /guide/advanced-node-views
|
||||
draft: true
|
||||
@ -127,10 +128,10 @@
|
||||
items:
|
||||
- title: Collaboration
|
||||
link: /api/extensions/collaboration
|
||||
premium: true
|
||||
pro: true
|
||||
- title: CollaborationCursor
|
||||
link: /api/extensions/collaboration-cursor
|
||||
premium: true
|
||||
pro: true
|
||||
- title: Dropcursor
|
||||
link: /api/extensions/dropcursor
|
||||
- title: Focus
|
||||
@ -160,5 +161,13 @@
|
||||
items:
|
||||
- title: Monthly reports
|
||||
link: /open
|
||||
redirect: /open/2020-10
|
||||
items:
|
||||
- title: October 2020
|
||||
link: /open/2020-10
|
||||
- title: September 2020
|
||||
link: /open/2020-09
|
||||
- title: August 2020
|
||||
link: /open/2020-08
|
||||
- title: Become a sponsor
|
||||
link: /sponsor
|
||||
|
Loading…
Reference in New Issue
Block a user