react-input-emoji 5.8.1 → 5.9.0-beta.2

Sign up to get free protection for your applications and to get access to all the features.
package/dist/index.es.js CHANGED
@@ -30,479 +30,10 @@ function styleInject(css, ref) {
30
30
  var css_248z = ".react-input-emoji--container {\n color: #4b4b4b;\n text-rendering: optimizeLegibility;\n background-color: #fff;\n border: 1px solid #fff;\n border-radius: 21px;\n margin: 5px 10px;\n box-sizing: border-box;\n flex: 1 1 auto;\n font-size: 15px;\n font-family: sans-serif;\n font-weight: 400;\n line-height: 20px;\n min-height: 20px;\n min-width: 0;\n outline: none;\n width: inherit;\n will-change: width;\n vertical-align: baseline;\n border: 1px solid #eaeaea;\n margin-right: 0;\n}\n\n.react-input-emoji--wrapper {\n display: flex;\n overflow: hidden;\n flex: 1;\n position: relative;\n padding-right: 0;\n vertical-align: baseline;\n outline: none;\n margin: 0;\n padding: 0;\n border: 0;\n}\n\n.react-input-emoji--input {\n font-weight: 400;\n max-height: 100px;\n min-height: 20px;\n outline: none;\n overflow-x: hidden;\n overflow-y: auto;\n position: relative;\n white-space: pre-wrap;\n word-wrap: break-word;\n z-index: 1;\n width: 100%;\n user-select: text;\n padding: 9px 12px 11px;\n text-align: left;\n}\n\n.react-input-emoji--input img {\n vertical-align: middle;\n width: 18px !important;\n height: 18px !important;\n display: inline !important;\n margin-left: 1px;\n margin-right: 1px;\n}\n\n.react-input-emoji--overlay {\n position: fixed;\n width: 100%;\n height: 100%;\n top: 0;\n left: 0;\n z-index: 9;\n}\n\n.react-input-emoji--placeholder {\n color: #a0a0a0;\n pointer-events: none;\n position: absolute;\n user-select: none;\n z-index: 2;\n left: 16px;\n top: 0;\n bottom: 0;\n display: flex;\n align-items: center;\n width: calc(100% - 22px);\n}\n\n.react-input-emoji--button {\n position: relative;\n display: block;\n text-align: center;\n padding: 0 10px;\n overflow: hidden;\n transition: color 0.1s ease-out;\n margin: 0;\n box-shadow: none;\n background: none;\n border: none;\n outline: none;\n cursor: pointer;\n flex-shrink: 0;\n}\n\n.react-input-emoji--button svg {\n fill: #858585;\n}\n\n.react-input-emoji--button__show svg {\n fill: #128b7e;\n}\n\n.react-emoji {\n display: flex;\n align-items: center;\n position: relative;\n width: 100%;\n}\n\n.react-emoji-picker--container {\n position: absolute;\n top: 0;\n width: 100%;\n}\n\n.react-emoji-picker--wrapper {\n position: absolute;\n bottom: 0;\n right: 0;\n height: 435px;\n width: 352px;\n overflow: hidden;\n z-index: 10;\n}\n\n.react-emoji-picker {\n position: absolute;\n top: 0;\n left: 0;\n animation: slidein 0.1s ease-in-out;\n}\n\n.react-emoji-picker__show {\n top: 0;\n}\n\n.react-input-emoji--mention--container {\n position: absolute;\n top: 0;\n left: 0;\n width: 100%;\n z-index: 10;\n}\n\n.react-input-emoji--mention--list {\n background-color: #fafafa;\n border: 1px solid #eaeaea;\n border-radius: 4px;\n margin: 0;\n padding: 0;\n list-style: none;\n display: flex;\n gap: 5px;\n flex-direction: column;\n position: absolute;\n bottom: 0;\n width: 100%;\n left: 0;\n}\n\n.react-input-emoji--mention--item {\n display: flex;\n align-items: center;\n gap: 10px;\n padding: 5px 10px;\n background-color: transparent;\n width: 100%;\n margin: 0;\n border: 0;\n}\n\n.react-input-emoji--mention--item__selected {\n background-color: #eeeeee;\n}\n\n.react-input-emoji--mention--item--img {\n width: 34px;\n height: 34px;\n border-radius: 50%;\n}\n\n.react-input-emoji--mention--item--name {\n font-size: 16px;\n color: #333;\n}\n\n.react-input-emoji--mention--item--name__selected {\n color: green;\n}\n\n.react-input-emoji--mention--text {\n color: #039be5;\n}\n\n.react-input-emoji--mention--loading {\n background-color: #fafafa;\n border: 1px solid #eaeaea;\n border-radius: 4px;\n display: flex;\n align-items: center;\n justify-content: center;\n padding: 10px 0;\n position: absolute;\n bottom: 0;\n left: 0;\n width: 100%;\n}\n\n.react-input-emoji--mention--loading--spinner,\n.react-input-emoji--mention--loading--spinner::after {\n border-radius: 50%;\n width: 10em;\n height: 10em;\n}\n\n.react-input-emoji--mention--loading--spinner {\n margin: 1px auto;\n font-size: 2px;\n position: relative;\n text-indent: -9999em;\n border-top: 1.1em solid rgba(0, 0, 0, 0.1);\n border-right: 1.1em solid rgba(0, 0, 0, 0.1);\n border-bottom: 1.1em solid rgba(0, 0, 0, 0.1);\n border-left: 1.1em solid rgba(0, 0, 0, 0.4);\n transform: translateZ(0);\n animation: load8 1.1s infinite linear;\n}\n\n@keyframes load8 {\n 0% {\n transform: rotate(0deg);\n }\n 100% {\n transform: rotate(360deg);\n }\n}\n\n@keyframes slidein {\n from {\n opacity: 0;\n }\n\n to {\n opacity: 1;\n }\n}\n";
31
31
  styleInject(css_248z);
32
32
 
33
- function _iterableToArrayLimit(r, l) {
34
- var t = null == r ? null : "undefined" != typeof Symbol && r[Symbol.iterator] || r["@@iterator"];
35
- if (null != t) {
36
- var e,
37
- n,
38
- i,
39
- u,
40
- a = [],
41
- f = !0,
42
- o = !1;
43
- try {
44
- if (i = (t = t.call(r)).next, 0 === l) {
45
- if (Object(t) !== t) return;
46
- f = !1;
47
- } else for (; !(f = (e = i.call(t)).done) && (a.push(e.value), a.length !== l); f = !0);
48
- } catch (r) {
49
- o = !0, n = r;
50
- } finally {
51
- try {
52
- if (!f && null != t.return && (u = t.return(), Object(u) !== u)) return;
53
- } finally {
54
- if (o) throw n;
55
- }
56
- }
57
- return a;
58
- }
59
- }
60
- function ownKeys(e, r) {
61
- var t = Object.keys(e);
62
- if (Object.getOwnPropertySymbols) {
63
- var o = Object.getOwnPropertySymbols(e);
64
- r && (o = o.filter(function (r) {
65
- return Object.getOwnPropertyDescriptor(e, r).enumerable;
66
- })), t.push.apply(t, o);
67
- }
68
- return t;
69
- }
70
- function _objectSpread2(e) {
71
- for (var r = 1; r < arguments.length; r++) {
72
- var t = null != arguments[r] ? arguments[r] : {};
73
- r % 2 ? ownKeys(Object(t), !0).forEach(function (r) {
74
- _defineProperty(e, r, t[r]);
75
- }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys(Object(t)).forEach(function (r) {
76
- Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r));
77
- });
78
- }
79
- return e;
80
- }
81
- function _regeneratorRuntime() {
82
- _regeneratorRuntime = function () {
83
- return e;
84
- };
85
- var t,
86
- e = {},
87
- r = Object.prototype,
88
- n = r.hasOwnProperty,
89
- o = Object.defineProperty || function (t, e, r) {
90
- t[e] = r.value;
91
- },
92
- i = "function" == typeof Symbol ? Symbol : {},
93
- a = i.iterator || "@@iterator",
94
- c = i.asyncIterator || "@@asyncIterator",
95
- u = i.toStringTag || "@@toStringTag";
96
- function define(t, e, r) {
97
- return Object.defineProperty(t, e, {
98
- value: r,
99
- enumerable: !0,
100
- configurable: !0,
101
- writable: !0
102
- }), t[e];
103
- }
104
- try {
105
- define({}, "");
106
- } catch (t) {
107
- define = function (t, e, r) {
108
- return t[e] = r;
109
- };
110
- }
111
- function wrap(t, e, r, n) {
112
- var i = e && e.prototype instanceof Generator ? e : Generator,
113
- a = Object.create(i.prototype),
114
- c = new Context(n || []);
115
- return o(a, "_invoke", {
116
- value: makeInvokeMethod(t, r, c)
117
- }), a;
118
- }
119
- function tryCatch(t, e, r) {
120
- try {
121
- return {
122
- type: "normal",
123
- arg: t.call(e, r)
124
- };
125
- } catch (t) {
126
- return {
127
- type: "throw",
128
- arg: t
129
- };
130
- }
131
- }
132
- e.wrap = wrap;
133
- var h = "suspendedStart",
134
- l = "suspendedYield",
135
- f = "executing",
136
- s = "completed",
137
- y = {};
138
- function Generator() {}
139
- function GeneratorFunction() {}
140
- function GeneratorFunctionPrototype() {}
141
- var p = {};
142
- define(p, a, function () {
143
- return this;
144
- });
145
- var d = Object.getPrototypeOf,
146
- v = d && d(d(values([])));
147
- v && v !== r && n.call(v, a) && (p = v);
148
- var g = GeneratorFunctionPrototype.prototype = Generator.prototype = Object.create(p);
149
- function defineIteratorMethods(t) {
150
- ["next", "throw", "return"].forEach(function (e) {
151
- define(t, e, function (t) {
152
- return this._invoke(e, t);
153
- });
154
- });
155
- }
156
- function AsyncIterator(t, e) {
157
- function invoke(r, o, i, a) {
158
- var c = tryCatch(t[r], t, o);
159
- if ("throw" !== c.type) {
160
- var u = c.arg,
161
- h = u.value;
162
- return h && "object" == typeof h && n.call(h, "__await") ? e.resolve(h.__await).then(function (t) {
163
- invoke("next", t, i, a);
164
- }, function (t) {
165
- invoke("throw", t, i, a);
166
- }) : e.resolve(h).then(function (t) {
167
- u.value = t, i(u);
168
- }, function (t) {
169
- return invoke("throw", t, i, a);
170
- });
171
- }
172
- a(c.arg);
173
- }
174
- var r;
175
- o(this, "_invoke", {
176
- value: function (t, n) {
177
- function callInvokeWithMethodAndArg() {
178
- return new e(function (e, r) {
179
- invoke(t, n, e, r);
180
- });
181
- }
182
- return r = r ? r.then(callInvokeWithMethodAndArg, callInvokeWithMethodAndArg) : callInvokeWithMethodAndArg();
183
- }
184
- });
185
- }
186
- function makeInvokeMethod(e, r, n) {
187
- var o = h;
188
- return function (i, a) {
189
- if (o === f) throw new Error("Generator is already running");
190
- if (o === s) {
191
- if ("throw" === i) throw a;
192
- return {
193
- value: t,
194
- done: !0
195
- };
196
- }
197
- for (n.method = i, n.arg = a;;) {
198
- var c = n.delegate;
199
- if (c) {
200
- var u = maybeInvokeDelegate(c, n);
201
- if (u) {
202
- if (u === y) continue;
203
- return u;
204
- }
205
- }
206
- if ("next" === n.method) n.sent = n._sent = n.arg;else if ("throw" === n.method) {
207
- if (o === h) throw o = s, n.arg;
208
- n.dispatchException(n.arg);
209
- } else "return" === n.method && n.abrupt("return", n.arg);
210
- o = f;
211
- var p = tryCatch(e, r, n);
212
- if ("normal" === p.type) {
213
- if (o = n.done ? s : l, p.arg === y) continue;
214
- return {
215
- value: p.arg,
216
- done: n.done
217
- };
218
- }
219
- "throw" === p.type && (o = s, n.method = "throw", n.arg = p.arg);
220
- }
221
- };
222
- }
223
- function maybeInvokeDelegate(e, r) {
224
- var n = r.method,
225
- o = e.iterator[n];
226
- if (o === t) return r.delegate = null, "throw" === n && e.iterator.return && (r.method = "return", r.arg = t, maybeInvokeDelegate(e, r), "throw" === r.method) || "return" !== n && (r.method = "throw", r.arg = new TypeError("The iterator does not provide a '" + n + "' method")), y;
227
- var i = tryCatch(o, e.iterator, r.arg);
228
- if ("throw" === i.type) return r.method = "throw", r.arg = i.arg, r.delegate = null, y;
229
- var a = i.arg;
230
- return a ? a.done ? (r[e.resultName] = a.value, r.next = e.nextLoc, "return" !== r.method && (r.method = "next", r.arg = t), r.delegate = null, y) : a : (r.method = "throw", r.arg = new TypeError("iterator result is not an object"), r.delegate = null, y);
231
- }
232
- function pushTryEntry(t) {
233
- var e = {
234
- tryLoc: t[0]
235
- };
236
- 1 in t && (e.catchLoc = t[1]), 2 in t && (e.finallyLoc = t[2], e.afterLoc = t[3]), this.tryEntries.push(e);
237
- }
238
- function resetTryEntry(t) {
239
- var e = t.completion || {};
240
- e.type = "normal", delete e.arg, t.completion = e;
241
- }
242
- function Context(t) {
243
- this.tryEntries = [{
244
- tryLoc: "root"
245
- }], t.forEach(pushTryEntry, this), this.reset(!0);
246
- }
247
- function values(e) {
248
- if (e || "" === e) {
249
- var r = e[a];
250
- if (r) return r.call(e);
251
- if ("function" == typeof e.next) return e;
252
- if (!isNaN(e.length)) {
253
- var o = -1,
254
- i = function next() {
255
- for (; ++o < e.length;) if (n.call(e, o)) return next.value = e[o], next.done = !1, next;
256
- return next.value = t, next.done = !0, next;
257
- };
258
- return i.next = i;
259
- }
260
- }
261
- throw new TypeError(typeof e + " is not iterable");
262
- }
263
- return GeneratorFunction.prototype = GeneratorFunctionPrototype, o(g, "constructor", {
264
- value: GeneratorFunctionPrototype,
265
- configurable: !0
266
- }), o(GeneratorFunctionPrototype, "constructor", {
267
- value: GeneratorFunction,
268
- configurable: !0
269
- }), GeneratorFunction.displayName = define(GeneratorFunctionPrototype, u, "GeneratorFunction"), e.isGeneratorFunction = function (t) {
270
- var e = "function" == typeof t && t.constructor;
271
- return !!e && (e === GeneratorFunction || "GeneratorFunction" === (e.displayName || e.name));
272
- }, e.mark = function (t) {
273
- return Object.setPrototypeOf ? Object.setPrototypeOf(t, GeneratorFunctionPrototype) : (t.__proto__ = GeneratorFunctionPrototype, define(t, u, "GeneratorFunction")), t.prototype = Object.create(g), t;
274
- }, e.awrap = function (t) {
275
- return {
276
- __await: t
277
- };
278
- }, defineIteratorMethods(AsyncIterator.prototype), define(AsyncIterator.prototype, c, function () {
279
- return this;
280
- }), e.AsyncIterator = AsyncIterator, e.async = function (t, r, n, o, i) {
281
- void 0 === i && (i = Promise);
282
- var a = new AsyncIterator(wrap(t, r, n, o), i);
283
- return e.isGeneratorFunction(r) ? a : a.next().then(function (t) {
284
- return t.done ? t.value : a.next();
285
- });
286
- }, defineIteratorMethods(g), define(g, u, "Generator"), define(g, a, function () {
287
- return this;
288
- }), define(g, "toString", function () {
289
- return "[object Generator]";
290
- }), e.keys = function (t) {
291
- var e = Object(t),
292
- r = [];
293
- for (var n in e) r.push(n);
294
- return r.reverse(), function next() {
295
- for (; r.length;) {
296
- var t = r.pop();
297
- if (t in e) return next.value = t, next.done = !1, next;
298
- }
299
- return next.done = !0, next;
300
- };
301
- }, e.values = values, Context.prototype = {
302
- constructor: Context,
303
- reset: function (e) {
304
- if (this.prev = 0, this.next = 0, this.sent = this._sent = t, this.done = !1, this.delegate = null, this.method = "next", this.arg = t, this.tryEntries.forEach(resetTryEntry), !e) for (var r in this) "t" === r.charAt(0) && n.call(this, r) && !isNaN(+r.slice(1)) && (this[r] = t);
305
- },
306
- stop: function () {
307
- this.done = !0;
308
- var t = this.tryEntries[0].completion;
309
- if ("throw" === t.type) throw t.arg;
310
- return this.rval;
311
- },
312
- dispatchException: function (e) {
313
- if (this.done) throw e;
314
- var r = this;
315
- function handle(n, o) {
316
- return a.type = "throw", a.arg = e, r.next = n, o && (r.method = "next", r.arg = t), !!o;
317
- }
318
- for (var o = this.tryEntries.length - 1; o >= 0; --o) {
319
- var i = this.tryEntries[o],
320
- a = i.completion;
321
- if ("root" === i.tryLoc) return handle("end");
322
- if (i.tryLoc <= this.prev) {
323
- var c = n.call(i, "catchLoc"),
324
- u = n.call(i, "finallyLoc");
325
- if (c && u) {
326
- if (this.prev < i.catchLoc) return handle(i.catchLoc, !0);
327
- if (this.prev < i.finallyLoc) return handle(i.finallyLoc);
328
- } else if (c) {
329
- if (this.prev < i.catchLoc) return handle(i.catchLoc, !0);
330
- } else {
331
- if (!u) throw new Error("try statement without catch or finally");
332
- if (this.prev < i.finallyLoc) return handle(i.finallyLoc);
333
- }
334
- }
335
- }
336
- },
337
- abrupt: function (t, e) {
338
- for (var r = this.tryEntries.length - 1; r >= 0; --r) {
339
- var o = this.tryEntries[r];
340
- if (o.tryLoc <= this.prev && n.call(o, "finallyLoc") && this.prev < o.finallyLoc) {
341
- var i = o;
342
- break;
343
- }
344
- }
345
- i && ("break" === t || "continue" === t) && i.tryLoc <= e && e <= i.finallyLoc && (i = null);
346
- var a = i ? i.completion : {};
347
- return a.type = t, a.arg = e, i ? (this.method = "next", this.next = i.finallyLoc, y) : this.complete(a);
348
- },
349
- complete: function (t, e) {
350
- if ("throw" === t.type) throw t.arg;
351
- return "break" === t.type || "continue" === t.type ? this.next = t.arg : "return" === t.type ? (this.rval = this.arg = t.arg, this.method = "return", this.next = "end") : "normal" === t.type && e && (this.next = e), y;
352
- },
353
- finish: function (t) {
354
- for (var e = this.tryEntries.length - 1; e >= 0; --e) {
355
- var r = this.tryEntries[e];
356
- if (r.finallyLoc === t) return this.complete(r.completion, r.afterLoc), resetTryEntry(r), y;
357
- }
358
- },
359
- catch: function (t) {
360
- for (var e = this.tryEntries.length - 1; e >= 0; --e) {
361
- var r = this.tryEntries[e];
362
- if (r.tryLoc === t) {
363
- var n = r.completion;
364
- if ("throw" === n.type) {
365
- var o = n.arg;
366
- resetTryEntry(r);
367
- }
368
- return o;
369
- }
370
- }
371
- throw new Error("illegal catch attempt");
372
- },
373
- delegateYield: function (e, r, n) {
374
- return this.delegate = {
375
- iterator: values(e),
376
- resultName: r,
377
- nextLoc: n
378
- }, "next" === this.method && (this.arg = t), y;
379
- }
380
- }, e;
381
- }
382
- function asyncGeneratorStep(gen, resolve, reject, _next, _throw, key, arg) {
383
- try {
384
- var info = gen[key](arg);
385
- var value = info.value;
386
- } catch (error) {
387
- reject(error);
388
- return;
389
- }
390
- if (info.done) {
391
- resolve(value);
392
- } else {
393
- Promise.resolve(value).then(_next, _throw);
394
- }
395
- }
396
- function _asyncToGenerator(fn) {
397
- return function () {
398
- var self = this,
399
- args = arguments;
400
- return new Promise(function (resolve, reject) {
401
- var gen = fn.apply(self, args);
402
- function _next(value) {
403
- asyncGeneratorStep(gen, resolve, reject, _next, _throw, "next", value);
404
- }
405
- function _throw(err) {
406
- asyncGeneratorStep(gen, resolve, reject, _next, _throw, "throw", err);
407
- }
408
- _next(undefined);
409
- });
410
- };
411
- }
412
- function _defineProperty(obj, key, value) {
413
- key = _toPropertyKey(key);
414
- if (key in obj) {
415
- Object.defineProperty(obj, key, {
416
- value: value,
417
- enumerable: true,
418
- configurable: true,
419
- writable: true
420
- });
421
- } else {
422
- obj[key] = value;
423
- }
424
- return obj;
425
- }
426
- function _objectWithoutPropertiesLoose(source, excluded) {
427
- if (source == null) return {};
428
- var target = {};
429
- var sourceKeys = Object.keys(source);
430
- var key, i;
431
- for (i = 0; i < sourceKeys.length; i++) {
432
- key = sourceKeys[i];
433
- if (excluded.indexOf(key) >= 0) continue;
434
- target[key] = source[key];
435
- }
436
- return target;
437
- }
438
- function _objectWithoutProperties(source, excluded) {
439
- if (source == null) return {};
440
- var target = _objectWithoutPropertiesLoose(source, excluded);
441
- var key, i;
442
- if (Object.getOwnPropertySymbols) {
443
- var sourceSymbolKeys = Object.getOwnPropertySymbols(source);
444
- for (i = 0; i < sourceSymbolKeys.length; i++) {
445
- key = sourceSymbolKeys[i];
446
- if (excluded.indexOf(key) >= 0) continue;
447
- if (!Object.prototype.propertyIsEnumerable.call(source, key)) continue;
448
- target[key] = source[key];
449
- }
450
- }
451
- return target;
452
- }
453
- function _slicedToArray(arr, i) {
454
- return _arrayWithHoles(arr) || _iterableToArrayLimit(arr, i) || _unsupportedIterableToArray(arr, i) || _nonIterableRest();
455
- }
456
- function _toConsumableArray(arr) {
457
- return _arrayWithoutHoles(arr) || _iterableToArray(arr) || _unsupportedIterableToArray(arr) || _nonIterableSpread();
458
- }
459
- function _arrayWithoutHoles(arr) {
460
- if (Array.isArray(arr)) return _arrayLikeToArray(arr);
461
- }
462
- function _arrayWithHoles(arr) {
463
- if (Array.isArray(arr)) return arr;
464
- }
465
- function _iterableToArray(iter) {
466
- if (typeof Symbol !== "undefined" && iter[Symbol.iterator] != null || iter["@@iterator"] != null) return Array.from(iter);
467
- }
468
- function _unsupportedIterableToArray(o, minLen) {
469
- if (!o) return;
470
- if (typeof o === "string") return _arrayLikeToArray(o, minLen);
471
- var n = Object.prototype.toString.call(o).slice(8, -1);
472
- if (n === "Object" && o.constructor) n = o.constructor.name;
473
- if (n === "Map" || n === "Set") return Array.from(o);
474
- if (n === "Arguments" || /^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(n)) return _arrayLikeToArray(o, minLen);
475
- }
476
- function _arrayLikeToArray(arr, len) {
477
- if (len == null || len > arr.length) len = arr.length;
478
- for (var i = 0, arr2 = new Array(len); i < len; i++) arr2[i] = arr[i];
479
- return arr2;
480
- }
481
- function _nonIterableSpread() {
482
- throw new TypeError("Invalid attempt to spread non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method.");
483
- }
484
- function _nonIterableRest() {
485
- throw new TypeError("Invalid attempt to destructure non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method.");
486
- }
487
- function _toPrimitive(input, hint) {
488
- if (typeof input !== "object" || input === null) return input;
489
- var prim = input[Symbol.toPrimitive];
490
- if (prim !== undefined) {
491
- var res = prim.call(input, hint || "default");
492
- if (typeof res !== "object") return res;
493
- throw new TypeError("@@toPrimitive must return a primitive value.");
494
- }
495
- return (hint === "string" ? String : Number)(input);
496
- }
497
- function _toPropertyKey(arg) {
498
- var key = _toPrimitive(arg, "string");
499
- return typeof key === "symbol" ? key : String(key);
500
- }
501
-
502
33
  /* eslint-disable valid-jsdoc */
