How to use the @wordpress/dom.isHorizontalEdge function in @wordpress/dom

To help you get started, we’ve selected a few @wordpress/dom examples, based on popular ways it is used in public projects.

Secure your code as it's written. Use Snyk Code to scan source code in minutes - no build needed - and fix issues immediately.

github DefinitelyTyped / DefinitelyTyped / types / wordpress__dom / wordpress__dom-tests.ts View on Github external
dom.getOffsetParent(node);

// $ExpectType DOMRect
dom.getRectangleFromRange(range);

// $ExpectType Element | undefined
dom.getScrollContainer(element);

// $ExpectType void
dom.insertAfter(node, node);

// $ExpectType boolean
dom.isEntirelySelected(element);

// $ExpectType boolean
dom.isHorizontalEdge(element, true);

// $ExpectType boolean
dom.isTextField(element);

// $ExpectType boolean
dom.isVerticalEdge(element, false);

// $ExpectType void
dom.placeCaretAtHorizontalEdge(element, true);

// $ExpectType void
dom.placeCaretAtHorizontalEdge(undefined, false);

// $ExpectType void
dom.placeCaretAtVerticalEdge(element, true);
github front / gutenberg-js / src / js / gutenberg-overrides / packages / editor / build-module / components / rich-text / index.js View on Github external
const { isCollapsed } = getSelection();

    // Only process delete if the key press occurs at uncollapsed edge.
    if (! isCollapsed) {
      return;
    }

    // It is important to consider emptiness because an empty container
    // will include a bogus TinyMCE BR node _after_ the caret, so in a
    // forward deletion the isHorizontalEdge function will incorrectly
    // interpret the presence of the bogus node as not being at the edge.
    const isEmpty = this.isEmpty();
    const isEdge = (
      isEmpty ||
			isHorizontalEdge(this.editor.getBody(), isReverse)
    );

    if (! isEdge) {
      return;
    }

    if (onMerge) {
      onMerge(! isReverse);
    }

    // Only handle remove on Backspace. This serves dual-purpose of being
    // an intentional user interaction distinguishing between Backspace and
    // Delete to remove the empty field, but also to avoid merge & remove
    // causing destruction of two fields (merge, then removed merged).
    if (onRemove && isEmpty && isReverse) {
      onRemove(! isReverse);
github WordPress / gutenberg / packages / block-editor / src / components / writing-flow / index.js View on Github external
// the end of the current block.
				this.expandSelection( isReverse );
				event.preventDefault();
			}
		} else if ( hasMultiSelection ) {
			// Moving from block multi-selection to single block selection
			this.moveSelection( isReverse );
			event.preventDefault();
		} else if ( isVertical && isVerticalEdge( target, isReverse ) ) {
			const closestTabbable = this.getClosestTabbable( target, isReverse );

			if ( closestTabbable ) {
				placeCaretAtVerticalEdge( closestTabbable, isReverse, this.verticalRect );
				event.preventDefault();
			}
		} else if ( isHorizontal && getSelection().isCollapsed && isHorizontalEdge( target, isReverseDir ) ) {
			const closestTabbable = this.getClosestTabbable( target, isReverseDir );
			placeCaretAtHorizontalEdge( closestTabbable, isReverseDir );
			event.preventDefault();
		}
	}
github WordPress / gutenberg / editor / components / rich-text / index.js View on Github external
onKeyDown( event ) {
		const dom = this.editor.dom;
		const rootNode = this.editor.getBody();
		const { keyCode } = event;

		if (
			( keyCode === BACKSPACE && isHorizontalEdge( rootNode, true ) ) ||
			( keyCode === DELETE && isHorizontalEdge( rootNode, false ) )
		) {
			if ( ! this.props.onMerge && ! this.props.onRemove ) {
				return;
			}

			const forward = keyCode === DELETE;

			if ( this.props.onMerge ) {
				this.props.onMerge( forward );
			}

			if ( this.props.onRemove && this.isEmpty() ) {
				this.props.onRemove( forward );
			}

			event.preventDefault();
github WordPress / gutenberg / editor / components / rich-text / index.js View on Github external
onKeyDown( event ) {
		const dom = this.editor.dom;
		const rootNode = this.editor.getBody();
		const { keyCode } = event;

		if (
			( keyCode === BACKSPACE && isHorizontalEdge( rootNode, true ) ) ||
			( keyCode === DELETE && isHorizontalEdge( rootNode, false ) )
		) {
			if ( ! this.props.onMerge && ! this.props.onRemove ) {
				return;
			}

			const forward = keyCode === DELETE;

			if ( this.props.onMerge ) {
				this.props.onMerge( forward );
			}

			if ( this.props.onRemove && this.isEmpty() ) {
				this.props.onRemove( forward );
			}
github WordPress / gutenberg / editor / components / rich-text / index.js View on Github external
onKeyDown( event ) {
		const dom = this.editor.dom;
		const rootNode = this.editor.getBody();

		if (
			( event.keyCode === BACKSPACE && isHorizontalEdge( rootNode, true ) ) ||
			( event.keyCode === DELETE && isHorizontalEdge( rootNode, false ) )
		) {
			if ( ! this.props.onMerge && ! this.props.onRemove ) {
				return;
			}

			this.onCreateUndoLevel();

			const forward = event.keyCode === DELETE;

			if ( this.props.onMerge ) {
				this.props.onMerge( forward );
			}

			if ( this.props.onRemove && this.isEmpty() ) {
				this.props.onRemove( forward );
github WordPress / gutenberg / editor / components / rich-text / index.js View on Github external
onKeyDown( event ) {
		const dom = this.editor.dom;
		const rootNode = this.editor.getBody();

		if (
			( event.keyCode === BACKSPACE && isHorizontalEdge( rootNode, true ) ) ||
			( event.keyCode === DELETE && isHorizontalEdge( rootNode, false ) )
		) {
			if ( ! this.props.onMerge && ! this.props.onRemove ) {
				return;
			}

			this.onCreateUndoLevel();

			const forward = event.keyCode === DELETE;

			if ( this.props.onMerge ) {
				this.props.onMerge( forward );
			}

			if ( this.props.onRemove && this.isEmpty() ) {
				this.props.onRemove( forward );
			}