helper.js 4.8 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159
  1. 'use strict';
  2. Object.defineProperty(exports, '__esModule', { value: true });
  3. var lodashUnified = require('lodash-unified');
  4. var browser = require('../../../utils/browser.js');
  5. const filterOption = (pattern, option) => {
  6. const lowerCase = pattern.toLowerCase();
  7. const label = option.label || option.value || "";
  8. return label.toLowerCase().includes(lowerCase);
  9. };
  10. const getMentionCtx = (inputEl, prefix, split) => {
  11. const { selectionEnd } = inputEl;
  12. if (selectionEnd === null)
  13. return;
  14. const inputValue = inputEl.value;
  15. const prefixArray = lodashUnified.castArray(prefix);
  16. let splitIndex = -1;
  17. let mentionCtx;
  18. for (let i = selectionEnd - 1; i >= 0; --i) {
  19. const char = inputValue[i];
  20. if (char === split || char === "\n" || char === "\r") {
  21. splitIndex = i;
  22. continue;
  23. }
  24. if (prefixArray.includes(char)) {
  25. const end = splitIndex === -1 ? selectionEnd : splitIndex;
  26. const pattern = inputValue.slice(i + 1, end);
  27. mentionCtx = {
  28. pattern,
  29. start: i + 1,
  30. end,
  31. prefix: char,
  32. prefixIndex: i,
  33. splitIndex,
  34. selectionEnd
  35. };
  36. break;
  37. }
  38. }
  39. return mentionCtx;
  40. };
  41. const getCursorPosition = (element, options = {
  42. debug: false,
  43. useSelectionEnd: false
  44. }) => {
  45. const selectionStart = element.selectionStart !== null ? element.selectionStart : 0;
  46. const selectionEnd = element.selectionEnd !== null ? element.selectionEnd : 0;
  47. const position = options.useSelectionEnd ? selectionEnd : selectionStart;
  48. const properties = [
  49. "direction",
  50. "boxSizing",
  51. "width",
  52. "height",
  53. "overflowX",
  54. "overflowY",
  55. "borderTopWidth",
  56. "borderRightWidth",
  57. "borderBottomWidth",
  58. "borderLeftWidth",
  59. "borderStyle",
  60. "paddingTop",
  61. "paddingRight",
  62. "paddingBottom",
  63. "paddingLeft",
  64. "fontStyle",
  65. "fontVariant",
  66. "fontWeight",
  67. "fontStretch",
  68. "fontSize",
  69. "fontSizeAdjust",
  70. "lineHeight",
  71. "fontFamily",
  72. "textAlign",
  73. "textTransform",
  74. "textIndent",
  75. "textDecoration",
  76. "letterSpacing",
  77. "wordSpacing",
  78. "tabSize",
  79. "MozTabSize"
  80. ];
  81. if (options.debug) {
  82. const el = document.querySelector(
  83. "#input-textarea-caret-position-mirror-div"
  84. );
  85. if (el == null ? void 0 : el.parentNode)
  86. el.parentNode.removeChild(el);
  87. }
  88. const div = document.createElement("div");
  89. div.id = "input-textarea-caret-position-mirror-div";
  90. document.body.appendChild(div);
  91. const style = div.style;
  92. const computed = window.getComputedStyle(element);
  93. const isInput = element.nodeName === "INPUT";
  94. style.whiteSpace = isInput ? "nowrap" : "pre-wrap";
  95. if (!isInput)
  96. style.wordWrap = "break-word";
  97. style.position = "absolute";
  98. if (!options.debug)
  99. style.visibility = "hidden";
  100. properties.forEach((prop) => {
  101. if (isInput && prop === "lineHeight") {
  102. if (computed.boxSizing === "border-box") {
  103. const height = Number.parseInt(computed.height);
  104. const outerHeight = Number.parseInt(computed.paddingTop) + Number.parseInt(computed.paddingBottom) + Number.parseInt(computed.borderTopWidth) + Number.parseInt(computed.borderBottomWidth);
  105. const targetHeight = outerHeight + Number.parseInt(computed.lineHeight);
  106. if (height > targetHeight) {
  107. style.lineHeight = `${height - outerHeight}px`;
  108. } else if (height === targetHeight) {
  109. style.lineHeight = computed.lineHeight;
  110. } else {
  111. style.lineHeight = "0";
  112. }
  113. } else {
  114. style.lineHeight = computed.height;
  115. }
  116. } else {
  117. style[prop] = computed[prop];
  118. }
  119. });
  120. if (browser.isFirefox()) {
  121. if (element.scrollHeight > Number.parseInt(computed.height)) {
  122. style.overflowY = "scroll";
  123. }
  124. } else {
  125. style.overflow = "hidden";
  126. }
  127. div.textContent = element.value.slice(0, Math.max(0, position));
  128. if (isInput && div.textContent) {
  129. div.textContent = div.textContent.replace(/\s/g, "\xA0");
  130. }
  131. const span = document.createElement("span");
  132. span.textContent = element.value.slice(Math.max(0, position)) || ".";
  133. span.style.position = "relative";
  134. span.style.left = `${-element.scrollLeft}px`;
  135. span.style.top = `${-element.scrollTop}px`;
  136. div.appendChild(span);
  137. const relativePosition = {
  138. top: span.offsetTop + Number.parseInt(computed.borderTopWidth),
  139. left: span.offsetLeft + Number.parseInt(computed.borderLeftWidth),
  140. height: Number.parseInt(computed.fontSize) * 1.5
  141. };
  142. if (options.debug) {
  143. span.style.backgroundColor = "#aaa";
  144. } else {
  145. document.body.removeChild(div);
  146. }
  147. if (relativePosition.left >= element.clientWidth) {
  148. relativePosition.left = element.clientWidth;
  149. }
  150. return relativePosition;
  151. };
  152. exports.filterOption = filterOption;
  153. exports.getCursorPosition = getCursorPosition;
  154. exports.getMentionCtx = getMentionCtx;
  155. //# sourceMappingURL=helper.js.map