react-text-range 1.0.15 → 1.0.16

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 (3) hide show
  1. package/dist/cjs/index.js +32 -24
  2. package/dist/esm/index.js +32 -24
  3. package/package.json +1 -1
package/dist/cjs/index.js CHANGED
@@ -70,6 +70,17 @@ const getHandlerRect = (node, left) => {
70
70
  return null;
71
71
  }
72
72
  };
73
+ const createTextNodes = (div) => {
74
+ if (div.childNodes[1] && !div.childNodes[1].firstChild) {
75
+ div.childNodes[1].appendChild(document.createTextNode(''));
76
+ }
77
+ if (div.childNodes[3] && !div.childNodes[3].firstChild) {
78
+ div.childNodes[3].appendChild(document.createTextNode(''));
79
+ }
80
+ if (div.childNodes[5] && !div.childNodes[5].firstChild) {
81
+ div.childNodes[5].appendChild(document.createTextNode(''));
82
+ }
83
+ };
73
84
  const getNodeAndOffsetFromPoint = (x, y) => {
74
85
  let range;
75
86
  let textNode;
@@ -158,29 +169,27 @@ const useTextSelectionEditor = (initLeftPos, initRightPos, leftDrag, rightDrag,
158
169
  // mouse move handler
159
170
  // left handler
160
171
  const leftMoveHandler = React.useCallback((e) => {
161
- var _a, _b, _c, _d, _e, _f, _g, _h, _j, _k, _l, _m, _o, _p;
162
172
  const sm = getNodeAndOffsetFromPoint(e.clientX, e.clientY);
163
173
  if (!sm)
164
174
  return;
175
+ if (!textDiv.current)
176
+ return;
165
177
  let posToSet = currentLeftPos;
166
- if (sm.node === ((_a = textDiv.current) === null || _a === void 0 ? void 0 : _a.childNodes[1].firstChild)) {
178
+ if (sm.node === textDiv.current.childNodes[1].firstChild) {
167
179
  posToSet = sm.offset;
168
180
  }
169
- else if (sm.node === ((_b = textDiv.current) === null || _b === void 0 ? void 0 : _b.childNodes[3].firstChild)) {
181
+ else if (sm.node === textDiv.current.childNodes[3].firstChild) {
170
182
  posToSet = currentLeftPos + sm.offset;
171
183
  }
172
184
  if (posToSet !== currentLeftPos) {
173
- const headText = (_f = (_e = (_d = (_c = textDiv.current) === null || _c === void 0 ? void 0 : _c.childNodes[1]) === null || _d === void 0 ? void 0 : _d.firstChild) === null || _e === void 0 ? void 0 : _e.nodeValue) !== null && _f !== void 0 ? _f : '';
174
- const selText = (_k = (_j = (_h = (_g = textDiv.current) === null || _g === void 0 ? void 0 : _g.childNodes[3]) === null || _h === void 0 ? void 0 : _h.firstChild) === null || _j === void 0 ? void 0 : _j.nodeValue) !== null && _k !== void 0 ? _k : '';
185
+ createTextNodes(textDiv.current);
186
+ const headText = textDiv.current.childNodes[1].firstChild.nodeValue;
187
+ const selText = textDiv.current.childNodes[3].firstChild.nodeValue;
175
188
  const full = headText + selText;
176
- const nodeChild1 = (_m = (_l = textDiv.current) === null || _l === void 0 ? void 0 : _l.childNodes[1]) === null || _m === void 0 ? void 0 : _m.firstChild;
177
- if (nodeChild1) {
178
- nodeChild1.nodeValue = full.substring(0, posToSet);
179
- }
180
- const nodeChild3 = (_p = (_o = textDiv.current) === null || _o === void 0 ? void 0 : _o.childNodes[3]) === null || _p === void 0 ? void 0 : _p.firstChild;
181
- if (nodeChild3) {
182
- nodeChild3.nodeValue = full.substring(posToSet);
183
- }
189
+ const nodeChild1 = textDiv.current.childNodes[1].firstChild;
190
+ nodeChild1.nodeValue = full.substring(0, posToSet);
191
+ const nodeChild3 = textDiv.current.childNodes[3].firstChild;
192
+ nodeChild3.nodeValue = full.substring(posToSet);
184
193
  setCurrentLeftPos(posToSet);
185
194
  }
186
195
  }, [currentLeftPos, textDiv.current]);
@@ -200,10 +209,12 @@ const useTextSelectionEditor = (initLeftPos, initRightPos, leftDrag, rightDrag,
200
209
  }, [initLeftPos]);
201
210
  // right handler
202
211
  const rightMoveHandler = React.useCallback((e) => {
203
- var _a, _b, _c, _d, _e, _f, _g, _h, _j, _k, _l, _m, _o, _p;
212
+ var _a, _b;
204
213
  const sm = getNodeAndOffsetFromPoint(e.clientX, e.clientY);
205
214
  if (!sm)
206
215
  return;
216
+ if (!textDiv.current)
217
+ return;
207
218
  let posToSet = currentRightPos;
208
219
  if (sm.node === ((_a = textDiv.current) === null || _a === void 0 ? void 0 : _a.childNodes[3].firstChild)) {
209
220
  posToSet = currentLeftPos + sm.offset;
@@ -212,17 +223,14 @@ const useTextSelectionEditor = (initLeftPos, initRightPos, leftDrag, rightDrag,
212
223
  posToSet = currentRightPos + sm.offset;
213
224
  }
214
225
  if (posToSet !== currentRightPos) {
215
- const selText = (_f = (_e = (_d = (_c = textDiv.current) === null || _c === void 0 ? void 0 : _c.childNodes[3]) === null || _d === void 0 ? void 0 : _d.firstChild) === null || _e === void 0 ? void 0 : _e.nodeValue) !== null && _f !== void 0 ? _f : '';
216
- const tailText = (_k = (_j = (_h = (_g = textDiv.current) === null || _g === void 0 ? void 0 : _g.childNodes[5]) === null || _h === void 0 ? void 0 : _h.firstChild) === null || _j === void 0 ? void 0 : _j.nodeValue) !== null && _k !== void 0 ? _k : '';
226
+ createTextNodes(textDiv.current);
227
+ const selText = textDiv.current.childNodes[3].firstChild.nodeValue;
228
+ const tailText = textDiv.current.childNodes[5].firstChild.nodeValue;
217
229
  const full = selText + tailText;
218
- const nodeChild3 = (_m = (_l = textDiv.current) === null || _l === void 0 ? void 0 : _l.childNodes[3]) === null || _m === void 0 ? void 0 : _m.firstChild;
219
- if (nodeChild3) {
220
- nodeChild3.nodeValue = full.substring(0, posToSet - currentLeftPos);
221
- }
222
- const nodeChild5 = (_p = (_o = textDiv.current) === null || _o === void 0 ? void 0 : _o.childNodes[5]) === null || _p === void 0 ? void 0 : _p.firstChild;
223
- if (nodeChild5) {
224
- nodeChild5.nodeValue = full.substring(posToSet - currentLeftPos);
225
- }
230
+ const nodeChild3 = textDiv.current.childNodes[3].firstChild;
231
+ nodeChild3.nodeValue = full.substring(0, posToSet - currentLeftPos);
232
+ const nodeChild5 = textDiv.current.childNodes[5].firstChild;
233
+ nodeChild5.nodeValue = full.substring(posToSet - currentLeftPos);
226
234
  setCurrentRightPos(posToSet);
227
235
  }
228
236
  }, [currentLeftPos, currentRightPos, textDiv.current]);
package/dist/esm/index.js CHANGED
@@ -50,6 +50,17 @@ const getHandlerRect = (node, left) => {
50
50
  return null;
51
51
  }
52
52
  };
53
+ const createTextNodes = (div) => {
54
+ if (div.childNodes[1] && !div.childNodes[1].firstChild) {
55
+ div.childNodes[1].appendChild(document.createTextNode(''));
56
+ }
57
+ if (div.childNodes[3] && !div.childNodes[3].firstChild) {
58
+ div.childNodes[3].appendChild(document.createTextNode(''));
59
+ }
60
+ if (div.childNodes[5] && !div.childNodes[5].firstChild) {
61
+ div.childNodes[5].appendChild(document.createTextNode(''));
62
+ }
63
+ };
53
64
  const getNodeAndOffsetFromPoint = (x, y) => {
54
65
  let range;
55
66
  let textNode;
@@ -138,29 +149,27 @@ const useTextSelectionEditor = (initLeftPos, initRightPos, leftDrag, rightDrag,
138
149
  // mouse move handler
139
150
  // left handler
140
151
  const leftMoveHandler = useCallback((e) => {
141
- var _a, _b, _c, _d, _e, _f, _g, _h, _j, _k, _l, _m, _o, _p;
142
152
  const sm = getNodeAndOffsetFromPoint(e.clientX, e.clientY);
143
153
  if (!sm)
144
154
  return;
155
+ if (!textDiv.current)
156
+ return;
145
157
  let posToSet = currentLeftPos;
146
- if (sm.node === ((_a = textDiv.current) === null || _a === void 0 ? void 0 : _a.childNodes[1].firstChild)) {
158
+ if (sm.node === textDiv.current.childNodes[1].firstChild) {
147
159
  posToSet = sm.offset;
148
160
  }
149
- else if (sm.node === ((_b = textDiv.current) === null || _b === void 0 ? void 0 : _b.childNodes[3].firstChild)) {
161
+ else if (sm.node === textDiv.current.childNodes[3].firstChild) {
150
162
  posToSet = currentLeftPos + sm.offset;
151
163
  }
152
164
  if (posToSet !== currentLeftPos) {
153
- const headText = (_f = (_e = (_d = (_c = textDiv.current) === null || _c === void 0 ? void 0 : _c.childNodes[1]) === null || _d === void 0 ? void 0 : _d.firstChild) === null || _e === void 0 ? void 0 : _e.nodeValue) !== null && _f !== void 0 ? _f : '';
154
- const selText = (_k = (_j = (_h = (_g = textDiv.current) === null || _g === void 0 ? void 0 : _g.childNodes[3]) === null || _h === void 0 ? void 0 : _h.firstChild) === null || _j === void 0 ? void 0 : _j.nodeValue) !== null && _k !== void 0 ? _k : '';
165
+ createTextNodes(textDiv.current);
166
+ const headText = textDiv.current.childNodes[1].firstChild.nodeValue;
167
+ const selText = textDiv.current.childNodes[3].firstChild.nodeValue;
155
168
  const full = headText + selText;
156
- const nodeChild1 = (_m = (_l = textDiv.current) === null || _l === void 0 ? void 0 : _l.childNodes[1]) === null || _m === void 0 ? void 0 : _m.firstChild;
157
- if (nodeChild1) {
158
- nodeChild1.nodeValue = full.substring(0, posToSet);
159
- }
160
- const nodeChild3 = (_p = (_o = textDiv.current) === null || _o === void 0 ? void 0 : _o.childNodes[3]) === null || _p === void 0 ? void 0 : _p.firstChild;
161
- if (nodeChild3) {
162
- nodeChild3.nodeValue = full.substring(posToSet);
163
- }
169
+ const nodeChild1 = textDiv.current.childNodes[1].firstChild;
170
+ nodeChild1.nodeValue = full.substring(0, posToSet);
171
+ const nodeChild3 = textDiv.current.childNodes[3].firstChild;
172
+ nodeChild3.nodeValue = full.substring(posToSet);
164
173
  setCurrentLeftPos(posToSet);
165
174
  }
166
175
  }, [currentLeftPos, textDiv.current]);
@@ -180,10 +189,12 @@ const useTextSelectionEditor = (initLeftPos, initRightPos, leftDrag, rightDrag,
180
189
  }, [initLeftPos]);
181
190
  // right handler
182
191
  const rightMoveHandler = useCallback((e) => {
183
- var _a, _b, _c, _d, _e, _f, _g, _h, _j, _k, _l, _m, _o, _p;
192
+ var _a, _b;
184
193
  const sm = getNodeAndOffsetFromPoint(e.clientX, e.clientY);
185
194
  if (!sm)
186
195
  return;
196
+ if (!textDiv.current)
197
+ return;
187
198
  let posToSet = currentRightPos;
188
199
  if (sm.node === ((_a = textDiv.current) === null || _a === void 0 ? void 0 : _a.childNodes[3].firstChild)) {
189
200
  posToSet = currentLeftPos + sm.offset;
@@ -192,17 +203,14 @@ const useTextSelectionEditor = (initLeftPos, initRightPos, leftDrag, rightDrag,
192
203
  posToSet = currentRightPos + sm.offset;
193
204
  }
194
205
  if (posToSet !== currentRightPos) {
195
- const selText = (_f = (_e = (_d = (_c = textDiv.current) === null || _c === void 0 ? void 0 : _c.childNodes[3]) === null || _d === void 0 ? void 0 : _d.firstChild) === null || _e === void 0 ? void 0 : _e.nodeValue) !== null && _f !== void 0 ? _f : '';
196
- const tailText = (_k = (_j = (_h = (_g = textDiv.current) === null || _g === void 0 ? void 0 : _g.childNodes[5]) === null || _h === void 0 ? void 0 : _h.firstChild) === null || _j === void 0 ? void 0 : _j.nodeValue) !== null && _k !== void 0 ? _k : '';
206
+ createTextNodes(textDiv.current);
207
+ const selText = textDiv.current.childNodes[3].firstChild.nodeValue;
208
+ const tailText = textDiv.current.childNodes[5].firstChild.nodeValue;
197
209
  const full = selText + tailText;
198
- const nodeChild3 = (_m = (_l = textDiv.current) === null || _l === void 0 ? void 0 : _l.childNodes[3]) === null || _m === void 0 ? void 0 : _m.firstChild;
199
- if (nodeChild3) {
200
- nodeChild3.nodeValue = full.substring(0, posToSet - currentLeftPos);
201
- }
202
- const nodeChild5 = (_p = (_o = textDiv.current) === null || _o === void 0 ? void 0 : _o.childNodes[5]) === null || _p === void 0 ? void 0 : _p.firstChild;
203
- if (nodeChild5) {
204
- nodeChild5.nodeValue = full.substring(posToSet - currentLeftPos);
205
- }
210
+ const nodeChild3 = textDiv.current.childNodes[3].firstChild;
211
+ nodeChild3.nodeValue = full.substring(0, posToSet - currentLeftPos);
212
+ const nodeChild5 = textDiv.current.childNodes[5].firstChild;
213
+ nodeChild5.nodeValue = full.substring(posToSet - currentLeftPos);
206
214
  setCurrentRightPos(posToSet);
207
215
  }
208
216
  }, [currentLeftPos, currentRightPos, textDiv.current]);
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "react-text-range",
3
- "version": "1.0.15",
3
+ "version": "1.0.16",
4
4
  "description": "text selection editor for React",
5
5
  "main": "./dist/cjs/index.js",
6
6
  "module": "./dist/esm/index.js",