Dynamic block alignement

I am creating a dynamic block (view with PHP). I need the data-align attribute. To retrieve the data-align attribute in PHP, I create an attribute …

PHP

function capacity_after_setup_theme() {
	add_theme_support( 'align-wide' );
}
add_action( 'after_setup_theme', 'capacity_after_setup_theme' );

JS

  supports: {
    align: ["full"]
  },

JS

  blockWith() {
      var wrap = document.querySelector(
        '[data-type="capacity/employee-skills"]'
      );
      if (
        wrap.getAttribute("data-align") != "full" &&
        this.props.attributes.isFullWidth
      )
        wrap.setAttribute("data-align", "full");
      var config = { attributes: true, childList: false };
      var callback = function(mutationsList) {
        for (var mutation of mutationsList) {
          if (
            mutation.type == "attributes" &&
            mutation.attributeName == "data-align"
          ) {
            if (wrap.hasAttribute("data-align"))
              this.props.setAttributes({ isFullWidth: true });
            else this.props.setAttributes({ isFullWidth: true });
          }
        }
      };
      var observer = new MutationObserver(callback);
      observer.observe(wrap, config);
    }

does not it have a cleaner way of doing that?