Main pointers class. Pointer init is located here: https://gist.github.com/dingo-d/0ad8d67f9b88e96d8ae8cc1c8c450784

pointers.js

/* global pointerLocalization */
export default class Pointers {
  constructor() {
    this.pointersList = {};
    this.openedPointers = JSON.parse(localStorage.getItem('openedPointers')) || [];

    this.openPointer = this.openPointer.bind(this);
    this.setLabel = this.setLabel.bind(this);
    this.initPointers = this.initPointers.bind(this);
  }

  initPointers(totalPointers) {
    Object.keys(totalPointers).forEach((current) => {
      const pointerData = totalPointers[current];

      if (!this.openedPointers.includes(current)) {
        this.pointersList[current] = {
          target: $(pointerData.anchorId),
          data: pointerData,
        };
      }
    });

    const keys = Object.keys(this.pointersList);

    Object.keys(this.pointersList).forEach((current) => {
      const pointerData = this.pointersList[current];
      const location = keys.indexOf(current);

      const nextPointer = location < keys.length ? this.pointersList[keys[location + 1]] : '';

      pointerData.data.next = typeof nextPointer !== 'undefined' ? nextPointer.data.id : '';
    });

    // Open first pointer
    if (typeof Object.values(this.pointersList)[0] !== 'undefined') {
      this.openPointer(Object.values(this.pointersList)[0]);
    }
  }

  openPointer(pointerData) {

    const {data} = pointerData;
    const $target = pointerData.target;

    const $pointer = $target.pointer({
      content: `${data.title} ${data.content}`,
      position: {
        edge: data.edge,
        align: data.align,
      },
      open: () => {
        this.setLabel($target, data); // Check if has next and replace buttons.
      },
      close: () => {

        // Check if the current pointer is dismissable, if it is store it in localStorage
        if (data.dismissable) {
          this.openedPointers.push(data.id);
          localStorage.setItem('openedPointers', JSON.stringify(this.openedPointers));
        }

        if (Object.keys(this.pointersList).includes(data.next)) {
          this.openPointer(this.pointersList[data.next]);
        } else {
          $pointer.pointer('destroy');
        }

      },
    });

    const elementPosition = $pointer.offset().top - 30;

    Promise.resolve()
      .then(() => {
        $('html, body').animate({
          scrollTop: elementPosition,
        }, 600, () => {
          $pointer.pointer('open');
        });
      });
  }

  setLabel(target, data) {
    const $currentPointer = target.pointer('widget');
    const $buttons = $currentPointer.find('.wp-pointer-buttons');
    const $close = $buttons.find('.close');
    const $newButton = $close.clone(true, true).removeClass('close');
    const buttonLabel = Object.keys(this.pointersList).includes(data.next) ? pointerLocalization.nextLabel : pointerLocalization.closeLabel;

    $close.remove();
    $newButton.addClass('button').addClass('button-primary');

    $newButton.html(buttonLabel).appendTo($buttons);
  }

}