examples/consumption/index.js
function consumptionBars(x, y, self, items, scroller) {
  // All calculations are made for top handler, then inverted in the end
  // if this call refers to the bottom handler

  // If we are in the middle of the content and scrolled past the swipe origin
  // keeps reseting origin until user scrolls down. Effectively this means the
  // first time user scrolls down starts hiding the bars again.
  if (y > 0 && y < scroller.origin && scroller.consuming) {
    scroller.origin = y;
  }

  // if we are near the top, force topBar to show
  if (y <= self.rect.height && !scroller.consuming) {
    scroller.consuming = true;
    scroller.origin = 0;
  }

  var pos;
  if (scroller.consuming) {
    pos = Math.min(scroller.origin - y, 0);
  } else {
    pos = -self.rect.height; // offscreen
  }

  // As the top bar moves offscreen, it should be locked offscreen
  if (pos <= -self.rect.height) {
    scroller.consuming = false;
  }

  // If this was called from botbar, make it work from bottom of the viewport.
  if (self === items.botbar) {
    pos = scroller.rect.height - self.rect.height - pos;
  }

  return {
    y: pos,
    zIndex: 5,
  };
}
function consumptionBars(x, y, self, items, scroller) {
  // All calculations are made for top handler, then inverted in the end
  // if this call refers to the bottom handler

  // If we are in the middle of the content and scrolled past the swipe origin
  // keeps reseting origin until user scrolls down. Effectively this means the
  // first time user scrolls down starts hiding the bars again.
  if (y > 0 && y < scroller.origin && scroller.consuming) {
    scroller.origin = y;
  }

  // if we are near the top, force topBar to show
  if (y <= self.rect.height && !scroller.consuming) {
    scroller.consuming = true;
    scroller.origin = 0;
  }

  var pos;
  if (scroller.consuming) {
    pos = Math.min(scroller.origin - y, 0);
  } else {
    pos = -self.rect.height; // offscreen
  }

  // As the top bar moves offscreen, it should be locked offscreen
  if (pos <= -self.rect.height) {
    scroller.consuming = false;
  }

  // If this was called from botbar, make it work from bottom of the viewport.
  if (self === items.botbar) {
    pos = scroller.rect.height - self.rect.height - pos;
  }

  return {
    y: pos,
    zIndex: 5,
  };
}
/*
Notice: It's a Scrollable best practice to use plain functions instead
of React bound methods. Read more about why on the minimal example.