503
34
  // @ts-check
504
35
 
505
- var TRANSPARENT_GIF = "data:image/gif;base64,R0lGODlhAQABAIAAAAAAAP///yH5BAEAAAAALAAAAAABAAEAAAIBRAA7";
36
+ const TRANSPARENT_GIF = "data:image/gif;base64,R0lGODlhAQABAIAAAAAAAP///yH5BAEAAAAALAAAAAABAAEAAAIBRAA7";
506
37
 
507
38
  /**
508
39
  * Replace all text with emoji with an image html tag
@@ -510,11 +41,11 @@ var TRANSPARENT_GIF = "data:image/gif;base64,R0lGODlhAQABAIAAAAAAAP///yH5BAEAAAA
510
41
  * @return {string}
511
42
  */
512
43
  function replaceAllTextEmojis(text) {
513
- var allEmojis = getAllEmojisFromText(text);
44
+ let allEmojis = getAllEmojisFromText(text);
514
45
  if (allEmojis) {
515
- allEmojis = _toConsumableArray(new Set(allEmojis)); // remove duplicates
46
+ allEmojis = [...new Set(allEmojis)]; // remove duplicates
516
47
 
517
- allEmojis.forEach(function (emoji) {
48
+ allEmojis.forEach(emoji => {
518
49
  text = replaceAll(text, emoji, getInputEmojiHTML('', emoji));
519
50
  });
520
51
  }
@@ -550,18 +81,18 @@ function getAllEmojisFromText(text) {
550
81
  function getImageEmoji(emoji) {
551
82
  var _emojiPickerEl$shadow;
552
83
  /** @type {HTMLElement | null} */
553
- var emojiPickerEl = document.querySelector('em-emoji-picker');
84
+ const emojiPickerEl = document.querySelector('em-emoji-picker');
554
85
  if (!emojiPickerEl) {
555
- return getInputEmojiNativeHTML(emoji["native"]);
86
+ return getInputEmojiNativeHTML(emoji.native);
556
87
  }
557
88
 
558
89
  /** @type {HTMLSpanElement | null=} */
559
- var emojiSpanEl = emojiPickerEl === null || emojiPickerEl === void 0 || (_emojiPickerEl$shadow = emojiPickerEl.shadowRoot) === null || _emojiPickerEl$shadow === void 0 ? void 0 : _emojiPickerEl$shadow.querySelector("[title=\"".concat(emoji.name, "\"] > span > span"));
90
+ const emojiSpanEl = emojiPickerEl === null || emojiPickerEl === void 0 || (_emojiPickerEl$shadow = emojiPickerEl.shadowRoot) === null || _emojiPickerEl$shadow === void 0 ? void 0 : _emojiPickerEl$shadow.querySelector("[title=\"".concat(emoji.name, "\"] > span > span"));
560
91
  if (!emojiSpanEl) {
561
- return getInputEmojiNativeHTML(emoji["native"]);
92
+ return getInputEmojiNativeHTML(emoji.native);
562
93
  }
563
- var style = replaceAll(emojiSpanEl.style.cssText, '"', "'");
564
- return getInputEmojiHTML(style, emoji["native"]);
94
+ const style = replaceAll(emojiSpanEl.style.cssText, '"', "'");
95
+ return getInputEmojiHTML(style, emoji.native);
565
96
  }
566
97
 
567
98
  // eslint-disable-next-line valid-jsdoc
@@ -590,10 +121,10 @@ function getInputEmojiNativeHTML(emoji) {
590
121
  * @return {string}
591
122
  */
592
123
  function replaceAllTextEmojiToString(html) {
593
- var container = document.createElement("div");
124
+ const container = document.createElement("div");
594
125
  container.innerHTML = html;
595
- var images = Array.prototype.slice.call(container.querySelectorAll("img"));
596
- images.forEach(function (image) {
126
+ const images = Array.prototype.slice.call(container.querySelectorAll("img"));
127
+ images.forEach(image => {
597
128
  container.innerHTML = container.innerHTML.replace(image.outerHTML, image.dataset.emoji);
598
129
  });
599
130
  return container.innerHTML;
@@ -606,12 +137,12 @@ function replaceAllTextEmojiToString(html) {
606
137
  * @param {React.ClipboardEvent} event
607
138
  */
608
139
  function handleCopy(event) {
609
- var selectedText = window.getSelection();
140
+ const selectedText = window.getSelection();
610
141
  if (selectedText === null) {
611
142
  return;
612
143
  }
613
- var container = document.createElement("div");
614
- for (var i = 0, len = selectedText.rangeCount; i < len; ++i) {
144
+ let container = document.createElement("div");
145
+ for (let i = 0, len = selectedText.rangeCount; i < len; ++i) {
615
146
  container.appendChild(selectedText.getRangeAt(i).cloneContents());
616
147
  }
617
148
  container = replaceEmojiToString(container);
@@ -619,28 +150,42 @@ function handleCopy(event) {
619
150
  event.preventDefault();
620
151
  }
621
152
 
153
+ /** @type {Range|undefined} */
154
+ /** @type {Range|undefined} */
155
+ let currentRangeCached;
156
+
622
157
  /**
623
- *
624
- * @param {string} html
158
+ * Caches the current text selection range
159
+ */
160
+ function cacheCurrentRange() {
161
+ const selection = window.getSelection();
162
+ if (!selection.rangeCount || (selection === null || selection === void 0 ? void 0 : selection.anchorNode['className']) !== 'react-input-emoji--input' && selection.anchorNode.parentNode['className'] !== 'react-input-emoji--input') return;
163
+ const range = selection.getRangeAt(0);
164
+ currentRangeCached = range.cloneRange();
165
+ }
166
+
167
+ /**
168
+ * @param {string} html - HTML string to be pasted at the caret position
625
169
  */
626
170
  function handlePasteHtmlAtCaret(html) {
627
- var sel;
628
- var range;
171
+ let sel;
172
+ let range;
629
173
  if (window.getSelection) {
630
174
  // IE9 and non-IE
631
175
  sel = window.getSelection();
632
176
  if (sel === null) return;
633
177
  if (sel.getRangeAt && sel.rangeCount) {
634
- range = sel.getRangeAt(0);
178
+ var _currentRangeCached;
179
+ range = (_currentRangeCached = currentRangeCached) !== null && _currentRangeCached !== void 0 ? _currentRangeCached : sel.getRangeAt(0);
635
180
  range.deleteContents();
636
181
 
637
182
  // Range.createContextualFragment() would be useful here but is
638
183
  // non-standard and not supported in all browsers (IE9, for one)
639
- var el = document.createElement("div");
184
+ const el = document.createElement("div");
640
185
  el.innerHTML = html;
641
- var frag = document.createDocumentFragment();
642
- var node;
643
- var lastNode;
186
+ const frag = document.createDocumentFragment();
187
+ let node;
188
+ let lastNode;
644
189
  while (node = el.firstChild) {
645
190
  lastNode = frag.appendChild(node);
646
191
  }
@@ -649,6 +194,7 @@ function handlePasteHtmlAtCaret(html) {
649
194
  // Preserve the selection
650
195
  if (lastNode) {
651
196
  range = range.cloneRange();
197
+ currentRangeCached = range;
652
198
  range.setStartAfter(lastNode);
653
199
  range.collapse(true);
654
200
  sel.removeAllRanges();
@@ -664,8 +210,8 @@ function handlePasteHtmlAtCaret(html) {
664
210
  * @return {HTMLDivElement}
665
211
  */
666
212
  function replaceEmojiToString(container) {
667
- var images = Array.prototype.slice.call(container.querySelectorAll("img"));
668
- images.forEach(function (image) {
213
+ const images = Array.prototype.slice.call(container.querySelectorAll("img"));
214
+ images.forEach(image => {
669
215
  image.outerHTML = image.dataset.emoji;
670
216
  });
671
217
  return container;
@@ -677,10 +223,12 @@ function replaceEmojiToString(container) {
677
223
  * @return {number}
678
224
  */
679
225
  function totalCharacters(_ref2) {
680
- var text = _ref2.text,
681
- html = _ref2.html;
682
- var textCount = text.length;
683
- var emojisCount = (html.match(/<img/g) || []).length;
226
+ let {
227
+ text,
228
+ html
229
+ } = _ref2;
230
+ const textCount = text.length;
231
+ const emojisCount = (html.match(/<img/g) || []).length;
684
232
  return textCount + emojisCount;
685
233
  }
686
234
  /**
@@ -689,12 +237,12 @@ function totalCharacters(_ref2) {
689
237
  * @return {string}
690
238
  */
691
239
  function removeHtmlExceptBr(inputDiv) {
692
- var temp = inputDiv.innerHTML.replaceAll(/<br\s*\/?>/gi, "[BR]"); // temporarily replace <br> with placeholder
693
- var tempContainer = document.createElement("div");
240
+ const temp = inputDiv.innerHTML.replaceAll(/<br\s*\/?>/gi, "[BR]"); // temporarily replace <br> with placeholder
241
+ const tempContainer = document.createElement("div");
694
242
  tempContainer.innerHTML = temp;
695
- var stripped = tempContainer.innerText; // strip all html tags
696
- var _final = stripped.replaceAll(/\[BR\]/gi, "</br>"); // replace placeholders with <br>
697
- return _final;
243
+ const stripped = tempContainer.innerText; // strip all html tags
244
+ const final = stripped.replaceAll(/\[BR\]/gi, "</br>"); // replace placeholders with <br>
245
+ return final;
698
246
  }
699
247
 
700
248
  /**
@@ -703,8 +251,8 @@ function removeHtmlExceptBr(inputDiv) {
703
251
  * @returns
704
252
  */
705
253
  function getSelectionStart$1(range) {
706
- var node = range.startContainer;
707
- var offset = range.startOffset;
254
+ let node = range.startContainer;
255
+ let offset = range.startOffset;
708
256
 
709
257
  // Handle cases where the selection start node is not a text node
710
258
  if (node.nodeType !== Node.TEXT_NODE) {
@@ -721,8 +269,8 @@ function getSelectionStart$1(range) {
721
269
  offset = 0;
722
270
  }
723
271
  return {
724
- node: node,
725
- offset: offset
272
+ node,
273
+ offset
726
274
  };
727
275
  }
728
276
 
@@ -731,13 +279,13 @@ function getSelectionStart$1(range) {
731
279
  * @return {Object} cursor
732
280
  */
733
281
  function getCursor() {
734
- var selection = window.getSelection();
735
- var range = selection.getRangeAt(0);
736
- var selectionStart = getSelectionStart$1(range);
282
+ const selection = window.getSelection();
283
+ const range = selection.getRangeAt(0);
284
+ const selectionStart = getSelectionStart$1(range);
737
285
  return {
738
- selection: selection,
739
- range: range,
740
- selectionStart: selectionStart
286
+ selection,
287
+ range,
288
+ selectionStart
741
289
  };
742
290
  }
743
291
 
@@ -745,30 +293,31 @@ function getCursor() {
745
293
  *
746
294
  */
747
295
  function addLineBreak() {
748
- var _getCursor = getCursor(),
749
- selection = _getCursor.selection,
750
- range = _getCursor.range,
751
- selectionStart = _getCursor.selectionStart;
296
+ const {
297
+ selection,
298
+ range,
299
+ selectionStart
300
+ } = getCursor();
752
301
 
753
302
  // If cursor is at the end of the text content, add one more line break
754
303
  if (selection.isCollapsed && selectionStart.offset === selectionStart.node.textContent.length) {
755
- var br = document.createElement("br");
304
+ const br = document.createElement("br");
756
305
  range.insertNode(br);
757
306
  range.setStartAfter(br);
758
307
  range.setEndAfter(br);
759
308
  selection.removeAllRanges();
760
309
  selection.addRange(range);
761
- var br2 = document.createElement("br");
310
+ const br2 = document.createElement("br");
762
311
  range.insertNode(br2);
763
312
  range.setStartAfter(br2);
764
313
  range.setEndAfter(br2);
765
314
  selection.removeAllRanges();
766
315
  selection.addRange(range);
767
316
  } else {
768
- var _br = document.createElement("br");
769
- range.insertNode(_br);
770
- range.setStartAfter(_br);
771
- range.setEndAfter(_br);
317
+ const br = document.createElement("br");
318
+ range.insertNode(br);
319
+ range.setStartAfter(br);
320
+ range.setEndAfter(br);
772
321
  selection.removeAllRanges();
773
322
  selection.addRange(range);
774
323
  // Set cursor position right before the first letter after the line break
@@ -987,7 +536,7 @@ var reactEasyEmoji = function reactEasyEmoji(element, optionsOrFn) {
987
536
  var emoji = reactEasyEmoji;
988
537
 
989
538
  // @ts-check
990
- var EMOJI_REGEX = new RegExp(/(?:[\u2700-\u27bf]|(?:\ud83c[\udde6-\uddff]){2}|[\ud800-\udbff][\udc00-\udfff])[\ufe0e\ufe0f]?(?:[\u0300-\u036f\ufe20-\ufe23\u20d0-\u20f0]|\ud83c[\udffb-\udfff])?(?:\u200d(?:[^\ud800-\udfff]|(?:\ud83c[\udde6-\uddff]){2}|[\ud800-\udbff][\udc00-\udfff])[\ufe0e\ufe0f]?(?:[\u0300-\u036f\ufe20-\ufe23\u20d0-\u20f0]|\ud83c[\udffb-\udfff])?)*/g);
539
+ const EMOJI_REGEX = new RegExp(/(?:[\u2700-\u27bf]|(?:\ud83c[\udde6-\uddff]){2}|[\ud800-\udbff][\udc00-\udfff])[\ufe0e\ufe0f]?(?:[\u0300-\u036f\ufe20-\ufe23\u20d0-\u20f0]|\ud83c[\udffb-\udfff])?(?:\u200d(?:[^\ud800-\udfff]|(?:\ud83c[\udde6-\uddff]){2}|[\ud800-\udbff][\udc00-\udfff])[\ufe0e\ufe0f]?(?:[\u0300-\u036f\ufe20-\ufe23\u20d0-\u20f0]|\ud83c[\udffb-\udfff])?)*/g);
991
540
 
992
541
  /**
993
542
  * @typedef {import('../types/types').SanitizeFn} SanitizeFn
@@ -1000,17 +549,17 @@ var EMOJI_REGEX = new RegExp(/(?:[\u2700-\u27bf]|(?:\ud83c[\udde6-\uddff]){2}|[\
1000
549
  */
1001
550
  function useSanitize(shouldReturn, shouldConvertEmojiToImage) {
1002
551
  /** @type {React.MutableRefObject<SanitizeFn[]>} */
1003
- var sanitizeFnsRef = useRef([]);
1004
- var sanitizedTextRef = useRef("");
552
+ const sanitizeFnsRef = useRef([]);
553
+ const sanitizedTextRef = useRef("");
1005
554
 
1006
555
  /** @type {(fn: SanitizeFn) => void} */
1007
- var addSanitizeFn = useCallback(function (fn) {
556
+ const addSanitizeFn = useCallback(fn => {
1008
557
  sanitizeFnsRef.current.push(fn);
1009
558
  }, []);
1010
559
 
1011
560
  /** @type {(html: string) => string} */
1012
- var sanitize = useCallback(function (html) {
1013
- var result = sanitizeFnsRef.current.reduce(function (acc, fn) {
561
+ const sanitize = useCallback(html => {
562
+ let result = sanitizeFnsRef.current.reduce((acc, fn) => {
1014
563
  return fn(acc);
1015
564
  }, html);
1016
565
  result = replaceAllHtmlToString(result, shouldReturn);
@@ -1021,9 +570,9 @@ function useSanitize(shouldReturn, shouldConvertEmojiToImage) {
1021
570
  return result;
1022
571
  }, [shouldReturn, shouldConvertEmojiToImage]);
1023
572
  return {
1024
- addSanitizeFn: addSanitizeFn,
1025
- sanitize: sanitize,
1026
- sanitizedTextRef: sanitizedTextRef
573
+ addSanitizeFn,
574
+ sanitize,
575
+ sanitizedTextRef
1027
576
  };
1028
577
  }
1029
578
 
@@ -1034,9 +583,9 @@ function useSanitize(shouldReturn, shouldConvertEmojiToImage) {
1034
583
  * @return {string}
1035
584
  */
1036
585
  function replaceAllHtmlToString(html, shouldReturn) {
1037
- var container = document.createElement("div");
586
+ const container = document.createElement("div");
1038
587
  container.innerHTML = html;
1039
- var text;
588
+ let text;
1040
589
  if (shouldReturn) {
1041
590
  text = removeHtmlExceptBr(container);
1042
591
  } else {
@@ -1086,34 +635,35 @@ function handleEmoji(text) {
1086
635
  * @param {Props} props
1087
636
  */
1088
637
  function useExpose(_ref) {
1089
- var ref = _ref.ref,
1090
- textInputRef = _ref.textInputRef,
1091
- setValue = _ref.setValue,
1092
- emitChange = _ref.emitChange,
1093
- shouldConvertEmojiToImage = _ref.shouldConvertEmojiToImage;
1094
- var _useSanitize = useSanitize(false, shouldConvertEmojiToImage),
1095
- sanitize = _useSanitize.sanitize,
1096
- sanitizedTextRef = _useSanitize.sanitizedTextRef;
1097
- useImperativeHandle(ref, function () {
1098
- return {
1099
- get value() {
1100
- return sanitizedTextRef.current;
1101
- },
1102
- set value(value) {
1103
- setValue(value);
1104
- },
1105
- focus: function focus() {
1106
- if (textInputRef.current === null) return;
1107
- textInputRef.current.focus();
1108
- },
1109
- blur: function blur() {
1110
- if (textInputRef.current !== null) {
1111
- sanitize(textInputRef.current.html);
1112
- }
1113
- emitChange();
638
+ let {
639
+ ref,
640
+ textInputRef,
641
+ setValue,
642
+ emitChange,
643
+ shouldConvertEmojiToImage
644
+ } = _ref;
645
+ const {
646
+ sanitize,
647
+ sanitizedTextRef
648
+ } = useSanitize(false, shouldConvertEmojiToImage);
649
+ useImperativeHandle(ref, () => ({
650
+ get value() {
651
+ return sanitizedTextRef.current;
652
+ },
653
+ set value(value) {
654
+ setValue(value);
655
+ },
656
+ focus: () => {
657
+ if (textInputRef.current === null) return;
658
+ textInputRef.current.focus();
659
+ },
660
+ blur: () => {
661
+ if (textInputRef.current !== null) {
662
+ sanitize(textInputRef.current.html);
1114
663
  }
1115
- };
1116
- });
664
+ emitChange();
665
+ }
666
+ }));
1117
667
  }
1118
668
 
1119
669
  // @ts-check
@@ -1127,19 +677,19 @@ function useExpose(_ref) {
1127
677
  */
1128
678
  function useEmit(textInputRef, onResize, onChange) {
1129
679
  /** @type {React.MutableRefObject<{width: number; height: number} | null>} */
1130
- var currentSizeRef = useRef(null);
1131
- var onChangeFn = useRef(onChange);
1132
- var checkAndEmitResize = useCallback(function () {
680
+ const currentSizeRef = useRef(null);
681
+ const onChangeFn = useRef(onChange);
682
+ const checkAndEmitResize = useCallback(() => {
1133
683
  if (textInputRef.current !== null) {
1134
- var currentSize = currentSizeRef.current;
1135
- var nextSize = textInputRef.current.size;
684
+ const currentSize = currentSizeRef.current;
685
+ const nextSize = textInputRef.current.size;
1136
686
  if ((!currentSize || currentSize.width !== nextSize.width || currentSize.height !== nextSize.height) && typeof onResize === "function") {
1137
687
  onResize(nextSize);
1138
688
  }
1139
689
  currentSizeRef.current = nextSize;
1140
690
  }
1141
691
  }, [onResize, textInputRef]);
1142
- var emitChange = useCallback(function (sanitizedText) {
692
+ const emitChange = useCallback(sanitizedText => {
1143
693
  if (typeof onChangeFn.current === "function") {
1144
694
  onChangeFn.current(sanitizedText);
1145
695
  }
@@ -1147,7 +697,7 @@ function useEmit(textInputRef, onResize, onChange) {
1147
697
  checkAndEmitResize();
1148
698
  }
1149
699
  }, [checkAndEmitResize, onResize]);
1150
- useEffect(function () {
700
+ useEffect(() => {
1151
701
  if (textInputRef.current) {
1152
702
  checkAndEmitResize();
1153
703
  }
@@ -1155,7 +705,84 @@ function useEmit(textInputRef, onResize, onChange) {
1155
705
  return emitChange;
1156
706
  }
1157
707
 
1158
- var _excluded = ["placeholder", "style", "tabIndex", "className", "onChange"];
708
+ function ownKeys(e, r) {
709
+ var t = Object.keys(e);
710
+ if (Object.getOwnPropertySymbols) {
711
+ var o = Object.getOwnPropertySymbols(e);
712
+ r && (o = o.filter(function (r) {
713
+ return Object.getOwnPropertyDescriptor(e, r).enumerable;
714
+ })), t.push.apply(t, o);
715
+ }
716
+ return t;
717
+ }
718
+ function _objectSpread2(e) {
719
+ for (var r = 1; r < arguments.length; r++) {
720
+ var t = null != arguments[r] ? arguments[r] : {};
721
+ r % 2 ? ownKeys(Object(t), !0).forEach(function (r) {
722
+ _defineProperty(e, r, t[r]);
723
+ }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys(Object(t)).forEach(function (r) {
724
+ Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r));
725
+ });
726
+ }
727
+ return e;
728
+ }
729
+ function _defineProperty(obj, key, value) {
730
+ key = _toPropertyKey(key);
731
+ if (key in obj) {
732
+ Object.defineProperty(obj, key, {
733
+ value: value,
734
+ enumerable: true,
735
+ configurable: true,
736
+ writable: true
737
+ });
738
+ } else {
739
+ obj[key] = value;
740
+ }
741
+ return obj;
742
+ }
743
+ function _objectWithoutPropertiesLoose(source, excluded) {
744
+ if (source == null) return {};
745
+ var target = {};
746
+ var sourceKeys = Object.keys(source);
747
+ var key, i;
748
+ for (i = 0; i < sourceKeys.length; i++) {
749
+ key = sourceKeys[i];
750
+ if (excluded.indexOf(key) >= 0) continue;
751
+ target[key] = source[key];
752
+ }
753
+ return target;
754
+ }
755
+ function _objectWithoutProperties(source, excluded) {
756
+ if (source == null) return {};
757
+ var target = _objectWithoutPropertiesLoose(source, excluded);
758
+ var key, i;
759
+ if (Object.getOwnPropertySymbols) {
760
+ var sourceSymbolKeys = Object.getOwnPropertySymbols(source);
761
+ for (i = 0; i < sourceSymbolKeys.length; i++) {
762
+ key = sourceSymbolKeys[i];
763
+ if (excluded.indexOf(key) >= 0) continue;
764
+ if (!Object.prototype.propertyIsEnumerable.call(source, key)) continue;
765
+ target[key] = source[key];
766
+ }
767
+ }
768
+ return target;
769
+ }
770
+ function _toPrimitive(input, hint) {
771
+ if (typeof input !== "object" || input === null) return input;
772
+ var prim = input[Symbol.toPrimitive];
773
+ if (prim !== undefined) {
774
+ var res = prim.call(input, hint || "default");
775
+ if (typeof res !== "object") return res;
776
+ throw new TypeError("@@toPrimitive must return a primitive value.");
777
+ }
778
+ return (hint === "string" ? String : Number)(input);
779
+ }
780
+ function _toPropertyKey(arg) {
781
+ var key = _toPrimitive(arg, "string");
782
+ return typeof key === "symbol" ? key : String(key);
783
+ }
784
+
785
+ const _excluded = ["placeholder", "style", "tabIndex", "className", "onChange"];
1159
786
 
1160
787
  /**
1161
788
  * @typedef {Object} Props
@@ -1189,78 +816,78 @@ var _excluded = ["placeholder", "style", "tabIndex", "className", "onChange"];
1189
816
 
1190
817
  // eslint-disable-next-line valid-jsdoc
1191
818
  /** @type {React.ForwardRefRenderFunction<Ref, Props>} */
1192
- var TextInput = function TextInput(_ref, ref) {
1193
- var placeholder = _ref.placeholder,
1194
- style = _ref.style,
1195
- tabIndex = _ref.tabIndex,
1196
- className = _ref.className,
1197
- onChange = _ref.onChange,
819
+ const TextInput = (_ref, ref) => {
820
+ let {
821
+ placeholder,
822
+ style,
823
+ tabIndex,
824
+ className,
825
+ onChange
826
+ } = _ref,
1198
827
  props = _objectWithoutProperties(_ref, _excluded);
1199
- useImperativeHandle(ref, function () {
1200
- return {
1201
- appendContent: function appendContent(html) {
1202
- if (textInputRef.current) {
1203
- textInputRef.current.focus();
1204
- }
1205
- handlePasteHtmlAtCaret(html);
1206
- if (textInputRef.current) {
1207
- textInputRef.current.focus();
1208
- }
1209
- if (textInputRef.current && placeholderRef.current && replaceAllTextEmojiToString(textInputRef.current.innerHTML) === "") {
828
+ useImperativeHandle(ref, () => ({
829
+ appendContent: html => {
830
+ if (textInputRef.current) {
831
+ textInputRef.current.focus();
832
+ }
833
+ handlePasteHtmlAtCaret(html);
834
+ if (textInputRef.current) {
835
+ textInputRef.current.focus();
836
+ }
837
+ if (textInputRef.current && placeholderRef.current && replaceAllTextEmojiToString(textInputRef.current.innerHTML) === "") {
838
+ placeholderRef.current.style.visibility = "visible";
839
+ } else if (placeholderRef.current) {
840
+ placeholderRef.current.style.visibility = "hidden";
841
+ }
842
+ if (textInputRef.current && typeof onChange === 'function') {
843
+ onChange(textInputRef.current.innerHTML);
844
+ }
845
+ },
846
+ set html(value) {
847
+ if (textInputRef.current) {
848
+ textInputRef.current.innerHTML = value;
849
+ }
850
+ if (placeholderRef.current) {
851
+ const text = replaceAllTextEmojiToString(value);
852
+ if (text === "") {
1210
853
  placeholderRef.current.style.visibility = "visible";
1211
- } else if (placeholderRef.current) {
854
+ } else {
1212
855
  placeholderRef.current.style.visibility = "hidden";
1213
856
  }
1214
- if (textInputRef.current && typeof onChange === 'function') {
1215
- onChange(textInputRef.current.innerHTML);
1216
- }
1217
- },
1218
- set html(value) {
1219
- if (textInputRef.current) {
1220
- textInputRef.current.innerHTML = value;
1221
- }
1222
- if (placeholderRef.current) {
1223
- var text = replaceAllTextEmojiToString(value);
1224
- if (text === "") {
1225
- placeholderRef.current.style.visibility = "visible";
1226
- } else {
1227
- placeholderRef.current.style.visibility = "hidden";
1228
- }
1229
- }
1230
- if (typeof onChange === 'function' && textInputRef.current) {
1231
- onChange(textInputRef.current.innerHTML);
1232
- }
1233
- },
1234
- get html() {
1235
- if (!textInputRef.current) return '';
1236
- return textInputRef.current.innerHTML;
1237
- },
1238
- get text() {
1239
- if (!textInputRef.current) return '';
1240
- return textInputRef.current.innerText;
1241
- },
1242
- get size() {
1243
- if (!textInputRef.current) {
1244
- return {
1245
- width: 0,
1246
- height: 0
1247
- };
1248
- }
857
+ }
858
+ if (typeof onChange === 'function' && textInputRef.current) {
859
+ onChange(textInputRef.current.innerHTML);
860
+ }
861
+ },
862
+ get html() {
863
+ if (!textInputRef.current) return '';
864
+ return textInputRef.current.innerHTML;
865
+ },
866
+ get text() {
867
+ if (!textInputRef.current) return '';
868
+ return textInputRef.current.innerText;
869
+ },
870
+ get size() {
871
+ if (!textInputRef.current) {
1249
872
  return {
1250
- width: textInputRef.current.offsetWidth,
1251
- height: textInputRef.current.offsetHeight
873
+ width: 0,
874
+ height: 0
1252
875
  };
1253
- },
1254
- focus: function focus() {
1255
- if (!textInputRef.current) return;
1256
- textInputRef.current.focus();
1257
876
  }
1258
- };
1259
- });
877
+ return {
878
+ width: textInputRef.current.offsetWidth,
879
+ height: textInputRef.current.offsetHeight
880
+ };
881
+ },
882
+ focus() {
883
+ if (!textInputRef.current) return;
884
+ textInputRef.current.focus();
885
+ }
886
+ }));
1260
887
 
1261
888
  /** @type {React.CSSProperties} */
1262
- var placeholderStyle = useMemo(function () {
1263
- var placeholderStyle = {};
889
+ const placeholderStyle = useMemo(() => {
890
+ const placeholderStyle = {};
1264
891
  if (style.placeholderColor) {
1265
892
  placeholderStyle.color = style.placeholderColor;
1266
893
  }
@@ -1268,8 +895,8 @@ var TextInput = function TextInput(_ref, ref) {
1268
895
  }, [style === null || style === void 0 ? void 0 : style.placeholderColor]);
1269
896
 
1270
897
  /** @type {React.CSSProperties} */
1271
- var inputStyle = useMemo(function () {
1272
- var inputStyle = {};
898
+ const inputStyle = useMemo(() => {
899
+ const inputStyle = {};
1273
900
  if (style.color) {
1274
901
  inputStyle.color = style.color;
1275
902
  }
@@ -1277,9 +904,9 @@ var TextInput = function TextInput(_ref, ref) {
1277
904
  }, [style === null || style === void 0 ? void 0 : style.color]);
1278
905
 
1279
906
  /** @type {React.MutableRefObject<HTMLDivElement | null>} */
1280
- var placeholderRef = useRef(null);
907
+ const placeholderRef = useRef(null);
1281
908
  /** @type {React.MutableRefObject<HTMLDivElement | null>} */
1282
- var textInputRef = useRef(null);
909
+ const textInputRef = useRef(null);
1283
910
 
1284
911
  /**
1285
912
  *
@@ -1318,9 +945,9 @@ var TextInput = function TextInput(_ref, ref) {
1318
945
  */
1319
946
  function handleKeyUp(event) {
1320
947
  props.onKeyUp(event);
1321
- var input = textInputRef.current;
948
+ const input = textInputRef.current;
1322
949
  if (placeholderRef.current && input) {
1323
- var text = replaceAllTextEmojiToString(input.innerHTML);
950
+ const text = replaceAllTextEmojiToString(input.innerHTML);
1324
951
  if (text === "") {
1325
952
  placeholderRef.current.style.visibility = "visible";
1326
953
  } else {
@@ -1355,7 +982,9 @@ var TextInput = function TextInput(_ref, ref) {
1355
982
  style: inputStyle
1356
983
  })));
1357
984
  };
1358
- var TextInputWithRef = /*#__PURE__*/forwardRef(TextInput);
985
+ const TextInputWithRef = /*#__PURE__*/forwardRef(TextInput);
986
+
987
+ // vendors
1359
988
 
1360
989
  /**
1361
990
  * @typedef {object} Props
@@ -1371,16 +1000,15 @@ var TextInputWithRef = /*#__PURE__*/forwardRef(TextInput);
1371
1000
  * @return {JSX.Element}
1372
1001
  */
1373
1002
  function EmojiPickerButton(_ref) {
1374
- var showPicker = _ref.showPicker,
1375
- toggleShowPicker = _ref.toggleShowPicker,
1376
- buttonElement = _ref.buttonElement,
1377
- buttonRef = _ref.buttonRef;
1378
- var localButtonRef = useRef(null);
1379
- var _useState = useState(false),
1380
- _useState2 = _slicedToArray(_useState, 2),
1381
- showCustomButtonContent = _useState2[0],
1382
- setShowCustomButtonContent = _useState2[1];
1383
- useEffect(function () {
1003
+ let {
1004
+ showPicker,
1005
+ toggleShowPicker,
1006
+ buttonElement,
1007
+ buttonRef
1008
+ } = _ref;
1009
+ const localButtonRef = useRef(null);
1010
+ const [showCustomButtonContent, setShowCustomButtonContent] = useState(false);
1011
+ useEffect(() => {
1384
1012
  var _buttonRef$current$ch, _buttonRef$current, _buttonElement$childN, _buttonElement$childN2;
1385
1013
  if (((_buttonRef$current$ch = buttonRef === null || buttonRef === void 0 || (_buttonRef$current = buttonRef.current) === null || _buttonRef$current === void 0 || (_buttonRef$current = _buttonRef$current.childNodes) === null || _buttonRef$current === void 0 ? void 0 : _buttonRef$current.length) !== null && _buttonRef$current$ch !== void 0 ? _buttonRef$current$ch : 0) > 2) {
1386
1014
  localButtonRef.current.appendChild(buttonRef.current.childNodes[0]);
@@ -3845,8 +3473,9 @@ function $e5534fc185f7111e$export$2e2bcd8739ae039(props) {
3845
3473
  });
3846
3474
  }
3847
3475
 
3848
- var EMOJI_MART_DATA_URL = "https://cdn.jsdelivr.net/npm/@emoji-mart/data";
3849
- var cacheI18n = {};
3476
+ // vendors
3477
+ const EMOJI_MART_DATA_URL = "https://cdn.jsdelivr.net/npm/@emoji-mart/data";
3478
+ const cacheI18n = {};
3850
3479
 
3851
3480
  /**
3852
3481
  * @typedef {object} Props
@@ -3862,55 +3491,38 @@ var cacheI18n = {};
3862
3491
  * @param {Props} props
3863
3492
  */
3864
3493
  function EmojiPicker(props) {
3865
- var theme = props.theme,
3866
- onSelectEmoji = props.onSelectEmoji,
3867
- disableRecent = props.disableRecent,
3868
- customEmojis = props.customEmojis,
3869
- language = props.language;
3494
+ const {
3495
+ theme,
3496
+ onSelectEmoji,
3497
+ disableRecent,
3498
+ customEmojis,
3499
+ language
3500
+ } = props;
3870
3501
 
3871
3502
  /** @type {string[]} */
3872
- var categories = useMemo(function () {
3503
+ const categories = useMemo(() => {
3873
3504
  /** @type {string[]} */
3874
- var categoryies = [];
3505
+ let categoryies = [];
3875
3506
  if (!disableRecent) {
3876
3507
  categoryies.push("frequent");
3877
3508
  }
3878
- categoryies = [].concat(_toConsumableArray(categoryies), ["people", "nature", "foods", "activity", "places", "objects", "symbols", "flags"]);
3509
+ categoryies = [...categoryies, "people", "nature", "foods", "activity", "places", "objects", "symbols", "flags"];
3879
3510
  return categoryies;
3880
3511
  }, [disableRecent]);
3881
- var _useState = useState(undefined),
3882
- _useState2 = _slicedToArray(_useState, 2),
3883
- i18n = _useState2[0],
3884
- setI18n = _useState2[1];
3885
- useEffect(function () {
3886
- var _ref2;
3512
+ const [i18n, setI18n] = useState(undefined);
3513
+ useEffect(() => {
3887
3514
  if (!language) {
3888
- var _ref;
3889
3515
  if (cacheI18n.en) {
3890
3516
  setI18n(cacheI18n.en);
3891
3517
  return;
3892
3518
  }
3893
3519
 
3894
3520
  // @ts-ignore
3895
- fetch("".concat(EMOJI_MART_DATA_URL, "/i18n/en.json")).then(function (_x) {
3896
- return (_ref = _ref || _asyncToGenerator( /*#__PURE__*/_regeneratorRuntime().mark(function _callee(data) {
3897
- var translations;
3898
- return _regeneratorRuntime().wrap(function _callee$(_context) {
3899
- while (1) switch (_context.prev = _context.next) {
3900
- case 0:
3901
- _context.next = 2;
3902
- return data.json();
3903
- case 2:
3904
- translations = _context.sent;
3905
- setI18n(translations);
3906
- cacheI18n.en = translations;
3907
- case 5:
3908
- case "end":
3909
- return _context.stop();
3910
- }
3911
- }, _callee);
3912
- }))).apply(this, arguments);
3913
- })["catch"](function (error) {
3521
+ fetch("".concat(EMOJI_MART_DATA_URL, "/i18n/en.json")).then(async data => {
3522
+ const translations = await data.json();
3523
+ setI18n(translations);
3524
+ cacheI18n.en = translations;
3525
+ }).catch(error => {
3914
3526
  console.error("Failed to load translations:", error);
3915
3527
  });
3916
3528
  return;
@@ -3921,25 +3533,11 @@ function EmojiPicker(props) {
3921
3533
  }
3922
3534
 
3923
3535
  // @ts-ignore
3924
- fetch("".concat(EMOJI_MART_DATA_URL, "/i18n/").concat(language, ".json")).then(function (_x2) {
3925
- return (_ref2 = _ref2 || _asyncToGenerator( /*#__PURE__*/_regeneratorRuntime().mark(function _callee2(data) {
3926
- var translations;
3927
- return _regeneratorRuntime().wrap(function _callee2$(_context2) {
3928
- while (1) switch (_context2.prev = _context2.next) {
3929
- case 0:
3930
- _context2.next = 2;
3931
- return data.json();
3932
- case 2:
3933
- translations = _context2.sent;
3934
- setI18n(translations);
3935
- cacheI18n[language] = translations;
3936
- case 5:
3937
- case "end":
3938
- return _context2.stop();
3939
- }
3940
- }, _callee2);
3941
- }))).apply(this, arguments);
3942
- })["catch"](function (error) {
3536
+ fetch("".concat(EMOJI_MART_DATA_URL, "/i18n/").concat(language, ".json")).then(async data => {
3537
+ const translations = await data.json();
3538
+ setI18n(translations);
3539
+ cacheI18n[language] = translations;
3540
+ }).catch(error => {
3943
3541
  console.error("Failed to load translations:", error);
3944
3542
  });
3945
3543
  }, [language]);
@@ -3976,20 +3574,20 @@ var EmojiPicker$1 = /*#__PURE__*/memo(EmojiPicker);
3976
3574
  * @return {JSX.Element}
3977
3575
  */
3978
3576
  function EmojiPickerContainer(_ref) {
3979
- var showPicker = _ref.showPicker,
3980
- theme = _ref.theme,
3981
- handleSelectEmoji = _ref.handleSelectEmoji,
3982
- disableRecent = _ref.disableRecent,
3983
- customEmojis = _ref.customEmojis,
3984
- position = _ref.position,
3985
- language = _ref.language;
3577
+ let {
3578
+ showPicker,
3579
+ theme,
3580
+ handleSelectEmoji,
3581
+ disableRecent,
3582
+ customEmojis,
3583
+ position,
3584
+ language
3585
+ } = _ref;
3986
3586
  return /*#__PURE__*/React.createElement("div", {
3987
3587
  className: "react-emoji-picker--container"
3988
3588
  }, showPicker && /*#__PURE__*/React.createElement("div", {
3989
3589
  className: "react-emoji-picker--wrapper",
3990
- onClick: function onClick(evt) {
3991
- return evt.stopPropagation();
3992
- },
3590
+ onClick: evt => evt.stopPropagation(),
3993
3591
  style: position === 'below' ? {
3994
3592
  top: '40px'
3995
3593
  } : {}
@@ -4004,7 +3602,8 @@ function EmojiPickerContainer(_ref) {
4004
3602
  }))));
4005
3603
  }
4006
3604
 
4007
- var EMOJI_PICKER_CONTAINER_HEIGHT = 435;
3605
+ // @ts-check
3606
+ const EMOJI_PICKER_CONTAINER_HEIGHT = 435;
4008
3607
 
4009
3608
  /**
4010
3609
  * @typedef {import('../types/types').SanitizeFn} SanitizeFn
@@ -4030,38 +3629,36 @@ var EMOJI_PICKER_CONTAINER_HEIGHT = 435;
4030
3629
 
4031
3630
  // eslint-disable-next-line valid-jsdoc
4032
3631
  /** @type {React.FC<Props>} */
4033
- var EmojiPickerWrapper = function EmojiPickerWrapper(props) {
4034
- var theme = props.theme,
4035
- keepOpened = props.keepOpened,
4036
- disableRecent = props.disableRecent,
4037
- customEmojis = props.customEmojis,
4038
- addSanitizeFn = props.addSanitizeFn,
4039
- addPolluteFn = props.addPolluteFn,
4040
- appendContent = props.appendContent,
4041
- buttonElement = props.buttonElement,
4042
- buttonRef = props.buttonRef,
4043
- language = props.language;
4044
- var _useState = useState(false),
4045
- _useState2 = _slicedToArray(_useState, 2),
4046
- showPicker = _useState2[0],
4047
- setShowPicker = _useState2[1];
3632
+ const EmojiPickerWrapper = props => {
3633
+ const {
3634
+ theme,
3635
+ keepOpened,
3636
+ disableRecent,
3637
+ customEmojis,
3638
+ addSanitizeFn,
3639
+ addPolluteFn,
3640
+ appendContent,
3641
+ buttonElement,
3642
+ buttonRef,
3643
+ language
3644
+ } = props;
3645
+ const [showPicker, setShowPicker] = useState(false);
4048
3646
  /** @type {[HTMLDivElement | undefined, React.Dispatch<React.SetStateAction<HTMLDivElement | undefined>>]} */
4049
- var _useState3 = useState(),
4050
- _useState4 = _slicedToArray(_useState3, 2),
4051
- customButton = _useState4[0],
4052
- setCustomButton = _useState4[1];
3647
+ const [customButton, setCustomButton] = useState();
4053
3648
  /** @type {['above' | 'below' | undefined, React.Dispatch<React.SetStateAction<'above' | 'below' | undefined>>]} */
4054
- var _useState5 = useState(),
4055
- _useState6 = _slicedToArray(_useState5, 2),
4056
- emojiPickerPosition = _useState6[0],
4057
- setEmojiPickerPosition = _useState6[1];
4058
- useEffect(function () {
3649
+ const [emojiPickerPosition, setEmojiPickerPosition] = useState();
3650
+ useEffect(() => {
3651
+ if (showPicker) {
3652
+ cacheCurrentRange();
3653
+ }
3654
+ }, [showPicker]);
3655
+ useEffect(() => {
4059
3656
  addSanitizeFn(replaceAllTextEmojiToString);
4060
3657
  }, [addSanitizeFn]);
4061
- useEffect(function () {
3658
+ useEffect(() => {
4062
3659
  addPolluteFn(replaceAllTextEmojis);
4063
3660
  }, [addPolluteFn]);
4064
- useEffect(function () {
3661
+ useEffect(() => {
4065
3662
  /**
4066
3663
  *
4067
3664
  * @param {MouseEvent} event
@@ -4069,14 +3666,14 @@ var EmojiPickerWrapper = function EmojiPickerWrapper(props) {
4069
3666
  function checkClickOutside(event) {
4070
3667
  /** @type {HTMLElement} */
4071
3668
  // @ts-ignore
4072
- var element = event.target;
3669
+ const element = event.target;
4073
3670
  if (element.classList.contains("react-input-emoji--button") || element.classList.contains("react-input-emoji--button--icon")) {
4074
3671
  return;
4075
3672
  }
4076
3673
  setShowPicker(false);
4077
3674
  }
4078
3675
  document.addEventListener("click", checkClickOutside);
4079
- return function () {
3676
+ return () => {
4080
3677
  document.removeEventListener("click", checkClickOutside);
4081
3678
  };
4082
3679
  }, []);
@@ -4089,9 +3686,7 @@ var EmojiPickerWrapper = function EmojiPickerWrapper(props) {
4089
3686
  event.stopPropagation();
4090
3687
  event.preventDefault();
4091
3688
  setEmojiPickerPosition(calcTopPosition(event));
4092
- setShowPicker(function (currentShowPicker) {
4093
- return !currentShowPicker;
4094
- });
3689
+ setShowPicker(currentShowPicker => !currentShowPicker);
4095
3690
  }
4096
3691
 
4097
3692
  /**
@@ -4100,9 +3695,9 @@ var EmojiPickerWrapper = function EmojiPickerWrapper(props) {
4100
3695
  * @return {'above' | 'below'}
4101
3696
  */
4102
3697
  function calcTopPosition(event) {
4103
- var btn = event.currentTarget;
4104
- var btnRect = btn.getBoundingClientRect();
4105
- var popoverHeight = EMOJI_PICKER_CONTAINER_HEIGHT;
3698
+ const btn = event.currentTarget;
3699
+ const btnRect = btn.getBoundingClientRect();
3700
+ const popoverHeight = EMOJI_PICKER_CONTAINER_HEIGHT;
4106
3701
 
4107
3702
  // Decide to display above or below based on available space
4108
3703
  if (btnRect.top >= popoverHeight) {
@@ -4122,12 +3717,10 @@ var EmojiPickerWrapper = function EmojiPickerWrapper(props) {
4122
3717
  function handleSelectEmoji(emoji) {
4123
3718
  appendContent(getImageEmoji(emoji));
4124
3719
  if (!keepOpened) {
4125
- setShowPicker(function (currentShowPicker) {
4126
- return !currentShowPicker;
4127
- });
3720
+ setShowPicker(currentShowPicker => !currentShowPicker);
4128
3721
  }
4129
3722
  }
4130
- useEffect(function () {
3723
+ useEffect(() => {
4131
3724
  var _buttonRef$current;
4132
3725
  if (buttonRef !== null && buttonRef !== void 0 && (_buttonRef$current = buttonRef.current) !== null && _buttonRef$current !== void 0 && _buttonRef$current.style) {
4133
3726
  buttonRef.current.style.position = "relative";
@@ -4171,16 +3764,16 @@ var EmojiPickerWrapper = function EmojiPickerWrapper(props) {
4171
3764
  * @return {string | null}
4172
3765
  */
4173
3766
  function getTextFromAtToCaret() {
4174
- var range = getRangeFromAtToCaret();
3767
+ const range = getRangeFromAtToCaret();
4175
3768
  if (!range) return null;
4176
- var text = range.text.substring(range.begin, range.end);
3769
+ const text = range.text.substring(range.begin, range.end);
4177
3770
  return text || null;
4178
3771
  }
4179
3772
 
4180
3773
  // eslint-disable-next-line valid-jsdoc
4181
3774
  /** */
4182
3775
  function deleteTextFromAtToCaret() {
4183
- var range = getRangeFromAtToCaret();
3776
+ const range = getRangeFromAtToCaret();
4184
3777
  if (!range) return;
4185
3778
 
4186
3779
  // @ts-ignore
@@ -4192,22 +3785,24 @@ function deleteTextFromAtToCaret() {
4192
3785
  * @return {{begin: number, end: number, text: string, element: Node} | null}
4193
3786
  */
4194
3787
  function getRangeFromAtToCaret() {
4195
- var elementWithFocus = getElementWithFocus();
3788
+ const elementWithFocus = getElementWithFocus();
4196
3789
  if (!elementWithFocus) {
4197
3790
  return null;
4198
3791
  }
4199
- var element = elementWithFocus.element,
4200
- caretOffset = elementWithFocus.caretOffset;
4201
- var text = element.textContent;
4202
- var lastAt = text.lastIndexOf("@");
3792
+ const {
3793
+ element,
3794
+ caretOffset
3795
+ } = elementWithFocus;
3796
+ const text = element.textContent;
3797
+ const lastAt = text.lastIndexOf("@");
4203
3798
  if (lastAt === -1 || lastAt >= caretOffset || lastAt !== 0 && text[lastAt - 1] !== " ") {
4204
3799
  return null;
4205
3800
  }
4206
3801
  return {
4207
3802
  begin: lastAt,
4208
3803
  end: caretOffset,
4209
- text: text,
4210
- element: element
3804
+ text,
3805
+ element
4211
3806
  };
4212
3807
  }
4213
3808
 
@@ -4216,14 +3811,14 @@ function getRangeFromAtToCaret() {
4216
3811
  * @return {{element: Node, caretOffset: number}}
4217
3812
  */
4218
3813
  function getElementWithFocus() {
4219
- var element = getSelectionStart();
3814
+ const element = getSelectionStart();
4220
3815
  if (element === null) {
4221
3816
  return null;
4222
3817
  }
4223
- var caretOffset = 0;
3818
+ let caretOffset = 0;
4224
3819
  if (typeof window.getSelection != "undefined") {
4225
- var range = window.getSelection().getRangeAt(0);
4226
- var preCaretRange = range.cloneRange();
3820
+ const range = window.getSelection().getRangeAt(0);
3821
+ const preCaretRange = range.cloneRange();
4227
3822
  preCaretRange.selectNodeContents(element);
4228
3823
  preCaretRange.setEnd(range.endContainer, range.endOffset);
4229
3824
  caretOffset = preCaretRange.toString().length;
@@ -4233,16 +3828,16 @@ function getElementWithFocus() {
4233
3828
  // @ts-ignore
4234
3829
  document.selection.type != "Control") {
4235
3830
  // @ts-ignore
4236
- var textRange = document.selection.createRange();
3831
+ const textRange = document.selection.createRange();
4237
3832
  // @ts-ignore
4238
- var preCaretTextRange = document.body.createTextRange();
3833
+ const preCaretTextRange = document.body.createTextRange();
4239
3834
  preCaretTextRange.moveToElementText(element);
4240
3835
  preCaretTextRange.setEndPoint("EndToEnd", textRange);
4241
3836
  caretOffset = preCaretTextRange.text.length;
4242
3837
  }
4243
3838
  return {
4244
- element: element,
4245
- caretOffset: caretOffset
3839
+ element,
3840
+ caretOffset
4246
3841
  };
4247
3842
  }
4248
3843
 
@@ -4251,10 +3846,12 @@ function getElementWithFocus() {
4251
3846
  * @return {Node | null}
4252
3847
  */
4253
3848
  function getSelectionStart() {
4254
- var node = document.getSelection().anchorNode;
3849
+ const node = document.getSelection().anchorNode;
4255
3850
  return (node === null || node === void 0 ? void 0 : node.nodeType) == 3 ? node : null;
4256
3851
  }
4257
3852
 
3853
+ // @ts-check
3854
+
4258
3855
  /**
4259
3856
  * @typedef {import('../types/types').MentionUser} MentionUser
4260
3857
  */
@@ -4266,95 +3863,53 @@ function getSelectionStart() {
4266
3863
  * @returns {{mentionSearchText: string | null, mentionUsers: MentionUser[], onKeyUp: (event: React.KeyboardEvent) => void, onFocus: () => void, onSelectUser: () => void, loading: boolean}}
4267
3864
  */
4268
3865
  function useMention(searchMention) {
4269
- var _ref2;
4270
- var _useState = useState(false),
4271
- _useState2 = _slicedToArray(_useState, 2),
4272
- loading = _useState2[0],
4273
- setLoading = _useState2[1];
3866
+ const [loading, setLoading] = useState(false);
4274
3867
 
4275
3868
  /** @type {[MentionUser[], React.Dispatch<React.SetStateAction<MentionUser[]>>]} */
4276
- var _useState3 = useState([]),
4277
- _useState4 = _slicedToArray(_useState3, 2),
4278
- mentionUsers = _useState4[0],
4279
- setMentionUsers = _useState4[1];
3869
+ const [mentionUsers, setMentionUsers] = useState([]);
4280
3870
 
4281
3871
  /** @type {[string | null, React.Dispatch<React.SetStateAction<string | null>>]} */
4282
- var _useState5 = useState(null),
4283
- _useState6 = _slicedToArray(_useState5, 2),
4284
- mentionSearchText = _useState6[0],
4285
- setMentionSearchText = _useState6[1];
4286
- var onSelectUser = useCallback(function () {
3872
+ const [mentionSearchText, setMentionSearchText] = useState(null);
3873
+ const onSelectUser = useCallback(() => {
4287
3874
  deleteTextFromAtToCaret();
4288
3875
  setMentionUsers([]);
4289
3876
  }, []);
4290
3877
 
4291
3878
  /** */
4292
- var checkMentionText = useCallback( /*#__PURE__*/_asyncToGenerator( /*#__PURE__*/_regeneratorRuntime().mark(function _callee() {
4293
- var metionText, users;
4294
- return _regeneratorRuntime().wrap(function _callee$(_context) {
4295
- while (1) switch (_context.prev = _context.next) {
4296
- case 0:
4297
- metionText = getTextFromAtToCaret();
4298
- setMentionSearchText(metionText);
4299
- if (!(metionText === null)) {
4300
- _context.next = 6;
4301
- break;
4302
- }
4303
- setMentionUsers([]);
4304
- _context.next = 12;
4305
- break;
4306
- case 6:
4307
- setLoading(true);
4308
- _context.next = 9;
4309
- return searchMention(metionText);
4310
- case 9:
4311
- users = _context.sent;
4312
- setLoading(false);
4313
- setMentionUsers(users);
4314
- case 12:
4315
- case "end":
4316
- return _context.stop();
4317
- }
4318
- }, _callee);
4319
- })), [searchMention]);
3879
+ const checkMentionText = useCallback(async () => {
3880
+ const metionText = getTextFromAtToCaret();
3881
+ setMentionSearchText(metionText);
3882
+ if (metionText === null) {
3883
+ setMentionUsers([]);
3884
+ } else {
3885
+ setLoading(true);
3886
+ const users = await searchMention(metionText);
3887
+ setLoading(false);
3888
+ setMentionUsers(users);
3889
+ }
3890
+ }, [searchMention]);
4320
3891
 
4321
3892
  /** @type {(event: React.KeyboardEvent) => void} */
4322
- var onKeyUp = useCallback(function (_x) {
4323
- return (_ref2 = _ref2 || _asyncToGenerator( /*#__PURE__*/_regeneratorRuntime().mark(function _callee2(event) {
4324
- var _getElementWithFocus;
4325
- var elementWithFocus;
4326
- return _regeneratorRuntime().wrap(function _callee2$(_context2) {
4327
- while (1) switch (_context2.prev = _context2.next) {
4328
- case 0:
4329
- if (!(typeof searchMention !== "function")) {
4330
- _context2.next = 2;
4331
- break;
4332
- }
4333
- return _context2.abrupt("return");
4334
- case 2:
4335
- if (event.key === "Backspace" && (_getElementWithFocus = getElementWithFocus()) !== null && _getElementWithFocus !== void 0 && _getElementWithFocus.element.parentElement.hasAttribute("data-mention-id")) {
4336
- elementWithFocus = getElementWithFocus();
4337
- elementWithFocus.element.parentElement.remove();
4338
- } else if (!["ArrowUp", "ArrowDown", "Esc", "Escape"].includes(event.key)) {
4339
- checkMentionText();
4340
- }
4341
- case 3:
4342
- case "end":
4343
- return _context2.stop();
4344
- }
4345
- }, _callee2);
4346
- }))).apply(this, arguments);
3893
+ const onKeyUp = useCallback(async event => {
3894
+ var _getElementWithFocus;
3895
+ if (typeof searchMention !== "function") return;
3896
+ if (event.key === "Backspace" && (_getElementWithFocus = getElementWithFocus()) !== null && _getElementWithFocus !== void 0 && _getElementWithFocus.element.parentElement.hasAttribute("data-mention-id")) {
3897
+ const elementWithFocus = getElementWithFocus();
3898
+ elementWithFocus.element.parentElement.remove();
3899
+ } else if (!["ArrowUp", "ArrowDown", "Esc", "Escape"].includes(event.key)) {
3900
+ checkMentionText();
3901
+ }
4347
3902
  }, [checkMentionText, searchMention]);
4348
- var onFocus = useCallback(function () {
3903
+ const onFocus = useCallback(() => {
4349
3904
  checkMentionText();
4350
3905
  }, [checkMentionText]);
4351
3906
  return {
4352
- mentionSearchText: mentionSearchText,
4353
- mentionUsers: mentionUsers,
4354
- onKeyUp: onKeyUp,
4355
- onFocus: onFocus,
4356
- onSelectUser: onSelectUser,
4357
- loading: loading
3907
+ mentionSearchText,
3908
+ mentionUsers,
3909
+ onKeyUp,
3910
+ onFocus,
3911
+ onSelectUser,
3912
+ loading
4358
3913
  };
4359
3914
  }
4360
3915
 
@@ -4380,36 +3935,33 @@ function useMention(searchMention) {
4380
3935
 
4381
3936
  // eslint-disable-next-line valid-jsdoc
4382
3937
  /** @type {React.ForwardRefRenderFunction<Ref, Props>} */
4383
- var MentionUserList = function MentionUserList(_ref, ref) {
4384
- var users = _ref.users,
4385
- mentionSearchText = _ref.mentionSearchText,
4386
- onSelect = _ref.onSelect,
4387
- addEventListener = _ref.addEventListener;
4388
- var _useState = useState(0),
4389
- _useState2 = _slicedToArray(_useState, 2),
4390
- selectedUser = _useState2[0],
4391
- setSelectedUser = _useState2[1];
4392
- useImperativeHandle(ref, function () {
4393
- return {
4394
- prevUser: function prevUser() {
4395
- setSelectedUser(function (currentSelectedUser) {
4396
- if (currentSelectedUser === 0) {
4397
- return 0;
4398
- }
4399
- return currentSelectedUser - 1;
4400
- });
4401
- },
4402
- nextUser: function nextUser() {
4403
- setSelectedUser(function (currentSelectedUser) {
4404
- if (currentSelectedUser === users.length - 1) {
4405
- return users.length - 1;
4406
- }
4407
- return currentSelectedUser + 1;
4408
- });
4409
- }
4410
- };
4411
- });
4412
- useEffect(function () {
3938
+ const MentionUserList = (_ref, ref) => {
3939
+ let {
3940
+ users,
3941
+ mentionSearchText,
3942
+ onSelect,
3943
+ addEventListener
3944
+ } = _ref;
3945
+ const [selectedUser, setSelectedUser] = useState(0);
3946
+ useImperativeHandle(ref, () => ({
3947
+ prevUser: () => {
3948
+ setSelectedUser(currentSelectedUser => {
3949
+ if (currentSelectedUser === 0) {
3950
+ return 0;
3951
+ }
3952
+ return currentSelectedUser - 1;
3953
+ });
3954
+ },
3955
+ nextUser: () => {
3956
+ setSelectedUser(currentSelectedUser => {
3957
+ if (currentSelectedUser === users.length - 1) {
3958
+ return users.length - 1;
3959
+ }
3960
+ return currentSelectedUser + 1;
3961
+ });
3962
+ }
3963
+ }));
3964
+ useEffect(() => {
4413
3965
  setSelectedUser(0);
4414
3966
  }, [users]);
4415
3967
 
@@ -4424,16 +3976,16 @@ var MentionUserList = function MentionUserList(_ref, ref) {
4424
3976
  }
4425
3977
 
4426
3978
  /** @type {(MentionUser & {nameHtml: string})[]} */
4427
- var usersFiltered = useMemo(function () {
4428
- var searchText = mentionSearchText ? mentionSearchText.substring(1).toLocaleLowerCase() : "";
4429
- return users.map(function (user) {
4430
- var nameHtml = user.name;
3979
+ const usersFiltered = useMemo(() => {
3980
+ const searchText = mentionSearchText ? mentionSearchText.substring(1).toLocaleLowerCase() : "";
3981
+ return users.map(user => {
3982
+ let nameHtml = user.name;
4431
3983
  if (mentionSearchText && mentionSearchText.length > 1) {
4432
3984
  if (user.name.toLowerCase().startsWith(searchText)) {
4433
3985
  nameHtml = getMentionSelectedNameEl(user.name.substring(0, searchText.length), user.name.substring(searchText.length));
4434
3986
  } else {
4435
- var names = user.name.split(" ");
4436
- nameHtml = names.map(function (name) {
3987
+ const names = user.name.split(" ");
3988
+ nameHtml = names.map(name => {
4437
3989
  if (name.toLocaleLowerCase().startsWith(searchText)) {
4438
3990
  return getMentionSelectedNameEl(name.substring(0, searchText.length), name.substring(searchText.length));
4439
3991
  }
@@ -4442,7 +3994,7 @@ var MentionUserList = function MentionUserList(_ref, ref) {
4442
3994
  }
4443
3995
  }
4444
3996
  return _objectSpread2(_objectSpread2({}, user), {}, {
4445
- nameHtml: nameHtml
3997
+ nameHtml
4446
3998
  });
4447
3999
  });
4448
4000
  }, [mentionSearchText, users]);
@@ -4454,47 +4006,45 @@ var MentionUserList = function MentionUserList(_ref, ref) {
4454
4006
  * @returns {(event: React.MouseEvent) => void} event
4455
4007
  */
4456
4008
  function handleClick(user) {
4457
- return function (event) {
4009
+ return event => {
4458
4010
  event.stopPropagation();
4459
4011
  event.preventDefault();
4460
4012
  onSelect(user);
4461
4013
  };
4462
4014
  }
4463
- useEffect(function () {
4464
- var unsubscribe = addEventListener("enter", function (event) {
4015
+ useEffect(() => {
4016
+ const unsubscribe = addEventListener("enter", event => {
4465
4017
  event.stopPropagation();
4466
4018
  event.preventDefault();
4467
4019
  onSelect(usersFiltered[selectedUser]);
4468
4020
  });
4469
- return function () {
4021
+ return () => {
4470
4022
  unsubscribe();
4471
4023
  };
4472
4024
  }, [addEventListener, onSelect, selectedUser, usersFiltered]);
4473
4025
  return /*#__PURE__*/React.createElement("ul", {
4474
4026
  className: "react-input-emoji--mention--list",
4475
4027
  "data-testid": "mention-user-list"
4476
- }, usersFiltered.map(function (user, index) {
4477
- return /*#__PURE__*/React.createElement("li", {
4478
- key: user.id
4479
- }, /*#__PURE__*/React.createElement("button", {
4480
- type: "button",
4481
- onClick: handleClick(user),
4482
- className: "react-input-emoji--mention--item".concat(selectedUser === index ? " react-input-emoji--mention--item__selected" : ""),
4483
- onMouseOver: function onMouseOver() {
4484
- return setSelectedUser(index);
4485
- }
4486
- }, /*#__PURE__*/React.createElement("img", {
4487
- className: "react-input-emoji--mention--item--img",
4488
- src: user.image
4489
- }), /*#__PURE__*/React.createElement("div", {
4490
- className: "react-input-emoji--mention--item--name",
4491
- dangerouslySetInnerHTML: {
4492
- __html: user.nameHtml
4493
- }
4494
- })));
4495
- }));
4028
+ }, usersFiltered.map((user, index) => /*#__PURE__*/React.createElement("li", {
4029
+ key: user.id
4030
+ }, /*#__PURE__*/React.createElement("button", {
4031
+ type: "button",
4032
+ onClick: handleClick(user),
4033
+ className: "react-input-emoji--mention--item".concat(selectedUser === index ? " react-input-emoji--mention--item__selected" : ""),
4034
+ onMouseOver: () => setSelectedUser(index)
4035
+ }, /*#__PURE__*/React.createElement("img", {
4036
+ className: "react-input-emoji--mention--item--img",
4037
+ src: user.image
4038
+ }), /*#__PURE__*/React.createElement("div", {
4039
+ className: "react-input-emoji--mention--item--name",
4040
+ dangerouslySetInnerHTML: {
4041
+ __html: user.nameHtml
4042
+ }
4043
+ })))));
4496
4044
  };
4497
- var MentionUserListWithRef = /*#__PURE__*/forwardRef(MentionUserList);
4045
+ const MentionUserListWithRef = /*#__PURE__*/forwardRef(MentionUserList);
4046
+
4047
+ // @ts-check
4498
4048
 
4499
4049
  /**
4500
4050
  * @typedef {import('../types/types').MentionUser} MetionUser
@@ -4518,55 +4068,55 @@ var MentionUserListWithRef = /*#__PURE__*/forwardRef(MentionUserList);
4518
4068
 
4519
4069
  // eslint-disable-next-line valid-jsdoc
4520
4070
  /** @type {React.FC<Props>} */
4521
- var MentionWrapper = function MentionWrapper(_ref) {
4522
- var searchMention = _ref.searchMention,
4523
- addEventListener = _ref.addEventListener,
4524
- appendContent = _ref.appendContent,
4525
- addSanitizeFn = _ref.addSanitizeFn;
4071
+ const MentionWrapper = _ref => {
4072
+ let {
4073
+ searchMention,
4074
+ addEventListener,
4075
+ appendContent,
4076
+ addSanitizeFn
4077
+ } = _ref;
4526
4078
  /** @type {React.MutableRefObject<import('./mention-user-list').Ref | null>} */
4527
- var metionUserListRef = useRef(null);
4528
- var _useState = useState(false),
4529
- _useState2 = _slicedToArray(_useState, 2),
4530
- showUserList = _useState2[0],
4531
- setShowUserList = _useState2[1];
4532
- var _useMention = useMention(searchMention),
4533
- mentionSearchText = _useMention.mentionSearchText,
4534
- mentionUsers = _useMention.mentionUsers,
4535
- loading = _useMention.loading,
4536
- onKeyUp = _useMention.onKeyUp,
4537
- onFocus = _useMention.onFocus,
4538
- onSelectUser = _useMention.onSelectUser;
4539
- useEffect(function () {
4540
- addSanitizeFn(function (html) {
4541
- var container = document.createElement("div");
4079
+ const metionUserListRef = useRef(null);
4080
+ const [showUserList, setShowUserList] = useState(false);
4081
+ const {
4082
+ mentionSearchText,
4083
+ mentionUsers,
4084
+ loading,
4085
+ onKeyUp,
4086
+ onFocus,
4087
+ onSelectUser
4088
+ } = useMention(searchMention);
4089
+ useEffect(() => {
4090
+ addSanitizeFn(html => {
4091
+ const container = document.createElement("div");
4542
4092
  container.innerHTML = html;
4543
- var mentionsEl = Array.prototype.slice.call(container.querySelectorAll(".react-input-emoji--mention--text"));
4544
- mentionsEl.forEach(function (mentionEl) {
4093
+ const mentionsEl = Array.prototype.slice.call(container.querySelectorAll(".react-input-emoji--mention--text"));
4094
+ mentionsEl.forEach(mentionEl => {
4545
4095
  container.innerHTML = container.innerHTML.replace(mentionEl.outerHTML, "@[".concat(mentionEl.dataset.mentionName, "](userId:").concat(mentionEl.dataset.mentionId, ")"));
4546
4096
  });
4547
4097
  return container.innerHTML;
4548
4098
  });
4549
4099
  }, [addSanitizeFn]);
4550
- useEffect(function () {
4100
+ useEffect(() => {
4551
4101
  setShowUserList(mentionUsers.length > 0);
4552
4102
  }, [mentionUsers]);
4553
- useEffect(function () {
4103
+ useEffect(() => {
4554
4104
  /** */
4555
4105
  function checkClickOutside() {
4556
4106
  setShowUserList(false);
4557
4107
  }
4558
4108
  document.addEventListener("click", checkClickOutside);
4559
- return function () {
4109
+ return () => {
4560
4110
  document.removeEventListener("click", checkClickOutside);
4561
4111
  };
4562
4112
  }, []);
4563
- useEffect(function () {
4564
- var unsubscribe = addEventListener("keyUp", onKeyUp);
4565
- return function () {
4113
+ useEffect(() => {
4114
+ const unsubscribe = addEventListener("keyUp", onKeyUp);
4115
+ return () => {
4566
4116
  unsubscribe();
4567
4117
  };
4568
4118
  }, [addEventListener, onKeyUp]);
4569
- useEffect(function () {
4119
+ useEffect(() => {
4570
4120
  /**
4571
4121
  *
4572
4122
  * @param {React.KeyboardEvent} event
@@ -4579,30 +4129,30 @@ var MentionWrapper = function MentionWrapper(_ref) {
4579
4129
  break;
4580
4130
  }
4581
4131
  }
4582
- var unsubscribe = addEventListener("keyDown", handleKeyDown);
4583
- return function () {
4132
+ const unsubscribe = addEventListener("keyDown", handleKeyDown);
4133
+ return () => {
4584
4134
  unsubscribe();
4585
4135
  };
4586
4136
  }, [addEventListener]);
4587
- useEffect(function () {
4588
- var unsubscribe = addEventListener("focus", onFocus);
4589
- return function () {
4137
+ useEffect(() => {
4138
+ const unsubscribe = addEventListener("focus", onFocus);
4139
+ return () => {
4590
4140
  unsubscribe();
4591
4141
  };
4592
4142
  }, [addEventListener, onFocus]);
4593
- useEffect(function () {
4143
+ useEffect(() => {
4594
4144
  if (showUserList) {
4595
- var unsubscribeArrowUp = addEventListener("arrowUp", function (event) {
4145
+ const unsubscribeArrowUp = addEventListener("arrowUp", event => {
4596
4146
  event.stopPropagation();
4597
4147
  event.preventDefault();
4598
4148
  metionUserListRef.current.prevUser();
4599
4149
  });
4600
- var unsubscribeArrowDown = addEventListener("arrowDown", function (event) {
4150
+ const unsubscribeArrowDown = addEventListener("arrowDown", event => {
4601
4151
  event.stopPropagation();
4602
4152
  event.preventDefault();
4603
4153
  metionUserListRef.current.nextUser();
4604
4154
  });
4605
- return function () {
4155
+ return () => {
4606
4156
  unsubscribeArrowUp();
4607
4157
  unsubscribeArrowDown();
4608
4158
  };
@@ -4625,9 +4175,7 @@ var MentionWrapper = function MentionWrapper(_ref) {
4625
4175
  className: "react-input-emoji--mention--loading--spinner"
4626
4176
  }, "Loading..."))) : showUserList && /*#__PURE__*/React.createElement("div", {
4627
4177
  className: "react-input-emoji--mention--container",
4628
- onClick: function onClick(evt) {
4629
- return evt.stopPropagation();
4630
- }
4178
+ onClick: evt => evt.stopPropagation()
4631
4179
  }, /*#__PURE__*/React.createElement(MentionUserListWithRef, {
4632
4180
  ref: metionUserListRef,
4633
4181
  mentionSearchText: mentionSearchText,
@@ -4646,20 +4194,16 @@ var MentionWrapper = function MentionWrapper(_ref) {
4646
4194
  */
4647
4195
  function createObserver() {
4648
4196
  /** @type {import('../types/types').Listerner<T>[]} */
4649
- var listeners = [];
4197
+ let listeners = [];
4650
4198
  return {
4651
- subscribe: function subscribe(listener) {
4199
+ subscribe: listener => {
4652
4200
  listeners.push(listener);
4653
- return function () {
4654
- listeners = listeners.filter(function (l) {
4655
- return l !== listener;
4656
- });
4201
+ return () => {
4202
+ listeners = listeners.filter(l => l !== listener);
4657
4203
  };
4658
4204
  },
4659
- publish: function publish(event) {
4660
- listeners.forEach(function (listener) {
4661
- return listener(event);
4662
- });
4205
+ publish: event => {
4206
+ listeners.forEach(listener => listener(event));
4663
4207
  },
4664
4208
  get currentListerners() {
4665
4209
  return listeners;
@@ -4677,28 +4221,26 @@ function createObserver() {
4677
4221
  /** */
4678
4222
  function useEventListeners() {
4679
4223
  /** @type {TextInputListeners} */
4680
- var listeners = useMemo(function () {
4681
- return {
4682
- keyDown: createObserver(),
4683
- keyUp: createObserver(),
4684
- arrowUp: createObserver(),
4685
- arrowDown: createObserver(),
4686
- enter: createObserver(),
4687
- focus: createObserver(),
4688
- blur: createObserver()
4689
- };
4690
- }, []);
4224
+ const listeners = useMemo(() => ({
4225
+ keyDown: createObserver(),
4226
+ keyUp: createObserver(),
4227
+ arrowUp: createObserver(),
4228
+ arrowDown: createObserver(),
4229
+ enter: createObserver(),
4230
+ focus: createObserver(),
4231
+ blur: createObserver()
4232
+ }), []);
4691
4233
 
4692
4234
  /**
4693
4235
  * @template {keyof TextInputListeners} T, K
4694
4236
  * @type {(event: keyof TextInputListeners, fn: import('../types/types').Listerner<any>) => () => void}
4695
4237
  */
4696
- var addEventListener = useCallback(function (event, fn) {
4238
+ const addEventListener = useCallback((event, fn) => {
4697
4239
  return listeners[event].subscribe(fn);
4698
4240
  }, [listeners]);
4699
4241
  return {
4700
- addEventListener: addEventListener,
4701
- listeners: listeners
4242
+ addEventListener,
4243
+ listeners
4702
4244
  };
4703
4245
  }
4704
4246
 
@@ -4712,23 +4254,23 @@ function useEventListeners() {
4712
4254
  /** */
4713
4255
  function usePollute() {
4714
4256
  /** @type {React.MutableRefObject<PolluteFn[]>} */
4715
- var polluteFnsRef = useRef([]);
4257
+ const polluteFnsRef = useRef([]);
4716
4258
 
4717
4259
  /** @type {(fn: PolluteFn) => void} */
4718
- var addPolluteFn = useCallback(function (fn) {
4260
+ const addPolluteFn = useCallback(fn => {
4719
4261
  polluteFnsRef.current.push(fn);
4720
4262
  }, []);
4721
4263
 
4722
4264
  /** @type {(html: string) => string} */
4723
- var pollute = useCallback(function (text) {
4724
- var result = polluteFnsRef.current.reduce(function (acc, fn) {
4265
+ const pollute = useCallback(text => {
4266
+ const result = polluteFnsRef.current.reduce((acc, fn) => {
4725
4267
  return fn(acc);
4726
4268
  }, text);
4727
4269
  return result;
4728
4270
  }, []);
4729
4271
  return {
4730
- addPolluteFn: addPolluteFn,
4731
- pollute: pollute
4272
+ addPolluteFn,
4273
+ pollute
4732
4274
  };
4733
4275
  }
4734
4276
 
@@ -4784,72 +4326,78 @@ function usePollute() {
4784
4326
  * @return {JSX.Element}
4785
4327
  */
4786
4328
  function InputEmoji(props, ref) {
4787
- var onChange = props.onChange,
4788
- onEnter = props.onEnter,
4789
- onResize = props.onResize,
4790
- onClick = props.onClick,
4791
- onFocus = props.onFocus,
4792
- onBlur = props.onBlur,
4793
- onKeyDown = props.onKeyDown,
4794
- theme = props.theme,
4795
- cleanOnEnter = props.cleanOnEnter,
4796
- placeholder = props.placeholder,
4797
- maxLength = props.maxLength,
4798
- keepOpened = props.keepOpened,
4799
- inputClass = props.inputClass,
4800
- disableRecent = props.disableRecent,
4801
- tabIndex = props.tabIndex,
4802
- value = props.value,
4803
- customEmojis = props.customEmojis,
4804
- language = props.language,
4805
- searchMention = props.searchMention,
4806
- buttonElement = props.buttonElement,
4807
- buttonRef = props.buttonRef,
4808
- shouldReturn = props.shouldReturn,
4809
- shouldConvertEmojiToImage = props.shouldConvertEmojiToImage,
4810
- borderRadius = props.borderRadius,
4811
- borderColor = props.borderColor,
4812
- fontSize = props.fontSize,
4813
- fontFamily = props.fontFamily,
4814
- background = props.background,
4815
- placeholderColor = props.placeholderColor,
4816
- color = props.color;
4329
+ const {
4330
+ onChange,
4331
+ onEnter,
4332
+ onResize,
4333
+ onClick,
4334
+ onFocus,
4335
+ onBlur,
4336
+ onKeyDown,
4337
+ theme,
4338
+ cleanOnEnter,
4339
+ placeholder,
4340
+ maxLength,
4341
+ keepOpened,
4342
+ inputClass,
4343
+ disableRecent,
4344
+ tabIndex,
4345
+ value,
4346
+ customEmojis,
4347
+ language,
4348
+ searchMention,
4349
+ buttonElement,
4350
+ buttonRef,
4351
+ shouldReturn,
4352
+ shouldConvertEmojiToImage,
4353
+ // style
4354
+ borderRadius,
4355
+ borderColor,
4356
+ fontSize,
4357
+ fontFamily,
4358
+ background,
4359
+ placeholderColor,
4360
+ color
4361
+ } = props;
4817
4362
 
4818
4363
  /** @type {React.MutableRefObject<import('./text-input').Ref | null>} */
4819
- var textInputRef = useRef(null);
4820
- var _useEventListeners = useEventListeners(),
4821
- addEventListener = _useEventListeners.addEventListener,
4822
- listeners = _useEventListeners.listeners;
4823
- var _useSanitize = useSanitize(shouldReturn, shouldConvertEmojiToImage),
4824
- addSanitizeFn = _useSanitize.addSanitizeFn,
4825
- sanitize = _useSanitize.sanitize,
4826
- sanitizedTextRef = _useSanitize.sanitizedTextRef;
4827
- var _usePollute = usePollute(),
4828
- addPolluteFn = _usePollute.addPolluteFn,
4829
- pollute = _usePollute.pollute;
4830
- var updateHTML = useCallback(function () {
4831
- var nextValue = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : "";
4364
+ const textInputRef = useRef(null);
4365
+ const {
4366
+ addEventListener,
4367
+ listeners
4368
+ } = useEventListeners();
4369
+ const {
4370
+ addSanitizeFn,
4371
+ sanitize,
4372
+ sanitizedTextRef
4373
+ } = useSanitize(shouldReturn, shouldConvertEmojiToImage);
4374
+ const {
4375
+ addPolluteFn,
4376
+ pollute
4377
+ } = usePollute();
4378
+ const updateHTML = useCallback(function () {
4379
+ let nextValue = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : "";
4832
4380
  if (textInputRef.current === null) return;
4833
4381
  textInputRef.current.html = replaceAllTextEmojis(nextValue);
4834
4382
  sanitizedTextRef.current = nextValue;
4835
4383
  }, [sanitizedTextRef]);
4836
- var setValue = useCallback(
4384
+ const setValue = useCallback(
4837
4385
  /**
4838
4386
  *
4839
4387
  * @param {string} value
4840
4388
  */
4841
- function (value) {
4389
+ value => {
4842
4390
  updateHTML(value);
4843
4391
  }, [updateHTML]);
4844
- var emitChange = useEmit(textInputRef, onResize, onChange);
4392
+ const emitChange = useEmit(textInputRef, onResize, onChange);
4845
4393
  useExpose({
4846
- ref: ref,
4847
- setValue: setValue,
4848
- textInputRef: textInputRef,
4849
- emitChange: emitChange,
4850
- shouldConvertEmojiToImage: shouldConvertEmojiToImage
4394
+ ref,
4395
+ setValue,
4396
+ textInputRef,
4397
+ emitChange,
4398
+ shouldConvertEmojiToImage
4851
4399
  });
4852
- useEffect(function () {
4400
+ useEffect(() => {
4853
4401
  if (sanitizedTextRef.current !== value) {
4854
4402
  setValue(value);
4855
4403
  }
@@ -4859,7 +4407,7 @@ function InputEmoji(props, ref) {
4859
4407
  // updateHTML();
4860
4408
  // }, [updateHTML]);
4861
4409
 
4862
- useEffect(function () {
4410
+ useEffect(() => {
4863
4411
  /**
4864
4412
  * Handle keydown event
4865
4413
  * @param {React.KeyboardEvent} event
@@ -4871,7 +4419,7 @@ function InputEmoji(props, ref) {
4871
4419
  }
4872
4420
  if (event.key === "Enter" && textInputRef.current) {
4873
4421
  event.preventDefault();
4874
- var text = sanitize(textInputRef.current.html);
4422
+ const text = sanitize(textInputRef.current.html);
4875
4423
  emitChange(sanitizedTextRef.current);
4876
4424
  if (typeof onEnter === "function" && listeners.enter.currentListerners.length === 0) {
4877
4425
  onEnter(text);
@@ -4889,12 +4437,12 @@ function InputEmoji(props, ref) {
4889
4437
  }
4890
4438
  return true;
4891
4439
  }
4892
- var unsubscribe = addEventListener("keyDown", handleKeydown);
4893
- return function () {
4440
+ const unsubscribe = addEventListener("keyDown", handleKeydown);
4441
+ return () => {
4894
4442
  unsubscribe();
4895
4443
  };
4896
4444
  }, [addEventListener, cleanOnEnter, emitChange, listeners.enter.currentListerners.length, maxLength, onEnter, onKeyDown, sanitize, sanitizedTextRef, updateHTML]);
4897
- useEffect(function () {
4445
+ useEffect(() => {
4898
4446
  /** */
4899
4447
  function handleFocus() {
4900
4448
  if (typeof onClick === "function") {
@@ -4904,20 +4452,20 @@ function InputEmoji(props, ref) {
4904
4452
  onFocus();
4905
4453
  }
4906
4454
  }
4907
- var unsubscribe = addEventListener("focus", handleFocus);
4908
- return function () {
4455
+ const unsubscribe = addEventListener("focus", handleFocus);
4456
+ return () => {
4909
4457
  unsubscribe();
4910
4458
  };
4911
4459
  }, [addEventListener, onClick, onFocus]);
4912
- useEffect(function () {
4460
+ useEffect(() => {
4913
4461
  /** */
4914
4462
  function handleBlur() {
4915
4463
  if (typeof onBlur === "function") {
4916
4464
  onBlur();
4917
4465
  }
4918
4466
  }
4919
- var unsubscribe = addEventListener("blur", handleBlur);
4920
- return function () {
4467
+ const unsubscribe = addEventListener("blur", handleBlur);
4468
+ return () => {
4921
4469
  unsubscribe();
4922
4470
  };
4923
4471
  }, [addEventListener, onBlur]);
@@ -4952,7 +4500,7 @@ function InputEmoji(props, ref) {
4952
4500
  */
4953
4501
  function handlePaste(event) {
4954
4502
  event.preventDefault();
4955
- var content;
4503
+ let content;
4956
4504
  if (event.clipboardData) {
4957
4505
  content = event.clipboardData.getData("text/plain");
4958
4506
  content = pollute(content);
@@ -4980,13 +4528,13 @@ function InputEmoji(props, ref) {
4980
4528
  onEnter: listeners.enter.publish,
4981
4529
  placeholder: placeholder,
4982
4530
  style: {
4983
- borderRadius: borderRadius,
4984
- borderColor: borderColor,
4985
- fontSize: fontSize,
4986
- fontFamily: fontFamily,
4987
- background: background,
4988
- placeholderColor: placeholderColor,
4989
- color: color
4531
+ borderRadius,
4532
+ borderColor,
4533
+ fontSize,
4534
+ fontFamily,
4535
+ background,
4536
+ placeholderColor,
4537
+ color
4990
4538
  },
4991
4539
  tabIndex: tabIndex,
4992
4540
  className: inputClass,
@@ -5004,7 +4552,7 @@ function InputEmoji(props, ref) {
5004
4552
  language: language
5005
4553
  }));
5006
4554
  }
5007
- var InputEmojiWithRef = /*#__PURE__*/forwardRef(InputEmoji);
4555
+ const InputEmojiWithRef = /*#__PURE__*/forwardRef(InputEmoji);
5008
4556
  InputEmojiWithRef.defaultProps = {
5009
4557
  theme: /** @type {const} */"auto",
5010
4558
  height: 30,