Implementing a declarative scroll propagation control on top of scroll customization

overflow-propagation-using-scrollcustomiaztion.js

class OverflowPropagationElement extends HTMLElement {
  createdCallback() {
    // See design doc for details of these experimental APIs: https://docs.google.com/document/d/1VnvAqeWFG9JFZfgG5evBqrLGDZYRE5w6G5jEDORekPY/edit
    this.distributeScrollIntent = function(scrollIntent) {
      if (scrollIntent.deltaY <= 0) {
        if (this.getComputedValue('overflow-propagation-up') == 'normal') {
          // let children scroll first and then we scroll if any delta remaining
          scrollIntent.distributeToScrollChainDescendant();
          this.applyScrollIntent(scrollState);
        } else {
          // we scroll first and then let children scroll if any delta remaining
          this.applyScrollIntent(scrollState);
          scrollIntent.distributeToScrollChainDescendant();
        }
      }
      // same for other directions 
    }
  }
}