Skip to content

Conversation

tmorehouse
Copy link
Member

@tmorehouse tmorehouse commented Aug 22, 2017

Migration of dropdown and nav-item-dropdown to use popper.js

Migration wasn't too bad. a couple of new optional props (offset & no-flip), but I was able to make it work with our existing props (dropup & right)

By design, popper is disabled for menus in navbars (because of collapsing behavior of navbars)

@codecov-io
Copy link

codecov-io commented Aug 22, 2017

Codecov Report

Merging #913 into dev will decrease coverage by 0.14%.
The diff coverage is 46.37%.

Impacted file tree graph

@@            Coverage Diff             @@
##              dev     #913      +/-   ##
==========================================
- Coverage   41.41%   41.26%   -0.15%     
==========================================
  Files          94       94              
  Lines        2306     2341      +35     
  Branches      664      675      +11     
==========================================
+ Hits          955      966      +11     
- Misses       1192     1210      +18     
- Partials      159      165       +6
Impacted Files Coverage Δ
lib/components/nav-item-dropdown.vue 46.66% <0%> (-3.34%) ⬇️
lib/mixins/dropdown.js 36.6% <46.77%> (-0.58%) ⬇️
lib/components/dropdown.vue 73.33% <75%> (ø) ⬆️
lib/directives/scrollspy.js 10.34% <0%> (-0.39%) ⬇️

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 3a3ce0b...d3c24f9. Read the comment docs.

