mirror of
https://github.com/ianstormtaylor/slate.git
synced 2025-02-01 05:16:10 +01:00
f37dd21137
#### Is this adding or improving a _feature_ or fixing a _bug_? Debt. #### What's the new behavior? `createHyperscript` takes an options object that now looks for the `decorations` property instead of the `decorators` property #### How does this change work? Pretty straightforward rename of an option, then all of its uses and wherever the term decorators showed up in docs #### Have you checked that...? * [x] The new code matches the existing patterns and styles. * [x] The tests pass with `yarn test`. * [x] The linter passes with `yarn lint`. (Fix errors with `yarn prettier`.) * [x] The relevant examples still work. (Run examples with `yarn watch`.) #### Does this fix any issues or need any specific reviewers? Fixes: #1996 Reviewers: @ianstormtaylor
41 lines
1.8 KiB
Markdown
41 lines
1.8 KiB
Markdown
# Examples
|
|
|
|
|
|
|
|
This directory contains a set of examples that give you an idea for how you might use Slate to implement your own editor. Take a look around!
|
|
|
|
* [**Plain text**](./plain-text) — showing the most basic case: a glorified `<textarea>`.
|
|
* [**Rich text**](./rich-text) — showing the features you'd expect from a basic editor.
|
|
* [**Forced Layout**](./forced-layout) - showing how to use schema rules to enforce document structure
|
|
* [**Auto-markdown**](./auto-markdown) — showing how to add key handlers for Markdown-like shortcuts.
|
|
* [**Links**](./links) — showing how wrap text in inline nodes with associated data.
|
|
* [**Images**](./images) — showing how to use void (text-less) nodes to add images.
|
|
* [**Hovering menu**](./hovering-menu) — showing how a contextual hovering menu can be implemented.
|
|
* [**Tables**](./tables) — showing how to nest blocks to render more advanced components.
|
|
* [**Paste HTML**](./paste-html) — showing how to use an HTML serializer to handle pasted HTML.
|
|
* [**Code Highlighting**](./code-highlighting) — showing how to use decorations to dynamically mark text.
|
|
* ...and more!
|
|
|
|
If you have an idea for an example that shows a common use case, pull request it!
|
|
|
|
## Running the Examples
|
|
|
|
To get the examples running on your machine, you need to have the Slate repository cloned to your computer. After that, you need to `cd` into the directory where you cloned it, and install the dependencies with `yarn` and build the monorepo:
|
|
|
|
```
|
|
yarn install
|
|
yarn build
|
|
```
|
|
|
|
Then start the watcher and examples server:
|
|
|
|
```
|
|
yarn start
|
|
```
|
|
|
|
Now you can open up `http://localhost:8080` in your browser and you'll see the examples site. Any changes you make to the source code will be immediately reflected when you refresh the page. You can open the examples URL quickly with:
|
|
|
|
```
|
|
yarn open
|
|
```
|