public/svelte-quill
3
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

feat: make default value display correctly

Browse Source
This commit is contained in:
Olivers Vītiņš
2024-02-24 23:45:34 +02:00
parent 59778ea03b
commit 9cee2d8b7a
5 changed files with 17 additions and 24 deletions
Download Patch File Download Diff File Expand all files Collapse all files

18
README.md
View File

@@ -1,14 +1,5 @@
# svelte-editor-quill # svelte-editor-quill
[![NPM version][npm-img]][npm]
<!-- [![Build Status][ci-img]][ci] -->
[npm-img]: https://img.shields.io/npm/v/@tadashi/svelte-editor-quill.svg
[npm]: https://www.npmjs.com/package/@tadashi/svelte-editor-quill
<!-- [ci-img]: https://github.com/lagden/svelte-editor-quill/workflows/Node.js%20CI/badge.svg -->
<!-- [ci]: https://github.com/lagden/svelte-editor-quill/actions?query=workflow%3A%22Node.js+CI%22 -->
--- ---
Svelte component Svelte component
@@ -17,7 +8,7 @@ Svelte component
## Install ## Install
``` ```
$ npm i @tadashi/svelte-editor-quill $ npm i @resultium/svelte-editor-quill
``` ```
@@ -45,7 +36,7 @@ Accept only paste plain text.
```html ```html
<script> <script>
import {Editor} from '@tadashi/svelte-editor-quill' import {Editor} from '@resultium/svelte-editor-quill'
const options = { const options = {
theme: 'snow', theme: 'snow',
@@ -58,14 +49,15 @@ Accept only paste plain text.
</script> </script>
<svelte:head> <svelte:head>
<link rel="preconnect" href="https://cdn.quilljs.com" crossorigin> <link rel="preconnect" href="https://cdn.quilljs.com">
<link rel="stylesheet" href="https://cdn.quilljs.com/1.3.7/quill.snow.css"> <link rel="stylesheet" href="https://cdn.quilljs.com/1.3.7/quill.snow.css">
</svelte:head> </svelte:head>
<Editor {options} on:text-change={onTextChange} data='Apenas um show' /> <Editor {options} on:text-change={onTextChange} data='Lorem ipsum dolor' />
``` ```
## License ## License
MIT © [Thiago Lagden](https://github.com/lagden) MIT © [Thiago Lagden](https://github.com/lagden)
MIT © Resultium LLC

12
package.json
View File

@@ -1,13 +1,13 @@
{ {
"name": "@tadashi/svelte-editor-quill", "name": "@resultium/svelte-editor-quill",
"version": "2.2.0", "version": "1.0.0",
"description": "Svelte component", "description": "Quill.js implementation in svelte",
"author": "Thiago Lagden", "author": "Resultium LLC",
"license": "MIT", "license": "MIT",
"bugs": { "bugs": {
"url": "https://github.com/lagden/svelte-editor-quill/issues" "email": "technology@resultium.io"
}, },
"homepage": "https://github.com/lagden/svelte-editor-quill#readme", "homepage": "https://git.resultium.net/public/svelte-editor-quill",
"engines": { "engines": {
"node": ">=12.0.0" "node": ">=12.0.0"
}, },

4
src/lib/Editor.svelte
View File

@@ -18,6 +18,8 @@
onMount(async () => { onMount(async () => {
const {quill} = await import('./quill.js') const {quill} = await import('./quill.js')
destroy = quill(node, options) destroy = quill(node, options)
node.firstChild.innerHTML = data
}) })
onDestroy(() => { onDestroy(() => {
@@ -26,5 +28,5 @@
</script> </script>
<div class={className}> <div class={className}>
<div bind:this={node} on:text-change>{@html data}</div> <div bind:this={node} on:text-change />
</div> </div>

1
src/lib/quill.js
View File

@@ -36,7 +36,6 @@ export function quill(node, options) {
modules: { modules: {
toolbar, toolbar,
}, },
placeholder: 'Digite algo...',
...options, ...options,
}) })

6
src/routes/+page.svelte
View File

@@ -12,8 +12,8 @@
</script> </script>
<svelte:head> <svelte:head>
<link rel="preconnect" href="https://cdn.quilljs.com" crossorigin /> <link rel="preconnect" href="https://cdn.quilljs.com" />
<link rel="stylesheet" href="https://cdn.quilljs.com/1.3.7/quill.snow.css" crossorigin /> <link rel="stylesheet" href="https://cdn.quilljs.com/1.3.7/quill.snow.css" />
</svelte:head> </svelte:head>
<Editor {options} on:text-change={onTextChange} data="Apenas um show" /> <Editor {options} on:text-change={onTextChange} data="<p>test</p><p>sample</p>" />