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

add content to the link extension page

Browse Source
This commit is contained in:
Hans Pagel
2020-09-25 19:05:21 +02:00
parent c4d9bf9b41
commit 304504da73
6 changed files with 45 additions and 36 deletions
Download Patch File Download Diff File Expand all files Collapse all files

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

@@ -44,13 +44,13 @@ editor.off('update', callback)
```
## List of events
| Event | Description | Parameters |
| -------- | ----------------------------- | ------------------------------------ |
| `blur` | Editor isn’t focused anymore. | `{ event }` |
| `focus` | Editor is in focus. | `{ event }` |
| `init` | Editor has been initialized. | *None* |
| `update` | Content has changed. | *None* |
| `transaction` | State has changed. | `{ transaction }` |
| Event | Description | Parameters |
| ------------- | ----------------------------- | ----------------- |
| `blur` | Editor isn’t focused anymore. | `{ event }` |
| `focus` | Editor is in focus. | `{ event }` |
| `init` | Editor has been initialized. | *None* |
| `transaction` | State has changed. | `{ transaction }` |
| `update` | Content has changed. | *None* |
:::info List of hooks
The according hooks are called `onBlur`, `onFocus`, `onInit`, `onUpdate` and `onTransaction`.

29
docs/src/docPages/api/extensions/link.md
View File

@@ -1,5 +1,9 @@
# Link
Enables you to use the `<a>` HTML tag in the editor.
The Link extension adds support for `<a>` tags to the editor. The extension is renderless too, there is no actual UI to add, modify or delete links. The usage example below uses the native JavaScript prompt to show you how that could work.
In a real world application, you would probably add a more sophisticated user interface. [Check out the example](/examples/links) to see how that could look like.
Pasted URLs will be linked automatically.
## Installation
```bash
@@ -11,22 +15,25 @@ yarn add @tiptap/extension-link
```
## Settings
| Option | Type | Default | Description |
| ----------- | ------- | ------- | -------------------------------------------- |
| class | string | – | Add a custom class to the rendered HTML tag. |
| openOnClick | Boolean | true | Specifies if links will be opened on click. |
| Option | Type | Default | Description |
| ----------- | ------- | ---------------------------- | -------------------------------------------- |
| class | string | – | Add a custom class to the rendered HTML tag. |
| openOnClick | Boolean | true | If enabled, links will be opened on click. |
| rel | string | noopener noreferrer nofollow | Configure the `rel` attribute. |
| target | _self | | Set the default `target` of links. |
## Commands
| Command | Options | Description |
| ------- | ------- | ----------------------- |
| link | — | Link the selected text. |
| Command | Options | Description |
| ------- | -------------- | ----------------------------------------------------------- |
| link | href<br>target | Link the selected text. Removes a link, if `href` is empty. |
## Keyboard shortcuts
* Windows/Linux: `Control` `K`
* macOS: `Cmd` `K`
:::warning Doesn’t have a keyboard shortcut
This extension doesn’t bind a specific keyboard shortcut. You would probably open your UI on `Mod-k` though.
:::
## Source code
[packages/extension-link/](https://github.com/ueberdosis/tiptap-next/blob/main/packages/extension-link/)
## Usage
<demo name="Extensions/Link" highlight="" />
<demo name="Extensions/Link" highlight="3-8,19,38,52" />