@mgreminger/quill-image-resize-module 1.0.0 → 1.0.1

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (5) hide show
  1. package/README.md +8 -7
  2. package/index.html +40 -34
  3. package/package.json +5 -1
  4. package/preview/index.html +40 -34
  5. package/vite.preview.config.js +2 -2
package/README.md CHANGED
@@ -3,13 +3,14 @@
3
3
  A module for Quill rich text editor to allow images to be resized.
4
4
 
5
5
  A fork of [kensnyder/quill-image-resize-module](https://github.com/kensnyder/quill-image-resize-module) with the following changes:
6
- * Updated to work with Quill 2
7
- * Modernized toolchain using vite and TypeScript
8
- * Toolbar buttons removed since allignment settings were not preserved in the document Delta
9
- * The presence of resize handles no longer impacts underlying selection range so keyboard actions such as copy to clipboard and type to replace still work as expected
10
- * Keyboard shortcuts added to increase image size (+ key) and decrease image size (- key)
11
- * Resize handles now appear when image is selected with the keyboard (using shift with the arrow keys)
12
- * Works with touch events in addition to mouse events
6
+
7
+ - Updated to work with Quill 2
8
+ - Modernized toolchain using vite and TypeScript
9
+ - Toolbar buttons removed since allignment settings were not preserved in the document Delta
10
+ - The presence of resize handles no longer impacts underlying selection range so keyboard actions such as copy to clipboard and type to replace still work as expected
11
+ - Keyboard shortcuts added to increase image size (+ key) and decrease image size (- key)
12
+ - Resize handles now appear when image is selected with the keyboard (using shift with the arrow keys)
13
+ - Works with touch events in addition to mouse events
13
14
 
14
15
  ## Demo
15
16
 
package/index.html CHANGED
@@ -1,40 +1,46 @@
1
1
  <!doctype html>
2
2
  <html>
3
+ <head>
4
+ <meta charset="utf-8" />
5
+ <title>Quill Image Resize Module Demo</title>
6
+ </head>
3
7
 
4
- <head>
5
- <meta charset="utf-8" />
6
- <title>Quill Image Resize Module Demo</title>
7
- </head>
8
+ <body>
9
+ <h1>Quill Image Resize Module Demo</h1>
10
+ <div id="editor" style="max-height: 500px; overflow: auto">
11
+ <p>Click on the Image Below to resize</p>
12
+ <p>
13
+ <img
14
+ src="https://upload.wikimedia.org/wikipedia/commons/thumb/f/f5/Typescript.svg/64px-Typescript.svg.png"
15
+ />
16
+ </p>
17
+ <p>Some initial <strong>bold</strong> text</p>
18
+ <p>
19
+ <img
20
+ src="https://upload.wikimedia.org/wikipedia/commons/a/a4/JavaScript_code.png"
21
+ />
22
+ </p>
23
+ </div>
8
24
 
9
- <body>
10
- <h1>Quill Image Resize Module Demo</h1>
11
- <div id="editor" style="max-height: 500px; overflow: auto">
12
- <p>Click on the Image Below to resize</p>
25
+ <h1>Editor 2</h1>
26
+ <div id="editor2" style="max-height: 500px; overflow: auto">
27
+ <p>Click on the Image Below to resize</p>
28
+ <p>
29
+ <img
30
+ src="https://upload.wikimedia.org/wikipedia/commons/thumb/f/f5/Typescript.svg/64px-Typescript.svg.png"
31
+ />
32
+ </p>
33
+ <p>Some initial <strong>bold</strong> text</p>
34
+ <p>
35
+ <img
36
+ src="https://upload.wikimedia.org/wikipedia/commons/a/a4/JavaScript_code.png"
37
+ />
38
+ </p>
39
+ </div>
13
40
  <p>
14
- <img src="https://upload.wikimedia.org/wikipedia/commons/thumb/f/f5/Typescript.svg/64px-Typescript.svg.png" />
41
+ <label>Text Input:</label>
42
+ <input />
15
43
  </p>
16
- <p>Some initial <strong>bold</strong> text</p>
17
- <p>
18
- <img src="https://upload.wikimedia.org/wikipedia/commons/a/a4/JavaScript_code.png" />
19
- </p>
20
- </div>
21
-
22
- <h1>Editor 2</h1>
23
- <div id="editor2" style="max-height: 500px; overflow: auto">
24
- <p>Click on the Image Below to resize</p>
25
- <p>
26
- <img src="https://upload.wikimedia.org/wikipedia/commons/thumb/f/f5/Typescript.svg/64px-Typescript.svg.png" />
27
- </p>
28
- <p>Some initial <strong>bold</strong> text</p>
29
- <p>
30
- <img src="https://upload.wikimedia.org/wikipedia/commons/a/a4/JavaScript_code.png" />
31
- </p>
32
- </div>
33
- <p>
34
- <label>Text Input:</label>
35
- <input></input>
36
- </p>
37
- <script type="module" src="./demo/script.js"></script>
38
- </body>
39
-
40
- </html>
44
+ <script type="module" src="./demo/script.js"></script>
45
+ </body>
46
+ </html>
package/package.json CHANGED
@@ -1,7 +1,7 @@
1
1
  {
2
2
  "name": "@mgreminger/quill-image-resize-module",
3
3
  "private": false,
4
- "version": "1.0.0",
4
+ "version": "1.0.1",
5
5
  "description": "A module for Quill rich text editor to allow images to be resized.",
6
6
  "type": "module",
7
7
  "scripts": {
@@ -27,5 +27,9 @@
27
27
  },
28
28
  "dependencies": {
29
29
  "lodash": "^4.17.4"
30
+ },
31
+ "repository": {
32
+ "type": "git",
33
+ "url": "https://github.com/mgreminger/quill-image-resize-module"
30
34
  }
31
35
  }
package/preview/index.html CHANGED
@@ -1,40 +1,46 @@
1
1
  <!doctype html>
2
2
  <html>
3
+ <head>
4
+ <meta charset="utf-8" />
5
+ <title>Quill Image Resize Module Demo</title>
6
+ </head>
3
7
 
4
- <head>
5
- <meta charset="utf-8" />
6
- <title>Quill Image Resize Module Demo</title>
7
- </head>
8
+ <body>
9
+ <h1>Quill Image Resize Module Demo</h1>
10
+ <div id="editor" style="max-height: 500px; overflow: auto">
11
+ <p>Click on the Image Below to resize</p>
12
+ <p>
13
+ <img
14
+ src="https://upload.wikimedia.org/wikipedia/commons/thumb/f/f5/Typescript.svg/64px-Typescript.svg.png"
15
+ />
16
+ </p>
17
+ <p>Some initial <strong>bold</strong> text</p>
18
+ <p>
19
+ <img
20
+ src="https://upload.wikimedia.org/wikipedia/commons/a/a4/JavaScript_code.png"
21
+ />
22
+ </p>
23
+ </div>
8
24
 
9
- <body>
10
- <h1>Quill Image Resize Module Demo</h1>
11
- <div id="editor" style="max-height: 500px; overflow: auto">
12
- <p>Click on the Image Below to resize</p>
25
+ <h1>Editor 2</h1>
26
+ <div id="editor2" style="max-height: 500px; overflow: auto">
27
+ <p>Click on the Image Below to resize</p>
28
+ <p>
29
+ <img
30
+ src="https://upload.wikimedia.org/wikipedia/commons/thumb/f/f5/Typescript.svg/64px-Typescript.svg.png"
31
+ />
32
+ </p>
33
+ <p>Some initial <strong>bold</strong> text</p>
34
+ <p>
35
+ <img
36
+ src="https://upload.wikimedia.org/wikipedia/commons/a/a4/JavaScript_code.png"
37
+ />
38
+ </p>
39
+ </div>
13
40
  <p>
14
- <img src="https://upload.wikimedia.org/wikipedia/commons/thumb/f/f5/Typescript.svg/64px-Typescript.svg.png" />
41
+ <label>Text Input:</label>
42
+ <input />
15
43
  </p>
16
- <p>Some initial <strong>bold</strong> text</p>
17
- <p>
18
- <img src="https://upload.wikimedia.org/wikipedia/commons/a/a4/JavaScript_code.png" />
19
- </p>
20
- </div>
21
-
22
- <h1>Editor 2</h1>
23
- <div id="editor2" style="max-height: 500px; overflow: auto">
24
- <p>Click on the Image Below to resize</p>
25
- <p>
26
- <img src="https://upload.wikimedia.org/wikipedia/commons/thumb/f/f5/Typescript.svg/64px-Typescript.svg.png" />
27
- </p>
28
- <p>Some initial <strong>bold</strong> text</p>
29
- <p>
30
- <img src="https://upload.wikimedia.org/wikipedia/commons/a/a4/JavaScript_code.png" />
31
- </p>
32
- </div>
33
- <p>
34
- <label>Text Input:</label>
35
- <input></input>
36
- </p>
37
- <script type="module" src="./script.js"></script>
38
- </body>
39
-
40
- </html>
44
+ <script type="module" src="./script.js"></script>
45
+ </body>
46
+ </html>
package/vite.preview.config.js CHANGED
@@ -4,7 +4,7 @@ export default defineConfig({
4
4
  root: "./preview",
5
5
  build: {
6
6
  outDir: "../dist-preview",
7
- emptyOutDir: true
7
+ emptyOutDir: true,
8
8
  },
9
- base: './'
9
+ base: "./",
10
10
  });