Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

feat(table): Add row-unhovered event #1874

Merged
merged 3 commits into from Oct 24, 2018
Merged

Conversation

gaaf
Copy link
Contributor

@gaaf gaaf commented Jun 8, 2018

Some users might want to know not only when the mouse is hovering a row,
but also when the mouse leaves the row.

For example for dynamically showing (and hiding) some row content based
on mouse hovering.

Some users might want to know not only when the mouse is hovering a row,
but also when the mouse leaves the row.

For example for dynamically showing (and hiding) some row content based
on mouse hovering.
@codecov
Copy link

codecov bot commented Jun 8, 2018

Codecov Report

Merging #1874 into dev will decrease coverage by 0.08%.
The diff coverage is 0%.

Impacted file tree graph

@@            Coverage Diff             @@
##              dev    #1874      +/-   ##
==========================================
- Coverage   64.77%   64.68%   -0.09%     
==========================================
  Files         154      154              
  Lines        2907     2911       +4     
  Branches      800      801       +1     
==========================================
  Hits         1883     1883              
- Misses        736      739       +3     
- Partials      288      289       +1
Impacted Files Coverage Δ
src/components/table/table.js 74.34% <0%> (-0.88%) ⬇️

Continue to review full report at Codecov.

Legend - Click here to learn more
Δ = absolute <relative> (impact), ø = not affected, ? = missing data
Powered by Codecov. Last update 1eced46...0580df9. Read the comment docs.

@mosinve
Copy link
Member

mosinve commented Jun 8, 2018

There's a ::hover css pseudo-class, and b-table has a tbody-tr-class prop. Combining both, in most cases could help, i think

@mosinve
Copy link
Member

mosinve commented Jun 8, 2018

b-table is already over-customizable.

@gaaf
Copy link
Contributor Author

gaaf commented Jun 8, 2018

@mosinve Thanks for the hint. That indeed works for showing/hiding stuff in the same row (column with action buttons in my case). But this won't solve the general case.

This PR is to make the API more coherent as it is asymmetric now. There is an event for handling mouseenter (row-hovered), but there is no way to handle mouseleave (row-unhovered).

@tmorehouse
Copy link
Member

@gaaf could you add in a test for the unhovered event?

@tmorehouse tmorehouse removed the Status: Changes Needed Pull request needs changes label Oct 24, 2018
@tmorehouse
Copy link
Member

For testing, I am not sure how to test (i.e. simulate) a mouse over/out event JSDOM. So I guess we skip that (as we currently do not test for the current row-hovered event).

@tmorehouse tmorehouse merged commit a87cad1 into bootstrap-vue:dev Oct 24, 2018
shinrox added a commit to shinrox/bootstrap-vue that referenced this pull request Oct 26, 2018
* dev: (31 commits)
  feat(card): support left and right image placement (bootstrap-vue#1981)
  fix(collapse/toggle): "collapsed" class cleared when component updated (bootstrap-vue#2102)
  fix(form-file): Add validation of single file (bootstrap-vue#2028)
  chore(docs): minor update to the b-form-input docs
  chore(docs): Minor update to b-form-input docs
  feat(table): Add row-unhovered event (bootstrap-vue#1874)
  feat(table): Support contextmenu event binding for table rows (bootstrap-vue#2064)
  docs(table): fix minor typo (bootstrap-vue#2093)
  feat(table): Support sorting on nested object properties (bootstrap-vue#1868)
  perf(modal): optimize model.resetScrollbar, resolves bootstrap-vue#1831  (bootstrap-vue#1837)
  docs: Update images reference section (bootstrap-vue#1999)
  fix(observe-dom): fix comment typo (bootstrap-vue#2084)
  chore(modal): trivial word fix in comment (bootstrap-vue#2089)
  (docs): Fix grammer in Intro readme (bootstrap-vue#2092)
  fix(modal): prevent scrolling on .modal-content focus, fixes bootstrap-vue#1748 (bootstrap-vue#2060)
  feat(pagination):  added slots for first, prev, next, last, and ellipsis. Fixes bootstrap-vue#1870. (bootstrap-vue#1980)
  Handle state change on validated fields. (bootstrap-vue#1984)
  fix(docs): input group prepend slot typo (bootstrap-vue#2059)
  fix(dependencies): replace opencollective with opencollective-postintall (bootstrap-vue#2067)
  fix(docs): change b-input-group attribute 'left' to 'prepend' (bootstrap-vue#2017)
  ...
@tmorehouse tmorehouse mentioned this pull request Nov 14, 2018
89 tasks
@gaaf gaaf deleted the row-unhovered branch February 14, 2019 09:29
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Projects
None yet
Development

Successfully merging this pull request may close these issues.

None yet

3 participants