Add horizontal scroll indicator feature#814
Conversation
|
@aschenoni This may be the scroll indicator rendering above the scroll bar. The scroll indicator element is a peer of the scrolling overflow container. |
|
I wrote a test and a fix. I'll submit a PR to this branch |
|
Take a look at #821 |
mixonic
left a comment
There was a problem hiding this comment.
Looking into it, but does this defeat the lazy rendering of horizontal content as the element with overflow changes?
0cfd313 to
696f2d3
Compare
| columns: null, | ||
| registerColumnTree: this.registerColumnTree.bind(this), | ||
| tableId: this.elementId, | ||
| tableId: `${this.elementId}-overflow`, |
There was a problem hiding this comment.
@mixonic I believe that this update should keep row and column occlusion working as before. Yes, the scrolling element has changed, but I believe that this is the reference used for what element to observe the scroll on.
twokul
left a comment
There was a problem hiding this comment.
Took a pass. Let me know if the comments make sense 😄
| @@ -0,0 +1 @@ | |||
| export { default } from 'ember-table/components/-private/scroll-indicators/component'; | |||
There was a problem hiding this comment.
Without this export, we can't render the {{-ember-table-private/scroll-indicators}} component in the {{ember-table}} template.
| if (this.get('enableScrollIndicators')) { | ||
| this._addListeners(); | ||
| } | ||
| addObserver(this, 'enableScrollIndicators', this._updateListeners); |
There was a problem hiding this comment.
do we need to set up the observer if enableScrollIndicators is false?
There was a problem hiding this comment.
Yes, because we need to add the listeners if the value of enableScrollIndicators is later changed to true
2fb879a to
7cdf5c4
Compare
mixonic
left a comment
There was a problem hiding this comment.
Thanks for the excellent work and iteration on this @kpfefferle. It is a really exciting contribution, and addresses UX cases across many of our apps at Addepar.
I'll note that we've integrated this change into our (pretty large) test suites and have no regressions. We did need to adjust some tests for the DOM change.
Lets get it in and cut another beta.

Adds a new feature to optionally enable horizontal scroll indicator gradients on either side if there is scrollable overflow extending in that direction:
The scroll indicator gradients respect changes to the size of the ember-table container and table both, and they will render inside fixed columns if they are present. Includes documentation page demonstrating the feature and tests exercising the feature.