@tmorehouse tmorehouse changed the title [WIP] fix(dropdowns): Migration to popper [WIP] fix(dropdowns): Migration to popper.js Aug 23, 2017
@tmorehouse tmorehouse changed the title [WIP] fix(dropdowns): Migration to popper.js fix(dropdowns): Migration to popper.js Aug 23, 2017
@tmorehouse tmorehouse requested a review from GregPeden August 23, 2017 00:52
export default {
mixins: [clickoutMixin, listenOnRootMixin],
props: {
id: {
type: String
},
Copy link
Member Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

this comes from the id mixin now

@tmorehouse tmorehouse changed the title fix(dropdowns): Migration to popper.js fix(dropdowns): Migration to popper.js positioning Aug 23, 2017
@mosinve
Copy link
Member

mosinve commented Aug 23, 2017

Checked local playground. It's very buggy.

@tmorehouse
Copy link
Member Author

What kind of bug are you seeing? I wonder if we are using the correct version of popper?

Bootstrap recently upgraded (or downgraded) their popper version

@mosinve
Copy link
Member

mosinve commented Aug 23, 2017

i uploaded screencast to slack
it pops at wrong positions... except dropup - only it works correct

@tmorehouse
Copy link
Member Author

This should now be ready for merging.

@tmorehouse tmorehouse merged commit 116cb3e into dev Aug 23, 2017
@tmorehouse tmorehouse deleted the tmorehouse/ddown-popper branch August 23, 2017 14:15
tmorehouse added a commit that referenced this pull request Aug 28, 2017
* fix(alert): Fix auto-dimissing alert "bug" (#897)

* fix(alert): Fix edgecase where dismissable alert couldnt be re-shown

* Update README.md

* [alert] add slot for dimiss button content

* Update meta.json

* [alert] remove deprecated state prop

* fix(carousel): Handle older opera oTransitionEnd event (#899)

* Fix(navbar-item) typo

misspelled safeId function

* fix(tabs): Better handling of active tab and transitions (#903)

* [tab] Sniff parent fro fade and lazy vals

* Update tabs.vue


* Update tabs.vue

* [tabs] fix keyboard navigation

* Update tabs.vue

* [tabs] ARIA tweaks

* update dependencies

rollup configs updated

* small typos

* docs: remove alert

* update nav bar

* m-alert

* update readme

* fix(link): default href to null

By explictly setting it to # ssr rendered links will overriden to # even if they hav to prop

* fix(link): if nothing is provided default href to #

* fix(link): ensure target is vue component before #emit

* chore(docs): Update navbar examples

* chore(release): 1.0.0-beta.5

* update edit link

* nuxt rc6

* feat(readme): add package quality badge (#907)

* fix(progress-bar): Minor adjutment to style calculation

Use raw percentage for setting width to prevent multiple bars from overflowing outer container

* feat(col): BS4 column component  (#906)

* feat(col): BS4 column component

* feat(col): getting column working

* fixed index.js from merge

* chore(README.md): Update version number

* chore(docs): fix header/footer-bg-variants in some card examples

* chore(docs): card minor example updates

* fix(dropdown): hover/focus shading for active items

* fix(nav-item-dropdown): hover/focus shading for active items

* fix(scrollspy): Make work with new nav-link functional component (#909)

* fix(scrollspy): Make work with new nav-link functional component

Before, elements with class `.nav-link` had a compoent VM on their parent element, but `nav-link`s no longer have  associated VMs, so we set the `active` class directly on them.

* Update scrollspy.js

* Update README.md

* Update README.md

* [scrollspy] get $root from vnode context

* Update README.md

* fix(tabs): Show first tab when set to active (#912)

* fix(tabs): Show first tab when set to active

* fix(tabs): minor logic update

* chore(docs): Update dropdown docs

* feat(table): use computedFields for easier usage

* feat(table): Scoped slots for fixed top/bottom rows (#908)

* [table] add fixed top and bottom row soped slots

* Update meta.json

* fix(progress-bar): aria-valuenow fix

* Update progress-bar.vue

* fix(progress-bar): remove unessesary this in template

* fix(alert) dismiss event broken after PR #897

* fix(alert) countdown event test (#916)

* fix(alert): show dismiss button when dismissible is true

* fix(dropdowns): Migration to popper.js positioning (#913)

* update dropdown.vue

* Update nav-item-dropdown.vue

* [dropdown.js mixin]: Incorporate popper.js

* Update README.md

* First stab at updaing documentation

* docs(progress): Updated first example to include multi bars

* fix(form-textarea): Fix value reactivity

* docs update and typos fix

* fix(dropdowns): Allow gracefull fallback if Popper.js not defined (#920)

* fix(dropdowns): Allow gracefull fallback if Popper not defined

* Warn on mount that Popper.js not available

* ESLint

* fix typos

* feat(table) refactor to formatter feature

* refactor

* chore(carousel): Add text shadow to carousel example

Add a text shadow style to carousel example to make text on slides easier to read

* fix(docs): feedback doc in form group (#934)

* feat(b-col): restore `.offset-*` col classes + new b-container and b-row components 🍾🍻🎉 (#929)

* feat(col): BS4 column component

* feat(col): getting column working

* fixed index.js from merge

* feat(col): restore .offset-* col classes 🍾

* feat(test): added b-col test suite

* [b-col] Update to docs

* feat(b-row): New functional component

* Make b-row component available

* docs:(componentvdoc.vue): Handle pages that don't have a main component

* Rename docs page

* Rename docs/components/col/README.md to docs/components/grid/README.md

* Rename docs/components/col/index.js to docs/components/grid/index.js

* Rename docs/components/col/meta.json to docs/components/grid/meta.json

* Update index.js

* Update README.md

* feat(b-conatiner): new functional component

b-container component that supports optional fluid prop

* make b-container available

* [b-container]: ESLint

* Update meta.json

* Update README.md

* [b-row] Add no-cgutters prop

* Update README.md

* Update README.md

* Rename docs/components/grid/README.md to docs/components/layout/README.md

* Rename docs/components/grid/index.js to docs/components/layout/index.js

* Rename docs/components/grid/meta.json to docs/components/layout/meta.json

* rename /docs/grid to /docs/layout

* Update meta.json

* Update meta.json

* [b-row]: demo.html fixture

* [b-row] demo.js

* Update demo.html

* [b-row] Tests

* [b-container] demo.html

* [b-container] demo.js

* [b-container] tests

* Update container.spec.js

* docs typo

* fix(jumbotron): continer wrapper only needed in fluid mode

* fix(jumbotron): minor update

* revert(jumbotron): Wrong branch :p

* fix(docs): toggle navbar @md to keep content from wrapping

* feat(docs): add BS4 docs to Layout page

* feat(jumbotron): Convert to functional component (#932)

* feat(jumbotron): Convert to functional component

* Use FC version of jumbotron

* ESLint

* Delete jumbotron.vue

* typo fix

* Update demo.html

* Update jumbotron.spec.js

* Update jumbotron.spec.js

* Update demo.html

* Update jumbotron.spec.js

* Update jumbotron.spec.js

* Update jumbotron.spec.js

* Update jumbotron.spec.js

* Update jumbotron.spec.js

* Update jumbotron.spec.js

* Update jumbotron.spec.js

* Update jumbotron.spec.js

* Update jumbotron.spec.js

* Update jumbotron.spec.js

* Update jumbotron.spec.js

* Merge dev into branch (#935)

* fix(docs): feedback doc in form group (#934)

* feat(b-col): restore `.offset-*` col classes + new b-container and b-row components 🍾🍻🎉 (#929)

* feat(col): BS4 column component

* feat(col): getting column working

* fixed index.js from merge

* feat(col): restore .offset-* col classes 🍾

* feat(test): added b-col test suite

* [b-col] Update to docs

* feat(b-row): New functional component

* Make b-row component available

* docs:(componentvdoc.vue): Handle pages that don't have a main component

* Rename docs page

* Rename docs/components/col/README.md to docs/components/grid/README.md

* Rename docs/components/col/index.js to docs/components/grid/index.js

* Rename docs/components/col/meta.json to docs/components/grid/meta.json

* Update index.js

* Update README.md

* feat(b-conatiner): new functional component

b-container component that supports optional fluid prop

* make b-container available

* [b-container]: ESLint

* Update meta.json

* Update README.md

* [b-row] Add no-cgutters prop

* Update README.md

* Update README.md

* Rename docs/components/grid/README.md to docs/components/layout/README.md

* Rename docs/components/grid/index.js to docs/components/layout/index.js

* Rename docs/components/grid/meta.json to docs/components/layout/meta.json

* rename /docs/grid to /docs/layout

* Update meta.json

* Update meta.json

* [b-row]: demo.html fixture

* [b-row] demo.js

* Update demo.html

* [b-row] Tests

* [b-container] demo.html

* [b-container] demo.js

* [b-container] tests

* Update container.spec.js

* docs typo

* fix(jumbotron): continer wrapper only needed in fluid mode

* fix(jumbotron): minor update

* revert(jumbotron): Wrong branch :p

* fix(docs): toggle navbar @md to keep content from wrapping

* feat(docs): add BS4 docs to Layout page

* Update jumbotron.js

* Update jumbotron.js

* Update jumbotron.spec.js

* Update demo.html

* Update jumbotron.spec.js

* Update jumbotron.spec.js

* Attempt  last part of tests

* Update demo.html

* Final tests

* docs: Fix typo in Form Checkbox page (#939)

Fix typo

* feat(layout): alignment utilities 🛠  (#941)

* feat(b-img): New component (#933)

* feat(b-img): New functional component

Support many options, plus the ability to create blank images of any size

* [b-img] Support solid/transparent color blank image

* make b-img component avilalable

* Create meta.json

* Create index.js

* Create README.md

* Add b-img docs

* Create demo.html

* Create demo.js

* Create img.spec.js

* feat: New popper.js based tooltip/popover directives and components (#923)

* Create tooltip.js

* Warn on mount that Popper.js not available

* Update index.js

* Create README.md

* [tooltip] Create shared class

* [popover] Common shared class

* Fix template compiler

* [popover] v-b-popover directive

* Remove tether dependency

* [tooltip.js class] Code optimizations

* create classes index

* force tip template recompile on next show, in case template changes

* [tooltip class] Add comments as to which methods PopOver overwrites

* new tooltip.vue component

* New popover.vue component

* Make new popover.vue and tooltip.vue components available

* Update README.md

* Allow reactive components in b-popover content

* b-popover: callback hooks for events

* b-tooltip: callback hooks for events

* [tooltip class]: add callback hooks

* popover meta.json: document events

* b-tooltip meta.json: document events

* [tooltip class] Allow reactive content in title element

* [popover class] Allow reactive content in title and content

* [BvEvent]: add relatedTarget descriptor

* [tooltip.js class] Better callback handling + cancelable hide & show events

Better callback handling, and allow hide & show callback to cancel hide or show of tooltip/popover

* [b-popover]: Enable canclable show and hide events

* [b-tooltip]: Add cancelable show and hide events

* [tooltip class]: Emit events on $root

* [tooltip popover] namespace events emitted on $root

Root events are emitted with namespaced event name. i.e. `bv:tooltip::show` and `bv:popover::hidden`

* [tooltip class] Prepare for future bv:modal:hidden $root event name

* Update rollup.config.js

* Update webpack.config.js

* fix: include popper.js in dist bundle

* refactor(eslint): remove semicolons to placate eslint

* refactor: rm semicolons in classes & add BvEvent to class dir

* [tooltip.js] Optimise isWithContent()

* Fixes to Popover & Tooltip Components Docs
Fix to ToolTip component

* [popover.js] Optimise isWithContent()

* feat(popover): import fix

* fix(popove): tooltip import
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

Successfully merging this pull request may close these issues.

3 participants