easy-richtextarea 4.0.20 → 4.0.22

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.
package/package.json CHANGED
@@ -1,7 +1,7 @@
1
1
  {
2
2
  "name": "easy-richtextarea",
3
3
  "author": "James Smith",
4
- "version": "4.0.20",
4
+ "version": "4.0.22",
5
5
  "license": "MIT, Anti-996",
6
6
  "homepage": "https://github.com/djalbat/easy-richtextarea",
7
7
  "description": "A textarea element that handles and hands off events well.",
@@ -0,0 +1,17 @@
1
+ "use strict";
2
+
3
+ import { eventTypes } from "easy";
4
+
5
+ export const { CUT_EVENT_TYPE,
6
+ COPY_EVENT_TYPE,
7
+ BLUR_EVENT_TYPE,
8
+ PASTE_EVENT_TYPE,
9
+ INPUT_EVENT_TYPE,
10
+ FOCUS_EVENT_TYPE,
11
+ CHANGE_EVENT_TYPE,
12
+ SCROLL_EVENT_TYPE,
13
+ KEYDOWN_EVENT_TYPE,
14
+ CONTEXTMENU_EVENT_TYPE,
15
+ SELECTIONCHANGE_EVENT_TYPE } = eventTypes;
16
+
17
+ export const FIND_EVENT_TYPE = "find";
@@ -5,7 +5,7 @@ import RichTextarea from "./richTextarea";
5
5
  const content = "",
6
6
  richTextarea =
7
7
 
8
- <RichTextarea onChange={changeHandler} onScroll={scrollHandler} onFocus={focusHandler} onBlur={blurHandler} />
8
+ <RichTextarea onFind={findHandler} onBlur={blurHandler} onFocus={focusHandler} onChange={changeHandler} onScroll={scrollHandler} />
9
9
 
10
10
  ;
11
11
 
@@ -23,6 +23,18 @@ const View = (properties) =>
23
23
 
24
24
  export default View;
25
25
 
26
+ function findHandler(event, element) {
27
+ console.log("find")
28
+ }
29
+
30
+ function blurHandler(event, element) {
31
+ console.log("blur")
32
+ }
33
+
34
+ function focusHandler(event, element) {
35
+ console.log("focus")
36
+ }
37
+
26
38
  function changeHandler(event, element) {
27
39
  const contentChanged = richTextarea.hasContentChanged(),
28
40
  selectionChanged = richTextarea.hasSelectionChanged();
@@ -36,11 +48,3 @@ function scrollHandler(event, element) {
36
48
 
37
49
  console.log(scrollTop, scrollLeft)
38
50
  }
39
-
40
- function focusHandler(event, element) {
41
- console.log("focus")
42
- }
43
-
44
- function blurHandler(event, element) {
45
- console.log("blur")
46
- }
package/src/keyCodes.js CHANGED
@@ -1,3 +1,4 @@
1
1
  "use strict";
2
2
 
3
+ export const F_KEY_CODE = 70;
3
4
  export const Z_KEY_CODE = 90;
@@ -1,6 +1,6 @@
1
1
  "use strict";
2
2
 
3
- import { Element, document, eventTypes } from "easy";
3
+ import { Element, document } from "easy";
4
4
 
5
5
  import Selection from "./selection"
6
6
  import UndoBuffer from "./undoBuffer";
@@ -10,20 +10,20 @@ import transformContent from "./transform/content";
10
10
  import transformSelection from "./transform/selection";
11
11
  import generateOperations from "./operations/generate";
12
12
 
13
- import { Z_KEY_CODE } from "./keyCodes";
14
13
  import { TEXT, EMPTY_STRING } from "./constants";
15
-
16
- const { CUT_EVENT_TYPE,
17
- COPY_EVENT_TYPE,
18
- BLUR_EVENT_TYPE,
19
- PASTE_EVENT_TYPE,
20
- INPUT_EVENT_TYPE,
21
- FOCUS_EVENT_TYPE,
22
- CHANGE_EVENT_TYPE,
23
- SCROLL_EVENT_TYPE,
24
- KEYDOWN_EVENT_TYPE,
25
- CONTEXTMENU_EVENT_TYPE,
26
- SELECTIONCHANGE_EVENT_TYPE } = eventTypes;
14
+ import { F_KEY_CODE, Z_KEY_CODE } from "./keyCodes";
15
+ import { CUT_EVENT_TYPE,
16
+ COPY_EVENT_TYPE,
17
+ FIND_EVENT_TYPE,
18
+ BLUR_EVENT_TYPE,
19
+ PASTE_EVENT_TYPE,
20
+ INPUT_EVENT_TYPE,
21
+ FOCUS_EVENT_TYPE,
22
+ CHANGE_EVENT_TYPE,
23
+ SCROLL_EVENT_TYPE,
24
+ KEYDOWN_EVENT_TYPE,
25
+ CONTEXTMENU_EVENT_TYPE,
26
+ SELECTIONCHANGE_EVENT_TYPE } from "./eventTypes";
27
27
 
28
28
  export default class RichTextarea extends Element {
29
29
  constructor(selector, focused, readOnly, undoBuffer, previousContent, previousSelection) {
@@ -114,21 +114,31 @@ export default class RichTextarea extends Element {
114
114
  }
115
115
 
116
116
  keyDownHandler = (event, element) => {
117
- const { keyCode } = event;
117
+ const { ctrlKey, metaKey } = event;
118
+
119
+ if (ctrlKey || metaKey) {
120
+ const { keyCode } = event;
121
+
122
+ switch (keyCode) {
123
+ case F_KEY_CODE: {
124
+ this.find(event, element);
118
125
 
119
- if (keyCode === Z_KEY_CODE) {
120
- const { ctrlKey, metaKey } = event;
126
+ event.preventDefault();
121
127
 
122
- if (ctrlKey || metaKey) {
123
- const { shiftKey } = event;
128
+ return;
129
+ }
124
130
 
125
- shiftKey ?
126
- this.redo(event, element) :
127
- this.undo(event, element);
131
+ case Z_KEY_CODE: {
132
+ const { shiftKey } = event;
128
133
 
129
- event.preventDefault();
134
+ shiftKey ?
135
+ this.redo(event, element) :
136
+ this.undo(event, element);
130
137
 
131
- return;
138
+ event.preventDefault();
139
+
140
+ return;
141
+ }
132
142
  }
133
143
  }
134
144
 
@@ -313,6 +323,12 @@ export default class RichTextarea extends Element {
313
323
  }
314
324
  }
315
325
 
326
+ find(event, element) {
327
+ const eventType = FIND_EVENT_TYPE;
328
+
329
+ this.callHandlers(eventType, event, element);
330
+ }
331
+
316
332
  undo(event, element) {
317
333
  const undoOperation = this.undoBuffer.undo();
318
334
 
@@ -437,6 +453,20 @@ export default class RichTextarea extends Element {
437
453
  this.removeClass("active");
438
454
  }
439
455
 
456
+ onFind(findHandler, element) {
457
+ const eventType = FIND_EVENT_TYPE,
458
+ handler = findHandler; ///
459
+
460
+ this.addEventListener(eventType, handler, element);
461
+ }
462
+
463
+ offFind(findHandler, element) {
464
+ const eventType = FIND_EVENT_TYPE,
465
+ handler = findHandler; ///
466
+
467
+ this.removeEventListener(eventType, handler, element);
468
+ }
469
+
440
470
  onBlur(blurHandler, element) {
441
471
  const eventType = BLUR_EVENT_TYPE,
442
472
  handler = blurHandler; ///
@@ -494,11 +524,12 @@ export default class RichTextarea extends Element {
494
524
  }
495
525
 
496
526
  didMount() {
497
- const { onChange, onScroll, onFocus, onBlur } = this.properties,
498
- changeHandler = onChange, ///
499
- scrollHandler = onScroll, ///
527
+ const { onFind, onBlur, onFocus, onChange, onScroll } = this.properties,
528
+ findHandler = onFind, ///
529
+ blurHandler = onBlur, ///
500
530
  focusHandler = onFocus, ///
501
- blurHandler = onBlur; ///
531
+ changeHandler = onChange, ///
532
+ scrollHandler = onScroll; ///
502
533
 
503
534
  const content = this.getContent(),
504
535
  selection = this.getSelection();
@@ -507,13 +538,15 @@ export default class RichTextarea extends Element {
507
538
 
508
539
  this.previousSelection = selection; ///
509
540
 
510
- changeHandler && this.onChange(changeHandler, this);
541
+ findHandler && this.onFind(findHandler, this);
511
542
 
512
- scrollHandler && this.onScroll(scrollHandler, this);
543
+ blurHandler && this.onBlur(blurHandler, this);
513
544
 
514
545
  focusHandler && this.onFocus(focusHandler, this);
515
546
 
516
- blurHandler && this.onBlur(blurHandler, this);
547
+ changeHandler && this.onChange(changeHandler, this);
548
+
549
+ scrollHandler && this.onScroll(scrollHandler, this);
517
550
 
518
551
  this.on(CUT_EVENT_TYPE, this.cutHandler);
519
552
 
@@ -527,19 +560,22 @@ export default class RichTextarea extends Element {
527
560
  }
528
561
 
529
562
  willUnmount() {
530
- const { onChange, onScroll, onFocus, onBlur } = this.properties,
531
- changeHandler = onChange, ///
532
- scrollHandler = onScroll, ///
533
- focusHandler = onFocus, ///
534
- blurHandler = onBlur; ///
563
+ const { onFind, onBlur, onFocus, onChange, onScroll } = this.properties,
564
+ findHandler = onFind, ///
565
+ blurHandler = onBlur, ///
566
+ focusHandler = onFocus, ///
567
+ changeHandler = onChange, ///
568
+ scrollHandler = onScroll; ///
535
569
 
536
- changeHandler && this.offChange(changeHandler, this);
570
+ findHandler && this.offFind(findHandler, this);
537
571
 
538
- scrollHandler && this.offScroll(scrollHandler, this);
572
+ blurHandler && this.offBlur(blurHandler, this);
539
573
 
540
574
  focusHandler && this.offFocus(focusHandler, this);
541
575
 
542
- blurHandler && this.offBlur(blurHandler, this);
576
+ changeHandler && this.offChange(changeHandler, this);
577
+
578
+ scrollHandler && this.offScroll(scrollHandler, this);
543
579
 
544
580
  this.off(CUT_EVENT_TYPE, this.cutHandler);
545
581
 
@@ -561,10 +597,11 @@ export default class RichTextarea extends Element {
561
597
  static tagName = "textarea";
562
598
 
563
599
  static ignoredProperties = [
600
+ "onFind",
601
+ "onBlur",
602
+ "onFocus",
564
603
  "onChange",
565
604
  "onScroll",
566
- "onFocus",
567
- "onBlur"
568
605
  ];
569
606
 
570
607
  static defaultProperties = {