Acknowledgements

BSN General Information

This library is not a perfect drop-in replacement of the original jQuery Plugins, as some functionalities have been added over time into the official Bootstrap code base, we decided to skip them for lack of requests/interest.

This library does not require the Popper script for Dropdown, Popover and Tooltip components like the original script does and the additional features from Popper have been partially implemented into our library.

The demo page for BSN provides documentation for a general guidance on how to use the components and applies to the current version and the legacy version, except that the ladder version is missing some functionality added for V3.x mentioned in this post.

All Components Can Be Initialized Automatically

If you include the library in your site and all elements use proper markup, everything including Tooltip and Popover is initialized on load via their DATA API specific attributes.

Use The Build Files

The library is ES6/ES7 sourced which means that you might not use the files in the /src folder right away, except modern browsers with ES6/ES7 support.

Some Features Have Been Altered

For instance we don't have a show option for Modal due to the flexibility nature of native JavaScript, as well as other external content related option, but that's fully explained for each component.

Some features are even better

How about having a paused class for Carousel when in paused state, or an option to keep a Dropdown open as if you would have a form inside, or Tooltip and Popover automatic (re)positioning without any required option or third party scripts. Our Tab component can do a nice transition when tab contents have different heights, and many more you can learn about these improvements for each component.

Additionally, all elements that the components target for initialization will store the initialization object, giving you full access even for instances when the DATA API was used.

EG: myModalTrigger.Modal.

If your application delivers content dynamically, you surely need to check this out.

Original Events

Most events like show, hide, slide or close can be default prevented, which means you can use event.PreventDefault() with your conditional functions. Other events like shown, hidden or slid don't have this functionality as it might break the page functionality or other application.

Namespace

While the original events like show.bs.modal are inline with the original components exactly, some method names might not be the same with the original library.

Additional Styling

The dismiss Popover close button would require some adjustments for perfect looks. Copy this code in your application CSS files.

/* styles the close button for the dismissible popovers */
.popover .close {
  line-height: 0.75;
}