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 |
kpfefferle
force-pushed
the
kpfefferle/scroll-indicators
branch
from
0cfd313
to
696f2d3
Compare
| @@ -91,7 +91,7 @@ export default Component.extend({ | |||
| return { | |||
| 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.
| @@ -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
kpfefferle
force-pushed
the
kpfefferle/scroll-indicators
branch
from
2fb879a
to
7cdf5c4
Compare
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.