You can not select more than 25 topics
Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
1009 lines
33 KiB
1009 lines
33 KiB
this["wp"] = this["wp"] || {}; this["wp"]["dom"] = |
|
/******/ (function(modules) { // webpackBootstrap |
|
/******/ // The module cache |
|
/******/ var installedModules = {}; |
|
/******/ |
|
/******/ // The require function |
|
/******/ function __webpack_require__(moduleId) { |
|
/******/ |
|
/******/ // Check if module is in cache |
|
/******/ if(installedModules[moduleId]) { |
|
/******/ return installedModules[moduleId].exports; |
|
/******/ } |
|
/******/ // Create a new module (and put it into the cache) |
|
/******/ var module = installedModules[moduleId] = { |
|
/******/ i: moduleId, |
|
/******/ l: false, |
|
/******/ exports: {} |
|
/******/ }; |
|
/******/ |
|
/******/ // Execute the module function |
|
/******/ modules[moduleId].call(module.exports, module, module.exports, __webpack_require__); |
|
/******/ |
|
/******/ // Flag the module as loaded |
|
/******/ module.l = true; |
|
/******/ |
|
/******/ // Return the exports of the module |
|
/******/ return module.exports; |
|
/******/ } |
|
/******/ |
|
/******/ |
|
/******/ // expose the modules object (__webpack_modules__) |
|
/******/ __webpack_require__.m = modules; |
|
/******/ |
|
/******/ // expose the module cache |
|
/******/ __webpack_require__.c = installedModules; |
|
/******/ |
|
/******/ // define getter function for harmony exports |
|
/******/ __webpack_require__.d = function(exports, name, getter) { |
|
/******/ if(!__webpack_require__.o(exports, name)) { |
|
/******/ Object.defineProperty(exports, name, { enumerable: true, get: getter }); |
|
/******/ } |
|
/******/ }; |
|
/******/ |
|
/******/ // define __esModule on exports |
|
/******/ __webpack_require__.r = function(exports) { |
|
/******/ if(typeof Symbol !== 'undefined' && Symbol.toStringTag) { |
|
/******/ Object.defineProperty(exports, Symbol.toStringTag, { value: 'Module' }); |
|
/******/ } |
|
/******/ Object.defineProperty(exports, '__esModule', { value: true }); |
|
/******/ }; |
|
/******/ |
|
/******/ // create a fake namespace object |
|
/******/ // mode & 1: value is a module id, require it |
|
/******/ // mode & 2: merge all properties of value into the ns |
|
/******/ // mode & 4: return value when already ns object |
|
/******/ // mode & 8|1: behave like require |
|
/******/ __webpack_require__.t = function(value, mode) { |
|
/******/ if(mode & 1) value = __webpack_require__(value); |
|
/******/ if(mode & 8) return value; |
|
/******/ if((mode & 4) && typeof value === 'object' && value && value.__esModule) return value; |
|
/******/ var ns = Object.create(null); |
|
/******/ __webpack_require__.r(ns); |
|
/******/ Object.defineProperty(ns, 'default', { enumerable: true, value: value }); |
|
/******/ if(mode & 2 && typeof value != 'string') for(var key in value) __webpack_require__.d(ns, key, function(key) { return value[key]; }.bind(null, key)); |
|
/******/ return ns; |
|
/******/ }; |
|
/******/ |
|
/******/ // getDefaultExport function for compatibility with non-harmony modules |
|
/******/ __webpack_require__.n = function(module) { |
|
/******/ var getter = module && module.__esModule ? |
|
/******/ function getDefault() { return module['default']; } : |
|
/******/ function getModuleExports() { return module; }; |
|
/******/ __webpack_require__.d(getter, 'a', getter); |
|
/******/ return getter; |
|
/******/ }; |
|
/******/ |
|
/******/ // Object.prototype.hasOwnProperty.call |
|
/******/ __webpack_require__.o = function(object, property) { return Object.prototype.hasOwnProperty.call(object, property); }; |
|
/******/ |
|
/******/ // __webpack_public_path__ |
|
/******/ __webpack_require__.p = ""; |
|
/******/ |
|
/******/ |
|
/******/ // Load entry module and return exports |
|
/******/ return __webpack_require__(__webpack_require__.s = 323); |
|
/******/ }) |
|
/************************************************************************/ |
|
/******/ ({ |
|
|
|
/***/ 19: |
|
/***/ (function(module, __webpack_exports__, __webpack_require__) { |
|
|
|
"use strict"; |
|
|
|
// CONCATENATED MODULE: ./node_modules/@babel/runtime/helpers/esm/arrayWithoutHoles.js |
|
function _arrayWithoutHoles(arr) { |
|
if (Array.isArray(arr)) { |
|
for (var i = 0, arr2 = new Array(arr.length); i < arr.length; i++) { |
|
arr2[i] = arr[i]; |
|
} |
|
|
|
return arr2; |
|
} |
|
} |
|
// EXTERNAL MODULE: ./node_modules/@babel/runtime/helpers/esm/iterableToArray.js |
|
var iterableToArray = __webpack_require__(33); |
|
|
|
// CONCATENATED MODULE: ./node_modules/@babel/runtime/helpers/esm/nonIterableSpread.js |
|
function _nonIterableSpread() { |
|
throw new TypeError("Invalid attempt to spread non-iterable instance"); |
|
} |
|
// CONCATENATED MODULE: ./node_modules/@babel/runtime/helpers/esm/toConsumableArray.js |
|
/* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "a", function() { return _toConsumableArray; }); |
|
|
|
|
|
|
|
function _toConsumableArray(arr) { |
|
return _arrayWithoutHoles(arr) || Object(iterableToArray["a" /* default */])(arr) || _nonIterableSpread(); |
|
} |
|
|
|
/***/ }), |
|
|
|
/***/ 2: |
|
/***/ (function(module, exports) { |
|
|
|
(function() { module.exports = this["lodash"]; }()); |
|
|
|
/***/ }), |
|
|
|
/***/ 323: |
|
/***/ (function(module, __webpack_exports__, __webpack_require__) { |
|
|
|
"use strict"; |
|
__webpack_require__.r(__webpack_exports__); |
|
var focusable_namespaceObject = {}; |
|
__webpack_require__.r(focusable_namespaceObject); |
|
__webpack_require__.d(focusable_namespaceObject, "find", function() { return find; }); |
|
var tabbable_namespaceObject = {}; |
|
__webpack_require__.r(tabbable_namespaceObject); |
|
__webpack_require__.d(tabbable_namespaceObject, "isTabbableIndex", function() { return isTabbableIndex; }); |
|
__webpack_require__.d(tabbable_namespaceObject, "find", function() { return tabbable_find; }); |
|
|
|
// EXTERNAL MODULE: ./node_modules/@babel/runtime/helpers/esm/toConsumableArray.js + 2 modules |
|
var toConsumableArray = __webpack_require__(19); |
|
|
|
// CONCATENATED MODULE: ./node_modules/@wordpress/dom/build-module/focusable.js |
|
|
|
|
|
/** |
|
* References: |
|
* |
|
* Focusable: |
|
* - https://www.w3.org/TR/html5/editing.html#focus-management |
|
* |
|
* Sequential focus navigation: |
|
* - https://www.w3.org/TR/html5/editing.html#sequential-focus-navigation-and-the-tabindex-attribute |
|
* |
|
* Disabled elements: |
|
* - https://www.w3.org/TR/html5/disabled-elements.html#disabled-elements |
|
* |
|
* getClientRects algorithm (requiring layout box): |
|
* - https://www.w3.org/TR/cssom-view-1/#extension-to-the-element-interface |
|
* |
|
* AREA elements associated with an IMG: |
|
* - https://w3c.github.io/html/editing.html#data-model |
|
*/ |
|
var SELECTOR = ['[tabindex]', 'a[href]', 'button:not([disabled])', 'input:not([type="hidden"]):not([disabled])', 'select:not([disabled])', 'textarea:not([disabled])', 'iframe', 'object', 'embed', 'area[href]', '[contenteditable]:not([contenteditable=false])'].join(','); |
|
/** |
|
* Returns true if the specified element is visible (i.e. neither display: none |
|
* nor visibility: hidden). |
|
* |
|
* @param {Element} element DOM element to test. |
|
* |
|
* @return {boolean} Whether element is visible. |
|
*/ |
|
|
|
function isVisible(element) { |
|
return element.offsetWidth > 0 || element.offsetHeight > 0 || element.getClientRects().length > 0; |
|
} |
|
/** |
|
* Returns true if the specified area element is a valid focusable element, or |
|
* false otherwise. Area is only focusable if within a map where a named map |
|
* referenced by an image somewhere in the document. |
|
* |
|
* @param {Element} element DOM area element to test. |
|
* |
|
* @return {boolean} Whether area element is valid for focus. |
|
*/ |
|
|
|
|
|
function isValidFocusableArea(element) { |
|
var map = element.closest('map[name]'); |
|
|
|
if (!map) { |
|
return false; |
|
} |
|
|
|
var img = document.querySelector('img[usemap="#' + map.name + '"]'); |
|
return !!img && isVisible(img); |
|
} |
|
/** |
|
* Returns all focusable elements within a given context. |
|
* |
|
* @param {Element} context Element in which to search. |
|
* |
|
* @return {Element[]} Focusable elements. |
|
*/ |
|
|
|
|
|
function find(context) { |
|
var elements = context.querySelectorAll(SELECTOR); |
|
return Object(toConsumableArray["a" /* default */])(elements).filter(function (element) { |
|
if (!isVisible(element)) { |
|
return false; |
|
} |
|
|
|
var nodeName = element.nodeName; |
|
|
|
if ('AREA' === nodeName) { |
|
return isValidFocusableArea(element); |
|
} |
|
|
|
return true; |
|
}); |
|
} |
|
|
|
// CONCATENATED MODULE: ./node_modules/@wordpress/dom/build-module/tabbable.js |
|
/** |
|
* Internal dependencies |
|
*/ |
|
|
|
/** |
|
* Returns the tab index of the given element. In contrast with the tabIndex |
|
* property, this normalizes the default (0) to avoid browser inconsistencies, |
|
* operating under the assumption that this function is only ever called with a |
|
* focusable node. |
|
* |
|
* @see https://bugzilla.mozilla.org/show_bug.cgi?id=1190261 |
|
* |
|
* @param {Element} element Element from which to retrieve. |
|
* |
|
* @return {?number} Tab index of element (default 0). |
|
*/ |
|
|
|
function getTabIndex(element) { |
|
var tabIndex = element.getAttribute('tabindex'); |
|
return tabIndex === null ? 0 : parseInt(tabIndex, 10); |
|
} |
|
/** |
|
* Returns true if the specified element is tabbable, or false otherwise. |
|
* |
|
* @param {Element} element Element to test. |
|
* |
|
* @return {boolean} Whether element is tabbable. |
|
*/ |
|
|
|
|
|
function isTabbableIndex(element) { |
|
return getTabIndex(element) !== -1; |
|
} |
|
/** |
|
* An array map callback, returning an object with the element value and its |
|
* array index location as properties. This is used to emulate a proper stable |
|
* sort where equal tabIndex should be left in order of their occurrence in the |
|
* document. |
|
* |
|
* @param {Element} element Element. |
|
* @param {number} index Array index of element. |
|
* |
|
* @return {Object} Mapped object with element, index. |
|
*/ |
|
|
|
function mapElementToObjectTabbable(element, index) { |
|
return { |
|
element: element, |
|
index: index |
|
}; |
|
} |
|
/** |
|
* An array map callback, returning an element of the given mapped object's |
|
* element value. |
|
* |
|
* @param {Object} object Mapped object with index. |
|
* |
|
* @return {Element} Mapped object element. |
|
*/ |
|
|
|
|
|
function mapObjectTabbableToElement(object) { |
|
return object.element; |
|
} |
|
/** |
|
* A sort comparator function used in comparing two objects of mapped elements. |
|
* |
|
* @see mapElementToObjectTabbable |
|
* |
|
* @param {Object} a First object to compare. |
|
* @param {Object} b Second object to compare. |
|
* |
|
* @return {number} Comparator result. |
|
*/ |
|
|
|
|
|
function compareObjectTabbables(a, b) { |
|
var aTabIndex = getTabIndex(a.element); |
|
var bTabIndex = getTabIndex(b.element); |
|
|
|
if (aTabIndex === bTabIndex) { |
|
return a.index - b.index; |
|
} |
|
|
|
return aTabIndex - bTabIndex; |
|
} |
|
|
|
function tabbable_find(context) { |
|
return find(context).filter(isTabbableIndex).map(mapElementToObjectTabbable).sort(compareObjectTabbables).map(mapObjectTabbableToElement); |
|
} |
|
|
|
// EXTERNAL MODULE: external "lodash" |
|
var external_lodash_ = __webpack_require__(2); |
|
|
|
// CONCATENATED MODULE: ./node_modules/@wordpress/dom/build-module/dom.js |
|
/** |
|
* External dependencies |
|
*/ |
|
|
|
/** |
|
* Browser dependencies |
|
*/ |
|
|
|
var _window = window, |
|
getComputedStyle = _window.getComputedStyle; |
|
var _window$Node = window.Node, |
|
TEXT_NODE = _window$Node.TEXT_NODE, |
|
ELEMENT_NODE = _window$Node.ELEMENT_NODE, |
|
DOCUMENT_POSITION_PRECEDING = _window$Node.DOCUMENT_POSITION_PRECEDING, |
|
DOCUMENT_POSITION_FOLLOWING = _window$Node.DOCUMENT_POSITION_FOLLOWING; |
|
/** |
|
* Returns true if the given selection object is in the forward direction, or |
|
* false otherwise. |
|
* |
|
* @see https://developer.mozilla.org/en-US/docs/Web/API/Node/compareDocumentPosition |
|
* |
|
* @param {Selection} selection Selection object to check. |
|
* |
|
* @return {boolean} Whether the selection is forward. |
|
*/ |
|
|
|
function isSelectionForward(selection) { |
|
var anchorNode = selection.anchorNode, |
|
focusNode = selection.focusNode, |
|
anchorOffset = selection.anchorOffset, |
|
focusOffset = selection.focusOffset; |
|
var position = anchorNode.compareDocumentPosition(focusNode); // Disable reason: `Node#compareDocumentPosition` returns a bitmask value, |
|
// so bitwise operators are intended. |
|
|
|
/* eslint-disable no-bitwise */ |
|
// Compare whether anchor node precedes focus node. If focus node (where |
|
// end of selection occurs) is after the anchor node, it is forward. |
|
|
|
if (position & DOCUMENT_POSITION_PRECEDING) { |
|
return false; |
|
} |
|
|
|
if (position & DOCUMENT_POSITION_FOLLOWING) { |
|
return true; |
|
} |
|
/* eslint-enable no-bitwise */ |
|
// `compareDocumentPosition` returns 0 when passed the same node, in which |
|
// case compare offsets. |
|
|
|
|
|
if (position === 0) { |
|
return anchorOffset <= focusOffset; |
|
} // This should never be reached, but return true as default case. |
|
|
|
|
|
return true; |
|
} |
|
/** |
|
* Check whether the selection is horizontally at the edge of the container. |
|
* |
|
* @param {Element} container Focusable element. |
|
* @param {boolean} isReverse Set to true to check left, false for right. |
|
* |
|
* @return {boolean} True if at the horizontal edge, false if not. |
|
*/ |
|
|
|
|
|
function isHorizontalEdge(container, isReverse) { |
|
if (Object(external_lodash_["includes"])(['INPUT', 'TEXTAREA'], container.tagName)) { |
|
if (container.selectionStart !== container.selectionEnd) { |
|
return false; |
|
} |
|
|
|
if (isReverse) { |
|
return container.selectionStart === 0; |
|
} |
|
|
|
return container.value.length === container.selectionStart; |
|
} |
|
|
|
if (!container.isContentEditable) { |
|
return true; |
|
} |
|
|
|
var selection = window.getSelection(); // Create copy of range for setting selection to find effective offset. |
|
|
|
var range = selection.getRangeAt(0).cloneRange(); // Collapse in direction of selection. |
|
|
|
if (!selection.isCollapsed) { |
|
range.collapse(!isSelectionForward(selection)); |
|
} |
|
|
|
var node = range.startContainer; |
|
var extentOffset; |
|
|
|
if (isReverse) { |
|
// When in reverse, range node should be first. |
|
extentOffset = 0; |
|
} else if (node.nodeValue) { |
|
// Otherwise, vary by node type. A text node has no children. Its range |
|
// offset reflects its position in nodeValue. |
|
// |
|
// "If the startContainer is a Node of type Text, Comment, or |
|
// CDATASection, then the offset is the number of characters from the |
|
// start of the startContainer to the boundary point of the Range." |
|
// |
|
// See: https://developer.mozilla.org/en-US/docs/Web/API/Range/startOffset |
|
// See: https://developer.mozilla.org/en-US/docs/Web/API/Node/nodeValue |
|
extentOffset = node.nodeValue.length; |
|
} else { |
|
// "For other Node types, the startOffset is the number of child nodes |
|
// between the start of the startContainer and the boundary point of |
|
// the Range." |
|
// |
|
// See: https://developer.mozilla.org/en-US/docs/Web/API/Range/startOffset |
|
extentOffset = node.childNodes.length; |
|
} // Offset of range should be at expected extent. |
|
|
|
|
|
var position = isReverse ? 'start' : 'end'; |
|
var offset = range["".concat(position, "Offset")]; |
|
|
|
if (offset !== extentOffset) { |
|
return false; |
|
} // If confirmed to be at extent, traverse up through DOM, verifying that |
|
// the node is at first or last child for reverse or forward respectively. |
|
// Continue until container is reached. |
|
|
|
|
|
var order = isReverse ? 'first' : 'last'; |
|
|
|
while (node !== container) { |
|
var parentNode = node.parentNode; |
|
|
|
if (parentNode["".concat(order, "Child")] !== node) { |
|
return false; |
|
} |
|
|
|
node = parentNode; |
|
} // If reached, range is assumed to be at edge. |
|
|
|
|
|
return true; |
|
} |
|
/** |
|
* Check whether the selection is vertically at the edge of the container. |
|
* |
|
* @param {Element} container Focusable element. |
|
* @param {boolean} isReverse Set to true to check top, false for bottom. |
|
* |
|
* @return {boolean} True if at the edge, false if not. |
|
*/ |
|
|
|
function isVerticalEdge(container, isReverse) { |
|
if (Object(external_lodash_["includes"])(['INPUT', 'TEXTAREA'], container.tagName)) { |
|
return isHorizontalEdge(container, isReverse); |
|
} |
|
|
|
if (!container.isContentEditable) { |
|
return true; |
|
} |
|
|
|
var selection = window.getSelection(); |
|
var range = selection.rangeCount ? selection.getRangeAt(0) : null; |
|
|
|
if (!range) { |
|
return false; |
|
} |
|
|
|
var rangeRect = getRectangleFromRange(range); |
|
|
|
if (!rangeRect) { |
|
return false; |
|
} |
|
|
|
var buffer = rangeRect.height / 2; |
|
var editableRect = container.getBoundingClientRect(); // Too low. |
|
|
|
if (isReverse && rangeRect.top - buffer > editableRect.top) { |
|
return false; |
|
} // Too high. |
|
|
|
|
|
if (!isReverse && rangeRect.bottom + buffer < editableRect.bottom) { |
|
return false; |
|
} |
|
|
|
return true; |
|
} |
|
/** |
|
* Get the rectangle of a given Range. |
|
* |
|
* @param {Range} range The range. |
|
* |
|
* @return {DOMRect} The rectangle. |
|
*/ |
|
|
|
function getRectangleFromRange(range) { |
|
// For uncollapsed ranges, get the rectangle that bounds the contents of the |
|
// range; this a rectangle enclosing the union of the bounding rectangles |
|
// for all the elements in the range. |
|
if (!range.collapsed) { |
|
return range.getBoundingClientRect(); |
|
} |
|
|
|
var rect = range.getClientRects()[0]; // If the collapsed range starts (and therefore ends) at an element node, |
|
// `getClientRects` can be empty in some browsers. This can be resolved |
|
// by adding a temporary text node with zero-width space to the range. |
|
// |
|
// See: https://stackoverflow.com/a/6847328/995445 |
|
|
|
if (!rect) { |
|
var padNode = document.createTextNode("\u200B"); |
|
range.insertNode(padNode); |
|
rect = range.getClientRects()[0]; |
|
padNode.parentNode.removeChild(padNode); |
|
} |
|
|
|
return rect; |
|
} |
|
/** |
|
* Get the rectangle for the selection in a container. |
|
* |
|
* @param {Element} container Editable container. |
|
* |
|
* @return {?DOMRect} The rectangle. |
|
*/ |
|
|
|
function computeCaretRect(container) { |
|
if (!container.isContentEditable) { |
|
return; |
|
} |
|
|
|
var selection = window.getSelection(); |
|
var range = selection.rangeCount ? selection.getRangeAt(0) : null; |
|
|
|
if (!range) { |
|
return; |
|
} |
|
|
|
return getRectangleFromRange(range); |
|
} |
|
/** |
|
* Places the caret at start or end of a given element. |
|
* |
|
* @param {Element} container Focusable element. |
|
* @param {boolean} isReverse True for end, false for start. |
|
*/ |
|
|
|
function placeCaretAtHorizontalEdge(container, isReverse) { |
|
if (!container) { |
|
return; |
|
} |
|
|
|
if (Object(external_lodash_["includes"])(['INPUT', 'TEXTAREA'], container.tagName)) { |
|
container.focus(); |
|
|
|
if (isReverse) { |
|
container.selectionStart = container.value.length; |
|
container.selectionEnd = container.value.length; |
|
} else { |
|
container.selectionStart = 0; |
|
container.selectionEnd = 0; |
|
} |
|
|
|
return; |
|
} |
|
|
|
container.focus(); |
|
|
|
if (!container.isContentEditable) { |
|
return; |
|
} // Select on extent child of the container, not the container itself. This |
|
// avoids the selection always being `endOffset` of 1 when placed at end, |
|
// where `startContainer`, `endContainer` would always be container itself. |
|
|
|
|
|
var rangeTarget = container[isReverse ? 'lastChild' : 'firstChild']; // If no range target, it implies that the container is empty. Focusing is |
|
// sufficient for caret to be placed correctly. |
|
|
|
if (!rangeTarget) { |
|
return; |
|
} |
|
|
|
var selection = window.getSelection(); |
|
var range = document.createRange(); |
|
range.selectNodeContents(rangeTarget); |
|
range.collapse(!isReverse); |
|
selection.removeAllRanges(); |
|
selection.addRange(range); |
|
} |
|
/** |
|
* Polyfill. |
|
* Get a collapsed range for a given point. |
|
* |
|
* @see https://developer.mozilla.org/en-US/docs/Web/API/Document/caretRangeFromPoint |
|
* |
|
* @param {Document} doc The document of the range. |
|
* @param {number} x Horizontal position within the current viewport. |
|
* @param {number} y Vertical position within the current viewport. |
|
* |
|
* @return {?Range} The best range for the given point. |
|
*/ |
|
|
|
function caretRangeFromPoint(doc, x, y) { |
|
if (doc.caretRangeFromPoint) { |
|
return doc.caretRangeFromPoint(x, y); |
|
} |
|
|
|
if (!doc.caretPositionFromPoint) { |
|
return null; |
|
} |
|
|
|
var point = doc.caretPositionFromPoint(x, y); // If x or y are negative, outside viewport, or there is no text entry node. |
|
// https://developer.mozilla.org/en-US/docs/Web/API/Document/caretRangeFromPoint |
|
|
|
if (!point) { |
|
return null; |
|
} |
|
|
|
var range = doc.createRange(); |
|
range.setStart(point.offsetNode, point.offset); |
|
range.collapse(true); |
|
return range; |
|
} |
|
/** |
|
* Get a collapsed range for a given point. |
|
* Gives the container a temporary high z-index (above any UI). |
|
* This is preferred over getting the UI nodes and set styles there. |
|
* |
|
* @param {Document} doc The document of the range. |
|
* @param {number} x Horizontal position within the current viewport. |
|
* @param {number} y Vertical position within the current viewport. |
|
* @param {Element} container Container in which the range is expected to be found. |
|
* |
|
* @return {?Range} The best range for the given point. |
|
*/ |
|
|
|
|
|
function hiddenCaretRangeFromPoint(doc, x, y, container) { |
|
container.style.zIndex = '10000'; |
|
var range = caretRangeFromPoint(doc, x, y); |
|
container.style.zIndex = null; |
|
return range; |
|
} |
|
/** |
|
* Places the caret at the top or bottom of a given element. |
|
* |
|
* @param {Element} container Focusable element. |
|
* @param {boolean} isReverse True for bottom, false for top. |
|
* @param {DOMRect} [rect] The rectangle to position the caret with. |
|
* @param {boolean} [mayUseScroll=true] True to allow scrolling, false to disallow. |
|
*/ |
|
|
|
|
|
function placeCaretAtVerticalEdge(container, isReverse, rect) { |
|
var mayUseScroll = arguments.length > 3 && arguments[3] !== undefined ? arguments[3] : true; |
|
|
|
if (!container) { |
|
return; |
|
} |
|
|
|
if (!rect || !container.isContentEditable) { |
|
placeCaretAtHorizontalEdge(container, isReverse); |
|
return; |
|
} // Offset by a buffer half the height of the caret rect. This is needed |
|
// because caretRangeFromPoint may default to the end of the selection if |
|
// offset is too close to the edge. It's unclear how to precisely calculate |
|
// this threshold; it may be the padded area of some combination of line |
|
// height, caret height, and font size. The buffer offset is effectively |
|
// equivalent to a point at half the height of a line of text. |
|
|
|
|
|
var buffer = rect.height / 2; |
|
var editableRect = container.getBoundingClientRect(); |
|
var x = rect.left; |
|
var y = isReverse ? editableRect.bottom - buffer : editableRect.top + buffer; |
|
var selection = window.getSelection(); |
|
var range = hiddenCaretRangeFromPoint(document, x, y, container); |
|
|
|
if (!range || !container.contains(range.startContainer)) { |
|
if (mayUseScroll && (!range || !range.startContainer || !range.startContainer.contains(container))) { |
|
// Might be out of view. |
|
// Easier than attempting to calculate manually. |
|
container.scrollIntoView(isReverse); |
|
placeCaretAtVerticalEdge(container, isReverse, rect, false); |
|
return; |
|
} |
|
|
|
placeCaretAtHorizontalEdge(container, isReverse); |
|
return; |
|
} // Check if the closest text node is actually further away. |
|
// If so, attempt to get the range again with the y position adjusted to get the right offset. |
|
|
|
|
|
if (range.startContainer.nodeType === TEXT_NODE) { |
|
var parentNode = range.startContainer.parentNode; |
|
var parentRect = parentNode.getBoundingClientRect(); |
|
var side = isReverse ? 'bottom' : 'top'; |
|
var padding = parseInt(getComputedStyle(parentNode).getPropertyValue("padding-".concat(side)), 10) || 0; |
|
var actualY = isReverse ? parentRect.bottom - padding - buffer : parentRect.top + padding + buffer; |
|
|
|
if (y !== actualY) { |
|
range = hiddenCaretRangeFromPoint(document, x, actualY, container); |
|
} |
|
} |
|
|
|
selection.removeAllRanges(); |
|
selection.addRange(range); |
|
container.focus(); // Editable was already focussed, it goes back to old range... |
|
// This fixes it. |
|
|
|
selection.removeAllRanges(); |
|
selection.addRange(range); |
|
} |
|
/** |
|
* Check whether the given element is a text field, where text field is defined |
|
* by the ability to select within the input, or that it is contenteditable. |
|
* |
|
* See: https://html.spec.whatwg.org/#textFieldSelection |
|
* |
|
* @param {HTMLElement} element The HTML element. |
|
* |
|
* @return {boolean} True if the element is an text field, false if not. |
|
*/ |
|
|
|
function isTextField(element) { |
|
try { |
|
var nodeName = element.nodeName, |
|
selectionStart = element.selectionStart, |
|
contentEditable = element.contentEditable; |
|
return nodeName === 'INPUT' && selectionStart !== null || nodeName === 'TEXTAREA' || contentEditable === 'true'; |
|
} catch (error) { |
|
// Safari throws an exception when trying to get `selectionStart` |
|
// on non-text <input> elements (which, understandably, don't |
|
// have the text selection API). We catch this via a try/catch |
|
// block, as opposed to a more explicit check of the element's |
|
// input types, because of Safari's non-standard behavior. This |
|
// also means we don't have to worry about the list of input |
|
// types that support `selectionStart` changing as the HTML spec |
|
// evolves over time. |
|
return false; |
|
} |
|
} |
|
/** |
|
* Check wether the current document has a selection. |
|
* This checks both for focus in an input field and general text selection. |
|
* |
|
* @return {boolean} True if there is selection, false if not. |
|
*/ |
|
|
|
function documentHasSelection() { |
|
if (isTextField(document.activeElement)) { |
|
return true; |
|
} |
|
|
|
var selection = window.getSelection(); |
|
var range = selection.rangeCount ? selection.getRangeAt(0) : null; |
|
return range && !range.collapsed; |
|
} |
|
/** |
|
* Check whether the contents of the element have been entirely selected. |
|
* Returns true if there is no possibility of selection. |
|
* |
|
* @param {Element} element The element to check. |
|
* |
|
* @return {boolean} True if entirely selected, false if not. |
|
*/ |
|
|
|
function isEntirelySelected(element) { |
|
if (Object(external_lodash_["includes"])(['INPUT', 'TEXTAREA'], element.nodeName)) { |
|
return element.selectionStart === 0 && element.value.length === element.selectionEnd; |
|
} |
|
|
|
if (!element.isContentEditable) { |
|
return true; |
|
} |
|
|
|
var selection = window.getSelection(); |
|
var range = selection.rangeCount ? selection.getRangeAt(0) : null; |
|
|
|
if (!range) { |
|
return true; |
|
} |
|
|
|
var startContainer = range.startContainer, |
|
endContainer = range.endContainer, |
|
startOffset = range.startOffset, |
|
endOffset = range.endOffset; |
|
|
|
if (startContainer === element && endContainer === element && startOffset === 0 && endOffset === element.childNodes.length) { |
|
return true; |
|
} |
|
|
|
var lastChild = element.lastChild; |
|
var lastChildContentLength = lastChild.nodeType === TEXT_NODE ? lastChild.data.length : lastChild.childNodes.length; |
|
return startContainer === element.firstChild && endContainer === element.lastChild && startOffset === 0 && endOffset === lastChildContentLength; |
|
} |
|
/** |
|
* Given a DOM node, finds the closest scrollable container node. |
|
* |
|
* @param {Element} node Node from which to start. |
|
* |
|
* @return {?Element} Scrollable container node, if found. |
|
*/ |
|
|
|
function getScrollContainer(node) { |
|
if (!node) { |
|
return; |
|
} // Scrollable if scrollable height exceeds displayed... |
|
|
|
|
|
if (node.scrollHeight > node.clientHeight) { |
|
// ...except when overflow is defined to be hidden or visible |
|
var _window$getComputedSt = window.getComputedStyle(node), |
|
overflowY = _window$getComputedSt.overflowY; |
|
|
|
if (/(auto|scroll)/.test(overflowY)) { |
|
return node; |
|
} |
|
} // Continue traversing |
|
|
|
|
|
return getScrollContainer(node.parentNode); |
|
} |
|
/** |
|
* Returns the closest positioned element, or null under any of the conditions |
|
* of the offsetParent specification. Unlike offsetParent, this function is not |
|
* limited to HTMLElement and accepts any Node (e.g. Node.TEXT_NODE). |
|
* |
|
* @see https://drafts.csswg.org/cssom-view/#dom-htmlelement-offsetparent |
|
* |
|
* @param {Node} node Node from which to find offset parent. |
|
* |
|
* @return {?Node} Offset parent. |
|
*/ |
|
|
|
function getOffsetParent(node) { |
|
// Cannot retrieve computed style or offset parent only anything other than |
|
// an element node, so find the closest element node. |
|
var closestElement; |
|
|
|
while (closestElement = node.parentNode) { |
|
if (closestElement.nodeType === ELEMENT_NODE) { |
|
break; |
|
} |
|
} |
|
|
|
if (!closestElement) { |
|
return null; |
|
} // If the closest element is already positioned, return it, as offsetParent |
|
// does not otherwise consider the node itself. |
|
|
|
|
|
if (getComputedStyle(closestElement).position !== 'static') { |
|
return closestElement; |
|
} |
|
|
|
return closestElement.offsetParent; |
|
} |
|
/** |
|
* Given two DOM nodes, replaces the former with the latter in the DOM. |
|
* |
|
* @param {Element} processedNode Node to be removed. |
|
* @param {Element} newNode Node to be inserted in its place. |
|
* @return {void} |
|
*/ |
|
|
|
function replace(processedNode, newNode) { |
|
insertAfter(newNode, processedNode.parentNode); |
|
remove(processedNode); |
|
} |
|
/** |
|
* Given a DOM node, removes it from the DOM. |
|
* |
|
* @param {Element} node Node to be removed. |
|
* @return {void} |
|
*/ |
|
|
|
function remove(node) { |
|
node.parentNode.removeChild(node); |
|
} |
|
/** |
|
* Given two DOM nodes, inserts the former in the DOM as the next sibling of |
|
* the latter. |
|
* |
|
* @param {Element} newNode Node to be inserted. |
|
* @param {Element} referenceNode Node after which to perform the insertion. |
|
* @return {void} |
|
*/ |
|
|
|
function insertAfter(newNode, referenceNode) { |
|
referenceNode.parentNode.insertBefore(newNode, referenceNode.nextSibling); |
|
} |
|
/** |
|
* Unwrap the given node. This means any child nodes are moved to the parent. |
|
* |
|
* @param {Node} node The node to unwrap. |
|
* |
|
* @return {void} |
|
*/ |
|
|
|
function unwrap(node) { |
|
var parent = node.parentNode; |
|
|
|
while (node.firstChild) { |
|
parent.insertBefore(node.firstChild, node); |
|
} |
|
|
|
parent.removeChild(node); |
|
} |
|
/** |
|
* Replaces the given node with a new node with the given tag name. |
|
* |
|
* @param {Element} node The node to replace |
|
* @param {string} tagName The new tag name. |
|
* |
|
* @return {Element} The new node. |
|
*/ |
|
|
|
function replaceTag(node, tagName) { |
|
var newNode = node.ownerDocument.createElement(tagName); |
|
|
|
while (node.firstChild) { |
|
newNode.appendChild(node.firstChild); |
|
} |
|
|
|
node.parentNode.replaceChild(newNode, node); |
|
return newNode; |
|
} |
|
/** |
|
* Wraps the given node with a new node with the given tag name. |
|
* |
|
* @param {Element} newNode The node to insert. |
|
* @param {Element} referenceNode The node to wrap. |
|
*/ |
|
|
|
function wrap(newNode, referenceNode) { |
|
referenceNode.parentNode.insertBefore(newNode, referenceNode); |
|
newNode.appendChild(referenceNode); |
|
} |
|
|
|
// CONCATENATED MODULE: ./node_modules/@wordpress/dom/build-module/index.js |
|
/* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "focus", function() { return build_module_focus; }); |
|
/* concated harmony reexport isHorizontalEdge */__webpack_require__.d(__webpack_exports__, "isHorizontalEdge", function() { return isHorizontalEdge; }); |
|
/* concated harmony reexport isVerticalEdge */__webpack_require__.d(__webpack_exports__, "isVerticalEdge", function() { return isVerticalEdge; }); |
|
/* concated harmony reexport getRectangleFromRange */__webpack_require__.d(__webpack_exports__, "getRectangleFromRange", function() { return getRectangleFromRange; }); |
|
/* concated harmony reexport computeCaretRect */__webpack_require__.d(__webpack_exports__, "computeCaretRect", function() { return computeCaretRect; }); |
|
/* concated harmony reexport placeCaretAtHorizontalEdge */__webpack_require__.d(__webpack_exports__, "placeCaretAtHorizontalEdge", function() { return placeCaretAtHorizontalEdge; }); |
|
/* concated harmony reexport placeCaretAtVerticalEdge */__webpack_require__.d(__webpack_exports__, "placeCaretAtVerticalEdge", function() { return placeCaretAtVerticalEdge; }); |
|
/* concated harmony reexport isTextField */__webpack_require__.d(__webpack_exports__, "isTextField", function() { return isTextField; }); |
|
/* concated harmony reexport documentHasSelection */__webpack_require__.d(__webpack_exports__, "documentHasSelection", function() { return documentHasSelection; }); |
|
/* concated harmony reexport isEntirelySelected */__webpack_require__.d(__webpack_exports__, "isEntirelySelected", function() { return isEntirelySelected; }); |
|
/* concated harmony reexport getScrollContainer */__webpack_require__.d(__webpack_exports__, "getScrollContainer", function() { return getScrollContainer; }); |
|
/* concated harmony reexport getOffsetParent */__webpack_require__.d(__webpack_exports__, "getOffsetParent", function() { return getOffsetParent; }); |
|
/* concated harmony reexport replace */__webpack_require__.d(__webpack_exports__, "replace", function() { return replace; }); |
|
/* concated harmony reexport remove */__webpack_require__.d(__webpack_exports__, "remove", function() { return remove; }); |
|
/* concated harmony reexport insertAfter */__webpack_require__.d(__webpack_exports__, "insertAfter", function() { return insertAfter; }); |
|
/* concated harmony reexport unwrap */__webpack_require__.d(__webpack_exports__, "unwrap", function() { return unwrap; }); |
|
/* concated harmony reexport replaceTag */__webpack_require__.d(__webpack_exports__, "replaceTag", function() { return replaceTag; }); |
|
/* concated harmony reexport wrap */__webpack_require__.d(__webpack_exports__, "wrap", function() { return wrap; }); |
|
/** |
|
* Internal dependencies |
|
*/ |
|
|
|
|
|
var build_module_focus = { |
|
focusable: focusable_namespaceObject, |
|
tabbable: tabbable_namespaceObject |
|
}; |
|
|
|
|
|
|
|
/***/ }), |
|
|
|
/***/ 33: |
|
/***/ (function(module, __webpack_exports__, __webpack_require__) { |
|
|
|
"use strict"; |
|
/* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "a", function() { return _iterableToArray; }); |
|
function _iterableToArray(iter) { |
|
if (Symbol.iterator in Object(iter) || Object.prototype.toString.call(iter) === "[object Arguments]") return Array.from(iter); |
|
} |
|
|
|
/***/ }) |
|
|
|
/******/ }); |