@wordpress/dom/build/dom/place-caret-at-edge.js

DOM utilities module for WordPress.

"use strict";

var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
Object.defineProperty(exports, "__esModule", {
  value: true
});
exports.default = placeCaretAtEdge;
var _hiddenCaretRangeFromPoint = _interopRequireDefault(require("./hidden-caret-range-from-point"));
var _assertIsDefined = require("../utils/assert-is-defined");
var _isInputOrTextArea = _interopRequireDefault(require("./is-input-or-text-area"));
var _isRtl = _interopRequireDefault(require("./is-rtl"));
var _scrollIfNoRange = require("./scroll-if-no-range");
/**
 * Internal dependencies
 */

/**
 * Gets the range to place.
 *
 * @param {HTMLElement}      container Focusable element.
 * @param {boolean}          isReverse True for end, false for start.
 * @param {number|undefined} x         X coordinate to vertically position.
 *
 * @return {Range|null} The range to place.
 */
function getRange(container, isReverse, x) {
  const {
    ownerDocument
  } = container;
  // In the case of RTL scripts, the horizontal edge is at the opposite side.
  const isReverseDir = (0, _isRtl.default)(container) ? !isReverse : isReverse;
  const containerRect = container.getBoundingClientRect();
  // When placing at the end (isReverse), find the closest range to the bottom
  // right corner. When placing at the start, to the top left corner.
  // Ensure x is defined and within the container's boundaries. When it's
  // exactly at the boundary, it's not considered within the boundaries.
  if (x === undefined) {
    x = isReverse ? containerRect.right - 1 : containerRect.left + 1;
  } else if (x <= containerRect.left) {
    x = containerRect.left + 1;
  } else if (x >= containerRect.right) {
    x = containerRect.right - 1;
  }
  const y = isReverseDir ? containerRect.bottom - 1 : containerRect.top + 1;
  return (0, _hiddenCaretRangeFromPoint.default)(ownerDocument, x, y, container);
}

/**
 * Places the caret at start or end of a given element.
 *
 * @param {HTMLElement}      container Focusable element.
 * @param {boolean}          isReverse True for end, false for start.
 * @param {number|undefined} x         X coordinate to vertically position.
 */
function placeCaretAtEdge(container, isReverse, x) {
  if (!container) {
    return;
  }
  container.focus();
  if ((0, _isInputOrTextArea.default)(container)) {
    // The element may not support selection setting.
    if (typeof container.selectionStart !== 'number') {
      return;
    }
    if (isReverse) {
      container.selectionStart = container.value.length;
      container.selectionEnd = container.value.length;
    } else {
      container.selectionStart = 0;
      container.selectionEnd = 0;
    }
    return;
  }
  if (!container.isContentEditable) {
    return;
  }
  const range = (0, _scrollIfNoRange.scrollIfNoRange)(container, isReverse, () => getRange(container, isReverse, x));
  if (!range) {
    return;
  }
  const {
    ownerDocument
  } = container;
  const {
    defaultView
  } = ownerDocument;
  (0, _assertIsDefined.assertIsDefined)(defaultView, 'defaultView');
  const selection = defaultView.getSelection();
  (0, _assertIsDefined.assertIsDefined)(selection, 'selection');
  selection.removeAllRanges();
  selection.addRange(range);
}
//# sourceMappingURL=place-caret-at-edge.js.map