How to use the @ephox/sugar.Traverse.parent function in @ephox/sugar

return detect(Element.fromDom(editor.selection.getNode())).getOrThunk(() => {
    // Create a wrapper
    const wrapper = Element.fromHtml('<span data-mce-bogus="1" data-mce-autocompleter="1"></span>', editor.getDoc());

    // Wrap the content
    Insert.append(wrapper, Element.fromDom(range.extractContents()));
    range.insertNode(wrapper.dom());
    Traverse.parent(wrapper).each((elm) =&gt; elm.dom().normalize());

    // Update the cursor position
    CursorPosition.last(wrapper).map((last) =&gt; {
      editor.selection.setCursorLocation(last.dom(), Awareness.getEnd(last));
    });

    return wrapper;
  });
};

const context = (editor: Editor, elem: any, wrapName: string, nodeName: string): ChildContext => {
  return Traverse.parent(elem).fold(
    () => ChildContext.Skipping,

    (parent) => {
      // We used to skip these, but given that they might be representing empty paragraphs, it probably
      // makes sense to treat them just like text nodes
      if (nodeName === 'br' || isZeroWidth(elem)) {
        return ChildContext.Valid;
      } else if (isAnnotation(elem)) {
        return ChildContext.Existing;
      } else if (isCaretNode(elem)) {
        return ChildContext.Caret;
      } else if (!FormatUtils.isValid(editor, wrapName, nodeName) || !FormatUtils.isValid(editor, Node.name(parent), wrapName)) {
        return ChildContext.InvalidChild;
      } else {
        return ChildContext.Valid;
      }

const getRawOrComputed = function (isRoot, rawStart) {
  const optStart = Node.isElement(rawStart) ? Option.some(rawStart) : Traverse.parent(rawStart).filter(Node.isElement);
  return optStart.map(function (start) {
    const inline = PredicateFind.closest(start, (elem) => Css.getRaw(elem, 'font-size').isSome(), isRoot)
      .bind((elem) => Css.getRaw(elem, 'font-size'));

    return inline.getOrThunk(function () {
      return Css.get(start, 'font-size');
    });
  }).getOr('');
};

getRoot: (comp) => {
          return Traverse.parent(comp.element());
        },
        notify: {

          getRoot: (comp) => Traverse.parent(comp.element()),
          invalidClass: 'tox-control-wrap--status-invalid',

getRoot(input) {
        return Traverse.parent(input.element());
      },
      invalidClass: 'tox-invalid',

const parentIsListComponent = (el: Element) => {
  return Traverse.parent(el).map(isListComponent).getOr(false);
};

const createEntry = (li: Element, depth: number, isSelected: boolean): Option => {
  return Traverse.parent(li).filter(Node.isElement).map((list) => {
    return {
      depth,
      isSelected,
      content: cloneItemContent(li),
      itemAttributes: Attr.clone(li),
      listAttributes: Attr.clone(list),
      listType: Node.name(list) as ListType
    };
  });
};

const outdentDlItem = (editor: Editor, item: Element): void => {
  if (Compare.is(item, 'dd')) {
    Replication.mutate(item, 'dt');
  } else if (Compare.is(item, 'dt')) {
    Traverse.parent(item).each((dl) => SplitList.splitList(editor, dl.dom(), item.dom()));
  }
};