Hopiu/bootstrap
1
0
Fork 0
mirror of https://github.com/Hopiu/bootstrap.git synced 2026-03-17 05:00:24 +00:00
Code Issues Projects Releases Packages Wiki Activity Actions

Merge pull request #4 from twbs/v4-dev

Browse source 
update forked v4-dev
This commit is contained in:
Gijs Boddeus 2017-09-13 16:46:14 +02:00 committed by GitHub
commit cf004433e0
98 changed files with 10710 additions and 5379 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

4
.babelrc
View file

@ -8,7 +8,5 @@
}
]
],
"plugins": [
"transform-es2015-modules-strip"
]
"plugins": ["external-helpers"]
}

4
.gitignore vendored
View file

@ -44,9 +44,9 @@ scss-lint-report.xml
# grunt-contrib-sass cache
.sass-cache
# Jekyll metadata
# Jekyll metadata and extra config file for `github` script
docs/.jekyll-metadata
twbsconfig.yml
# Folders to ignore
bower_components
node_modules

8
Gemfile.lock
View file

@ -1,8 +1,8 @@
GEM
remote: https://rubygems.org/
specs:
addressable (2.5.1)
public_suffix (~> 2.0, >= 2.0.2)
addressable (2.5.2)
public_suffix (>= 2.0.2, < 4.0)
colorator (1.1.0)
ffi (1.9.18)
ffi (1.9.18-x64-mingw32)
@ -41,7 +41,7 @@ GEM
mini_portile2 (~> 2.2.0)
pathutil (0.14.0)
forwardable-extended (~> 2.6)
public_suffix (2.0.5)
public_suffix (3.0.0)
rake (12.0.0)
rb-fsevent (0.10.2)
rb-inotify (0.9.10)
@ -65,4 +65,4 @@ DEPENDENCIES
scss_lint (~> 0.54.0)
BUNDLED WITH
1.15.3
1.15.4

9
README.md
View file

@ -41,9 +41,8 @@ Several quick start options are available:
- [Download the latest release.](https://github.com/twbs/bootstrap/archive/v4.0.0-beta.zip)
- Clone the repo: `git clone https://github.com/twbs/bootstrap.git`
- Install with [npm](https://www.npmjs.com): `npm install bootstrap@4.0.0-beta`
- Install with [yarn](https://github.com/yarnpkg/yarn): `yarn add bootstrap@4.0.0-beta`
- Install with [yarn](https://yarnpkg.com): `yarn add bootstrap@4.0.0-beta`
- Install with [Composer](https://getcomposer.org): `composer require twbs/bootstrap:4.0.0-beta`
- Install with [Bower](https://bower.io): `bower install bootstrap#v4.0.0-beta`
- Install with [NuGet](https://www.nuget.org): CSS: `Install-Package bootstrap -Pre` Sass: `Install-Package bootstrap.sass -Pre` (`-Pre` is only required until Bootstrap v4 has a stable release).
Read the [Getting started page](https://getbootstrap.com/getting-started/) for information on the framework contents, templates and examples, and more.
@ -51,7 +50,6 @@ Read the [Getting started page](https://getbootstrap.com/getting-started/) for i
## Status
[![Slack](https://bootstrap-slack.herokuapp.com/badge.svg)](https://bootstrap-slack.herokuapp.com)
[![Bower](https://img.shields.io/bower/v/bootstrap.svg)](https://bower.io/search/?q=bootstrap)
[![npm version](https://img.shields.io/npm/v/bootstrap.svg)](https://www.npmjs.com/package/bootstrap)
[![Gem version](https://img.shields.io/gem/v/bootstrap.svg)](https://rubygems.org/gems/bootstrap)
[![Build Status](https://img.shields.io/travis/twbs/bootstrap/v4-dev.svg)](https://travis-ci.org/twbs/bootstrap)
@ -98,14 +96,15 @@ Documentation search is powered by [Algolia's DocSearch](https://community.algol
1. Run through the [tooling setup](https://github.com/twbs/bootstrap/blob/v4-dev/docs/4.0/getting-started/build-tools.md#tooling-setup) to install Jekyll (the site builder) and other Ruby dependencies with `bundle install`.
2. Run `npm install` to install Node.js dependencies.
3. Run `npm run test` (or a specific NPM script) to rebuild distributed CSS and JavaScript files, as well as our docs assets.
4. From the root `/bootstrap` directory, run `bundle exec jekyll serve` in the command line.
4. From the root `/bootstrap` directory, run `npm run docs-serve` in the command line.
5. Open <http://localhost:9001> in your browser, and voilà.
Learn more about using Jekyll by reading its [documentation](https://jekyllrb.com/docs/home/).
### Documentation for previous releases
Documentation for v2.3.2 has been made available for the time being at <https://getbootstrap.com/2.3.2/> while folks transition to Bootstrap 3.
- For v2.3.2: <https://getbootstrap.com/2.3.2/>
- For v3.3.x: <https://getbootstrap.com/docs/3.3/>
[Previous releases](https://github.com/twbs/bootstrap/releases) and their documentation are also available for download.

2
_data/browser-bugs.yml
View file

@ -204,7 +204,7 @@
summary: >
`table-cell` borders not overlapping despite `margin-right: -1px`
upstream_bug: >
Chromium#568691
Chromium#749848
origin: >
Bootstrap#17438, Bootstrap#14237

BIN
assets/css/docs.min.css.map
View file

Binary file not shown.

38
bower.json
View file

@ -1,37 +1 @@
{
"name": "bootstrap",
"description": "The most popular front-end framework for developing responsive, mobile first projects on the web.",
"keywords": [
"css",
"js",
"sass",
"mobile-first",
"responsive",
"front-end",
"framework",
"web"
],
"homepage": "https://getbootstrap.com",
"license": "MIT",
"moduleType": "globals",
"main": [
"scss/bootstrap.scss",
"dist/js/bootstrap.js"
],
"ignore": [
"/.*",
"/_*",
"about",
"assets",
"docs",
"js/tests",
"nuget",
"CNAME",
"composer.json",
"Gruntfile.js"
],
"dependencies": {
"jquery": ">=3.0.0",
"popper.js": "^1.12.3"
}
}
@$% Not a Bower package. Use a better package management tool instead. ^&*

2
build/postcss.config.js
View file

@ -9,7 +9,7 @@ module.exports = (ctx) => ({
browsers: [
//
// Official browser support policy:
// https://v4-alpha.getbootstrap.com/getting-started/browsers-devices/#supported-browsers
// https://getbootstrap.com/docs/4.0/getting-started/browsers-devices/#supported-browsers
//
'Chrome >= 45', // Exact version number here is kinda arbitrary
'Firefox ESR',

51
build/rollup.config.js Normal file
View file

@ -0,0 +1,51 @@
const path = require('path')
const babel = require('rollup-plugin-babel')
const resolve = require('rollup-plugin-node-resolve')
const pkg = require(path.resolve(__dirname, '../package.json'))
const BUNDLE = process.env.BUNDLE === 'true'
const year = new Date().getFullYear()
var fileDest = 'bootstrap.js'
var external = ['jquery', 'popper.js']
const plugins = [
babel({
exclude: 'node_modules/**', // only transpile our source code
externalHelpersWhitelist: [ // include only required helpers
'typeof',
'classCallCheck',
'createClass',
'inherits',
'possibleConstructorReturn'
]
})
]
const globals = {
jquery: '$',
'popper.js': 'Popper'
}
if (BUNDLE) {
fileDest = 'bootstrap.bundle.js'
// remove last entry in external array to bundle Popper
external.pop()
delete globals['popper.js']
plugins.push(resolve())
}
module.exports = {
input: path.resolve(__dirname, '../js/src/index.js'),
output: {
file: path.resolve(__dirname, `../dist/js/${fileDest}`),
format: 'iife'
},
name: 'bootstrap',
external: external,
globals: globals,
plugins: plugins,
banner: `/*!
* Bootstrap v${pkg.version} (${pkg.homepage})
* Copyright 2011-${year} ${pkg.author}
* Licensed under MIT (https://github.com/twbs/bootstrap/blob/master/LICENSE)
*/
`
}

41
build/stamp.js
View file

@ -1,41 +0,0 @@
const fs = require('fs')
fs.readFile('package.json', (err, data) => {
if (err) {
throw err
}
const pkg = JSON.parse(data)
const year = new Date().getFullYear()
const stampTop =
`/*!
* Bootstrap v${pkg.version} (${pkg.homepage})
* Copyright 2011-${year} ${pkg.author}
* Licensed under MIT (https://github.com/twbs/bootstrap/blob/master/LICENSE)
*/
if (typeof jQuery === 'undefined') {
throw new Error('Bootstrap\\'s JavaScript requires jQuery. jQuery must be included before Bootstrap\\'s JavaScript.')
}
(function ($) {
var version = $.fn.jquery.split(' ')[0].split('.')
if ((version[0] < 3) || (version[0] >= 4)) {
throw new Error('Bootstrap\\'s JavaScript requires at least jQuery v3.0.0 but less than v4.0.0')
}
})(jQuery);
(function () {
`
const stampEnd = `
})();`
process.stdout.write(stampTop)
process.stdin.on('end', () => {
process.stdout.write(stampEnd)
})
process.stdin.pipe(process.stdout)
})

7
build/uglifyjs.config.json
View file

@ -1,5 +1,8 @@
{
"output" : {
"output": {
"comments": "/^!/"
}
},
"compress": {
"typeofs": false
}
}

BIN
dist/css/bootstrap-grid.css.map vendored
View file

Binary file not shown.

2
dist/css/bootstrap-reboot.css vendored
View file

@ -180,7 +180,7 @@ a,
area,
button,
[role="button"],
input,
input:not([type=range]),
label,
select,
summary,

BIN
dist/css/bootstrap-reboot.css.map vendored
View file

Binary file not shown.

2
dist/css/bootstrap-reboot.min.css vendored
View file

@ -1,2 +1,2 @@
*,::after,::before{box-sizing:border-box}html{font-family:sans-serif;line-height:1.15;-webkit-text-size-adjust:100%;-ms-text-size-adjust:100%;-ms-overflow-style:scrollbar;-webkit-tap-highlight-color:transparent}@-ms-viewport{width:device-width}article,aside,dialog,figcaption,figure,footer,header,hgroup,main,nav,section{display:block}body{margin:0;font-family:-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,"Helvetica Neue",Arial,sans-serif,"Apple Color Emoji","Segoe UI Emoji","Segoe UI Symbol";font-size:1rem;font-weight:400;line-height:1.5;color:#212529;text-align:left;background-color:#fff}[tabindex="-1"]:focus{outline:0!important}hr{box-sizing:content-box;height:0;overflow:visible}h1,h2,h3,h4,h5,h6{margin-top:0;margin-bottom:.5rem}p{margin-top:0;margin-bottom:1rem}abbr[data-original-title],abbr[title]{text-decoration:underline;-webkit-text-decoration:underline dotted;text-decoration:underline dotted;cursor:help;border-bottom:0}address{margin-bottom:1rem;font-style:normal;line-height:inherit}dl,ol,ul{margin-top:0;margin-bottom:1rem}ol ol,ol ul,ul ol,ul ul{margin-bottom:0}dt{font-weight:700}dd{margin-bottom:.5rem;margin-left:0}blockquote{margin:0 0 1rem}dfn{font-style:italic}b,strong{font-weight:bolder}small{font-size:80%}sub,sup{position:relative;font-size:75%;line-height:0;vertical-align:baseline}sub{bottom:-.25em}sup{top:-.5em}a{color:#007bff;text-decoration:none;background-color:transparent;-webkit-text-decoration-skip:objects}a:hover{color:#0056b3;text-decoration:underline}a:not([href]):not([tabindex]){color:inherit;text-decoration:none}a:not([href]):not([tabindex]):focus,a:not([href]):not([tabindex]):hover{color:inherit;text-decoration:none}a:not([href]):not([tabindex]):focus{outline:0}code,kbd,pre,samp{font-family:monospace,monospace;font-size:1em}pre{margin-top:0;margin-bottom:1rem;overflow:auto}figure{margin:0 0 1rem}img{vertical-align:middle;border-style:none}svg:not(:root){overflow:hidden}[role=button],a,area,button,input,label,select,summary,textarea{-ms-touch-action:manipulation;touch-action:manipulation}table{border-collapse:collapse}caption{padding-top:.75rem;padding-bottom:.75rem;color:#868e96;text-align:left;caption-side:bottom}th{text-align:inherit}label{display:inline-block;margin-bottom:.5rem}button:focus{outline:1px dotted;outline:5px auto -webkit-focus-ring-color}button,input,optgroup,select,textarea{margin:0;font-family:inherit;font-size:inherit;line-height:inherit}button,input{overflow:visible}button,select{text-transform:none}[type=reset],[type=submit],button,html [type=button]{-webkit-appearance:button}[type=button]::-moz-focus-inner,[type=reset]::-moz-focus-inner,[type=submit]::-moz-focus-inner,button::-moz-focus-inner{padding:0;border-style:none}input[type=checkbox],input[type=radio]{box-sizing:border-box;padding:0}input[type=date],input[type=datetime-local],input[type=month],input[type=time]{-webkit-appearance:listbox}textarea{overflow:auto;resize:vertical}fieldset{min-width:0;padding:0;margin:0;border:0}legend{display:block;width:100%;max-width:100%;padding:0;margin-bottom:.5rem;font-size:1.5rem;line-height:inherit;color:inherit;white-space:normal}progress{vertical-align:baseline}[type=number]::-webkit-inner-spin-button,[type=number]::-webkit-outer-spin-button{height:auto}[type=search]{outline-offset:-2px;-webkit-appearance:none}[type=search]::-webkit-search-cancel-button,[type=search]::-webkit-search-decoration{-webkit-appearance:none}::-webkit-file-upload-button{font:inherit;-webkit-appearance:button}output{display:inline-block}summary{display:list-item}template{display:none}[hidden]{display:none!important}
*,::after,::before{box-sizing:border-box}html{font-family:sans-serif;line-height:1.15;-webkit-text-size-adjust:100%;-ms-text-size-adjust:100%;-ms-overflow-style:scrollbar;-webkit-tap-highlight-color:transparent}@-ms-viewport{width:device-width}article,aside,dialog,figcaption,figure,footer,header,hgroup,main,nav,section{display:block}body{margin:0;font-family:-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,"Helvetica Neue",Arial,sans-serif,"Apple Color Emoji","Segoe UI Emoji","Segoe UI Symbol";font-size:1rem;font-weight:400;line-height:1.5;color:#212529;text-align:left;background-color:#fff}[tabindex="-1"]:focus{outline:0!important}hr{box-sizing:content-box;height:0;overflow:visible}h1,h2,h3,h4,h5,h6{margin-top:0;margin-bottom:.5rem}p{margin-top:0;margin-bottom:1rem}abbr[data-original-title],abbr[title]{text-decoration:underline;-webkit-text-decoration:underline dotted;text-decoration:underline dotted;cursor:help;border-bottom:0}address{margin-bottom:1rem;font-style:normal;line-height:inherit}dl,ol,ul{margin-top:0;margin-bottom:1rem}ol ol,ol ul,ul ol,ul ul{margin-bottom:0}dt{font-weight:700}dd{margin-bottom:.5rem;margin-left:0}blockquote{margin:0 0 1rem}dfn{font-style:italic}b,strong{font-weight:bolder}small{font-size:80%}sub,sup{position:relative;font-size:75%;line-height:0;vertical-align:baseline}sub{bottom:-.25em}sup{top:-.5em}a{color:#007bff;text-decoration:none;background-color:transparent;-webkit-text-decoration-skip:objects}a:hover{color:#0056b3;text-decoration:underline}a:not([href]):not([tabindex]){color:inherit;text-decoration:none}a:not([href]):not([tabindex]):focus,a:not([href]):not([tabindex]):hover{color:inherit;text-decoration:none}a:not([href]):not([tabindex]):focus{outline:0}code,kbd,pre,samp{font-family:monospace,monospace;font-size:1em}pre{margin-top:0;margin-bottom:1rem;overflow:auto}figure{margin:0 0 1rem}img{vertical-align:middle;border-style:none}svg:not(:root){overflow:hidden}[role=button],a,area,button,input:not([type=range]),label,select,summary,textarea{-ms-touch-action:manipulation;touch-action:manipulation}table{border-collapse:collapse}caption{padding-top:.75rem;padding-bottom:.75rem;color:#868e96;text-align:left;caption-side:bottom}th{text-align:inherit}label{display:inline-block;margin-bottom:.5rem}button:focus{outline:1px dotted;outline:5px auto -webkit-focus-ring-color}button,input,optgroup,select,textarea{margin:0;font-family:inherit;font-size:inherit;line-height:inherit}button,input{overflow:visible}button,select{text-transform:none}[type=reset],[type=submit],button,html [type=button]{-webkit-appearance:button}[type=button]::-moz-focus-inner,[type=reset]::-moz-focus-inner,[type=submit]::-moz-focus-inner,button::-moz-focus-inner{padding:0;border-style:none}input[type=checkbox],input[type=radio]{box-sizing:border-box;padding:0}input[type=date],input[type=datetime-local],input[type=month],input[type=time]{-webkit-appearance:listbox}textarea{overflow:auto;resize:vertical}fieldset{min-width:0;padding:0;margin:0;border:0}legend{display:block;width:100%;max-width:100%;padding:0;margin-bottom:.5rem;font-size:1.5rem;line-height:inherit;color:inherit;white-space:normal}progress{vertical-align:baseline}[type=number]::-webkit-inner-spin-button,[type=number]::-webkit-outer-spin-button{height:auto}[type=search]{outline-offset:-2px;-webkit-appearance:none}[type=search]::-webkit-search-cancel-button,[type=search]::-webkit-search-decoration{-webkit-appearance:none}::-webkit-file-upload-button{font:inherit;-webkit-appearance:button}output{display:inline-block}summary{display:list-item}template{display:none}[hidden]{display:none!important}
/*# sourceMappingURL=bootstrap-reboot.min.css.map */

BIN
dist/css/bootstrap-reboot.min.css.map vendored
View file

Binary file not shown.

133
dist/css/bootstrap.css
View file

@ -244,7 +244,7 @@ a,
area,
button,
[role="button"],
input,
input:not([type=range]),
label,
select,
summary,
@ -1689,51 +1689,105 @@ pre code {
background-color: rgba(0, 0, 0, 0.075);
}
.thead-inverse th {
.table .thead-dark th {
color: #fff;
background-color: #212529;
}
.thead-default th {
color: #495057;
background-color: #e9ecef;
}
.table-inverse {
color: #fff;
background-color: #212529;
}
.table-inverse th,
.table-inverse td,
.table-inverse thead th {
border-color: #32383e;
}
.table-inverse.table-bordered {
.table .thead-light th {
color: #495057;
background-color: #e9ecef;
border-color: #e9ecef;
}
.table-dark {
color: #fff;
background-color: #212529;
}
.table-dark th,
.table-dark td,
.table-dark thead th {
border-color: #32383e;
}
.table-dark.table-bordered {
border: 0;
}
.table-inverse.table-striped tbody tr:nth-of-type(odd) {
.table-dark.table-striped tbody tr:nth-of-type(odd) {
background-color: rgba(255, 255, 255, 0.05);
}
.table-inverse.table-hover tbody tr:hover {
.table-dark.table-hover tbody tr:hover {
background-color: rgba(255, 255, 255, 0.075);
}
@media (max-width: 991px) {
.table-responsive {
@media (max-width: 575px) {
.table-responsive-sm {
display: block;
width: 100%;
overflow-x: auto;
-webkit-overflow-scrolling: touch;
-ms-overflow-style: -ms-autohiding-scrollbar;
}
.table-responsive.table-bordered {
.table-responsive-sm.table-bordered {
border: 0;
}
}
@media (max-width: 767px) {
.table-responsive-md {
display: block;
width: 100%;
overflow-x: auto;
-webkit-overflow-scrolling: touch;
-ms-overflow-style: -ms-autohiding-scrollbar;
}
.table-responsive-md.table-bordered {
border: 0;
}
}
@media (max-width: 991px) {
.table-responsive-lg {
display: block;
width: 100%;
overflow-x: auto;
-webkit-overflow-scrolling: touch;
-ms-overflow-style: -ms-autohiding-scrollbar;
}
.table-responsive-lg.table-bordered {
border: 0;
}
}
@media (max-width: 1199px) {
.table-responsive-xl {
display: block;
width: 100%;
overflow-x: auto;
-webkit-overflow-scrolling: touch;
-ms-overflow-style: -ms-autohiding-scrollbar;
}
.table-responsive-xl.table-bordered {
border: 0;
}
}
.table-responsive {
display: block;
width: 100%;
overflow-x: auto;
-webkit-overflow-scrolling: touch;
-ms-overflow-style: -ms-autohiding-scrollbar;
}
.table-responsive.table-bordered {
border: 0;
}
.form-control {
display: block;
width: 100%;
@ -1825,6 +1879,7 @@ select.form-control:focus::-ms-value {
padding-bottom: 0.5rem;
margin-bottom: 0;
line-height: 1.25;
background-color: transparent;
border: solid transparent;
border-width: 1px 0;
}
@ -3475,6 +3530,8 @@ tbody.collapse.show {
.navbar-collapse {
-ms-flex-preferred-size: 100%;
flex-basis: 100%;
-ms-flex-positive: 1;
flex-grow: 1;
-ms-flex-align: center;
align-items: center;
}
@ -3542,6 +3599,8 @@ tbody.collapse.show {
.navbar-expand-sm .navbar-collapse {
display: -ms-flexbox !important;
display: flex !important;
-ms-flex-preferred-size: auto;
flex-basis: auto;
}
.navbar-expand-sm .navbar-toggler {
display: none;
@ -3588,6 +3647,8 @@ tbody.collapse.show {
.navbar-expand-md .navbar-collapse {
display: -ms-flexbox !important;
display: flex !important;
-ms-flex-preferred-size: auto;
flex-basis: auto;
}
.navbar-expand-md .navbar-toggler {
display: none;
@ -3634,6 +3695,8 @@ tbody.collapse.show {
.navbar-expand-lg .navbar-collapse {
display: -ms-flexbox !important;
display: flex !important;
-ms-flex-preferred-size: auto;
flex-basis: auto;
}
.navbar-expand-lg .navbar-toggler {
display: none;
@ -3680,6 +3743,8 @@ tbody.collapse.show {
.navbar-expand-xl .navbar-collapse {
display: -ms-flexbox !important;
display: flex !important;
-ms-flex-preferred-size: auto;
flex-basis: auto;
}
.navbar-expand-xl .navbar-toggler {
display: none;
@ -3729,6 +3794,8 @@ tbody.collapse.show {
.navbar-expand .navbar-collapse {
display: -ms-flexbox !important;
display: flex !important;
-ms-flex-preferred-size: auto;
flex-basis: auto;
}
.navbar-expand .navbar-toggler {
@ -4032,6 +4099,10 @@ tbody.collapse.show {
}
.breadcrumb {
display: -ms-flexbox;
display: flex;
-ms-flex-wrap: wrap;
flex-wrap: wrap;
padding: 0.75rem 1rem;
margin-bottom: 1rem;
list-style: none;
@ -4039,16 +4110,6 @@ tbody.collapse.show {
border-radius: 0.25rem;
}
.breadcrumb::after {
display: block;
clear: both;
content: "";
}
.breadcrumb-item {
float: left;
}
.breadcrumb-item + .breadcrumb-item::before {
display: inline-block;
padding-right: 0.5rem;
@ -4811,6 +4872,7 @@ button.close {
position: relative;
width: auto;
margin: 10px;
pointer-events: none;
}
.modal-content {
@ -4819,6 +4881,7 @@ button.close {
display: flex;
-ms-flex-direction: column;
flex-direction: column;
pointer-events: auto;
background-color: #fff;
background-clip: padding-box;
border: 1px solid rgba(0, 0, 0, 0.2);
@ -5583,11 +5646,11 @@ a.bg-dark:focus, a.bg-dark:hover {
}
.rounded-circle {
border-radius: 50%;
border-radius: 50% !important;
}
.rounded-0 {
border-radius: 0;
border-radius: 0 !important;
}
.clearfix::after {

BIN
dist/css/bootstrap.css.map vendored
View file

Binary file not shown.

2
dist/css/bootstrap.min.css vendored
View file

File diff suppressed because one or more lines are too long

BIN
dist/css/bootstrap.min.css.map vendored
View file

Binary file not shown.

6350
dist/js/bootstrap.bundle.js vendored Normal file
View file

File diff suppressed because it is too large Load diff

6
dist/js/bootstrap.bundle.min.js vendored Normal file
View file

File diff suppressed because one or more lines are too long

1598
dist/js/bootstrap.js
View file

File diff suppressed because it is too large Load diff

10
dist/js/bootstrap.min.js vendored
View file

File diff suppressed because one or more lines are too long

4
docs/4.0/about/history.md
View file

@ -3,7 +3,7 @@ layout: docs
title: History
description: A brief overview of the history of Bootstrap.
redirect_from:
- /about/
- /docs/4.0/about/
group: about
---
@ -11,4 +11,4 @@ Originally created by a designer and a developer at Twitter, Bootstrap has becom
Bootstrap was created at Twitter in mid-2010 by [@mdo](https://twitter.com/mdo) and [@fat](https://twitter.com/fat). Prior to being an open-sourced framework, Bootstrap was known as _Twitter Blueprint_. A few months into development, Twitter held its [first Hack Week](https://blog.twitter.com/2010/hack-week) and the project exploded as developers of all skill levels jumped in without any external guidance. It served as the style guide for internal tools development at the company for over a year before its public release, and continues to do so today.
Originally [released](https://blog.twitter.com/2011/bootstrap-from-twitter) on [<time datetime="2011-08-19 11:25">Friday, August 19, 2011</time>](https://twitter.com/mdo/statuses/104620039650557952), we've since had over [twenty releases](https://github.com/twbs/bootstrap/releases), including two major rewrites with v2 and v3. With Bootstrap 2, we added responsive functionality to the entire framework as an optional stylesheet. Building on that with Bootstrap 3, we rewrote the library once more to make it responsive by default with a mobile first approach.
Originally [released](https://blog.twitter.com/2011/bootstrap-from-twitter) on [<time datetime="2011-08-19 11:25">Friday, August 19, 2011</time>](https://twitter.com/mdo/statuses/104620039650557952), we've since had over [twenty releases]({{ site.repo }}/releases), including two major rewrites with v2 and v3. With Bootstrap 2, we added responsive functionality to the entire framework as an optional stylesheet. Building on that with Bootstrap 3, we rewrote the library once more to make it responsive by default with a mobile first approach.

2
docs/4.0/about/license.md
View file

@ -31,4 +31,4 @@ Bootstrap is released under the MIT license and is copyright {{ site.time | date
- Include the source of Bootstrap itself, or of any modifications you may have made to it, in any redistribution you may assemble that includes it
- Submit changes that you make to Bootstrap back to the Bootstrap project (though such feedback is encouraged)
The full Bootstrap license is located [in the project repository]({{ site.repo }}/blob/master/LICENSE) for more information.
The full Bootstrap license is located [in the project repository]({{ site.repo }}/blob/v{{ site.current_version }}/LICENSE) for more information.

2
docs/4.0/about/team.md
View file

@ -19,4 +19,4 @@ Bootstrap is maintained by the founding team and a small group of invaluable cor
{% endfor %}
</div>
Get involved with Bootstrap development by [opening an issue](https://github.com/twbs/bootstrap/issues/new) or submitting a pull request. Read our [contributing guidelines](https://github.com/twbs/bootstrap/blob/master/CONTRIBUTING.md) for information on how we develop.
Get involved with Bootstrap development by [opening an issue]({{ site.repo }}/issues/new) or submitting a pull request. Read our [contributing guidelines]({{ site.repo }}/blob/v{{ site.current_version }}/.github/CONTRIBUTING.md) for information on how we develop.

45
docs/4.0/components/breadcrumb.md
View file

@ -4,31 +4,36 @@ title: Breadcrumb
description: Indicate the current page's location within a navigational hierarchy that automatically adds separators via CSS.
group: components
---
## Overview
Separators are automatically added in CSS through [`::before`](https://developer.mozilla.org/en-US/docs/Web/CSS/::before) and [`content`](https://developer.mozilla.org/en-US/docs/Web/CSS/content).
{% example html %}
<ol class="breadcrumb">
<li class="breadcrumb-item active">Home</li>
</ol>
<ol class="breadcrumb">
<li class="breadcrumb-item"><a href="#">Home</a></li>
<li class="breadcrumb-item active">Library</li>
</ol>
<ol class="breadcrumb">
<li class="breadcrumb-item"><a href="#">Home</a></li>
<li class="breadcrumb-item"><a href="#">Library</a></li>
<li class="breadcrumb-item active">Data</li>
</ol>
{% endexample %}
Similar to our navigation components, breadcrumbs work fine with or without the usage of list markup.
<nav aria-label="breadcrumb" role="navigation">
<ol class="breadcrumb">
<li class="breadcrumb-item active" aria-current="page">Home</li>
</ol>
</nav>
{% example html %}
<nav class="breadcrumb">
<a class="breadcrumb-item" href="#">Home</a>
<a class="breadcrumb-item" href="#">Library</a>
<a class="breadcrumb-item" href="#">Data</a>
<span class="breadcrumb-item active">Bootstrap</span>
<nav aria-label="breadcrumb" role="navigation">
<ol class="breadcrumb">
<li class="breadcrumb-item"><a href="#">Home</a></li>
<li class="breadcrumb-item active" aria-current="page">Library</li>
</ol>
</nav>
<nav aria-label="breadcrumb" role="navigation">
<ol class="breadcrumb">
<li class="breadcrumb-item"><a href="#">Home</a></li>
<li class="breadcrumb-item"><a href="#">Library</a></li>
<li class="breadcrumb-item active" aria-current="page">Data</li>
</ol>
</nav>
{% endexample %}
## Accessibility
Since breadcrumbs provide a navigation, it's a good idea to add a meaningful label such as `aria-label="breadcrumb"` to describe the type of navigation provided in the `<nav>` element, as well as applying an `aria-current="page"` to the last item of the set to indicate that it represents the current page.
For more information, see the [WAI-ARIA Authoring Practices for the breadcrumb pattern](https://www.w3.org/TR/wai-aria-practices/#breadcrumb).

4
docs/4.0/components/card.md
View file

@ -33,14 +33,14 @@ Below is an example of a basic card with mixed content and a fixed width. Cards
Cards support a wide variety of content, including images, text, list groups, links, and more. Below are examples of what's supported.
### Blocks
### Body
The building block of a card is the `.card-body`. Use it whenever you need a padded section within a card.
{% example html %}
<div class="card">
<div class="card-body">
This is some text within a card block.
This is some text within a card body.
</div>
</div>
{% endexample %}

4
docs/4.0/components/collapse.md
View file

@ -40,7 +40,7 @@ Multiple `<button>` or `<a>` can show and hide an element if they each referenc
{% example html %}
<p>
<a class="btn btn-primary" data-toggle="collapse" href="#multiCollapseExample1" aria-expanded="false" aria-controls="multiCollapseExample1">Toggle first element</a>
<button class="btn btn-primary" type="button" data-toggle="collapse" data-target="#multiCollapseExample2" aria-expanded="false" aria-controls="multiCollapseExample1">Toggle second element</button>
<button class="btn btn-primary" type="button" data-toggle="collapse" data-target="#multiCollapseExample2" aria-expanded="false" aria-controls="multiCollapseExample2">Toggle second element</button>
<button class="btn btn-primary" type="button" data-toggle="collapse" data-target=".multi-collapse" aria-expanded="false" aria-controls="multiCollapseExample1 multiCollapseExample2">Toggle both elements</button>
</p>
<div class="row">
@ -216,7 +216,7 @@ $('#myCollapsible').collapse({
#### `.collapse('toggle')`
Toggles a collapsible element to shown or hidden. **Returns to the caller before the collapsible element has actually been shown or hidden (i.e. before the `shown.bs.collapse` or `hidden.bs.collapse` event occurs).
Toggles a collapsible element to shown or hidden. **Returns to the caller before the collapsible element has actually been shown or hidden** (i.e. before the `shown.bs.collapse` or `hidden.bs.collapse` event occurs).
#### `.collapse('show')`

14
docs/4.0/components/dropdowns.md
View file

@ -10,7 +10,7 @@ toc: true
Dropdowns are toggleable, contextual overlays for displaying lists of links and more. They're made interactive with the included Bootstrap dropdown JavaScript plugin. They're toggled by clicking, not by hovering; this is [an intentional design decision.](http://markdotto.com/2012/02/27/bootstrap-explained-dropdowns/)
Dropdowns are built on a third party library, [Popper.js](https://popper.js.org), which provides dynamic positioning and viewport detection. Be sure to include [popper.min.js]({{ site.cdn.popper }}) before Bootstrap's JavaScript.
Dropdowns are built on a third party library, [Popper.js](https://popper.js.org), which provides dynamic positioning and viewport detection. Be sure to include [popper.min.js]({{ site.cdn.popper }}) before Bootstrap's JavaScript or use `bootstrap.bundle.min.js` / `bootstrap.bundle.js` which contains Popper.js.
If you're building our JS from source, it [requires `util.js`]({{ site.baseurl }}/docs/{{ site.docs_version }}/getting-started/javascript/#util).
@ -432,7 +432,7 @@ Historically dropdown menu contents *had* to be links, but that's no longer the
By default, a dropdown menu is automatically positioned 100% from the top and along the left side of its parent. Add `.dropdown-menu-right` to a `.dropdown-menu` to right align the dropdown menu.
{% callout info %}
**Heads up!** Dropdowns are positioned only with CSS and may need some additional styles for exact alignment.
**Heads up!** Dropdowns are positioned thanks to Popper.js (except when they are contained in a navbar).
{% endcallout %}
{% example html %}
@ -574,7 +574,7 @@ Regardless of whether you call your dropdown via JavaScript or instead use the d
### Options
Options can be passed via data attributes or JavaScript. For data attributes, append the option name to `data-`, as in `data-placement=""`.
Options can be passed via data attributes or JavaScript. For data attributes, append the option name to `data-`, as in `data-offset=""`.
<table class="table table-bordered table-striped table-responsive">
<thead>
@ -586,14 +586,6 @@ Options can be passed via data attributes or JavaScript. For data attributes, ap
</tr>
</thead>
<tbody>
<tr>
<td>placement</td>
<td>string</td>
<td>'bottom'</td>
<td>
<p>How to position the popover - top | bottom.</p>
</td>
</tr>
<tr>
<td>offset</td>
<td>number | string</td>

19
docs/4.0/components/forms.md
View file

@ -337,7 +337,10 @@ More complex layouts can also be created with the grid system.
</div>
<div class="form-group col-md-4">
<label for="inputState" class="col-form-label">State</label>
<select id="inputState" class="form-control">Choose</select>
<select id="inputState" class="form-control">
<option selected>Choose...</option>
<option>...</option>
</select>
</div>
<div class="form-group col-md-2">
<label for="inputZip" class="col-form-label">Zip</label>
@ -645,9 +648,9 @@ Add the `disabled` attribute to a `<fieldset>` to disable all the controls withi
<option>Disabled select</option>
</select>
</div>
<div class="checkbox">
<label>
<input type="checkbox"> Can't check this
<div class="form-check">
<label class="form-check-label">
<input class="form-check-input" type="checkbox"> Can't check this
</label>
</div>
<button type="submit" class="btn btn-primary">Submit</button>
@ -658,7 +661,7 @@ Add the `disabled` attribute to a `<fieldset>` to disable all the controls withi
{% callout warning %}
#### Caveat with anchors
By default, browsers will treat all native form controls (`<input>`, `<select>` and `<button>` elements) inside a `<fieldset disabled>` as disabled, preventing both keyboard and mouse interactions on them. However, if your form also includes `<a ... class="btn btn-*">` elements, these will only be given a style of `pointer-events: none`. As noted in the section about [disabled state for buttons]({{ site.baseurl }}/docs/{{ site.docs_version }}/components/buttons/#disabled-state) (and specifically in the sub-section for anchor elements), this CSS property is not yet standardized and isn't fully supported in Opera 18 and below, or in Internet Explorer 11, and won't prevent keyboard users from being able to focus or activate these links. So to be safe, use custom JavaScript to disable such links.
By default, browsers will treat all native form controls (`<input>`, `<select>` and `<button>` elements) inside a `<fieldset disabled>` as disabled, preventing both keyboard and mouse interactions on them. However, if your form also includes `<a ... class="btn btn-*">` elements, these will only be given a style of `pointer-events: none`. As noted in the section about [disabled state for buttons]({{ site.baseurl }}/docs/{{ site.docs_version }}/components/buttons/#disabled-state) (and specifically in the sub-section for anchor elements), this CSS property is not yet standardized and isn't fully supported in Opera 18 and below, or in Internet Explorer 10, and won't prevent keyboard users from being able to focus or activate these links. So to be safe, use custom JavaScript to disable such links.
{% endcallout %}
{% callout danger %}
@ -684,7 +687,7 @@ Here's how form validation works with Bootstrap:
- As a fallback, `.is-invalid` and `.is-valid` classes may be used instead of the pseudo-classes for [server side validation](#server-side). They do not require a `.was-validated` parent class.
- Due to constraints in how CSS works, we cannot (at present) apply styles to a `<label>` that comes before a form control in the DOM without the help of custom JavaScript.
- All modern browsers support the [constraint validation API](https://www.w3.org/TR/html5/forms.html#the-constraint-validation-api), a series of JavaScript methods for validating form controls.
- Feedback messages may utilize the [browser defaults](#browser-default) (different for each browser, and unstylable via CSS) or our custom feedback styles with additional HTML and CSS.
- Feedback messages may utilize the [browser defaults](#browser-defaults) (different for each browser, and unstylable via CSS) or our custom feedback styles with additional HTML and CSS.
- You may provide custom validity messages with `setCustomValidity` in JavaScript.
With that in mind, consider the following demos for our custom form validation styles, optional server side classes, and browser defaults.
@ -1004,8 +1007,8 @@ Here's how it works:
- We wrap the `<input>` in a `<label>` so the custom control properly triggers the file browser.
- We hide the default file `<input>` via `opacity`.
- We use `:after` to generate a custom background and directive (*Choose file...*).
- We use `:before` to generate and position the *Browse* button.
- We use `::after` to generate a custom background and directive (*Choose file...*).
- We use `::before` to generate and position the *Browse* button.
- We declare a `height` on the `<input>` for proper spacing for surrounding content.
In other words, it's an entirely custom element, all generated via CSS.

4
docs/4.0/components/list-group.md
View file

@ -56,7 +56,7 @@ Be sure to **not use the standard `.btn` classes here**.
{% example html %}
<div class="list-group">
<a href="#" class="list-group-item active">
<a href="#" class="list-group-item list-group-item-action active">
Cras justo odio
</a>
<a href="#" class="list-group-item list-group-item-action">Dapibus ac facilisis in</a>
@ -244,7 +244,7 @@ You can activate a list group navigation without writing any JavaScript by simpl
Enable tabbable list item via JavaScript (each list item needs to be activated individually):
{% highlight js %}
$('#myList a').click(function (e) {
$('#myList a').on('click', function (e) {
e.preventDefault()
$(this).tab('show')
})

2
docs/4.0/components/modal.md
View file

@ -19,7 +19,7 @@ Before getting started with Bootstrap's modal component, be sure to read the fol
{% highlight js %}
$('#myModal').on('shown.bs.modal', function () {
$('#myInput').focus()
$('#myInput').trigger('focus')
})
{% endhighlight %}

4
docs/4.0/components/navbar.md
View file

@ -70,7 +70,7 @@ The `.navbar-brand` can be applied to most elements, but an anchor works best as
<!-- As a heading -->
<nav class="navbar navbar-light bg-light">
<span class="h1" class="navbar-brand mb-0">Navbar</span>
<span class="navbar-brand mb-0 h1">Navbar</span>
</nav>
{% endexample %}
@ -165,7 +165,7 @@ You may also utilize dropdowns in your navbar nav. Dropdown menus require a wrap
<a class="nav-link" href="#">Pricing</a>
</li>
<li class="nav-item dropdown">
<a class="nav-link dropdown-toggle" href="http://example.com" id="navbarDropdownMenuLink" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false">
<a class="nav-link dropdown-toggle" href="#" id="navbarDropdownMenuLink" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false">
Dropdown link
</a>
<div class="dropdown-menu" aria-labelledby="navbarDropdownMenuLink">

2
docs/4.0/components/navs.md
View file

@ -554,7 +554,7 @@ You can activate a tab or pill navigation without writing any JavaScript by simp
Enable tabbable tabs via JavaScript (each tab needs to be activated individually):
{% highlight js %}
$('#myTab a').click(function (e) {
$('#myTab a').on('click', function (e) {
e.preventDefault()
$(this).tab('show')
})

2
docs/4.0/components/popovers.md
View file

@ -11,7 +11,7 @@ toc: true
Things to know when using the popover plugin:
- Popovers rely on the 3rd party library [Popper.js](https://popper.js.org) for positioning. You must include [popper.min.js]({{ site.cdn.popper }}) before bootstrap.js in order for popovers to work!
- Popovers rely on the 3rd party library [Popper.js](https://popper.js.org) for positioning. You must include [popper.min.js]({{ site.cdn.popper }}) before bootstrap.js or use `bootstrap.bundle.min.js` / `bootstrap.bundle.js` which contains Popper.js in order for popovers to work!
- Popovers require the [tooltip plugin]({{ site.baseurl }}/docs/{{ site.docs_version }}/components/tooltips/) as a dependency.
- If building our JS from source, it [requires `util.js`]({{ site.baseurl }}/docs/{{ site.docs_version }}/getting-started/javascript/#util).
- Popovers are opt-in for performance reasons, so **you must initialize them yourself**.

2
docs/4.0/components/tooltips.md
View file

@ -10,7 +10,7 @@ toc: true
Things to know when using the tooltip plugin:
- Tooltips rely on the 3rd party library [Popper.js](https://popper.js.org) for positioning. You must include [popper.min.js]({{ site.cdn.popper }}) before bootstrap.js in order for tooltips to work!
- Tooltips rely on the 3rd party library [Popper.js](https://popper.js.org) for positioning. You must include [popper.min.js]({{ site.cdn.popper }}) before bootstrap.js or use `bootstrap.bundle.min.js` / `bootstrap.bundle.js` which contains Popper.js in order for tooltips to work!
- If building our JS from source, it [requires `util.js`]({{ site.baseurl }}/docs/{{ site.docs_version }}/getting-started/javascript/#util).
- Tooltips are opt-in for performance reasons, so **you must initialize them yourself**.
- Tooltips with zero-length titles are never displayed.

4
docs/4.0/content/reboot.md
View file

@ -22,7 +22,7 @@ Here are our guidelines and reasons for choosing what to override in Reboot:
The `<html>` and `<body>` elements are updated to provide better page-wide defaults. More specifically:
- The `box-sizing` is globally set on every element—including `*:before` and `*:after`, to `border-box`. This ensures that the declared width of element is never exceeded due to padding or border.
- The `box-sizing` is globally set on every element—including `*::before` and `*::after`, to `border-box`. This ensures that the declared width of element is never exceeded due to padding or border.
- No base `font-size` is declared on the `<html>`, but `16px` is assumed (the browser default). `font-size: 1rem` is applied on the `<body>` for easy responsive type-scaling via media queries while respecting user preferences and ensuring a more accessible approach.
- The `<body>` also sets a global `font-family`, `line-height`, and `text-align`. This is inherited later by some form elements to prevent font inconsistencies.
- For safety, the `<body>` has a declared `background-color`, defaulting to `#fff`.
@ -339,7 +339,7 @@ HTML5 adds [a new global attribute named `[hidden]`](https://developer.mozilla.o
{% callout warning %}
#### jQuery incompatibility
`[hidden]` is not compatible with jQuery's `$(...).hide()` and `$(...).show()` methods. This could potentially change in jQuery 3, but we're not holding our breath. Therefore, we don't currently especially endorse `[hidden]` over other techniques for managing the `display` of elements.
`[hidden]` is not compatible with jQuery's `$(...).hide()` and `$(...).show()` methods. Therefore, we don't currently especially endorse `[hidden]` over other techniques for managing the `display` of elements.
{% endcallout %}
To merely toggle the visibility of an element, meaning its `display` is not modified and the element can still affect the flow of the document, use [the `.invisible` class]({{ site.baseurl }}/docs/{{ site.docs_version }}/utilities/visibility/) instead.

197
docs/4.0/content/tables.md
View file

@ -16,10 +16,10 @@ Using the most basic table markup, here's how `.table`-based tables look in Boot
<table class="table">
<thead>
<tr>
<th>#</th>
<th>First Name</th>
<th>Last Name</th>
<th>Username</th>
<th scope="col">#</th>
<th scope="col">First Name</th>
<th scope="col">Last Name</th>
<th scope="col">Username</th>
</tr>
</thead>
<tbody>
@ -51,10 +51,10 @@ You can also invert the colors—with light text on dark backgrounds—with `.ta
<table class="table table-dark">
<thead>
<tr>
<th>#</th>
<th>First Name</th>
<th>Last Name</th>
<th>Username</th>
<th scope="col">#</th>
<th scope="col">First Name</th>
<th scope="col">Last Name</th>
<th scope="col">Username</th>
</tr>
</thead>
<tbody>
@ -88,10 +88,10 @@ Similar to tables and dark tables, use the modifier classes `.thead-light` or `.
<table class="table">
<thead class="thead-dark">
<tr>
<th>#</th>
<th>First Name</th>
<th>Last Name</th>
<th>Username</th>
<th scope="col">#</th>
<th scope="col">First Name</th>
<th scope="col">Last Name</th>
<th scope="col">Username</th>
</tr>
</thead>
<tbody>
@ -119,10 +119,10 @@ Similar to tables and dark tables, use the modifier classes `.thead-light` or `.
<table class="table">
<thead class="thead-light">
<tr>
<th>#</th>
<th>First Name</th>
<th>Last Name</th>
<th>Username</th>
<th scope="col">#</th>
<th scope="col">First Name</th>
<th scope="col">Last Name</th>
<th scope="col">Username</th>
</tr>
</thead>
<tbody>
@ -156,10 +156,10 @@ Use `.table-striped` to add zebra-striping to any table row within the `<tbody>`
<table class="table table-striped">
<thead>
<tr>
<th>#</th>
<th>First Name</th>
<th>Last Name</th>
<th>Username</th>
<th scope="col">#</th>
<th scope="col">First Name</th>
<th scope="col">Last Name</th>
<th scope="col">Username</th>
</tr>
</thead>
<tbody>
@ -189,10 +189,10 @@ Use `.table-striped` to add zebra-striping to any table row within the `<tbody>`
<table class="table table-striped table-dark">
<thead>
<tr>
<th>#</th>
<th>First Name</th>
<th>Last Name</th>
<th>Username</th>
<th scope="col">#</th>
<th scope="col">First Name</th>
<th scope="col">Last Name</th>
<th scope="col">Username</th>
</tr>
</thead>
<tbody>
@ -226,10 +226,10 @@ Add `.table-bordered` for borders on all sides of the table and cells.
<table class="table table-bordered">
<thead>
<tr>
<th>#</th>
<th>First Name</th>
<th>Last Name</th>
<th>Username</th>
<th scope="col">#</th>
<th scope="col">First Name</th>
<th scope="col">Last Name</th>
<th scope="col">Username</th>
</tr>
</thead>
<tbody>
@ -264,10 +264,10 @@ Add `.table-bordered` for borders on all sides of the table and cells.
<table class="table table-bordered table-dark">
<thead>
<tr>
<th>#</th>
<th>First Name</th>
<th>Last Name</th>
<th>Username</th>
<th scope="col">#</th>
<th scope="col">First Name</th>
<th scope="col">Last Name</th>
<th scope="col">Username</th>
</tr>
</thead>
<tbody>
@ -306,10 +306,10 @@ Add `.table-hover` to enable a hover state on table rows within a `<tbody>`.
<table class="table table-hover">
<thead>
<tr>
<th>#</th>
<th>First Name</th>
<th>Last Name</th>
<th>Username</th>
<th scope="col">#</th>
<th scope="col">First Name</th>
<th scope="col">Last Name</th>
<th scope="col">Username</th>
</tr>
</thead>
<tbody>
@ -338,10 +338,10 @@ Add `.table-hover` to enable a hover state on table rows within a `<tbody>`.
<table class="table table-hover table-dark">
<thead>
<tr>
<th>#</th>
<th>First Name</th>
<th>Last Name</th>
<th>Username</th>
<th scope="col">#</th>
<th scope="col">First Name</th>
<th scope="col">Last Name</th>
<th scope="col">Username</th>
</tr>
</thead>
<tbody>
@ -374,10 +374,10 @@ Add `.table-sm` to make tables more compact by cutting cell padding in half.
<table class="table table-sm">
<thead>
<tr>
<th>#</th>
<th>First Name</th>
<th>Last Name</th>
<th>Username</th>
<th scope="col">#</th>
<th scope="col">First Name</th>
<th scope="col">Last Name</th>
<th scope="col">Username</th>
</tr>
</thead>
<tbody>
@ -406,10 +406,10 @@ Add `.table-sm` to make tables more compact by cutting cell padding in half.
<table class="table table-sm table-dark">
<thead>
<tr>
<th>#</th>
<th>First Name</th>
<th>Last Name</th>
<th>Username</th>
<th scope="col">#</th>
<th scope="col">First Name</th>
<th scope="col">Last Name</th>
<th scope="col">Username</th>
</tr>
</thead>
<tbody>
@ -442,10 +442,10 @@ Use contextual classes to color table rows or individual cells.
<table class="table">
<thead>
<tr>
<th>Type</th>
<th>Column heading</th>
<th>Column heading</th>
<th>Column heading</th>
<th scope="col">Type</th>
<th scope="col">Column heading</th>
<th scope="col">Column heading</th>
<th scope="col">Column heading</th>
</tr>
</thead>
<tbody>
@ -493,10 +493,10 @@ Regular table background variants are not available with the dark table, however
<table class="table table-dark">
<thead>
<tr>
<th>#</th>
<th>Column heading</th>
<th>Column heading</th>
<th>Column heading</th>
<th scope="col">#</th>
<th scope="col">Column heading</th>
<th scope="col">Column heading</th>
<th scope="col">Column heading</th>
</tr>
</thead>
<tbody>
@ -581,7 +581,9 @@ Regular table background variants are not available with the dark table, however
## Responsive tables
Create responsive tables by adding `.table-responsive` to any `.table` to make them scroll horizontally on small devices (under 768px). When viewing on anything larger than 768px wide, you will not see any difference in these tables.
Create responsive tables by adding `.table-responsive{-sm|-md|-lg|-xl}` to any `.table` to make them scroll horizontally at each `max-width` breakpoint 575px, 767px, 991px, and 1199px, respectively.
For responsive tables that always scroll horizontally when the table is wider than its container, add the `.table-responsive` class on `.table`.
{% callout warning %}
#### Vertical clipping/truncation
@ -593,13 +595,16 @@ Responsive tables make use of `overflow-y: hidden`, which clips off any content
<table class="table table-responsive">
<thead>
<tr>
<th>#</th>
<th>Table heading</th>
<th>Table heading</th>
<th>Table heading</th>
<th>Table heading</th>
<th>Table heading</th>
<th>Table heading</th>
<th scope="col">#</th>
<th scope="col">Table heading</th>
<th scope="col">Table heading</th>
<th scope="col">Table heading</th>
<th scope="col">Table heading</th>
<th scope="col">Table heading</th>
<th scope="col">Table heading</th>
<th scope="col">Table heading</th>
<th scope="col">Table heading</th>
<th scope="col">Table heading</th>
</tr>
</thead>
<tbody>
@ -611,6 +616,9 @@ Responsive tables make use of `overflow-y: hidden`, which clips off any content
<td>Table cell</td>
<td>Table cell</td>
<td>Table cell</td>
<td>Table cell</td>
<td>Table cell</td>
<td>Table cell</td>
</tr>
<tr>
<th scope="row">2</th>
@ -620,6 +628,9 @@ Responsive tables make use of `overflow-y: hidden`, which clips off any content
<td>Table cell</td>
<td>Table cell</td>
<td>Table cell</td>
<td>Table cell</td>
<td>Table cell</td>
<td>Table cell</td>
</tr>
<tr>
<th scope="row">3</th>
@ -629,20 +640,23 @@ Responsive tables make use of `overflow-y: hidden`, which clips off any content
<td>Table cell</td>
<td>Table cell</td>
<td>Table cell</td>
<td>Table cell</td>
<td>Table cell</td>
<td>Table cell</td>
</tr>
</tbody>
</table>
<table class="table table-bordered table-responsive">
<table class="table table-bordered table-responsive-lg">
<thead>
<tr>
<th>#</th>
<th>Table heading</th>
<th>Table heading</th>
<th>Table heading</th>
<th>Table heading</th>
<th>Table heading</th>
<th>Table heading</th>
<th scope="col">#</th>
<th scope="col">Table heading</th>
<th scope="col">Table heading</th>
<th scope="col">Table heading</th>
<th scope="col">Table heading</th>
<th scope="col">Table heading</th>
<th scope="col">Table heading</th>
</tr>
</thead>
<tbody>
@ -682,3 +696,42 @@ Responsive tables make use of `overflow-y: hidden`, which clips off any content
...
</table>
{% endhighlight %}
## Captions
A `<caption>` functions like a heading for a table. It helps users with screen readers to find a table and understand what it’s about and decide if they want to read it.
{% example html %}
<table class="table">
<caption>List of users</caption>
<thead>
<tr>
<th scope="col">#</th>
<th scope="col">First Name</th>
<th scope="col">Last Name</th>
<th scope="col">Username</th>
</tr>
</thead>
<tbody>
<tr>
<th scope="row">1</th>
<td>Mark</td>
<td>Otto</td>
<td>@mdo</td>
</tr>
<tr>
<th scope="row">2</th>
<td>Jacob</td>
<td>Thornton</td>
<td>@fat</td>
</tr>
<tr>
<th scope="row">3</th>
<td>Larry</td>
<td>the Bird</td>
<td>@twitter</td>
</tr>
</tbody>
</table>
{% endexample %}

2
docs/4.0/examples/blog/blog.css
View file

@ -62,7 +62,7 @@ h6, .h6 {
.nav-link.active {
color: #fff;
}
.nav-link.active:after {
.nav-link.active::after {
position: absolute;
bottom: 0;
left: 50%;

2
docs/4.0/examples/offcanvas/offcanvas.js
View file

@ -1,5 +1,5 @@
$(document).ready(function () {
$('[data-toggle="offcanvas"]').click(function () {
$('[data-toggle="offcanvas"]').on('click', function () {
$('.row-offcanvas').toggleClass('active')
});
});

2
docs/4.0/getting-started/browsers-devices.md
View file

@ -133,7 +133,7 @@ Bootstrap includes a workaround for this, although it is disabled by default. By
Even in some modern browsers, printing can be quirky.
As of Safari v8.0, use of the fixed-width `.container` class can cause Safari to use an unusually small font size when printing. See [issue #14868](https://github.com/twbs/bootstrap/issues/14868) and [WebKit bug #138192](https://bugs.webkit.org/show_bug.cgi?id=138192) for more details. One potential workaround is the following CSS:
As of Safari v8.0, use of the fixed-width `.container` class can cause Safari to use an unusually small font size when printing. See [issue #14868]({{ site.repo }}/issues/14868) and [WebKit bug #138192](https://bugs.webkit.org/show_bug.cgi?id=138192) for more details. One potential workaround is the following CSS:
{% highlight css %}
@media print {

10
docs/4.0/getting-started/build-tools.md
View file

@ -8,13 +8,13 @@ toc: true
## Tooling setup
Bootstrap uses [NPM scripts](https://docs.npmjs.com/misc/scripts) for its build system. Our [package.json](https://github.com/twbs/bootstrap/blob/v4-dev/package.json) includes convenient methods for working with the framework, including compiling code, running tests, and more.
Bootstrap uses [NPM scripts](https://docs.npmjs.com/misc/scripts) for its build system. Our [package.json]({{ site.repo }}/blob/v{{ site.current_version }}/package.json) includes convenient methods for working with the framework, including compiling code, running tests, and more.
To use our build system and run our documentation locally, you'll need a copy of Bootstrap's source files and Node. Follow these steps and you should be ready to rock:
1. [Download and install Node](https://nodejs.org/download/), which we use to manage our dependencies.
2. Navigate to the root `/bootstrap` directory and run `npm install` to install our local dependencies listed in [package.json](https://github.com/twbs/bootstrap/blob/master/package.json).
4. [Install Ruby][install-ruby], install [Bundler][gembundler] with `gem install bundler`, and finally run `bundle install`. This will install all Ruby dependencies, such as Jekyll and plugins.
2. Navigate to the root `/bootstrap` directory and run `npm install` to install our local dependencies listed in [package.json]({{ site.repo }}/blob/v{{ site.current_version }}/package.json).
3. [Install Ruby][install-ruby], install [Bundler][gembundler] with `gem install bundler`, and finally run `bundle install`. This will install all Ruby dependencies, such as Jekyll and plugins.
- **Windows users:** Read [this unofficial guide](http://jekyll-windows.juthilo.com/) to get Jekyll up and running without problems.
When completed, you'll be able to run the various commands provided from the command line.
@ -24,7 +24,7 @@ When completed, you'll be able to run the various commands provided from the com
## Using NPM scripts
Our [package.json](https://github.com/twbs/bootstrap/blob/master/package.json) includes the following commands and tasks:
Our [package.json]({{ site.repo }}/blob/v{{ site.current_version }}/package.json) includes the following commands and tasks:
| Task | Description |
| --- | --- |
@ -36,7 +36,7 @@ Our [package.json](https://github.com/twbs/bootstrap/blob/master/package.json) i
Bootstrap uses [Autoprefixer][autoprefixer] (included in our build process) to automatically add vendor prefixes to some CSS properties at build time. Doing so saves us time and code by allowing us to write key parts of our CSS a single time while eliminating the need for vendor mixins like those found in v3.
We maintain the list of browsers supported through Autoprefixer in a separate file within our GitHub repository. See [`/build/postcss.config.js`](https://github.com/twbs/bootstrap/blob/v4-dev/build/postcss.config.js) for details.
We maintain the list of browsers supported through Autoprefixer in a separate file within our GitHub repository. See [/build/postcss.config.js]({{ site.repo }}/blob/v{{ site.current_version }}/build/postcss.config.js) for details.
## Local documentation

10
docs/4.0/getting-started/download.md
View file

@ -1,7 +1,7 @@
---
layout: docs
title: Download
description: Download Bootstrap to get the compiled CSS and JavaScript, source code, or include it with your favorite package managers like npm, Bower, RubyGems, and more.
description: Download Bootstrap to get the compiled CSS and JavaScript, source code, or include it with your favorite package managers like npm, RubyGems, and more.
group: getting-started
toc: true
---
@ -87,14 +87,6 @@ You can also install and manage Bootstrap's Sass and JavaScript using [Composer]
composer require twbs/bootstrap:{{ site.current_version }}
{% endhighlight %}
### Bower
Install and manage Bootstrap's Sass and JavaScript using [Bower](https://bower.io).
{% highlight bash %}
bower install bootstrap#v{{ site.current_version }}
{% endhighlight %}
### NuGet
If you develop in .NET, you can also install and manage Bootstrap's [CSS](https://www.nuget.org/packages/bootstrap/) or [Sass](https://www.nuget.org/packages/bootstrap.sass/) and JavaScript using [NuGet](https://www.nuget.org):

5
docs/4.0/getting-started/introduction.md
View file

@ -20,7 +20,7 @@ Copy-paste the stylesheet `<link>` into your `<head>` before all other styleshee
<link rel="stylesheet" href="{{ site.cdn.css }}" integrity="{{ site.cdn.css_hash }}" crossorigin="anonymous">
{% endhighlight %}
Add our optional JavaScript plugins, jQuery, and [Popper.js](https://github.com/FezVrasta/popper.js)) near the end of your pages, right before the closing `</body>` tag. Be sure to place jQuery and Popper.js first, as our JavaScript plugins depend on them. While we use [jQuery's slim build](https://blog.jquery.com/2016/06/09/jquery-3-0-final-released/) in our docs, the full version is also supported.
Add our optional JavaScript plugins, jQuery, and [Popper.js](https://github.com/FezVrasta/popper.js) near the end of your pages, right before the closing `</body>` tag. Be sure to place jQuery and Popper.js first, as our JavaScript plugins depend on them. While we use [jQuery's slim build](https://blog.jquery.com/2016/06/09/jquery-3-0-final-released/) in our docs, the full version is also supported.
{% highlight html %}
<script src="{{ site.cdn.jquery }}" integrity="{{ site.cdn.jquery_hash }}" crossorigin="anonymous"></script>
@ -38,6 +38,7 @@ Be sure to have your pages set up with the latest design and development standar
<!DOCTYPE html>
<html lang="en">
<head>
<title>Hello, world!</title>
<!-- Required meta tags -->
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">
@ -96,7 +97,7 @@ On the rare occasion you need to override it, use something like the following:
}
{% endhighlight %}
With the above snippet, nested elements—including generated content via `:before` and `:after`—will all inherit the specified `box-sizing` for that `.selector-for-some-widget`.
With the above snippet, nested elements—including generated content via `::before` and `::after`—will all inherit the specified `box-sizing` for that `.selector-for-some-widget`.
Learn more about [box model and sizing at CSS Tricks](https://css-tricks.com/box-sizing/).

2
docs/4.0/getting-started/javascript.md
View file

@ -12,7 +12,7 @@ Plugins can be included individually (using Bootstrap's individual `*.js` files)
## Dependencies
Some plugins and CSS components depend on other plugins. If you include plugins individually, make sure to check for these dependencies in the docs. Also note that **all plugins depend on jQuery** (this means jQuery must be included **before** the plugin files). [Consult our `bower.json`]({{ site.repo }}/blob/v{{ site.current_version }}/bower.json) to see which versions of jQuery are supported.
Some plugins and CSS components depend on other plugins. If you include plugins individually, make sure to check for these dependencies in the docs. Also note that **all plugins depend on jQuery** (this means jQuery must be included **before** the plugin files). [Consult our `package.json`]({{ site.repo }}/blob/v{{ site.current_version }}/package.json) to see which versions of jQuery are supported.
Our tooltips and popovers also depend on [Popper.js](https://github.com/FezVrasta/popper.js).

4
docs/4.0/getting-started/options.md
View file

@ -46,11 +46,11 @@ All colors available in Bootstrap 4, available as Sass variables and a Sass map
<div class="row">
{% for color in site.data.colors %}
{% unless color.name == "white" or color.name == "gray" or color.name == "gray-dark" %}
<div class="col-md-4">
{% unless color.name == "white" or color.name == "gray" or color.name == "gray-dark" %}
<div class="p-3 mb-3 swatch-{{ color.name }}">{{ color.name | capitalize }}</div>
{% endunless %}
</div>
{% endunless %}
{% endfor %}
</div>

2
docs/4.0/layout/grid.md
View file

@ -727,4 +727,4 @@ $container-max-widths: (
);
{% endhighlight %}
When making any changes to the Sass variables or maps, you'll need to save your changes and recompile. Doing so will out a brand new set of predefined grid classes for column widths, offsets, and ordering. Responsive visibility utilities will also be updated to use the custom breakpoints.
When making any changes to the Sass variables or maps, you'll need to save your changes and recompile. Doing so will output a brand new set of predefined grid classes for column widths, offsets, and ordering. Responsive visibility utilities will also be updated to use the custom breakpoints. Make sure to set grid values in `px` (not `rem`, `em`, or `%`).

29
docs/4.0/migration.md
View file

@ -6,9 +6,22 @@ group: migration
toc: true
---
{% callout info %}
**Heads up!** This will be in flux as work on the v4 alphas progresses. Until then consider it incomplete, and we'd love pull requests to help keep it up to date.
{% endcallout %}
## Beta 2 changes
While in beta, we aim to have no breaking changes. However, things don't always go as planned. Below are the breaking changes to bear in mind when moving from Beta 1 to Beta 2.
### Breaking
- Removed `$badge-color` variable and its usage on `.badge`. We use a color contrast function to pick a `color` based on the `background-color`, so the variable is unnecessary.
- Renamed `grayscale()` function to `gray()` to avoid breaking conflict with the CSS native `grayscale` filter.
- Renamed `.table-inverse`, `.thead-inverse`, and `.thead-default` to `.*-dark` and `.*-light`, matching our color schemes used elsewhere.
- Responsive tables now generate classes for each grid breakpoint. This breaks from Beta 1 in that the `.table-responsive` you've been using is more like `.table-responsive-md`. You may now use `.table-responsive` or `.table-responsive-{sm,md,lg,xl}` as needed.
- Dropped Bower support as the package manager has been deprecated for alternatives (e.g., Yarn or npm). [See bower/bower#2298](https://github.com/bower/bower/issues/2298) for details.
- Bootstrap now requires jQuery 3.0.0 or higher.
### Highlights
- Introduced new `pointer-events` usage on modals. The outer `.modal-dialog` passes through events with `pointer-events: none` for custom click handling (making it possible to just listen on the `.modal-backdrop` for any clicks), and then counteracts it for the actual `.modal-content` with `pointer-events: auto`.
## Summary
@ -100,21 +113,21 @@ New to Bootstrap 4 is the [Reboot]({{ site.baseurl }}/docs/{{ site.docs_version
- Dropped `.form-group-*` classes for simplicity's sake. Use `.form-control-*` classes instead now.
- Dropped `.help-block` and replaced it with `.form-text` for block-level help text. For inline help text and other flexible options, use utility classes like `.text-muted`.
- Dropped `.radio-inline` and `.checkbox-inline`.
- Consolidated `.checkbox` and `.radio` into `.form-check` and the various `.form-check-*` classes.
- Horizontal forms overhauled:
- Dropped the `.form-horizontal` class requirement.
- `.form-group` no longer applies styles from the `.row` via mixin, so `.row` is now required for horizontal grid layouts (e.g., `<div class="form-group row">`).
- Added new `.form-control-label` class to vertically center labels with `.form-control`s.
- Added new `.form-row` for compact form layouts with the grid classes (swap your `.row` for a `.form-row` and go).
- Added custom forms support (for checkboxes, radios, selects, and file inputs).
- Added HTML5 form validation support via CSS's `:invalid` and `:valid` pseudo-classes.
- Renamed `.has-error` to `.has-danger`.
- Replaced `.has-error`, `.has-warning`, and `.has-success` classes with HTML5 form validation via CSS's `:invalid` and `:valid` pseudo-classes.
- Renamed `.form-control-static` to `.form-control-plaintext`.
### Buttons
- Renamed `.btn-default` to `.btn-secondary`.
- Dropped the `.btn-xs` class entirely as `.btn-sm` is proportionally much smaller than v3's.
- The [stateful button](https://getbootstrap.com/javascript/#buttons-methods) feature of the `button.js` jQuery plugin has been dropped. This includes the `$().button(string)` and `$().button('reset')` methods. We advise using a tiny bit of custom JavaScript instead, which will have the benefit of behaving exactly the way you want it to.
- The [stateful button]({{ site.baseurl }}/docs/3.3/javascript/#buttons-stateful) feature of the `button.js` jQuery plugin has been dropped. This includes the `$().button(string)` and `$().button('reset')` methods. We advise using a tiny bit of custom JavaScript instead, which will have the benefit of behaving exactly the way you want it to.
- Note that the other features of the plugin (button checkboxes, button radios, single-toggle buttons) have been retained in v4.
- Change buttons' `[disabled]` to `:disabled` as IE9+ supports `:disabled`. However `fieldset[disabled]` is still necessary because [native disabled fieldsets are still buggy in IE11](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/fieldset#Browser_compatibility).
@ -206,6 +219,10 @@ Dropped entirely for the new card component.
- `.panel-footer` to `.card-footer`
- `.panel-primary`, `.panel-success`, `.panel-info`, `.panel-warning`, and `.panel-danger` have been dropped for `.bg-`, `.text-`, and `.border` utilities generated from our `$theme-colors` Sass map.
### Progress
- Replaced contextual `.progress-bar-*` classes with `.bg-*` utilities. For example, `class="progress-bar progress-bar-danger"` becomes `class="progress-bar bg-danger"`.
### Carousel
- Overhauled the entire component to simplify design and styling. We have fewer styles for you to override, new indicators, and new icons.

23
docs/4.0/utilities/display.md
View file

@ -47,6 +47,29 @@ Responsive variations also exist for every single utility mentioned above.
- `.d{{ bp.abbr }}-flex`
- `.d{{ bp.abbr }}-inline-flex`{% endfor %}
## Hiding Elements
For faster mobile-friendly development, use responsive display classes for showing and hiding elements by device. Avoid creating entirely different versions of the same site, instead hide element responsively for each screen size.
To hide elements simply use the `.d-none` class or one of the `.d-{sm,md,lg,xl}-none` classes for any responsive screen variation.
To show an element only on a given interval of screen sizes you can combine one `.d-*-none` class with a `.d-*-*` class, for example `.d-none.d-md-block.d-xl-none` will hide the element for all screen sizes except on medium and large devices.
| Screen Size | Class |
| --- | --- |
| Hidden on all | `d-none` |
| Hidden only on xs | `d-none d-sm-block` |
| Hidden only on sm | `d-sm-none d-md-block` |
| Hidden only on md | `d-md-none d-lg-block` |
| Hidden only on lg | `d-lg-none d-xl-block` |
| Hidden only on xl | `d-xl-none` |
| Visible on all | `d-block` |
| Visible only on xs | `d-block d-sm-none` |
| Visible only on sm | `d-none d-sm-block d-md-none` |
| Visible only on md | `d-none d-md-block d-lg-none` |
| Visible only on lg | `d-none d-lg-block d-xl-none` |
| Visible only on xl | `d-none d-xl-block` |
## Display in print
Change the `display` value of elements when printing with our print display utilities.

5
index.html
View file

@ -34,7 +34,7 @@ layout: home
<!-- Icon by Bytesize https://github.com/danklammer/bytesize-icons -->
{% include icons/import.svg width="32" height="32" class="text-primary mb-2" %}
<h3>Installation</h3>
<p>Include Bootstrap's source Sass and JavaScript files via Bower, Composer, Meteor, or npm. Package managed installs don't include documentation, but do include our build system and readme.</p>
<p>Include Bootstrap's source Sass and JavaScript files via npm, Composer or Meteor. Package managed installs don't include documentation, but do include our build system and readme.</p>
{% highlight sh %}
npm install bootstrap@{{ site.current_version }}
@ -44,9 +44,6 @@ npm install bootstrap@{{ site.current_version }}
gem install bootstrap -v 4.0.0.beta
{% endhighlight %}
{% highlight sh %}
bower install bootstrap#v{{ site.current_version }}
{% endhighlight %}
<hr class="half-rule">
<a class="btn btn-outline-primary" href="{{ site.baseurl }}/docs/{{ site.docs_version }}/getting-started/download">Read installation docs</a>
</div>

178
js/dist/alert.js vendored
View file

@ -1,3 +1,5 @@
'use strict';
var _createClass = function () { function defineProperties(target, props) { for (var i = 0; i < props.length; i++) { var descriptor = props[i]; descriptor.enumerable = descriptor.enumerable || false; descriptor.configurable = true; if ("value" in descriptor) descriptor.writable = true; Object.defineProperty(target, descriptor.key, descriptor); } } return function (Constructor, protoProps, staticProps) { if (protoProps) defineProperties(Constructor.prototype, protoProps); if (staticProps) defineProperties(Constructor, staticProps); return Constructor; }; }();
function _classCallCheck(instance, Constructor) { if (!(instance instanceof Constructor)) { throw new TypeError("Cannot call a class as a function"); } }
@ -9,7 +11,7 @@ function _classCallCheck(instance, Constructor) { if (!(instance instanceof Cons
* --------------------------------------------------------------------------
*/
var Alert = function ($) {
var Alert = function () {
/**
* ------------------------------------------------------------------------
@ -56,98 +58,110 @@ var Alert = function ($) {
// getters
// public
_createClass(Alert, [{
key: 'close',
Alert.prototype.close = function close(element) {
element = element || this._element;
var rootElement = this._getRootElement(element);
var customEvent = this._triggerCloseEvent(rootElement);
// public
if (customEvent.isDefaultPrevented()) {
return;
}
value: function close(element) {
element = element || this._element;
this._removeElement(rootElement);
};
var rootElement = this._getRootElement(element);
var customEvent = this._triggerCloseEvent(rootElement);
Alert.prototype.dispose = function dispose() {
$.removeData(this._element, DATA_KEY);
this._element = null;
};
// private
Alert.prototype._getRootElement = function _getRootElement(element) {
var selector = Util.getSelectorFromElement(element);
var parent = false;
if (selector) {
parent = $(selector)[0];
}
if (!parent) {
parent = $(element).closest('.' + ClassName.ALERT)[0];
}
return parent;
};
Alert.prototype._triggerCloseEvent = function _triggerCloseEvent(element) {
var closeEvent = $.Event(Event.CLOSE);
$(element).trigger(closeEvent);
return closeEvent;
};
Alert.prototype._removeElement = function _removeElement(element) {
var _this = this;
$(element).removeClass(ClassName.SHOW);
if (!Util.supportsTransitionEnd() || !$(element).hasClass(ClassName.FADE)) {
this._destroyElement(element);
return;
}
$(element).one(Util.TRANSITION_END, function (event) {
return _this._destroyElement(element, event);
}).emulateTransitionEnd(TRANSITION_DURATION);
};
Alert.prototype._destroyElement = function _destroyElement(element) {
$(element).detach().trigger(Event.CLOSED).remove();
};
// static
Alert._jQueryInterface = function _jQueryInterface(config) {
return this.each(function () {
var $element = $(this);
var data = $element.data(DATA_KEY);
if (!data) {
data = new Alert(this);
$element.data(DATA_KEY, data);
if (customEvent.isDefaultPrevented()) {
return;
}
if (config === 'close') {
data[config](this);
}
});
};
this._removeElement(rootElement);
}
}, {
key: 'dispose',
value: function dispose() {
$.removeData(this._element, DATA_KEY);
this._element = null;
}
Alert._handleDismiss = function _handleDismiss(alertInstance) {
return function (event) {
if (event) {
event.preventDefault();
// private
}, {
key: '_getRootElement',
value: function _getRootElement(element) {
var selector = Util.getSelectorFromElement(element);
var parent = false;
if (selector) {
parent = $(selector)[0];
}
alertInstance.close(this);
};
};
if (!parent) {
parent = $(element).closest('.' + ClassName.ALERT)[0];
}
_createClass(Alert, null, [{
return parent;
}
}, {
key: '_triggerCloseEvent',
value: function _triggerCloseEvent(element) {
var closeEvent = $.Event(Event.CLOSE);
$(element).trigger(closeEvent);
return closeEvent;
}
}, {
key: '_removeElement',
value: function _removeElement(element) {
var _this = this;
$(element).removeClass(ClassName.SHOW);
if (!Util.supportsTransitionEnd() || !$(element).hasClass(ClassName.FADE)) {
this._destroyElement(element);
return;
}
$(element).one(Util.TRANSITION_END, function (event) {
return _this._destroyElement(element, event);
}).emulateTransitionEnd(TRANSITION_DURATION);
}
}, {
key: '_destroyElement',
value: function _destroyElement(element) {
$(element).detach().trigger(Event.CLOSED).remove();
}
// static
}], [{
key: '_jQueryInterface',
value: function _jQueryInterface(config) {
return this.each(function () {
var $element = $(this);
var data = $element.data(DATA_KEY);
if (!data) {
data = new Alert(this);
$element.data(DATA_KEY, data);
}
if (config === 'close') {
data[config](this);
}
});
}
}, {
key: '_handleDismiss',
value: function _handleDismiss(alertInstance) {
return function (event) {
if (event) {
event.preventDefault();
}
alertInstance.close(this);
};
}
}, {
key: 'VERSION',
get: function get() {
return VERSION;

BIN
js/dist/alert.js.map vendored
View file

Binary file not shown.

124
js/dist/button.js vendored
View file

@ -1,3 +1,5 @@
'use strict';
var _createClass = function () { function defineProperties(target, props) { for (var i = 0; i < props.length; i++) { var descriptor = props[i]; descriptor.enumerable = descriptor.enumerable || false; descriptor.configurable = true; if ("value" in descriptor) descriptor.writable = true; Object.defineProperty(target, descriptor.key, descriptor); } } return function (Constructor, protoProps, staticProps) { if (protoProps) defineProperties(Constructor.prototype, protoProps); if (staticProps) defineProperties(Constructor, staticProps); return Constructor; }; }();
function _classCallCheck(instance, Constructor) { if (!(instance instanceof Constructor)) { throw new TypeError("Cannot call a class as a function"); } }
@ -9,7 +11,7 @@ function _classCallCheck(instance, Constructor) { if (!(instance instanceof Cons
* --------------------------------------------------------------------------
*/
var Button = function ($) {
var Button = function () {
/**
* ------------------------------------------------------------------------
@ -58,74 +60,80 @@ var Button = function ($) {
// getters
// public
_createClass(Button, [{
key: 'toggle',
Button.prototype.toggle = function toggle() {
var triggerChangeEvent = true;
var addAriaPressed = true;
var rootElement = $(this._element).closest(Selector.DATA_TOGGLE)[0];
if (rootElement) {
var input = $(this._element).find(Selector.INPUT)[0];
// public
if (input) {
if (input.type === 'radio') {
if (input.checked && $(this._element).hasClass(ClassName.ACTIVE)) {
triggerChangeEvent = false;
} else {
var activeElement = $(rootElement).find(Selector.ACTIVE)[0];
value: function toggle() {
var triggerChangeEvent = true;
var addAriaPressed = true;
var rootElement = $(this._element).closest(Selector.DATA_TOGGLE)[0];
if (activeElement) {
$(activeElement).removeClass(ClassName.ACTIVE);
if (rootElement) {
var input = $(this._element).find(Selector.INPUT)[0];
if (input) {
if (input.type === 'radio') {
if (input.checked && $(this._element).hasClass(ClassName.ACTIVE)) {
triggerChangeEvent = false;
} else {
var activeElement = $(rootElement).find(Selector.ACTIVE)[0];
if (activeElement) {
$(activeElement).removeClass(ClassName.ACTIVE);
}
}
}
}
if (triggerChangeEvent) {
if (input.hasAttribute('disabled') || rootElement.hasAttribute('disabled') || input.classList.contains('disabled') || rootElement.classList.contains('disabled')) {
return;
if (triggerChangeEvent) {
if (input.hasAttribute('disabled') || rootElement.hasAttribute('disabled') || input.classList.contains('disabled') || rootElement.classList.contains('disabled')) {
return;
}
input.checked = !$(this._element).hasClass(ClassName.ACTIVE);
$(input).trigger('change');
}
input.checked = !$(this._element).hasClass(ClassName.ACTIVE);
$(input).trigger('change');
input.focus();
addAriaPressed = false;
}
}
if (addAriaPressed) {
this._element.setAttribute('aria-pressed', !$(this._element).hasClass(ClassName.ACTIVE));
}
if (triggerChangeEvent) {
$(this._element).toggleClass(ClassName.ACTIVE);
}
}
}, {
key: 'dispose',
value: function dispose() {
$.removeData(this._element, DATA_KEY);
this._element = null;
}
// static
}], [{
key: '_jQueryInterface',
value: function _jQueryInterface(config) {
return this.each(function () {
var data = $(this).data(DATA_KEY);
if (!data) {
data = new Button(this);
$(this).data(DATA_KEY, data);
}
input.focus();
addAriaPressed = false;
}
if (config === 'toggle') {
data[config]();
}
});
}
if (addAriaPressed) {
this._element.setAttribute('aria-pressed', !$(this._element).hasClass(ClassName.ACTIVE));
}
if (triggerChangeEvent) {
$(this._element).toggleClass(ClassName.ACTIVE);
}
};
Button.prototype.dispose = function dispose() {
$.removeData(this._element, DATA_KEY);
this._element = null;
};
// static
Button._jQueryInterface = function _jQueryInterface(config) {
return this.each(function () {
var data = $(this).data(DATA_KEY);
if (!data) {
data = new Button(this);
$(this).data(DATA_KEY, data);
}
if (config === 'toggle') {
data[config]();
}
});
};
_createClass(Button, null, [{
}, {
key: 'VERSION',
get: function get() {
return VERSION;

BIN
js/dist/button.js.map vendored
View file

Binary file not shown.

667
js/dist/carousel.js vendored
View file

@ -1,3 +1,5 @@
'use strict';
var _typeof = typeof Symbol === "function" && typeof Symbol.iterator === "symbol" ? function (obj) { return typeof obj; } : function (obj) { return obj && typeof Symbol === "function" && obj.constructor === Symbol && obj !== Symbol.prototype ? "symbol" : typeof obj; };
var _createClass = function () { function defineProperties(target, props) { for (var i = 0; i < props.length; i++) { var descriptor = props[i]; descriptor.enumerable = descriptor.enumerable || false; descriptor.configurable = true; if ("value" in descriptor) descriptor.writable = true; Object.defineProperty(target, descriptor.key, descriptor); } } return function (Constructor, protoProps, staticProps) { if (protoProps) defineProperties(Constructor.prototype, protoProps); if (staticProps) defineProperties(Constructor, staticProps); return Constructor; }; }();
@ -11,7 +13,7 @@ function _classCallCheck(instance, Constructor) { if (!(instance instanceof Cons
* --------------------------------------------------------------------------
*/
var Carousel = function ($) {
var Carousel = function () {
/**
* ------------------------------------------------------------------------
@ -113,360 +115,381 @@ var Carousel = function ($) {
// getters
// public
_createClass(Carousel, [{
key: 'next',
Carousel.prototype.next = function next() {
if (!this._isSliding) {
this._slide(Direction.NEXT);
// public
value: function next() {
if (!this._isSliding) {
this._slide(Direction.NEXT);
}
}
};
Carousel.prototype.nextWhenVisible = function nextWhenVisible() {
// Don't call next when the page isn't visible
// or the carousel or its parent isn't visible
if (!document.hidden && $(this._element).is(':visible') && $(this._element).css('visibility') !== 'hidden') {
this.next();
}, {
key: 'nextWhenVisible',
value: function nextWhenVisible() {
// Don't call next when the page isn't visible
// or the carousel or its parent isn't visible
if (!document.hidden && $(this._element).is(':visible') && $(this._element).css('visibility') !== 'hidden') {
this.next();
}
}
};
Carousel.prototype.prev = function prev() {
if (!this._isSliding) {
this._slide(Direction.PREV);
}, {
key: 'prev',
value: function prev() {
if (!this._isSliding) {
this._slide(Direction.PREV);
}
}
};
}, {
key: 'pause',
value: function pause(event) {
if (!event) {
this._isPaused = true;
}
Carousel.prototype.pause = function pause(event) {
if (!event) {
this._isPaused = true;
}
if ($(this._element).find(Selector.NEXT_PREV)[0] && Util.supportsTransitionEnd()) {
Util.triggerTransitionEnd(this._element);
this.cycle(true);
}
if ($(this._element).find(Selector.NEXT_PREV)[0] && Util.supportsTransitionEnd()) {
Util.triggerTransitionEnd(this._element);
this.cycle(true);
}
clearInterval(this._interval);
this._interval = null;
};
Carousel.prototype.cycle = function cycle(event) {
if (!event) {
this._isPaused = false;
}
if (this._interval) {
clearInterval(this._interval);
this._interval = null;
}
}, {
key: 'cycle',
value: function cycle(event) {
if (!event) {
this._isPaused = false;
}
if (this._config.interval && !this._isPaused) {
this._interval = setInterval((document.visibilityState ? this.nextWhenVisible : this.next).bind(this), this._config.interval);
if (this._interval) {
clearInterval(this._interval);
this._interval = null;
}
if (this._config.interval && !this._isPaused) {
this._interval = setInterval((document.visibilityState ? this.nextWhenVisible : this.next).bind(this), this._config.interval);
}
}
};
}, {
key: 'to',
value: function to(index) {
var _this = this;
Carousel.prototype.to = function to(index) {
var _this = this;
this._activeElement = $(this._element).find(Selector.ACTIVE_ITEM)[0];
this._activeElement = $(this._element).find(Selector.ACTIVE_ITEM)[0];
var activeIndex = this._getItemIndex(this._activeElement);
var activeIndex = this._getItemIndex(this._activeElement);
if (index > this._items.length - 1 || index < 0) {
return;
}
if (index > this._items.length - 1 || index < 0) {
return;
if (this._isSliding) {
$(this._element).one(Event.SLID, function () {
return _this.to(index);
});
return;
}
if (activeIndex === index) {
this.pause();
this.cycle();
return;
}
var direction = index > activeIndex ? Direction.NEXT : Direction.PREV;
this._slide(direction, this._items[index]);
}
}, {
key: 'dispose',
value: function dispose() {
$(this._element).off(EVENT_KEY);
$.removeData(this._element, DATA_KEY);
this._items = null;
this._config = null;
this._element = null;
this._interval = null;
this._isPaused = null;
this._isSliding = null;
this._activeElement = null;
this._indicatorsElement = null;
}
if (this._isSliding) {
$(this._element).one(Event.SLID, function () {
return _this.to(index);
});
return;
// private
}, {
key: '_getConfig',
value: function _getConfig(config) {
config = $.extend({}, Default, config);
Util.typeCheckConfig(NAME, config, DefaultType);
return config;
}
}, {
key: '_addEventListeners',
value: function _addEventListeners() {
var _this2 = this;
if (activeIndex === index) {
this.pause();
this.cycle();
return;
}
var direction = index > activeIndex ? Direction.NEXT : Direction.PREV;
this._slide(direction, this._items[index]);
};
Carousel.prototype.dispose = function dispose() {
$(this._element).off(EVENT_KEY);
$.removeData(this._element, DATA_KEY);
this._items = null;
this._config = null;
this._element = null;
this._interval = null;
this._isPaused = null;
this._isSliding = null;
this._activeElement = null;
this._indicatorsElement = null;
};
// private
Carousel.prototype._getConfig = function _getConfig(config) {
config = $.extend({}, Default, config);
Util.typeCheckConfig(NAME, config, DefaultType);
return config;
};
Carousel.prototype._addEventListeners = function _addEventListeners() {
var _this2 = this;
if (this._config.keyboard) {
$(this._element).on(Event.KEYDOWN, function (event) {
return _this2._keydown(event);
});
}
if (this._config.pause === 'hover') {
$(this._element).on(Event.MOUSEENTER, function (event) {
return _this2.pause(event);
}).on(Event.MOUSELEAVE, function (event) {
return _this2.cycle(event);
});
if ('ontouchstart' in document.documentElement) {
// if it's a touch-enabled device, mouseenter/leave are fired as
// part of the mouse compatibility events on first tap - the carousel
// would stop cycling until user tapped out of it;
// here, we listen for touchend, explicitly pause the carousel
// (as if it's the second time we tap on it, mouseenter compat event
// is NOT fired) and after a timeout (to allow for mouse compatibility
// events to fire) we explicitly restart cycling
$(this._element).on(Event.TOUCHEND, function () {
_this2.pause();
if (_this2.touchTimeout) {
clearTimeout(_this2.touchTimeout);
}
_this2.touchTimeout = setTimeout(function (event) {
return _this2.cycle(event);
}, TOUCHEVENT_COMPAT_WAIT + _this2._config.interval);
if (this._config.keyboard) {
$(this._element).on(Event.KEYDOWN, function (event) {
return _this2._keydown(event);
});
}
}
};
Carousel.prototype._keydown = function _keydown(event) {
if (/input|textarea/i.test(event.target.tagName)) {
return;
}
switch (event.which) {
case ARROW_LEFT_KEYCODE:
event.preventDefault();
this.prev();
break;
case ARROW_RIGHT_KEYCODE:
event.preventDefault();
this.next();
break;
default:
return;
}
};
Carousel.prototype._getItemIndex = function _getItemIndex(element) {
this._items = $.makeArray($(element).parent().find(Selector.ITEM));
return this._items.indexOf(element);
};
Carousel.prototype._getItemByDirection = function _getItemByDirection(direction, activeElement) {
var isNextDirection = direction === Direction.NEXT;
var isPrevDirection = direction === Direction.PREV;
var activeIndex = this._getItemIndex(activeElement);
var lastItemIndex = this._items.length - 1;
var isGoingToWrap = isPrevDirection && activeIndex === 0 || isNextDirection && activeIndex === lastItemIndex;
if (isGoingToWrap && !this._config.wrap) {
return activeElement;
}
var delta = direction === Direction.PREV ? -1 : 1;
var itemIndex = (activeIndex + delta) % this._items.length;
return itemIndex === -1 ? this._items[this._items.length - 1] : this._items[itemIndex];
};
Carousel.prototype._triggerSlideEvent = function _triggerSlideEvent(relatedTarget, eventDirectionName) {
var targetIndex = this._getItemIndex(relatedTarget);
var fromIndex = this._getItemIndex($(this._element).find(Selector.ACTIVE_ITEM)[0]);
var slideEvent = $.Event(Event.SLIDE, {
relatedTarget: relatedTarget,
direction: eventDirectionName,
from: fromIndex,
to: targetIndex
});
$(this._element).trigger(slideEvent);
return slideEvent;
};
Carousel.prototype._setActiveIndicatorElement = function _setActiveIndicatorElement(element) {
if (this._indicatorsElement) {
$(this._indicatorsElement).find(Selector.ACTIVE).removeClass(ClassName.ACTIVE);
var nextIndicator = this._indicatorsElement.children[this._getItemIndex(element)];
if (nextIndicator) {
$(nextIndicator).addClass(ClassName.ACTIVE);
}
}
};
Carousel.prototype._slide = function _slide(direction, element) {
var _this3 = this;
var activeElement = $(this._element).find(Selector.ACTIVE_ITEM)[0];
var activeElementIndex = this._getItemIndex(activeElement);
var nextElement = element || activeElement && this._getItemByDirection(direction, activeElement);
var nextElementIndex = this._getItemIndex(nextElement);
var isCycling = Boolean(this._interval);
var directionalClassName = void 0;
var orderClassName = void 0;
var eventDirectionName = void 0;
if (direction === Direction.NEXT) {
directionalClassName = ClassName.LEFT;
orderClassName = ClassName.NEXT;
eventDirectionName = Direction.LEFT;
} else {
directionalClassName = ClassName.RIGHT;
orderClassName = ClassName.PREV;
eventDirectionName = Direction.RIGHT;
}
if (nextElement && $(nextElement).hasClass(ClassName.ACTIVE)) {
this._isSliding = false;
return;
}
var slideEvent = this._triggerSlideEvent(nextElement, eventDirectionName);
if (slideEvent.isDefaultPrevented()) {
return;
}
if (!activeElement || !nextElement) {
// some weirdness is happening, so we bail
return;
}
this._isSliding = true;
if (isCycling) {
this.pause();
}
this._setActiveIndicatorElement(nextElement);
var slidEvent = $.Event(Event.SLID, {
relatedTarget: nextElement,
direction: eventDirectionName,
from: activeElementIndex,
to: nextElementIndex
});
if (Util.supportsTransitionEnd() && $(this._element).hasClass(ClassName.SLIDE)) {
$(nextElement).addClass(orderClassName);
Util.reflow(nextElement);
$(activeElement).addClass(directionalClassName);
$(nextElement).addClass(directionalClassName);
$(activeElement).one(Util.TRANSITION_END, function () {
$(nextElement).removeClass(directionalClassName + ' ' + orderClassName).addClass(ClassName.ACTIVE);
$(activeElement).removeClass(ClassName.ACTIVE + ' ' + orderClassName + ' ' + directionalClassName);
_this3._isSliding = false;
setTimeout(function () {
return $(_this3._element).trigger(slidEvent);
}, 0);
}).emulateTransitionEnd(TRANSITION_DURATION);
} else {
$(activeElement).removeClass(ClassName.ACTIVE);
$(nextElement).addClass(ClassName.ACTIVE);
this._isSliding = false;
$(this._element).trigger(slidEvent);
}
if (isCycling) {
this.cycle();
}
};
// static
Carousel._jQueryInterface = function _jQueryInterface(config) {
return this.each(function () {
var data = $(this).data(DATA_KEY);
var _config = $.extend({}, Default, $(this).data());
if ((typeof config === 'undefined' ? 'undefined' : _typeof(config)) === 'object') {
$.extend(_config, config);
}
var action = typeof config === 'string' ? config : _config.slide;
if (!data) {
data = new Carousel(this, _config);
$(this).data(DATA_KEY, data);
}
if (typeof config === 'number') {
data.to(config);
} else if (typeof action === 'string') {
if (data[action] === undefined) {
throw new Error('No method named "' + action + '"');
if (this._config.pause === 'hover') {
$(this._element).on(Event.MOUSEENTER, function (event) {
return _this2.pause(event);
}).on(Event.MOUSELEAVE, function (event) {
return _this2.cycle(event);
});
if ('ontouchstart' in document.documentElement) {
// if it's a touch-enabled device, mouseenter/leave are fired as
// part of the mouse compatibility events on first tap - the carousel
// would stop cycling until user tapped out of it;
// here, we listen for touchend, explicitly pause the carousel
// (as if it's the second time we tap on it, mouseenter compat event
// is NOT fired) and after a timeout (to allow for mouse compatibility
// events to fire) we explicitly restart cycling
$(this._element).on(Event.TOUCHEND, function () {
_this2.pause();
if (_this2.touchTimeout) {
clearTimeout(_this2.touchTimeout);
}
_this2.touchTimeout = setTimeout(function (event) {
return _this2.cycle(event);
}, TOUCHEVENT_COMPAT_WAIT + _this2._config.interval);
});
}
data[action]();
} else if (_config.interval) {
data.pause();
data.cycle();
}
});
};
}
}, {
key: '_keydown',
value: function _keydown(event) {
if (/input|textarea/i.test(event.target.tagName)) {
return;
}
Carousel._dataApiClickHandler = function _dataApiClickHandler(event) {
var selector = Util.getSelectorFromElement(this);
switch (event.which) {
case ARROW_LEFT_KEYCODE:
event.preventDefault();
this.prev();
break;
case ARROW_RIGHT_KEYCODE:
event.preventDefault();
this.next();
break;
default:
return;
}
}
}, {
key: '_getItemIndex',
value: function _getItemIndex(element) {
this._items = $.makeArray($(element).parent().find(Selector.ITEM));
return this._items.indexOf(element);
}
}, {
key: '_getItemByDirection',
value: function _getItemByDirection(direction, activeElement) {
var isNextDirection = direction === Direction.NEXT;
var isPrevDirection = direction === Direction.PREV;
var activeIndex = this._getItemIndex(activeElement);
var lastItemIndex = this._items.length - 1;
var isGoingToWrap = isPrevDirection && activeIndex === 0 || isNextDirection && activeIndex === lastItemIndex;
if (!selector) {
return;
if (isGoingToWrap && !this._config.wrap) {
return activeElement;
}
var delta = direction === Direction.PREV ? -1 : 1;
var itemIndex = (activeIndex + delta) % this._items.length;
return itemIndex === -1 ? this._items[this._items.length - 1] : this._items[itemIndex];
}
}, {
key: '_triggerSlideEvent',
value: function _triggerSlideEvent(relatedTarget, eventDirectionName) {
var targetIndex = this._getItemIndex(relatedTarget);
var fromIndex = this._getItemIndex($(this._element).find(Selector.ACTIVE_ITEM)[0]);
var slideEvent = $.Event(Event.SLIDE, {
relatedTarget: relatedTarget,
direction: eventDirectionName,
from: fromIndex,
to: targetIndex
});
$(this._element).trigger(slideEvent);
return slideEvent;
}
}, {
key: '_setActiveIndicatorElement',
value: function _setActiveIndicatorElement(element) {
if (this._indicatorsElement) {
$(this._indicatorsElement).find(Selector.ACTIVE).removeClass(ClassName.ACTIVE);
var nextIndicator = this._indicatorsElement.children[this._getItemIndex(element)];
if (nextIndicator) {
$(nextIndicator).addClass(ClassName.ACTIVE);
}
}
}
}, {
key: '_slide',
value: function _slide(direction, element) {
var _this3 = this;
var activeElement = $(this._element).find(Selector.ACTIVE_ITEM)[0];
var activeElementIndex = this._getItemIndex(activeElement);
var nextElement = element || activeElement && this._getItemByDirection(direction, activeElement);
var nextElementIndex = this._getItemIndex(nextElement);
var isCycling = Boolean(this._interval);
var directionalClassName = void 0;
var orderClassName = void 0;
var eventDirectionName = void 0;
if (direction === Direction.NEXT) {
directionalClassName = ClassName.LEFT;
orderClassName = ClassName.NEXT;
eventDirectionName = Direction.LEFT;
} else {
directionalClassName = ClassName.RIGHT;
orderClassName = ClassName.PREV;
eventDirectionName = Direction.RIGHT;
}
if (nextElement && $(nextElement).hasClass(ClassName.ACTIVE)) {
this._isSliding = false;
return;
}
var slideEvent = this._triggerSlideEvent(nextElement, eventDirectionName);
if (slideEvent.isDefaultPrevented()) {
return;
}
if (!activeElement || !nextElement) {
// some weirdness is happening, so we bail
return;
}
this._isSliding = true;
if (isCycling) {
this.pause();
}
this._setActiveIndicatorElement(nextElement);
var slidEvent = $.Event(Event.SLID, {
relatedTarget: nextElement,
direction: eventDirectionName,
from: activeElementIndex,
to: nextElementIndex
});
if (Util.supportsTransitionEnd() && $(this._element).hasClass(ClassName.SLIDE)) {
$(nextElement).addClass(orderClassName);
Util.reflow(nextElement);
$(activeElement).addClass(directionalClassName);
$(nextElement).addClass(directionalClassName);
$(activeElement).one(Util.TRANSITION_END, function () {
$(nextElement).removeClass(directionalClassName + ' ' + orderClassName).addClass(ClassName.ACTIVE);
$(activeElement).removeClass(ClassName.ACTIVE + ' ' + orderClassName + ' ' + directionalClassName);
_this3._isSliding = false;
setTimeout(function () {
return $(_this3._element).trigger(slidEvent);
}, 0);
}).emulateTransitionEnd(TRANSITION_DURATION);
} else {
$(activeElement).removeClass(ClassName.ACTIVE);
$(nextElement).addClass(ClassName.ACTIVE);
this._isSliding = false;
$(this._element).trigger(slidEvent);
}
if (isCycling) {
this.cycle();
}
}
var target = $(selector)[0];
// static
if (!target || !$(target).hasClass(ClassName.CAROUSEL)) {
return;
}], [{
key: '_jQueryInterface',
value: function _jQueryInterface(config) {
return this.each(function () {
var data = $(this).data(DATA_KEY);
var _config = $.extend({}, Default, $(this).data());
if ((typeof config === 'undefined' ? 'undefined' : _typeof(config)) === 'object') {
$.extend(_config, config);
}
var action = typeof config === 'string' ? config : _config.slide;
if (!data) {
data = new Carousel(this, _config);
$(this).data(DATA_KEY, data);
}
if (typeof config === 'number') {
data.to(config);
} else if (typeof action === 'string') {
if (typeof data[action] === 'undefined') {
throw new Error('No method named "' + action + '"');
}
data[action]();
} else if (_config.interval) {
data.pause();
data.cycle();
}
});
}
}, {
key: '_dataApiClickHandler',
value: function _dataApiClickHandler(event) {
var selector = Util.getSelectorFromElement(this);
var config = $.extend({}, $(target).data(), $(this).data());
var slideIndex = this.getAttribute('data-slide-to');
if (!selector) {
return;
}
if (slideIndex) {
config.interval = false;
var target = $(selector)[0];
if (!target || !$(target).hasClass(ClassName.CAROUSEL)) {
return;
}
var config = $.extend({}, $(target).data(), $(this).data());
var slideIndex = this.getAttribute('data-slide-to');
if (slideIndex) {
config.interval = false;
}
Carousel._jQueryInterface.call($(target), config);
if (slideIndex) {
$(target).data(DATA_KEY).to(slideIndex);
}
event.preventDefault();
}
Carousel._jQueryInterface.call($(target), config);
if (slideIndex) {
$(target).data(DATA_KEY).to(slideIndex);
}
event.preventDefault();
};
_createClass(Carousel, null, [{
}, {
key: 'VERSION',
get: function get() {
return VERSION;

BIN
js/dist/carousel.js.map vendored
View file

Binary file not shown.

390
js/dist/collapse.js vendored
View file

@ -1,3 +1,5 @@
'use strict';
var _typeof = typeof Symbol === "function" && typeof Symbol.iterator === "symbol" ? function (obj) { return typeof obj; } : function (obj) { return obj && typeof Symbol === "function" && obj.constructor === Symbol && obj !== Symbol.prototype ? "symbol" : typeof obj; };
var _createClass = function () { function defineProperties(target, props) { for (var i = 0; i < props.length; i++) { var descriptor = props[i]; descriptor.enumerable = descriptor.enumerable || false; descriptor.configurable = true; if ("value" in descriptor) descriptor.writable = true; Object.defineProperty(target, descriptor.key, descriptor); } } return function (Constructor, protoProps, staticProps) { if (protoProps) defineProperties(Constructor.prototype, protoProps); if (staticProps) defineProperties(Constructor, staticProps); return Constructor; }; }();
@ -11,7 +13,7 @@ function _classCallCheck(instance, Constructor) { if (!(instance instanceof Cons
* --------------------------------------------------------------------------
*/
var Collapse = function ($) {
var Collapse = function () {
/**
* ------------------------------------------------------------------------
@ -98,222 +100,237 @@ var Collapse = function ($) {
// getters
// public
_createClass(Collapse, [{
key: 'toggle',
Collapse.prototype.toggle = function toggle() {
if ($(this._element).hasClass(ClassName.SHOW)) {
this.hide();
} else {
this.show();
}
};
Collapse.prototype.show = function show() {
var _this = this;
// public
if (this._isTransitioning || $(this._element).hasClass(ClassName.SHOW)) {
return;
}
var actives = void 0;
var activesData = void 0;
if (this._parent) {
actives = $.makeArray($(this._parent).children().children(Selector.ACTIVES));
if (!actives.length) {
actives = null;
value: function toggle() {
if ($(this._element).hasClass(ClassName.SHOW)) {
this.hide();
} else {
this.show();
}
}
}, {
key: 'show',
value: function show() {
var _this = this;
if (actives) {
activesData = $(actives).data(DATA_KEY);
if (activesData && activesData._isTransitioning) {
if (this._isTransitioning || $(this._element).hasClass(ClassName.SHOW)) {
return;
}
}
var startEvent = $.Event(Event.SHOW);
$(this._element).trigger(startEvent);
if (startEvent.isDefaultPrevented()) {
return;
}
var actives = void 0;
var activesData = void 0;
if (actives) {
Collapse._jQueryInterface.call($(actives), 'hide');
if (!activesData) {
$(actives).data(DATA_KEY, null);
if (this._parent) {
actives = $.makeArray($(this._parent).children().children(Selector.ACTIVES));
if (!actives.length) {
actives = null;
}
}
if (actives) {
activesData = $(actives).data(DATA_KEY);
if (activesData && activesData._isTransitioning) {
return;
}
}
var startEvent = $.Event(Event.SHOW);
$(this._element).trigger(startEvent);
if (startEvent.isDefaultPrevented()) {
return;
}
if (actives) {
Collapse._jQueryInterface.call($(actives), 'hide');
if (!activesData) {
$(actives).data(DATA_KEY, null);
}
}
var dimension = this._getDimension();
$(this._element).removeClass(ClassName.COLLAPSE).addClass(ClassName.COLLAPSING);
this._element.style[dimension] = 0;
if (this._triggerArray.length) {
$(this._triggerArray).removeClass(ClassName.COLLAPSED).attr('aria-expanded', true);
}
this.setTransitioning(true);
var complete = function complete() {
$(_this._element).removeClass(ClassName.COLLAPSING).addClass(ClassName.COLLAPSE).addClass(ClassName.SHOW);
_this._element.style[dimension] = '';
_this.setTransitioning(false);
$(_this._element).trigger(Event.SHOWN);
};
if (!Util.supportsTransitionEnd()) {
complete();
return;
}
var capitalizedDimension = dimension[0].toUpperCase() + dimension.slice(1);
var scrollSize = 'scroll' + capitalizedDimension;
$(this._element).one(Util.TRANSITION_END, complete).emulateTransitionEnd(TRANSITION_DURATION);
this._element.style[dimension] = this._element[scrollSize] + 'px';
}
}, {
key: 'hide',
value: function hide() {
var _this2 = this;
var dimension = this._getDimension();
if (this._isTransitioning || !$(this._element).hasClass(ClassName.SHOW)) {
return;
}
$(this._element).removeClass(ClassName.COLLAPSE).addClass(ClassName.COLLAPSING);
var startEvent = $.Event(Event.HIDE);
$(this._element).trigger(startEvent);
if (startEvent.isDefaultPrevented()) {
return;
}
this._element.style[dimension] = 0;
var dimension = this._getDimension();
if (this._triggerArray.length) {
$(this._triggerArray).removeClass(ClassName.COLLAPSED).attr('aria-expanded', true);
}
this._element.style[dimension] = this._element.getBoundingClientRect()[dimension] + 'px';
this.setTransitioning(true);
Util.reflow(this._element);
var complete = function complete() {
$(_this._element).removeClass(ClassName.COLLAPSING).addClass(ClassName.COLLAPSE).addClass(ClassName.SHOW);
$(this._element).addClass(ClassName.COLLAPSING).removeClass(ClassName.COLLAPSE).removeClass(ClassName.SHOW);
_this._element.style[dimension] = '';
_this.setTransitioning(false);
$(_this._element).trigger(Event.SHOWN);
};
if (!Util.supportsTransitionEnd()) {
complete();
return;
}
var capitalizedDimension = dimension[0].toUpperCase() + dimension.slice(1);
var scrollSize = 'scroll' + capitalizedDimension;
$(this._element).one(Util.TRANSITION_END, complete).emulateTransitionEnd(TRANSITION_DURATION);
this._element.style[dimension] = this._element[scrollSize] + 'px';
};
Collapse.prototype.hide = function hide() {
var _this2 = this;
if (this._isTransitioning || !$(this._element).hasClass(ClassName.SHOW)) {
return;
}
var startEvent = $.Event(Event.HIDE);
$(this._element).trigger(startEvent);
if (startEvent.isDefaultPrevented()) {
return;
}
var dimension = this._getDimension();
this._element.style[dimension] = this._element.getBoundingClientRect()[dimension] + 'px';
Util.reflow(this._element);
$(this._element).addClass(ClassName.COLLAPSING).removeClass(ClassName.COLLAPSE).removeClass(ClassName.SHOW);
if (this._triggerArray.length) {
for (var i = 0; i < this._triggerArray.length; i++) {
var trigger = this._triggerArray[i];
var selector = Util.getSelectorFromElement(trigger);
if (selector !== null) {
var $elem = $(selector);
if (!$elem.hasClass(ClassName.SHOW)) {
$(trigger).addClass(ClassName.COLLAPSED).attr('aria-expanded', false);
if (this._triggerArray.length) {
for (var i = 0; i < this._triggerArray.length; i++) {
var trigger = this._triggerArray[i];
var selector = Util.getSelectorFromElement(trigger);
if (selector !== null) {
var $elem = $(selector);
if (!$elem.hasClass(ClassName.SHOW)) {
$(trigger).addClass(ClassName.COLLAPSED).attr('aria-expanded', false);
}
}
}
}
}
this.setTransitioning(true);
this.setTransitioning(true);
var complete = function complete() {
_this2.setTransitioning(false);
$(_this2._element).removeClass(ClassName.COLLAPSING).addClass(ClassName.COLLAPSE).trigger(Event.HIDDEN);
};
var complete = function complete() {
_this2.setTransitioning(false);
$(_this2._element).removeClass(ClassName.COLLAPSING).addClass(ClassName.COLLAPSE).trigger(Event.HIDDEN);
};
this._element.style[dimension] = '';
this._element.style[dimension] = '';
if (!Util.supportsTransitionEnd()) {
complete();
return;
}
$(this._element).one(Util.TRANSITION_END, complete).emulateTransitionEnd(TRANSITION_DURATION);
};
Collapse.prototype.setTransitioning = function setTransitioning(isTransitioning) {
this._isTransitioning = isTransitioning;
};
Collapse.prototype.dispose = function dispose() {
$.removeData(this._element, DATA_KEY);
this._config = null;
this._parent = null;
this._element = null;
this._triggerArray = null;
this._isTransitioning = null;
};
// private
Collapse.prototype._getConfig = function _getConfig(config) {
config = $.extend({}, Default, config);
config.toggle = Boolean(config.toggle); // coerce string values
Util.typeCheckConfig(NAME, config, DefaultType);
return config;
};
Collapse.prototype._getDimension = function _getDimension() {
var hasWidth = $(this._element).hasClass(Dimension.WIDTH);
return hasWidth ? Dimension.WIDTH : Dimension.HEIGHT;
};
Collapse.prototype._getParent = function _getParent() {
var _this3 = this;
var parent = $(this._config.parent)[0];
var selector = '[data-toggle="collapse"][data-parent="' + this._config.parent + '"]';
$(parent).find(selector).each(function (i, element) {
_this3._addAriaAndCollapsedClass(Collapse._getTargetFromElement(element), [element]);
});
return parent;
};
Collapse.prototype._addAriaAndCollapsedClass = function _addAriaAndCollapsedClass(element, triggerArray) {
if (element) {
var isOpen = $(element).hasClass(ClassName.SHOW);
if (triggerArray.length) {
$(triggerArray).toggleClass(ClassName.COLLAPSED, !isOpen).attr('aria-expanded', isOpen);
}
}
};
// static
Collapse._getTargetFromElement = function _getTargetFromElement(element) {
var selector = Util.getSelectorFromElement(element);
return selector ? $(selector)[0] : null;
};
Collapse._jQueryInterface = function _jQueryInterface(config) {
return this.each(function () {
var $this = $(this);
var data = $this.data(DATA_KEY);
var _config = $.extend({}, Default, $this.data(), (typeof config === 'undefined' ? 'undefined' : _typeof(config)) === 'object' && config);
if (!data && _config.toggle && /show|hide/.test(config)) {
_config.toggle = false;
if (!Util.supportsTransitionEnd()) {
complete();
return;
}
if (!data) {
data = new Collapse(this, _config);
$this.data(DATA_KEY, data);
}
$(this._element).one(Util.TRANSITION_END, complete).emulateTransitionEnd(TRANSITION_DURATION);
}
}, {
key: 'setTransitioning',
value: function setTransitioning(isTransitioning) {
this._isTransitioning = isTransitioning;
}
}, {
key: 'dispose',
value: function dispose() {
$.removeData(this._element, DATA_KEY);
if (typeof config === 'string') {
if (data[config] === undefined) {
throw new Error('No method named "' + config + '"');
this._config = null;
this._parent = null;
this._element = null;
this._triggerArray = null;
this._isTransitioning = null;
}
// private
}, {
key: '_getConfig',
value: function _getConfig(config) {
config = $.extend({}, Default, config);
config.toggle = Boolean(config.toggle); // coerce string values
Util.typeCheckConfig(NAME, config, DefaultType);
return config;
}
}, {
key: '_getDimension',
value: function _getDimension() {
var hasWidth = $(this._element).hasClass(Dimension.WIDTH);
return hasWidth ? Dimension.WIDTH : Dimension.HEIGHT;
}
}, {
key: '_getParent',
value: function _getParent() {
var _this3 = this;
var parent = $(this._config.parent)[0];
var selector = '[data-toggle="collapse"][data-parent="' + this._config.parent + '"]';
$(parent).find(selector).each(function (i, element) {
_this3._addAriaAndCollapsedClass(Collapse._getTargetFromElement(element), [element]);
});
return parent;
}
}, {
key: '_addAriaAndCollapsedClass',
value: function _addAriaAndCollapsedClass(element, triggerArray) {
if (element) {
var isOpen = $(element).hasClass(ClassName.SHOW);
if (triggerArray.length) {
$(triggerArray).toggleClass(ClassName.COLLAPSED, !isOpen).attr('aria-expanded', isOpen);
}
data[config]();
}
});
};
}
_createClass(Collapse, null, [{
// static
}], [{
key: '_getTargetFromElement',
value: function _getTargetFromElement(element) {
var selector = Util.getSelectorFromElement(element);
return selector ? $(selector)[0] : null;
}
}, {
key: '_jQueryInterface',
value: function _jQueryInterface(config) {
return this.each(function () {
var $this = $(this);
var data = $this.data(DATA_KEY);
var _config = $.extend({}, Default, $this.data(), (typeof config === 'undefined' ? 'undefined' : _typeof(config)) === 'object' && config);
if (!data && _config.toggle && /show|hide/.test(config)) {
_config.toggle = false;
}
if (!data) {
data = new Collapse(this, _config);
$this.data(DATA_KEY, data);
}
if (typeof config === 'string') {
if (typeof data[config] === 'undefined') {
throw new Error('No method named "' + config + '"');
}
data[config]();
}
});
}
}, {
key: 'VERSION',
get: function get() {
return VERSION;
@ -335,7 +352,8 @@ var Collapse = function ($) {
*/
$(document).on(Event.CLICK_DATA_API, Selector.DATA_TOGGLE, function (event) {
if (!/input|textarea/i.test(event.target.tagName)) {
// preventDefault only for <a> elements (which change the URL) not inside the collapsible element
if (event.currentTarget.tagName === 'A') {
event.preventDefault();
}

BIN
js/dist/collapse.js.map vendored
View file

Binary file not shown.

492
js/dist/dropdown.js vendored
View file

@ -1,3 +1,5 @@
'use strict';
var _typeof = typeof Symbol === "function" && typeof Symbol.iterator === "symbol" ? function (obj) { return typeof obj; } : function (obj) { return obj && typeof Symbol === "function" && obj.constructor === Symbol && obj !== Symbol.prototype ? "symbol" : typeof obj; };
var _createClass = function () { function defineProperties(target, props) { for (var i = 0; i < props.length; i++) { var descriptor = props[i]; descriptor.enumerable = descriptor.enumerable || false; descriptor.configurable = true; if ("value" in descriptor) descriptor.writable = true; Object.defineProperty(target, descriptor.key, descriptor); } } return function (Constructor, protoProps, staticProps) { if (protoProps) defineProperties(Constructor.prototype, protoProps); if (staticProps) defineProperties(Constructor, staticProps); return Constructor; }; }();
@ -11,7 +13,7 @@ function _classCallCheck(instance, Constructor) { if (!(instance instanceof Cons
* --------------------------------------------------------------------------
*/
var Dropdown = function ($) {
var Dropdown = function () {
/**
* Check for Popper dependency
@ -76,13 +78,11 @@ var Dropdown = function ($) {
};
var Default = {
placement: AttachmentMap.BOTTOM,
offset: 0,
flip: true
};
var DefaultType = {
placement: 'string',
offset: '(number|string)',
flip: 'boolean'
@ -108,278 +108,290 @@ var Dropdown = function ($) {
// getters
// public
_createClass(Dropdown, [{
key: 'toggle',
Dropdown.prototype.toggle = function toggle() {
if (this._element.disabled || $(this._element).hasClass(ClassName.DISABLED)) {
return;
// public
value: function toggle() {
if (this._element.disabled || $(this._element).hasClass(ClassName.DISABLED)) {
return;
}
var parent = Dropdown._getParentFromElement(this._element);
var isActive = $(this._menu).hasClass(ClassName.SHOW);
Dropdown._clearMenus();
if (isActive) {
return;
}
var relatedTarget = {
relatedTarget: this._element
};
var showEvent = $.Event(Event.SHOW, relatedTarget);
$(parent).trigger(showEvent);
if (showEvent.isDefaultPrevented()) {
return;
}
var element = this._element;
// for dropup with alignment we use the parent as popper container
if ($(parent).hasClass(ClassName.DROPUP)) {
if ($(this._menu).hasClass(ClassName.MENULEFT) || $(this._menu).hasClass(ClassName.MENURIGHT)) {
element = parent;
}
}
this._popper = new Popper(element, this._menu, this._getPopperConfig());
// if this is a touch-enabled device we add extra
// empty mouseover listeners to the body's immediate children;
// only needed because of broken event delegation on iOS
// https://www.quirksmode.org/blog/archives/2014/02/mouse_event_bub.html
if ('ontouchstart' in document.documentElement && !$(parent).closest(Selector.NAVBAR_NAV).length) {
$('body').children().on('mouseover', null, $.noop);
}
this._element.focus();
this._element.setAttribute('aria-expanded', true);
$(this._menu).toggleClass(ClassName.SHOW);
$(parent).toggleClass(ClassName.SHOW).trigger($.Event(Event.SHOWN, relatedTarget));
}
var parent = Dropdown._getParentFromElement(this._element);
var isActive = $(this._menu).hasClass(ClassName.SHOW);
Dropdown._clearMenus();
if (isActive) {
return;
}, {
key: 'dispose',
value: function dispose() {
$.removeData(this._element, DATA_KEY);
$(this._element).off(EVENT_KEY);
this._element = null;
this._menu = null;
if (this._popper !== null) {
this._popper.destroy();
}
this._popper = null;
}
var relatedTarget = {
relatedTarget: this._element
};
var showEvent = $.Event(Event.SHOW, relatedTarget);
$(parent).trigger(showEvent);
if (showEvent.isDefaultPrevented()) {
return;
}
var element = this._element;
// for dropup with alignment we use the parent as popper container
if ($(parent).hasClass(ClassName.DROPUP)) {
if ($(this._menu).hasClass(ClassName.MENULEFT) || $(this._menu).hasClass(ClassName.MENURIGHT)) {
element = parent;
}, {
key: 'update',
value: function update() {
this._inNavbar = this._detectNavbar();
if (this._popper !== null) {
this._popper.scheduleUpdate();
}
}
this._popper = new Popper(element, this._menu, this._getPopperConfig());
// if this is a touch-enabled device we add extra
// empty mouseover listeners to the body's immediate children;
// only needed because of broken event delegation on iOS
// https://www.quirksmode.org/blog/archives/2014/02/mouse_event_bub.html
if ('ontouchstart' in document.documentElement && !$(parent).closest(Selector.NAVBAR_NAV).length) {
$('body').children().on('mouseover', null, $.noop);
// private
}, {
key: '_addEventListeners',
value: function _addEventListeners() {
var _this = this;
$(this._element).on(Event.CLICK, function (event) {
event.preventDefault();
event.stopPropagation();
_this.toggle();
});
}
}, {
key: '_getConfig',
value: function _getConfig(config) {
config = $.extend({}, this.constructor.Default, $(this._element).data(), config);
Util.typeCheckConfig(NAME, config, this.constructor.DefaultType);
return config;
}
}, {
key: '_getMenuElement',
value: function _getMenuElement() {
if (!this._menu) {
var parent = Dropdown._getParentFromElement(this._element);
this._menu = $(parent).find(Selector.MENU)[0];
}
return this._menu;
}
}, {
key: '_getPlacement',
value: function _getPlacement() {
var $parentDropdown = $(this._element).parent();
var placement = AttachmentMap.BOTTOM;
// Handle dropup
if ($parentDropdown.hasClass(ClassName.DROPUP)) {
placement = AttachmentMap.TOP;
if ($(this._menu).hasClass(ClassName.MENURIGHT)) {
placement = AttachmentMap.TOPEND;
}
} else if ($(this._menu).hasClass(ClassName.MENURIGHT)) {
placement = AttachmentMap.BOTTOMEND;
}
return placement;
}
}, {
key: '_detectNavbar',
value: function _detectNavbar() {
return $(this._element).closest('.navbar').length > 0;
}
}, {
key: '_getPopperConfig',
value: function _getPopperConfig() {
var popperConfig = {
placement: this._getPlacement(),
modifiers: {
offset: {
offset: this._config.offset
},
flip: {
enabled: this._config.flip
}
}
// Disable Popper.js for Dropdown in Navbar
};if (this._inNavbar) {
popperConfig.modifiers.applyStyle = {
enabled: !this._inNavbar
};
}
return popperConfig;
}
this._element.focus();
this._element.setAttribute('aria-expanded', true);
// static
$(this._menu).toggleClass(ClassName.SHOW);
$(parent).toggleClass(ClassName.SHOW).trigger($.Event(Event.SHOWN, relatedTarget));
};
}], [{
key: '_jQueryInterface',
value: function _jQueryInterface(config) {
return this.each(function () {
var data = $(this).data(DATA_KEY);
var _config = (typeof config === 'undefined' ? 'undefined' : _typeof(config)) === 'object' ? config : null;
Dropdown.prototype.dispose = function dispose() {
$.removeData(this._element, DATA_KEY);
$(this._element).off(EVENT_KEY);
this._element = null;
this._menu = null;
if (this._popper !== null) {
this._popper.destroy();
if (!data) {
data = new Dropdown(this, _config);
$(this).data(DATA_KEY, data);
}
if (typeof config === 'string') {
if (typeof data[config] === 'undefined') {
throw new Error('No method named "' + config + '"');
}
data[config]();
}
});
}
this._popper = null;
};
}, {
key: '_clearMenus',
value: function _clearMenus(event) {
if (event && (event.which === RIGHT_MOUSE_BUTTON_WHICH || event.type === 'keyup' && event.which !== TAB_KEYCODE)) {
return;
}
Dropdown.prototype.update = function update() {
this._inNavbar = this._detectNavbar();
if (this._popper !== null) {
this._popper.scheduleUpdate();
var toggles = $.makeArray($(Selector.DATA_TOGGLE));
for (var i = 0; i < toggles.length; i++) {
var parent = Dropdown._getParentFromElement(toggles[i]);
var context = $(toggles[i]).data(DATA_KEY);
var relatedTarget = {
relatedTarget: toggles[i]
};
if (!context) {
continue;
}
var dropdownMenu = context._menu;
if (!$(parent).hasClass(ClassName.SHOW)) {
continue;
}
if (event && (event.type === 'click' && /input|textarea/i.test(event.target.tagName) || event.type === 'keyup' && event.which === TAB_KEYCODE) && $.contains(parent, event.target)) {
continue;
}
var hideEvent = $.Event(Event.HIDE, relatedTarget);
$(parent).trigger(hideEvent);
if (hideEvent.isDefaultPrevented()) {
continue;
}
// if this is a touch-enabled device we remove the extra
// empty mouseover listeners we added for iOS support
if ('ontouchstart' in document.documentElement) {
$('body').children().off('mouseover', null, $.noop);
}
toggles[i].setAttribute('aria-expanded', 'false');
$(dropdownMenu).removeClass(ClassName.SHOW);
$(parent).removeClass(ClassName.SHOW).trigger($.Event(Event.HIDDEN, relatedTarget));
}
}
};
}, {
key: '_getParentFromElement',
value: function _getParentFromElement(element) {
var parent = void 0;
var selector = Util.getSelectorFromElement(element);
// private
if (selector) {
parent = $(selector)[0];
}
Dropdown.prototype._addEventListeners = function _addEventListeners() {
var _this = this;
return parent || element.parentNode;
}
}, {
key: '_dataApiKeydownHandler',
value: function _dataApiKeydownHandler(event) {
if (!REGEXP_KEYDOWN.test(event.which) || /button/i.test(event.target.tagName) && event.which === SPACE_KEYCODE || /input|textarea/i.test(event.target.tagName)) {
return;
}
$(this._element).on(Event.CLICK, function (event) {
event.preventDefault();
event.stopPropagation();
_this.toggle();
});
};
Dropdown.prototype._getConfig = function _getConfig(config) {
var elementData = $(this._element).data();
if (elementData.placement !== undefined) {
elementData.placement = AttachmentMap[elementData.placement.toUpperCase()];
}
config = $.extend({}, this.constructor.Default, $(this._element).data(), config);
Util.typeCheckConfig(NAME, config, this.constructor.DefaultType);
return config;
};
Dropdown.prototype._getMenuElement = function _getMenuElement() {
if (!this._menu) {
var parent = Dropdown._getParentFromElement(this._element);
this._menu = $(parent).find(Selector.MENU)[0];
}
return this._menu;
};
Dropdown.prototype._getPlacement = function _getPlacement() {
var $parentDropdown = $(this._element).parent();
var placement = this._config.placement;
// Handle dropup
if ($parentDropdown.hasClass(ClassName.DROPUP) || this._config.placement === AttachmentMap.TOP) {
placement = AttachmentMap.TOP;
if ($(this._menu).hasClass(ClassName.MENURIGHT)) {
placement = AttachmentMap.TOPEND;
if (this.disabled || $(this).hasClass(ClassName.DISABLED)) {
return;
}
} else if ($(this._menu).hasClass(ClassName.MENURIGHT)) {
placement = AttachmentMap.BOTTOMEND;
}
return placement;
};
Dropdown.prototype._detectNavbar = function _detectNavbar() {
return $(this._element).closest('.navbar').length > 0;
};
var parent = Dropdown._getParentFromElement(this);
var isActive = $(parent).hasClass(ClassName.SHOW);
Dropdown.prototype._getPopperConfig = function _getPopperConfig() {
var popperConfig = {
placement: this._getPlacement(),
modifiers: {
offset: {
offset: this._config.offset
},
flip: {
enabled: this._config.flip
if (!isActive && (event.which !== ESCAPE_KEYCODE || event.which !== SPACE_KEYCODE) || isActive && (event.which === ESCAPE_KEYCODE || event.which === SPACE_KEYCODE)) {
if (event.which === ESCAPE_KEYCODE) {
var toggle = $(parent).find(Selector.DATA_TOGGLE)[0];
$(toggle).trigger('focus');
}
$(this).trigger('click');
return;
}
// Disable Popper.js for Dropdown in Navbar
};if (this._inNavbar) {
popperConfig.modifiers.applyStyle = {
enabled: !this._inNavbar
};
}
return popperConfig;
};
var items = $(parent).find(Selector.VISIBLE_ITEMS).get();
// static
Dropdown._jQueryInterface = function _jQueryInterface(config) {
return this.each(function () {
var data = $(this).data(DATA_KEY);
var _config = (typeof config === 'undefined' ? 'undefined' : _typeof(config)) === 'object' ? config : null;
if (!data) {
data = new Dropdown(this, _config);
$(this).data(DATA_KEY, data);
if (!items.length) {
return;
}
if (typeof config === 'string') {
if (data[config] === undefined) {
throw new Error('No method named "' + config + '"');
}
data[config]();
}
});
};
var index = items.indexOf(event.target);
Dropdown._clearMenus = function _clearMenus(event) {
if (event && (event.which === RIGHT_MOUSE_BUTTON_WHICH || event.type === 'keyup' && event.which !== TAB_KEYCODE)) {
return;
}
var toggles = $.makeArray($(Selector.DATA_TOGGLE));
for (var i = 0; i < toggles.length; i++) {
var parent = Dropdown._getParentFromElement(toggles[i]);
var context = $(toggles[i]).data(DATA_KEY);
var relatedTarget = {
relatedTarget: toggles[i]
};
if (!context) {
continue;
if (event.which === ARROW_UP_KEYCODE && index > 0) {
// up
index--;
}
var dropdownMenu = context._menu;
if (!$(parent).hasClass(ClassName.SHOW)) {
continue;
if (event.which === ARROW_DOWN_KEYCODE && index < items.length - 1) {
// down
index++;
}
if (event && (event.type === 'click' && /input|textarea/i.test(event.target.tagName) || event.type === 'keyup' && event.which === TAB_KEYCODE) && $.contains(parent, event.target)) {
continue;
if (index < 0) {
index = 0;
}
var hideEvent = $.Event(Event.HIDE, relatedTarget);
$(parent).trigger(hideEvent);
if (hideEvent.isDefaultPrevented()) {
continue;
}
// if this is a touch-enabled device we remove the extra
// empty mouseover listeners we added for iOS support
if ('ontouchstart' in document.documentElement) {
$('body').children().off('mouseover', null, $.noop);
}
toggles[i].setAttribute('aria-expanded', 'false');
$(dropdownMenu).removeClass(ClassName.SHOW);
$(parent).removeClass(ClassName.SHOW).trigger($.Event(Event.HIDDEN, relatedTarget));
items[index].focus();
}
};
Dropdown._getParentFromElement = function _getParentFromElement(element) {
var parent = void 0;
var selector = Util.getSelectorFromElement(element);
if (selector) {
parent = $(selector)[0];
}
return parent || element.parentNode;
};
Dropdown._dataApiKeydownHandler = function _dataApiKeydownHandler(event) {
if (!REGEXP_KEYDOWN.test(event.which) || /button/i.test(event.target.tagName) && event.which === SPACE_KEYCODE || /input|textarea/i.test(event.target.tagName)) {
return;
}
event.preventDefault();
event.stopPropagation();
if (this.disabled || $(this).hasClass(ClassName.DISABLED)) {
return;
}
var parent = Dropdown._getParentFromElement(this);
var isActive = $(parent).hasClass(ClassName.SHOW);
if (!isActive && (event.which !== ESCAPE_KEYCODE || event.which !== SPACE_KEYCODE) || isActive && (event.which === ESCAPE_KEYCODE || event.which === SPACE_KEYCODE)) {
if (event.which === ESCAPE_KEYCODE) {
var toggle = $(parent).find(Selector.DATA_TOGGLE)[0];
$(toggle).trigger('focus');
}
$(this).trigger('click');
return;
}
var items = $(parent).find(Selector.VISIBLE_ITEMS).get();
if (!items.length) {
return;
}
var index = items.indexOf(event.target);
if (event.which === ARROW_UP_KEYCODE && index > 0) {
// up
index--;
}
if (event.which === ARROW_DOWN_KEYCODE && index < items.length - 1) {
// down
index++;
}
if (index < 0) {
index = 0;
}
items[index].focus();
};
_createClass(Dropdown, null, [{
}, {
key: 'VERSION',
get: function get() {
return VERSION;
@ -427,5 +439,5 @@ var Dropdown = function ($) {
};
return Dropdown;
}(jQuery); /* global Popper */
}(jQuery, Popper);
//# sourceMappingURL=dropdown.js.map

BIN
js/dist/dropdown.js.map vendored
View file

Binary file not shown.

22
js/dist/index.js vendored Normal file
View file

@ -0,0 +1,22 @@
'use strict';
/**
* --------------------------------------------------------------------------
* Bootstrap (v4.0.0-alpha.6): index.js
* Licensed under MIT (https://github.com/twbs/bootstrap/blob/master/LICENSE)
* --------------------------------------------------------------------------
*/
(function () {
if (typeof jQuery === 'undefined') {
throw new Error('Bootstrap\'s JavaScript requires jQuery. jQuery must be included before Bootstrap\'s JavaScript.');
}
var version = $.fn.jquery.split(' ')[0].split('.');
var min = 3;
var max = 4;
if (version[0] < min || version[0] >= max) {
throw new Error('Bootstrap\'s JavaScript requires at least jQuery v3.0.0 but less than v4.0.0');
}
})(jQuery);
//# sourceMappingURL=index.js.map

BIN
js/dist/index.js.map vendored Normal file
View file

Binary file not shown.

810
js/dist/modal.js vendored
View file

@ -1,3 +1,5 @@
'use strict';
var _typeof = typeof Symbol === "function" && typeof Symbol.iterator === "symbol" ? function (obj) { return typeof obj; } : function (obj) { return obj && typeof Symbol === "function" && obj.constructor === Symbol && obj !== Symbol.prototype ? "symbol" : typeof obj; };
var _createClass = function () { function defineProperties(target, props) { for (var i = 0; i < props.length; i++) { var descriptor = props[i]; descriptor.enumerable = descriptor.enumerable || false; descriptor.configurable = true; if ("value" in descriptor) descriptor.writable = true; Object.defineProperty(target, descriptor.key, descriptor); } } return function (Constructor, protoProps, staticProps) { if (protoProps) defineProperties(Constructor.prototype, protoProps); if (staticProps) defineProperties(Constructor, staticProps); return Constructor; }; }();
@ -11,7 +13,7 @@ function _classCallCheck(instance, Constructor) { if (!(instance instanceof Cons
* --------------------------------------------------------------------------
*/
var Modal = function ($) {
var Modal = function () {
/**
* ------------------------------------------------------------------------
@ -70,6 +72,7 @@ var Modal = function ($) {
DATA_TOGGLE: '[data-toggle="modal"]',
DATA_DISMISS: '[data-dismiss="modal"]',
FIXED_CONTENT: '.fixed-top, .fixed-bottom, .is-fixed, .sticky-top',
STICKY_CONTENT: '.sticky-top',
NAVBAR_TOGGLER: '.navbar-toggler'
/**
@ -96,417 +99,452 @@ var Modal = function ($) {
// getters
// public
_createClass(Modal, [{
key: 'toggle',
Modal.prototype.toggle = function toggle(relatedTarget) {
return this._isShown ? this.hide() : this.show(relatedTarget);
};
Modal.prototype.show = function show(relatedTarget) {
var _this = this;
// public
if (this._isTransitioning) {
return;
value: function toggle(relatedTarget) {
return this._isShown ? this.hide() : this.show(relatedTarget);
}
}, {
key: 'show',
value: function show(relatedTarget) {
var _this = this;
if (Util.supportsTransitionEnd() && $(this._element).hasClass(ClassName.FADE)) {
this._isTransitioning = true;
}
var showEvent = $.Event(Event.SHOW, {
relatedTarget: relatedTarget
});
$(this._element).trigger(showEvent);
if (this._isShown || showEvent.isDefaultPrevented()) {
return;
}
this._isShown = true;
this._checkScrollbar();
this._setScrollbar();
$(document.body).addClass(ClassName.OPEN);
this._setEscapeEvent();
this._setResizeEvent();
$(this._element).on(Event.CLICK_DISMISS, Selector.DATA_DISMISS, function (event) {
return _this.hide(event);
});
$(this._dialog).on(Event.MOUSEDOWN_DISMISS, function () {
$(_this._element).one(Event.MOUSEUP_DISMISS, function (event) {
if ($(event.target).is(_this._element)) {
_this._ignoreBackdropClick = true;
}
});
});
this._showBackdrop(function () {
return _this._showElement(relatedTarget);
});
};
Modal.prototype.hide = function hide(event) {
var _this2 = this;
if (event) {
event.preventDefault();
}
if (this._isTransitioning || !this._isShown) {
return;
}
var transition = Util.supportsTransitionEnd() && $(this._element).hasClass(ClassName.FADE);
if (transition) {
this._isTransitioning = true;
}
var hideEvent = $.Event(Event.HIDE);
$(this._element).trigger(hideEvent);
if (!this._isShown || hideEvent.isDefaultPrevented()) {
return;
}
this._isShown = false;
this._setEscapeEvent();
this._setResizeEvent();
$(document).off(Event.FOCUSIN);
$(this._element).removeClass(ClassName.SHOW);
$(this._element).off(Event.CLICK_DISMISS);
$(this._dialog).off(Event.MOUSEDOWN_DISMISS);
if (transition) {
$(this._element).one(Util.TRANSITION_END, function (event) {
return _this2._hideModal(event);
}).emulateTransitionEnd(TRANSITION_DURATION);
} else {
this._hideModal();
}
};
Modal.prototype.dispose = function dispose() {
$.removeData(this._element, DATA_KEY);
$(window, document, this._element, this._backdrop).off(EVENT_KEY);
this._config = null;
this._element = null;
this._dialog = null;
this._backdrop = null;
this._isShown = null;
this._isBodyOverflowing = null;
this._ignoreBackdropClick = null;
this._scrollbarWidth = null;
};
Modal.prototype.handleUpdate = function handleUpdate() {
this._adjustDialog();
};
// private
Modal.prototype._getConfig = function _getConfig(config) {
config = $.extend({}, Default, config);
Util.typeCheckConfig(NAME, config, DefaultType);
return config;
};
Modal.prototype._showElement = function _showElement(relatedTarget) {
var _this3 = this;
var transition = Util.supportsTransitionEnd() && $(this._element).hasClass(ClassName.FADE);
if (!this._element.parentNode || this._element.parentNode.nodeType !== Node.ELEMENT_NODE) {
// don't move modals dom position
document.body.appendChild(this._element);
}
this._element.style.display = 'block';
this._element.removeAttribute('aria-hidden');
this._element.scrollTop = 0;
if (transition) {
Util.reflow(this._element);
}
$(this._element).addClass(ClassName.SHOW);
if (this._config.focus) {
this._enforceFocus();
}
var shownEvent = $.Event(Event.SHOWN, {
relatedTarget: relatedTarget
});
var transitionComplete = function transitionComplete() {
if (_this3._config.focus) {
_this3._element.focus();
}
_this3._isTransitioning = false;
$(_this3._element).trigger(shownEvent);
};
if (transition) {
$(this._dialog).one(Util.TRANSITION_END, transitionComplete).emulateTransitionEnd(TRANSITION_DURATION);
} else {
transitionComplete();
}
};
Modal.prototype._enforceFocus = function _enforceFocus() {
var _this4 = this;
$(document).off(Event.FOCUSIN) // guard against infinite focus loop
.on(Event.FOCUSIN, function (event) {
if (document !== event.target && _this4._element !== event.target && !$(_this4._element).has(event.target).length) {
_this4._element.focus();
}
});
};
Modal.prototype._setEscapeEvent = function _setEscapeEvent() {
var _this5 = this;
if (this._isShown && this._config.keyboard) {
$(this._element).on(Event.KEYDOWN_DISMISS, function (event) {
if (event.which === ESCAPE_KEYCODE) {
event.preventDefault();
_this5.hide();
}
});
} else if (!this._isShown) {
$(this._element).off(Event.KEYDOWN_DISMISS);
}
};
Modal.prototype._setResizeEvent = function _setResizeEvent() {
var _this6 = this;
if (this._isShown) {
$(window).on(Event.RESIZE, function (event) {
return _this6.handleUpdate(event);
});
} else {
$(window).off(Event.RESIZE);
}
};
Modal.prototype._hideModal = function _hideModal() {
var _this7 = this;
this._element.style.display = 'none';
this._element.setAttribute('aria-hidden', true);
this._isTransitioning = false;
this._showBackdrop(function () {
$(document.body).removeClass(ClassName.OPEN);
_this7._resetAdjustments();
_this7._resetScrollbar();
$(_this7._element).trigger(Event.HIDDEN);
});
};
Modal.prototype._removeBackdrop = function _removeBackdrop() {
if (this._backdrop) {
$(this._backdrop).remove();
this._backdrop = null;
}
};
Modal.prototype._showBackdrop = function _showBackdrop(callback) {
var _this8 = this;
var animate = $(this._element).hasClass(ClassName.FADE) ? ClassName.FADE : '';
if (this._isShown && this._config.backdrop) {
var doAnimate = Util.supportsTransitionEnd() && animate;
this._backdrop = document.createElement('div');
this._backdrop.className = ClassName.BACKDROP;
if (animate) {
$(this._backdrop).addClass(animate);
}
$(this._backdrop).appendTo(document.body);
$(this._element).on(Event.CLICK_DISMISS, function (event) {
if (_this8._ignoreBackdropClick) {
_this8._ignoreBackdropClick = false;
return;
}
if (event.target !== event.currentTarget) {
return;
}
if (_this8._config.backdrop === 'static') {
_this8._element.focus();
} else {
_this8.hide();
}
});
if (doAnimate) {
Util.reflow(this._backdrop);
}
$(this._backdrop).addClass(ClassName.SHOW);
if (!callback) {
if (this._isTransitioning) {
return;
}
if (!doAnimate) {
callback();
return;
}
$(this._backdrop).one(Util.TRANSITION_END, callback).emulateTransitionEnd(BACKDROP_TRANSITION_DURATION);
} else if (!this._isShown && this._backdrop) {
$(this._backdrop).removeClass(ClassName.SHOW);
var callbackRemove = function callbackRemove() {
_this8._removeBackdrop();
if (callback) {
callback();
}
};
if (Util.supportsTransitionEnd() && $(this._element).hasClass(ClassName.FADE)) {
$(this._backdrop).one(Util.TRANSITION_END, callbackRemove).emulateTransitionEnd(BACKDROP_TRANSITION_DURATION);
this._isTransitioning = true;
}
var showEvent = $.Event(Event.SHOW, {
relatedTarget: relatedTarget
});
$(this._element).trigger(showEvent);
if (this._isShown || showEvent.isDefaultPrevented()) {
return;
}
this._isShown = true;
this._checkScrollbar();
this._setScrollbar();
this._adjustDialog();
$(document.body).addClass(ClassName.OPEN);
this._setEscapeEvent();
this._setResizeEvent();
$(this._element).on(Event.CLICK_DISMISS, Selector.DATA_DISMISS, function (event) {
return _this.hide(event);
});
$(this._dialog).on(Event.MOUSEDOWN_DISMISS, function () {
$(_this._element).one(Event.MOUSEUP_DISMISS, function (event) {
if ($(event.target).is(_this._element)) {
_this._ignoreBackdropClick = true;
}
});
});
this._showBackdrop(function () {
return _this._showElement(relatedTarget);
});
}
}, {
key: 'hide',
value: function hide(event) {
var _this2 = this;
if (event) {
event.preventDefault();
}
if (this._isTransitioning || !this._isShown) {
return;
}
var transition = Util.supportsTransitionEnd() && $(this._element).hasClass(ClassName.FADE);
if (transition) {
this._isTransitioning = true;
}
var hideEvent = $.Event(Event.HIDE);
$(this._element).trigger(hideEvent);
if (!this._isShown || hideEvent.isDefaultPrevented()) {
return;
}
this._isShown = false;
this._setEscapeEvent();
this._setResizeEvent();
$(document).off(Event.FOCUSIN);
$(this._element).removeClass(ClassName.SHOW);
$(this._element).off(Event.CLICK_DISMISS);
$(this._dialog).off(Event.MOUSEDOWN_DISMISS);
if (transition) {
$(this._element).one(Util.TRANSITION_END, function (event) {
return _this2._hideModal(event);
}).emulateTransitionEnd(TRANSITION_DURATION);
} else {
callbackRemove();
this._hideModal();
}
} else if (callback) {
callback();
}
};
}, {
key: 'dispose',
value: function dispose() {
$.removeData(this._element, DATA_KEY);
// ----------------------------------------------------------------------
// the following methods are used to handle overflowing modals
// todo (fat): these should probably be refactored out of modal.js
// ----------------------------------------------------------------------
$(window, document, this._element, this._backdrop).off(EVENT_KEY);
Modal.prototype._adjustDialog = function _adjustDialog() {
var isModalOverflowing = this._element.scrollHeight > document.documentElement.clientHeight;
if (!this._isBodyOverflowing && isModalOverflowing) {
this._element.style.paddingLeft = this._scrollbarWidth + 'px';
this._config = null;
this._element = null;
this._dialog = null;
this._backdrop = null;
this._isShown = null;
this._isBodyOverflowing = null;
this._ignoreBackdropClick = null;
this._scrollbarWidth = null;
}
}, {
key: 'handleUpdate',
value: function handleUpdate() {
this._adjustDialog();
}
if (this._isBodyOverflowing && !isModalOverflowing) {
this._element.style.paddingRight = this._scrollbarWidth + 'px';
// private
}, {
key: '_getConfig',
value: function _getConfig(config) {
config = $.extend({}, Default, config);
Util.typeCheckConfig(NAME, config, DefaultType);
return config;
}
};
}, {
key: '_showElement',
value: function _showElement(relatedTarget) {
var _this3 = this;
Modal.prototype._resetAdjustments = function _resetAdjustments() {
this._element.style.paddingLeft = '';
this._element.style.paddingRight = '';
};
var transition = Util.supportsTransitionEnd() && $(this._element).hasClass(ClassName.FADE);
Modal.prototype._checkScrollbar = function _checkScrollbar() {
this._isBodyOverflowing = document.body.clientWidth < window.innerWidth;
this._scrollbarWidth = this._getScrollbarWidth();
};
if (!this._element.parentNode || this._element.parentNode.nodeType !== Node.ELEMENT_NODE) {
// don't move modals dom position
document.body.appendChild(this._element);
}
Modal.prototype._setScrollbar = function _setScrollbar() {
var _this9 = this;
this._element.style.display = 'block';
this._element.removeAttribute('aria-hidden');
this._element.scrollTop = 0;
if (this._isBodyOverflowing) {
// Note: DOMNode.style.paddingRight returns the actual value or '' if not set
// while $(DOMNode).css('padding-right') returns the calculated value or 0 if not set
if (transition) {
Util.reflow(this._element);
}
// Adjust fixed content padding
$(Selector.FIXED_CONTENT).each(function (index, element) {
var actualPadding = $(element)[0].style.paddingRight;
var calculatedPadding = $(element).css('padding-right');
$(element).data('padding-right', actualPadding).css('padding-right', parseFloat(calculatedPadding) + _this9._scrollbarWidth + 'px');
$(this._element).addClass(ClassName.SHOW);
if (this._config.focus) {
this._enforceFocus();
}
var shownEvent = $.Event(Event.SHOWN, {
relatedTarget: relatedTarget
});
// Adjust navbar-toggler margin
$(Selector.NAVBAR_TOGGLER).each(function (index, element) {
var actualMargin = $(element)[0].style.marginRight;
var calculatedMargin = $(element).css('margin-right');
$(element).data('margin-right', actualMargin).css('margin-right', parseFloat(calculatedMargin) + _this9._scrollbarWidth + 'px');
});
// Adjust body padding
var actualPadding = document.body.style.paddingRight;
var calculatedPadding = $('body').css('padding-right');
$('body').data('padding-right', actualPadding).css('padding-right', parseFloat(calculatedPadding) + this._scrollbarWidth + 'px');
}
};
Modal.prototype._resetScrollbar = function _resetScrollbar() {
// Restore fixed content padding
$(Selector.FIXED_CONTENT).each(function (index, element) {
var padding = $(element).data('padding-right');
if (typeof padding !== 'undefined') {
$(element).css('padding-right', padding).removeData('padding-right');
}
});
// Restore navbar-toggler margin
$(Selector.NAVBAR_TOGGLER).each(function (index, element) {
var margin = $(element).data('margin-right');
if (typeof margin !== 'undefined') {
$(element).css('margin-right', margin).removeData('margin-right');
}
});
// Restore body padding
var padding = $('body').data('padding-right');
if (typeof padding !== 'undefined') {
$('body').css('padding-right', padding).removeData('padding-right');
}
};
Modal.prototype._getScrollbarWidth = function _getScrollbarWidth() {
// thx d.walsh
var scrollDiv = document.createElement('div');
scrollDiv.className = ClassName.SCROLLBAR_MEASURER;
document.body.appendChild(scrollDiv);
var scrollbarWidth = scrollDiv.getBoundingClientRect().width - scrollDiv.clientWidth;
document.body.removeChild(scrollDiv);
return scrollbarWidth;
};
// static
Modal._jQueryInterface = function _jQueryInterface(config, relatedTarget) {
return this.each(function () {
var data = $(this).data(DATA_KEY);
var _config = $.extend({}, Modal.Default, $(this).data(), (typeof config === 'undefined' ? 'undefined' : _typeof(config)) === 'object' && config);
if (!data) {
data = new Modal(this, _config);
$(this).data(DATA_KEY, data);
}
if (typeof config === 'string') {
if (data[config] === undefined) {
throw new Error('No method named "' + config + '"');
var transitionComplete = function transitionComplete() {
if (_this3._config.focus) {
_this3._element.focus();
}
data[config](relatedTarget);
} else if (_config.show) {
data.show(relatedTarget);
}
});
};
_this3._isTransitioning = false;
$(_this3._element).trigger(shownEvent);
};
_createClass(Modal, null, [{
if (transition) {
$(this._dialog).one(Util.TRANSITION_END, transitionComplete).emulateTransitionEnd(TRANSITION_DURATION);
} else {
transitionComplete();
}
}
}, {
key: '_enforceFocus',
value: function _enforceFocus() {
var _this4 = this;
$(document).off(Event.FOCUSIN) // guard against infinite focus loop
.on(Event.FOCUSIN, function (event) {
if (document !== event.target && _this4._element !== event.target && !$(_this4._element).has(event.target).length) {
_this4._element.focus();
}
});
}
}, {
key: '_setEscapeEvent',
value: function _setEscapeEvent() {
var _this5 = this;
if (this._isShown && this._config.keyboard) {
$(this._element).on(Event.KEYDOWN_DISMISS, function (event) {
if (event.which === ESCAPE_KEYCODE) {
event.preventDefault();
_this5.hide();
}
});
} else if (!this._isShown) {
$(this._element).off(Event.KEYDOWN_DISMISS);
}
}
}, {
key: '_setResizeEvent',
value: function _setResizeEvent() {
var _this6 = this;
if (this._isShown) {
$(window).on(Event.RESIZE, function (event) {
return _this6.handleUpdate(event);
});
} else {
$(window).off(Event.RESIZE);
}
}
}, {
key: '_hideModal',
value: function _hideModal() {
var _this7 = this;
this._element.style.display = 'none';
this._element.setAttribute('aria-hidden', true);
this._isTransitioning = false;
this._showBackdrop(function () {
$(document.body).removeClass(ClassName.OPEN);
_this7._resetAdjustments();
_this7._resetScrollbar();
$(_this7._element).trigger(Event.HIDDEN);
});
}
}, {
key: '_removeBackdrop',
value: function _removeBackdrop() {
if (this._backdrop) {
$(this._backdrop).remove();
this._backdrop = null;
}
}
}, {
key: '_showBackdrop',
value: function _showBackdrop(callback) {
var _this8 = this;
var animate = $(this._element).hasClass(ClassName.FADE) ? ClassName.FADE : '';
if (this._isShown && this._config.backdrop) {
var doAnimate = Util.supportsTransitionEnd() && animate;
this._backdrop = document.createElement('div');
this._backdrop.className = ClassName.BACKDROP;
if (animate) {
$(this._backdrop).addClass(animate);
}
$(this._backdrop).appendTo(document.body);
$(this._element).on(Event.CLICK_DISMISS, function (event) {
if (_this8._ignoreBackdropClick) {
_this8._ignoreBackdropClick = false;
return;
}
if (event.target !== event.currentTarget) {
return;
}
if (_this8._config.backdrop === 'static') {
_this8._element.focus();
} else {
_this8.hide();
}
});
if (doAnimate) {
Util.reflow(this._backdrop);
}
$(this._backdrop).addClass(ClassName.SHOW);
if (!callback) {
return;
}
if (!doAnimate) {
callback();
return;
}
$(this._backdrop).one(Util.TRANSITION_END, callback).emulateTransitionEnd(BACKDROP_TRANSITION_DURATION);
} else if (!this._isShown && this._backdrop) {
$(this._backdrop).removeClass(ClassName.SHOW);
var callbackRemove = function callbackRemove() {
_this8._removeBackdrop();
if (callback) {
callback();
}
};
if (Util.supportsTransitionEnd() && $(this._element).hasClass(ClassName.FADE)) {
$(this._backdrop).one(Util.TRANSITION_END, callbackRemove).emulateTransitionEnd(BACKDROP_TRANSITION_DURATION);
} else {
callbackRemove();
}
} else if (callback) {
callback();
}
}
// ----------------------------------------------------------------------
// the following methods are used to handle overflowing modals
// todo (fat): these should probably be refactored out of modal.js
// ----------------------------------------------------------------------
}, {
key: '_adjustDialog',
value: function _adjustDialog() {
var isModalOverflowing = this._element.scrollHeight > document.documentElement.clientHeight;
if (!this._isBodyOverflowing && isModalOverflowing) {
this._element.style.paddingLeft = this._scrollbarWidth + 'px';
}
if (this._isBodyOverflowing && !isModalOverflowing) {
this._element.style.paddingRight = this._scrollbarWidth + 'px';
}
}
}, {
key: '_resetAdjustments',
value: function _resetAdjustments() {
this._element.style.paddingLeft = '';
this._element.style.paddingRight = '';
}
}, {
key: '_checkScrollbar',
value: function _checkScrollbar() {
var rect = document.body.getBoundingClientRect();
this._isBodyOverflowing = rect.left + rect.right < window.innerWidth;
this._scrollbarWidth = this._getScrollbarWidth();
}
}, {
key: '_setScrollbar',
value: function _setScrollbar() {
var _this9 = this;
if (this._isBodyOverflowing) {
// Note: DOMNode.style.paddingRight returns the actual value or '' if not set
// while $(DOMNode).css('padding-right') returns the calculated value or 0 if not set
// Adjust fixed content padding
$(Selector.FIXED_CONTENT).each(function (index, element) {
var actualPadding = $(element)[0].style.paddingRight;
var calculatedPadding = $(element).css('padding-right');
$(element).data('padding-right', actualPadding).css('padding-right', parseFloat(calculatedPadding) + _this9._scrollbarWidth + 'px');
});
// Adjust sticky content margin
$(Selector.STICKY_CONTENT).each(function (index, element) {
var actualMargin = $(element)[0].style.marginRight;
var calculatedMargin = $(element).css('margin-right');
$(element).data('margin-right', actualMargin).css('margin-right', parseFloat(calculatedMargin) - _this9._scrollbarWidth + 'px');
});
// Adjust navbar-toggler margin
$(Selector.NAVBAR_TOGGLER).each(function (index, element) {
var actualMargin = $(element)[0].style.marginRight;
var calculatedMargin = $(element).css('margin-right');
$(element).data('margin-right', actualMargin).css('margin-right', parseFloat(calculatedMargin) + _this9._scrollbarWidth + 'px');
});
// Adjust body padding
var actualPadding = document.body.style.paddingRight;
var calculatedPadding = $('body').css('padding-right');
$('body').data('padding-right', actualPadding).css('padding-right', parseFloat(calculatedPadding) + this._scrollbarWidth + 'px');
}
}
}, {
key: '_resetScrollbar',
value: function _resetScrollbar() {
// Restore fixed content padding
$(Selector.FIXED_CONTENT).each(function (index, element) {
var padding = $(element).data('padding-right');
if (typeof padding !== 'undefined') {
$(element).css('padding-right', padding).removeData('padding-right');
}
});
// Restore sticky content and navbar-toggler margin
$(Selector.STICKY_CONTENT + ', ' + Selector.NAVBAR_TOGGLER).each(function (index, element) {
var margin = $(element).data('margin-right');
if (typeof margin !== 'undefined') {
$(element).css('margin-right', margin).removeData('margin-right');
}
});
// Restore body padding
var padding = $('body').data('padding-right');
if (typeof padding !== 'undefined') {
$('body').css('padding-right', padding).removeData('padding-right');
}
}
}, {
key: '_getScrollbarWidth',
value: function _getScrollbarWidth() {
// thx d.walsh
var scrollDiv = document.createElement('div');
scrollDiv.className = ClassName.SCROLLBAR_MEASURER;
document.body.appendChild(scrollDiv);
var scrollbarWidth = scrollDiv.getBoundingClientRect().width - scrollDiv.clientWidth;
document.body.removeChild(scrollDiv);
return scrollbarWidth;
}
// static
}], [{
key: '_jQueryInterface',
value: function _jQueryInterface(config, relatedTarget) {
return this.each(function () {
var data = $(this).data(DATA_KEY);
var _config = $.extend({}, Modal.Default, $(this).data(), (typeof config === 'undefined' ? 'undefined' : _typeof(config)) === 'object' && config);
if (!data) {
data = new Modal(this, _config);
$(this).data(DATA_KEY, data);
}
if (typeof config === 'string') {
if (typeof data[config] === 'undefined') {
throw new Error('No method named "' + config + '"');
}
data[config](relatedTarget);
} else if (_config.show) {
data.show(relatedTarget);
}
});
}
}, {
key: 'VERSION',
get: function get() {
return VERSION;

BIN
js/dist/modal.js.map vendored
View file

Binary file not shown.

122
js/dist/popover.js vendored
View file

@ -1,3 +1,5 @@
'use strict';
var _typeof = typeof Symbol === "function" && typeof Symbol.iterator === "symbol" ? function (obj) { return typeof obj; } : function (obj) { return obj && typeof Symbol === "function" && obj.constructor === Symbol && obj !== Symbol.prototype ? "symbol" : typeof obj; };
var _createClass = function () { function defineProperties(target, props) { for (var i = 0; i < props.length; i++) { var descriptor = props[i]; descriptor.enumerable = descriptor.enumerable || false; descriptor.configurable = true; if ("value" in descriptor) descriptor.writable = true; Object.defineProperty(target, descriptor.key, descriptor); } } return function (Constructor, protoProps, staticProps) { if (protoProps) defineProperties(Constructor.prototype, protoProps); if (staticProps) defineProperties(Constructor, staticProps); return Constructor; }; }();
@ -15,7 +17,7 @@ function _inherits(subClass, superClass) { if (typeof superClass !== "function"
* --------------------------------------------------------------------------
*/
var Popover = function ($) {
var Popover = function () {
/**
* ------------------------------------------------------------------------
@ -77,73 +79,85 @@ var Popover = function ($) {
function Popover() {
_classCallCheck(this, Popover);
return _possibleConstructorReturn(this, _Tooltip.apply(this, arguments));
return _possibleConstructorReturn(this, (Popover.__proto__ || Object.getPrototypeOf(Popover)).apply(this, arguments));
}
// overrides
_createClass(Popover, [{
key: 'isWithContent',
Popover.prototype.isWithContent = function isWithContent() {
return this.getTitle() || this._getContent();
};
Popover.prototype.addAttachmentClass = function addAttachmentClass(attachment) {
$(this.getTipElement()).addClass(CLASS_PREFIX + '-' + attachment);
};
// overrides
Popover.prototype.getTipElement = function getTipElement() {
return this.tip = this.tip || $(this.config.template)[0];
};
Popover.prototype.setContent = function setContent() {
var $tip = $(this.getTipElement());
// we use append for html objects to maintain js events
this.setElementContent($tip.find(Selector.TITLE), this.getTitle());
this.setElementContent($tip.find(Selector.CONTENT), this._getContent());
$tip.removeClass(ClassName.FADE + ' ' + ClassName.SHOW);
};
// private
Popover.prototype._getContent = function _getContent() {
return this.element.getAttribute('data-content') || (typeof this.config.content === 'function' ? this.config.content.call(this.element) : this.config.content);
};
Popover.prototype._cleanTipClass = function _cleanTipClass() {
var $tip = $(this.getTipElement());
var tabClass = $tip.attr('class').match(BSCLS_PREFIX_REGEX);
if (tabClass !== null && tabClass.length > 0) {
$tip.removeClass(tabClass.join(''));
value: function isWithContent() {
return this.getTitle() || this._getContent();
}
};
}, {
key: 'addAttachmentClass',
value: function addAttachmentClass(attachment) {
$(this.getTipElement()).addClass(CLASS_PREFIX + '-' + attachment);
}
}, {
key: 'getTipElement',
value: function getTipElement() {
this.tip = this.tip || $(this.config.template)[0];
return this.tip;
}
}, {
key: 'setContent',
value: function setContent() {
var $tip = $(this.getTipElement());
// static
// we use append for html objects to maintain js events
this.setElementContent($tip.find(Selector.TITLE), this.getTitle());
this.setElementContent($tip.find(Selector.CONTENT), this._getContent());
Popover._jQueryInterface = function _jQueryInterface(config) {
return this.each(function () {
var data = $(this).data(DATA_KEY);
var _config = (typeof config === 'undefined' ? 'undefined' : _typeof(config)) === 'object' ? config : null;
$tip.removeClass(ClassName.FADE + ' ' + ClassName.SHOW);
}
if (!data && /destroy|hide/.test(config)) {
return;
// private
}, {
key: '_getContent',
value: function _getContent() {
return this.element.getAttribute('data-content') || (typeof this.config.content === 'function' ? this.config.content.call(this.element) : this.config.content);
}
}, {
key: '_cleanTipClass',
value: function _cleanTipClass() {
var $tip = $(this.getTipElement());
var tabClass = $tip.attr('class').match(BSCLS_PREFIX_REGEX);
if (tabClass !== null && tabClass.length > 0) {
$tip.removeClass(tabClass.join(''));
}
}
if (!data) {
data = new Popover(this, _config);
$(this).data(DATA_KEY, data);
}
// static
if (typeof config === 'string') {
if (data[config] === undefined) {
throw new Error('No method named "' + config + '"');
}], [{
key: '_jQueryInterface',
value: function _jQueryInterface(config) {
return this.each(function () {
var data = $(this).data(DATA_KEY);
var _config = (typeof config === 'undefined' ? 'undefined' : _typeof(config)) === 'object' ? config : null;
if (!data && /destroy|hide/.test(config)) {
return;
}
data[config]();
}
});
};
_createClass(Popover, null, [{
if (!data) {
data = new Popover(this, _config);
$(this).data(DATA_KEY, data);
}
if (typeof config === 'string') {
if (typeof data[config] === 'undefined') {
throw new Error('No method named "' + config + '"');
}
data[config]();
}
});
}
}, {
key: 'VERSION',

BIN
js/dist/popover.js.map vendored
View file

Binary file not shown.

327
js/dist/scrollspy.js vendored
View file

@ -1,3 +1,5 @@
'use strict';
var _typeof = typeof Symbol === "function" && typeof Symbol.iterator === "symbol" ? function (obj) { return typeof obj; } : function (obj) { return obj && typeof Symbol === "function" && obj.constructor === Symbol && obj !== Symbol.prototype ? "symbol" : typeof obj; };
var _createClass = function () { function defineProperties(target, props) { for (var i = 0; i < props.length; i++) { var descriptor = props[i]; descriptor.enumerable = descriptor.enumerable || false; descriptor.configurable = true; if ("value" in descriptor) descriptor.writable = true; Object.defineProperty(target, descriptor.key, descriptor); } } return function (Constructor, protoProps, staticProps) { if (protoProps) defineProperties(Constructor.prototype, protoProps); if (staticProps) defineProperties(Constructor, staticProps); return Constructor; }; }();
@ -11,7 +13,7 @@ function _classCallCheck(instance, Constructor) { if (!(instance instanceof Cons
* --------------------------------------------------------------------------
*/
var ScrollSpy = function ($) {
var ScrollSpy = function () {
/**
* ------------------------------------------------------------------------
@ -97,182 +99,197 @@ var ScrollSpy = function ($) {
// getters
// public
_createClass(ScrollSpy, [{
key: 'refresh',
ScrollSpy.prototype.refresh = function refresh() {
var _this2 = this;
var autoMethod = this._scrollElement !== this._scrollElement.window ? OffsetMethod.POSITION : OffsetMethod.OFFSET;
// public
var offsetMethod = this._config.method === 'auto' ? autoMethod : this._config.method;
value: function refresh() {
var _this2 = this;
var offsetBase = offsetMethod === OffsetMethod.POSITION ? this._getScrollTop() : 0;
var autoMethod = this._scrollElement !== this._scrollElement.window ? OffsetMethod.POSITION : OffsetMethod.OFFSET;
this._offsets = [];
this._targets = [];
var offsetMethod = this._config.method === 'auto' ? autoMethod : this._config.method;
this._scrollHeight = this._getScrollHeight();
var offsetBase = offsetMethod === OffsetMethod.POSITION ? this._getScrollTop() : 0;
var targets = $.makeArray($(this._selector));
this._offsets = [];
this._targets = [];
targets.map(function (element) {
var target = void 0;
var targetSelector = Util.getSelectorFromElement(element);
this._scrollHeight = this._getScrollHeight();
if (targetSelector) {
target = $(targetSelector)[0];
}
var targets = $.makeArray($(this._selector));
if (target) {
var targetBCR = target.getBoundingClientRect();
if (targetBCR.width || targetBCR.height) {
// todo (fat): remove sketch reliance on jQuery position/offset
return [$(target)[offsetMethod]().top + offsetBase, targetSelector];
targets.map(function (element) {
var target = void 0;
var targetSelector = Util.getSelectorFromElement(element);
if (targetSelector) {
target = $(targetSelector)[0];
}
}
return null;
}).filter(function (item) {
return item;
}).sort(function (a, b) {
return a[0] - b[0];
}).forEach(function (item) {
_this2._offsets.push(item[0]);
_this2._targets.push(item[1]);
});
};
ScrollSpy.prototype.dispose = function dispose() {
$.removeData(this._element, DATA_KEY);
$(this._scrollElement).off(EVENT_KEY);
this._element = null;
this._scrollElement = null;
this._config = null;
this._selector = null;
this._offsets = null;
this._targets = null;
this._activeTarget = null;
this._scrollHeight = null;
};
// private
ScrollSpy.prototype._getConfig = function _getConfig(config) {
config = $.extend({}, Default, config);
if (typeof config.target !== 'string') {
var id = $(config.target).attr('id');
if (!id) {
id = Util.getUID(NAME);
$(config.target).attr('id', id);
}
config.target = '#' + id;
if (target) {
var targetBCR = target.getBoundingClientRect();
if (targetBCR.width || targetBCR.height) {
// todo (fat): remove sketch reliance on jQuery position/offset
return [$(target)[offsetMethod]().top + offsetBase, targetSelector];
}
}
return null;
}).filter(function (item) {
return item;
}).sort(function (a, b) {
return a[0] - b[0];
}).forEach(function (item) {
_this2._offsets.push(item[0]);
_this2._targets.push(item[1]);
});
}
}, {
key: 'dispose',
value: function dispose() {
$.removeData(this._element, DATA_KEY);
$(this._scrollElement).off(EVENT_KEY);
Util.typeCheckConfig(NAME, config, DefaultType);
return config;
};
ScrollSpy.prototype._getScrollTop = function _getScrollTop() {
return this._scrollElement === window ? this._scrollElement.pageYOffset : this._scrollElement.scrollTop;
};
ScrollSpy.prototype._getScrollHeight = function _getScrollHeight() {
return this._scrollElement.scrollHeight || Math.max(document.body.scrollHeight, document.documentElement.scrollHeight);
};
ScrollSpy.prototype._getOffsetHeight = function _getOffsetHeight() {
return this._scrollElement === window ? window.innerHeight : this._scrollElement.getBoundingClientRect().height;
};
ScrollSpy.prototype._process = function _process() {
var scrollTop = this._getScrollTop() + this._config.offset;
var scrollHeight = this._getScrollHeight();
var maxScroll = this._config.offset + scrollHeight - this._getOffsetHeight();
if (this._scrollHeight !== scrollHeight) {
this.refresh();
}
if (scrollTop >= maxScroll) {
var target = this._targets[this._targets.length - 1];
if (this._activeTarget !== target) {
this._activate(target);
}
return;
}
if (this._activeTarget && scrollTop < this._offsets[0] && this._offsets[0] > 0) {
this._element = null;
this._scrollElement = null;
this._config = null;
this._selector = null;
this._offsets = null;
this._targets = null;
this._activeTarget = null;
this._clear();
return;
this._scrollHeight = null;
}
for (var i = this._offsets.length; i--;) {
var isActiveTarget = this._activeTarget !== this._targets[i] && scrollTop >= this._offsets[i] && (this._offsets[i + 1] === undefined || scrollTop < this._offsets[i + 1]);
// private
if (isActiveTarget) {
this._activate(this._targets[i]);
}
}
};
}, {
key: '_getConfig',
value: function _getConfig(config) {
config = $.extend({}, Default, config);
ScrollSpy.prototype._activate = function _activate(target) {
this._activeTarget = target;
this._clear();
var queries = this._selector.split(',');
queries = queries.map(function (selector) {
return selector + '[data-target="' + target + '"],' + (selector + '[href="' + target + '"]');
});
var $link = $(queries.join(','));
if ($link.hasClass(ClassName.DROPDOWN_ITEM)) {
$link.closest(Selector.DROPDOWN).find(Selector.DROPDOWN_TOGGLE).addClass(ClassName.ACTIVE);
$link.addClass(ClassName.ACTIVE);
} else {
// Set triggered link as active
$link.addClass(ClassName.ACTIVE);
// Set triggered links parents as active
// With both <ul> and <nav> markup a parent is the previous sibling of any nav ancestor
$link.parents(Selector.NAV_LIST_GROUP).prev(Selector.NAV_LINKS + ', ' + Selector.LIST_ITEMS).addClass(ClassName.ACTIVE);
}
$(this._scrollElement).trigger(Event.ACTIVATE, {
relatedTarget: target
});
};
ScrollSpy.prototype._clear = function _clear() {
$(this._selector).filter(Selector.ACTIVE).removeClass(ClassName.ACTIVE);
};
// static
ScrollSpy._jQueryInterface = function _jQueryInterface(config) {
return this.each(function () {
var data = $(this).data(DATA_KEY);
var _config = (typeof config === 'undefined' ? 'undefined' : _typeof(config)) === 'object' && config;
if (!data) {
data = new ScrollSpy(this, _config);
$(this).data(DATA_KEY, data);
}
if (typeof config === 'string') {
if (data[config] === undefined) {
throw new Error('No method named "' + config + '"');
if (typeof config.target !== 'string') {
var id = $(config.target).attr('id');
if (!id) {
id = Util.getUID(NAME);
$(config.target).attr('id', id);
}
data[config]();
config.target = '#' + id;
}
});
};
_createClass(ScrollSpy, null, [{
Util.typeCheckConfig(NAME, config, DefaultType);
return config;
}
}, {
key: '_getScrollTop',
value: function _getScrollTop() {
return this._scrollElement === window ? this._scrollElement.pageYOffset : this._scrollElement.scrollTop;
}
}, {
key: '_getScrollHeight',
value: function _getScrollHeight() {
return this._scrollElement.scrollHeight || Math.max(document.body.scrollHeight, document.documentElement.scrollHeight);
}
}, {
key: '_getOffsetHeight',
value: function _getOffsetHeight() {
return this._scrollElement === window ? window.innerHeight : this._scrollElement.getBoundingClientRect().height;
}
}, {
key: '_process',
value: function _process() {
var scrollTop = this._getScrollTop() + this._config.offset;
var scrollHeight = this._getScrollHeight();
var maxScroll = this._config.offset + scrollHeight - this._getOffsetHeight();
if (this._scrollHeight !== scrollHeight) {
this.refresh();
}
if (scrollTop >= maxScroll) {
var target = this._targets[this._targets.length - 1];
if (this._activeTarget !== target) {
this._activate(target);
}
return;
}
if (this._activeTarget && scrollTop < this._offsets[0] && this._offsets[0] > 0) {
this._activeTarget = null;
this._clear();
return;
}
for (var i = this._offsets.length; i--;) {
var isActiveTarget = this._activeTarget !== this._targets[i] && scrollTop >= this._offsets[i] && (typeof this._offsets[i + 1] === 'undefined' || scrollTop < this._offsets[i + 1]);
if (isActiveTarget) {
this._activate(this._targets[i]);
}
}
}
}, {
key: '_activate',
value: function _activate(target) {
this._activeTarget = target;
this._clear();
var queries = this._selector.split(',');
// eslint-disable-next-line arrow-body-style
queries = queries.map(function (selector) {
return selector + '[data-target="' + target + '"],' + (selector + '[href="' + target + '"]');
});
var $link = $(queries.join(','));
if ($link.hasClass(ClassName.DROPDOWN_ITEM)) {
$link.closest(Selector.DROPDOWN).find(Selector.DROPDOWN_TOGGLE).addClass(ClassName.ACTIVE);
$link.addClass(ClassName.ACTIVE);
} else {
// Set triggered link as active
$link.addClass(ClassName.ACTIVE);
// Set triggered links parents as active
// With both <ul> and <nav> markup a parent is the previous sibling of any nav ancestor
$link.parents(Selector.NAV_LIST_GROUP).prev(Selector.NAV_LINKS + ', ' + Selector.LIST_ITEMS).addClass(ClassName.ACTIVE);
}
$(this._scrollElement).trigger(Event.ACTIVATE, {
relatedTarget: target
});
}
}, {
key: '_clear',
value: function _clear() {
$(this._selector).filter(Selector.ACTIVE).removeClass(ClassName.ACTIVE);
}
// static
}], [{
key: '_jQueryInterface',
value: function _jQueryInterface(config) {
return this.each(function () {
var data = $(this).data(DATA_KEY);
var _config = (typeof config === 'undefined' ? 'undefined' : _typeof(config)) === 'object' && config;
if (!data) {
data = new ScrollSpy(this, _config);
$(this).data(DATA_KEY, data);
}
if (typeof config === 'string') {
if (typeof data[config] === 'undefined') {
throw new Error('No method named "' + config + '"');
}
data[config]();
}
});
}
}, {
key: 'VERSION',
get: function get() {
return VERSION;

BIN
js/dist/scrollspy.js.map vendored
View file

Binary file not shown.

289
js/dist/tab.js vendored
View file

@ -1,3 +1,5 @@
'use strict';
var _createClass = function () { function defineProperties(target, props) { for (var i = 0; i < props.length; i++) { var descriptor = props[i]; descriptor.enumerable = descriptor.enumerable || false; descriptor.configurable = true; if ("value" in descriptor) descriptor.writable = true; Object.defineProperty(target, descriptor.key, descriptor); } } return function (Constructor, protoProps, staticProps) { if (protoProps) defineProperties(Constructor.prototype, protoProps); if (staticProps) defineProperties(Constructor, staticProps); return Constructor; }; }();
function _classCallCheck(instance, Constructor) { if (!(instance instanceof Constructor)) { throw new TypeError("Cannot call a class as a function"); } }
@ -9,7 +11,7 @@ function _classCallCheck(instance, Constructor) { if (!(instance instanceof Cons
* --------------------------------------------------------------------------
*/
var Tab = function ($) {
var Tab = function () {
/**
* ------------------------------------------------------------------------
@ -66,165 +68,174 @@ var Tab = function ($) {
// getters
// public
_createClass(Tab, [{
key: 'show',
Tab.prototype.show = function show() {
var _this = this;
if (this._element.parentNode && this._element.parentNode.nodeType === Node.ELEMENT_NODE && $(this._element).hasClass(ClassName.ACTIVE) || $(this._element).hasClass(ClassName.DISABLED)) {
return;
}
// public
var target = void 0;
var previous = void 0;
var listElement = $(this._element).closest(Selector.NAV_LIST_GROUP)[0];
var selector = Util.getSelectorFromElement(this._element);
value: function show() {
var _this = this;
if (listElement) {
var itemSelector = listElement.nodeName === 'UL' ? Selector.ACTIVE_UL : Selector.ACTIVE;
previous = $.makeArray($(listElement).find(itemSelector));
previous = previous[previous.length - 1];
}
if (this._element.parentNode && this._element.parentNode.nodeType === Node.ELEMENT_NODE && $(this._element).hasClass(ClassName.ACTIVE) || $(this._element).hasClass(ClassName.DISABLED)) {
return;
}
var hideEvent = $.Event(Event.HIDE, {
relatedTarget: this._element
});
var target = void 0;
var previous = void 0;
var listElement = $(this._element).closest(Selector.NAV_LIST_GROUP)[0];
var selector = Util.getSelectorFromElement(this._element);
var showEvent = $.Event(Event.SHOW, {
relatedTarget: previous
});
if (listElement) {
var itemSelector = listElement.nodeName === 'UL' ? Selector.ACTIVE_UL : Selector.ACTIVE;
previous = $.makeArray($(listElement).find(itemSelector));
previous = previous[previous.length - 1];
}
if (previous) {
$(previous).trigger(hideEvent);
}
$(this._element).trigger(showEvent);
if (showEvent.isDefaultPrevented() || hideEvent.isDefaultPrevented()) {
return;
}
if (selector) {
target = $(selector)[0];
}
this._activate(this._element, listElement);
var complete = function complete() {
var hiddenEvent = $.Event(Event.HIDDEN, {
relatedTarget: _this._element
var hideEvent = $.Event(Event.HIDE, {
relatedTarget: this._element
});
var shownEvent = $.Event(Event.SHOWN, {
var showEvent = $.Event(Event.SHOW, {
relatedTarget: previous
});
$(previous).trigger(hiddenEvent);
$(_this._element).trigger(shownEvent);
};
if (target) {
this._activate(target, target.parentNode, complete);
} else {
complete();
}
};
Tab.prototype.dispose = function dispose() {
$.removeData(this._element, DATA_KEY);
this._element = null;
};
// private
Tab.prototype._activate = function _activate(element, container, callback) {
var _this2 = this;
var activeElements = void 0;
if (container.nodeName === 'UL') {
activeElements = $(container).find(Selector.ACTIVE_UL);
} else {
activeElements = $(container).children(Selector.ACTIVE);
}
var active = activeElements[0];
var isTransitioning = callback && Util.supportsTransitionEnd() && active && $(active).hasClass(ClassName.FADE);
var complete = function complete() {
return _this2._transitionComplete(element, active, isTransitioning, callback);
};
if (active && isTransitioning) {
$(active).one(Util.TRANSITION_END, complete).emulateTransitionEnd(TRANSITION_DURATION);
} else {
complete();
}
if (active) {
$(active).removeClass(ClassName.SHOW);
}
};
Tab.prototype._transitionComplete = function _transitionComplete(element, active, isTransitioning, callback) {
if (active) {
$(active).removeClass(ClassName.ACTIVE);
var dropdownChild = $(active.parentNode).find(Selector.DROPDOWN_ACTIVE_CHILD)[0];
if (dropdownChild) {
$(dropdownChild).removeClass(ClassName.ACTIVE);
if (previous) {
$(previous).trigger(hideEvent);
}
active.setAttribute('aria-expanded', false);
}
$(this._element).trigger(showEvent);
$(element).addClass(ClassName.ACTIVE);
element.setAttribute('aria-expanded', true);
if (isTransitioning) {
Util.reflow(element);
$(element).addClass(ClassName.SHOW);
} else {
$(element).removeClass(ClassName.FADE);
}
if (element.parentNode && $(element.parentNode).hasClass(ClassName.DROPDOWN_MENU)) {
var dropdownElement = $(element).closest(Selector.DROPDOWN)[0];
if (dropdownElement) {
$(dropdownElement).find(Selector.DROPDOWN_TOGGLE).addClass(ClassName.ACTIVE);
if (showEvent.isDefaultPrevented() || hideEvent.isDefaultPrevented()) {
return;
}
element.setAttribute('aria-expanded', true);
}
if (callback) {
callback();
}
};
// static
Tab._jQueryInterface = function _jQueryInterface(config) {
return this.each(function () {
var $this = $(this);
var data = $this.data(DATA_KEY);
if (!data) {
data = new Tab(this);
$this.data(DATA_KEY, data);
if (selector) {
target = $(selector)[0];
}
if (typeof config === 'string') {
if (data[config] === undefined) {
throw new Error('No method named "' + config + '"');
this._activate(this._element, listElement);
var complete = function complete() {
var hiddenEvent = $.Event(Event.HIDDEN, {
relatedTarget: _this._element
});
var shownEvent = $.Event(Event.SHOWN, {
relatedTarget: previous
});
$(previous).trigger(hiddenEvent);
$(_this._element).trigger(shownEvent);
};
if (target) {
this._activate(target, target.parentNode, complete);
} else {
complete();
}
}
}, {
key: 'dispose',
value: function dispose() {
$.removeData(this._element, DATA_KEY);
this._element = null;
}
// private
}, {
key: '_activate',
value: function _activate(element, container, callback) {
var _this2 = this;
var activeElements = void 0;
if (container.nodeName === 'UL') {
activeElements = $(container).find(Selector.ACTIVE_UL);
} else {
activeElements = $(container).children(Selector.ACTIVE);
}
var active = activeElements[0];
var isTransitioning = callback && Util.supportsTransitionEnd() && active && $(active).hasClass(ClassName.FADE);
var complete = function complete() {
return _this2._transitionComplete(element, active, isTransitioning, callback);
};
if (active && isTransitioning) {
$(active).one(Util.TRANSITION_END, complete).emulateTransitionEnd(TRANSITION_DURATION);
} else {
complete();
}
if (active) {
$(active).removeClass(ClassName.SHOW);
}
}
}, {
key: '_transitionComplete',
value: function _transitionComplete(element, active, isTransitioning, callback) {
if (active) {
$(active).removeClass(ClassName.ACTIVE);
var dropdownChild = $(active.parentNode).find(Selector.DROPDOWN_ACTIVE_CHILD)[0];
if (dropdownChild) {
$(dropdownChild).removeClass(ClassName.ACTIVE);
}
data[config]();
}
});
};
_createClass(Tab, null, [{
active.setAttribute('aria-expanded', false);
}
$(element).addClass(ClassName.ACTIVE);
element.setAttribute('aria-expanded', true);
if (isTransitioning) {
Util.reflow(element);
$(element).addClass(ClassName.SHOW);
} else {
$(element).removeClass(ClassName.FADE);
}
if (element.parentNode && $(element.parentNode).hasClass(ClassName.DROPDOWN_MENU)) {
var dropdownElement = $(element).closest(Selector.DROPDOWN)[0];
if (dropdownElement) {
$(dropdownElement).find(Selector.DROPDOWN_TOGGLE).addClass(ClassName.ACTIVE);
}
element.setAttribute('aria-expanded', true);
}
if (callback) {
callback();
}
}
// static
}], [{
key: '_jQueryInterface',
value: function _jQueryInterface(config) {
return this.each(function () {
var $this = $(this);
var data = $this.data(DATA_KEY);
if (!data) {
data = new Tab(this);
$this.data(DATA_KEY, data);
}
if (typeof config === 'string') {
if (typeof data[config] === 'undefined') {
throw new Error('No method named "' + config + '"');
}
data[config]();
}
});
}
}, {
key: 'VERSION',
get: function get() {
return VERSION;

BIN
js/dist/tab.js.map vendored
View file

Binary file not shown.

966
js/dist/tooltip.js vendored
View file

File diff suppressed because it is too large Load diff

BIN
js/dist/tooltip.js.map vendored
View file

Binary file not shown.

12
js/dist/util.js vendored
View file

@ -1,3 +1,5 @@
'use strict';
/**
* --------------------------------------------------------------------------
* Bootstrap (v4.0.0-beta): util.js
@ -5,7 +7,7 @@
* --------------------------------------------------------------------------
*/
var Util = function ($) {
var Util = function () {
/**
* ------------------------------------------------------------------------
@ -40,7 +42,7 @@ var Util = function ($) {
if ($(event.target).is(this)) {
return event.handleObj.handler.apply(this, arguments); // eslint-disable-line prefer-rest-params
}
return undefined;
return undefined; // eslint-disable-line no-undefined
}
};
}
@ -53,7 +55,7 @@ var Util = function ($) {
var el = document.createElement('bootstrap');
for (var name in TransitionEndEvent) {
if (el.style[name] !== undefined) {
if (typeof el.style[name] !== 'undefined') {
return {
end: TransitionEndEvent[name]
};
@ -115,7 +117,7 @@ var Util = function ($) {
}
try {
var $selector = $(selector);
var $selector = $(document).find(selector);
return $selector.length > 0 ? selector : null;
} catch (error) {
return null;
@ -132,7 +134,7 @@ var Util = function ($) {
},
typeCheckConfig: function typeCheckConfig(componentName, config, configTypes) {
for (var property in configTypes) {
if (configTypes.hasOwnProperty(property)) {
if (Object.prototype.hasOwnProperty.call(configTypes, property)) {
var expectedTypes = configTypes[property];
var value = config[property];
var valueType = value && isElement(value) ? 'element' : toType(value);

BIN
js/dist/util.js.map vendored
View file

Binary file not shown.

3
js/src/alert.js
View file

@ -1,3 +1,4 @@
import $ from 'jquery'
import Util from './util'
@ -8,7 +9,7 @@ import Util from './util'
* --------------------------------------------------------------------------
*/
const Alert = (($) => {
const Alert = (() => {
/**

3
js/src/button.js
View file

@ -1,3 +1,4 @@
import $ from 'jquery'
/**
* --------------------------------------------------------------------------
* Bootstrap (v4.0.0-beta): button.js
@ -5,7 +6,7 @@
* --------------------------------------------------------------------------
*/
const Button = (($) => {
const Button = (() => {
/**

3
js/src/carousel.js
View file

@ -1,3 +1,4 @@
import $ from 'jquery'
import Util from './util'
@ -8,7 +9,7 @@ import Util from './util'
* --------------------------------------------------------------------------
*/
const Carousel = (($) => {
const Carousel = (() => {
/**

5
js/src/collapse.js
View file

@ -1,3 +1,4 @@
import $ from 'jquery'
import Util from './util'
@ -8,7 +9,7 @@ import Util from './util'
* --------------------------------------------------------------------------
*/
const Collapse = (($) => {
const Collapse = (() => {
/**
@ -362,7 +363,7 @@ const Collapse = (($) => {
$(document).on(Event.CLICK_DATA_API, Selector.DATA_TOGGLE, function (event) {
// preventDefault only for <a> elements (which change the URL) not inside the collapsible element
if (event.target.tagName === 'A' && !$.contains(this, event.target)) {
if (event.currentTarget.tagName === 'A') {
event.preventDefault()
}

19
js/src/dropdown.js
View file

@ -1,5 +1,5 @@
/* global Popper */
import $ from 'jquery'
import Popper from 'popper.js'
import Util from './util'
@ -10,7 +10,7 @@ import Util from './util'
* --------------------------------------------------------------------------
*/
const Dropdown = (($) => {
const Dropdown = (() => {
/**
* Check for Popper dependency
@ -75,13 +75,11 @@ const Dropdown = (($) => {
}
const Default = {
placement : AttachmentMap.BOTTOM,
offset : 0,
flip : true
}
const DefaultType = {
placement : 'string',
offset : '(number|string)',
flip : 'boolean'
}
@ -203,11 +201,6 @@ const Dropdown = (($) => {
}
_getConfig(config) {
const elementData = $(this._element).data()
if (typeof elementData.placement !== 'undefined') {
elementData.placement = AttachmentMap[elementData.placement.toUpperCase()]
}
config = $.extend(
{},
this.constructor.Default,
@ -234,10 +227,10 @@ const Dropdown = (($) => {
_getPlacement() {
const $parentDropdown = $(this._element).parent()
let placement = this._config.placement
let placement = AttachmentMap.BOTTOM
// Handle dropup
if ($parentDropdown.hasClass(ClassName.DROPUP) || this._config.placement === AttachmentMap.TOP) {
if ($parentDropdown.hasClass(ClassName.DROPUP)) {
placement = AttachmentMap.TOP
if ($(this._menu).hasClass(ClassName.MENURIGHT)) {
placement = AttachmentMap.TOPEND
@ -445,6 +438,6 @@ const Dropdown = (($) => {
return Dropdown
})(jQuery)
})(jQuery, Popper)
export default Dropdown

46
js/src/index.js Normal file
View file

@ -0,0 +1,46 @@
import $ from 'jquery'
import Alert from './alert'
import Button from './button'
import Carousel from './carousel'
import Collapse from './collapse'
import Dropdown from './dropdown'
import Modal from './modal'
import Popover from './popover'
import Scrollspy from './scrollspy'
import Tab from './tab'
import Tooltip from './tooltip'
import Util from './util'
/**
* --------------------------------------------------------------------------
* Bootstrap (v4.0.0-alpha.6): index.js
* Licensed under MIT (https://github.com/twbs/bootstrap/blob/master/LICENSE)
* --------------------------------------------------------------------------
*/
(() => {
if (typeof jQuery === 'undefined') {
throw new Error('Bootstrap\'s JavaScript requires jQuery. jQuery must be included before Bootstrap\'s JavaScript.')
}
const version = $.fn.jquery.split(' ')[0].split('.')
const min = 3
const max = 4
if (version[0] < min || version[0] >= max) {
throw new Error('Bootstrap\'s JavaScript requires at least jQuery v3.0.0 but less than v4.0.0')
}
})(jQuery)
export {
Util,
Alert,
Button,
Carousel,
Collapse,
Dropdown,
Modal,
Popover,
Scrollspy,
Tab,
Tooltip
}

8
js/src/modal.js
View file

@ -1,3 +1,4 @@
import $ from 'jquery'
import Util from './util'
@ -8,7 +9,7 @@ import Util from './util'
* --------------------------------------------------------------------------
*/
const Modal = (($) => {
const Modal = (() => {
/**
@ -135,6 +136,8 @@ const Modal = (($) => {
this._checkScrollbar()
this._setScrollbar()
this._adjustDialog()
$(document.body).addClass(ClassName.OPEN)
this._setEscapeEvent()
@ -426,7 +429,8 @@ const Modal = (($) => {
}
_checkScrollbar() {
this._isBodyOverflowing = document.body.clientWidth < window.innerWidth
const rect = document.body.getBoundingClientRect()
this._isBodyOverflowing = rect.left + rect.right < window.innerWidth
this._scrollbarWidth = this._getScrollbarWidth()
}

3
js/src/popover.js
View file

@ -1,3 +1,4 @@
import $ from 'jquery'
import Tooltip from './tooltip'
@ -8,7 +9,7 @@ import Tooltip from './tooltip'
* --------------------------------------------------------------------------
*/
const Popover = (($) => {
const Popover = (() => {
/**

3
js/src/scrollspy.js
View file

@ -1,3 +1,4 @@
import $ from 'jquery'
import Util from './util'
@ -8,7 +9,7 @@ import Util from './util'
* --------------------------------------------------------------------------
*/
const ScrollSpy = (($) => {
const ScrollSpy = (() => {
/**

3
js/src/tab.js
View file

@ -1,3 +1,4 @@
import $ from 'jquery'
import Util from './util'
@ -8,7 +9,7 @@ import Util from './util'
* --------------------------------------------------------------------------
*/
const Tab = (($) => {
const Tab = (() => {
/**

14
js/src/tooltip.js
View file

@ -1,5 +1,5 @@
/* global Popper */
import $ from 'jquery'
import Popper from 'popper.js'
import Util from './util'
@ -10,7 +10,7 @@ import Util from './util'
* --------------------------------------------------------------------------
*/
const Tooltip = (($) => {
const Tooltip = (() => {
/**
* Check for Popper dependency
@ -622,18 +622,18 @@ const Tooltip = (($) => {
config
)
if (config.delay && typeof config.delay === 'number') {
if (typeof config.delay === 'number') {
config.delay = {
show : config.delay,
hide : config.delay
}
}
if (config.title && typeof config.title === 'number') {
if (typeof config.title === 'number') {
config.title = config.title.toString()
}
if (config.content && typeof config.content === 'number') {
if (typeof config.content === 'number') {
config.content = config.content.toString()
}
@ -728,6 +728,6 @@ const Tooltip = (($) => {
return Tooltip
})(jQuery)
})(jQuery, Popper)
export default Tooltip

6
js/src/util.js
View file

@ -1,3 +1,5 @@
import $ from 'jquery'
/**
* --------------------------------------------------------------------------
* Bootstrap (v4.0.0-beta): util.js
@ -5,7 +7,7 @@
* --------------------------------------------------------------------------
*/
const Util = (($) => {
const Util = (() => {
/**
@ -117,7 +119,7 @@ const Util = (($) => {
}
try {
const $selector = $(selector)
const $selector = $(document).find(selector)
return $selector.length > 0 ? selector : null
} catch (error) {
return null

1
js/tests/.eslintrc.json
View file

@ -28,6 +28,7 @@
"global-require": "off",
"no-process-env": "off",
"no-process-exit": "off",
"no-sync": "off",
// Stylistic Issues
"brace-style": "off",

78
js/tests/unit/modal.js
View file

@ -21,6 +21,8 @@ $(function () {
document.body.removeChild(scrollDiv)
return scrollbarWidth
}
// Simulate scrollbars in PhantomJS
$('html').css('padding-right', '16px')
},
beforeEach: function () {
// Run all tests in noConflict mode -- it's the only way to ensure that the plugin works in noConflict mode
@ -349,6 +351,20 @@ $(function () {
$toggleBtn.trigger('click')
})
QUnit.test('should adjust the inline padding of the modal when opening', function (assert) {
assert.expect(1)
var done = assert.async()
$('<div id="modal-test"/>')
.on('shown.bs.modal', function () {
var expectedPadding = $(this).getScrollbarWidth() + 'px'
var currentPadding = $(this).css('padding-right')
assert.strictEqual(currentPadding, expectedPadding, 'modal padding should be adjusted while opening')
done()
})
.bootstrapModal('show')
})
QUnit.test('should adjust the inline body padding when opening and restore when closing', function (assert) {
assert.expect(2)
var done = assert.async()
@ -391,6 +407,30 @@ $(function () {
.bootstrapModal('show')
})
QUnit.test('should not adjust the inline body padding when it does not overflow', function (assert) {
assert.expect(1)
var done = assert.async()
var $body = $(document.body)
var originalPadding = $body.css('padding-right')
// Hide scrollbars to prevent the body overflowing
$body.css('overflow', 'hidden') // real scrollbar (for in-browser testing)
$('html').css('padding-right', '0px') // simulated scrollbar (for PhantomJS)
$('<div id="modal-test"/>')
.on('shown.bs.modal', function () {
var currentPadding = $body.css('padding-right')
assert.strictEqual(currentPadding, originalPadding, 'body padding should not be adjusted')
$(this).bootstrapModal('hide')
// restore scrollbars
$body.css('overflow', 'auto')
$('html').css('padding-right', '16px')
done()
})
.bootstrapModal('show')
})
QUnit.test('should adjust the inline padding of fixed elements when opening and restore when closing', function (assert) {
assert.expect(2)
var done = assert.async()
@ -525,7 +565,7 @@ $(function () {
$('<div id="modal-test"/>')
.on('hidden.bs.modal', function () {
assert.ok(!$body.attr('style'), 'body does not have inline padding set')
assert.strictEqual($body.attr('style').indexOf('padding-right'), -1, 'body does not have inline padding set')
$style.remove()
done()
})
@ -597,4 +637,40 @@ $(function () {
})
.trigger('click')
})
QUnit.test('should not parse target as html', function (assert) {
assert.expect(1)
var done = assert.async()
var $toggleBtn = $('<button data-toggle="modal" data-target="&lt;div id=&quot;modal-test&quot;&gt;&lt;div class=&quot;contents&quot;&lt;div&lt;div id=&quot;close&quot; data-dismiss=&quot;modal&quot;/&gt;&lt;/div&gt;&lt;/div&gt;"/>')
.appendTo('#qunit-fixture')
$toggleBtn.trigger('click')
setTimeout(function () {
assert.strictEqual($('#modal-test').length, 0, 'target has not been parsed and added to the document')
done()
}, 1)
})
QUnit.test('should not execute js from target', function (assert) {
assert.expect(0)
var done = assert.async()
// This toggle button contains XSS payload in its data-target
// Note: it uses the onerror handler of an img element to execute the js, because a simple script element does not work here
// a script element works in manual tests though, so here it is likely blocked by the qunit framework
var $toggleBtn = $('<button data-toggle="modal" data-target="&lt;div&gt;&lt;image src=&quot;missing.png&quot; onerror=&quot;$(&apos;#qunit-fixture button.control&apos;).trigger(&apos;click&apos;)&quot;&gt;&lt;/div&gt;"/>')
.appendTo('#qunit-fixture')
// The XSS payload above does not have a closure over this function and cannot access the assert object directly
// However, it can send a click event to the following control button, which will then fail the assert
$('<button>')
.addClass('control')
.on('click', function () {
assert.notOk(true, 'XSS payload is not executed as js')
})
.appendTo('#qunit-fixture')
$toggleBtn.trigger('click')
setTimeout(done, 500)
})
})

4
js/tests/visual/modal.html
View file

@ -167,6 +167,10 @@
<div class="bg-dark text-white p-2" id="tall" style="display: none;">
Tall body content to force the page to have a scrollbar.
</div>
<button type="button" class="btn btn-secondary btn-lg" data-toggle="modal" data-target="&#x3C;div class=&#x22;modal fade the-bad&#x22; tabindex=&#x22;-1&#x22; role=&#x22;dialog&#x22;&#x3E;&#x3C;div class=&#x22;modal-dialog&#x22; role=&#x22;document&#x22;&#x3E;&#x3C;div class=&#x22;modal-content&#x22;&#x3E;&#x3C;div class=&#x22;modal-header&#x22;&#x3E;&#x3C;button type=&#x22;button&#x22; class=&#x22;close&#x22; data-dismiss=&#x22;modal&#x22; aria-label=&#x22;Close&#x22;&#x3E;&#x3C;span aria-hidden=&#x22;true&#x22;&#x3E;&#x26;times;&#x3C;/span&#x3E;&#x3C;/button&#x3E;&#x3C;h4 class=&#x22;modal-title&#x22;&#x3E;The Bad Modal&#x3C;/h4&#x3E;&#x3C;/div&#x3E;&#x3C;div class=&#x22;modal-body&#x22;&#x3E;This modal&#x27;s HTTML source code is declared inline, inside the data-target attribute of it&#x27;s show-button&#x3C;/div&#x3E;&#x3C;/div&#x3E;&#x3C;/div&#x3E;&#x3C;/div&#x3E;">
Modal with an XSS inside the data-target
</button>
</div>
<script src="../../../assets/js/vendor/jquery-slim.min.js"></script>

2770
package-lock.json generated
View file

File diff suppressed because it is too large Load diff

29
package.json
View file

@ -28,14 +28,17 @@
"css-prefix-docs": "postcss --config build/postcss.config.js --no-map --replace assets/css/docs.min.css",
"css-minify": "cleancss --level 1 --source-map --source-map-inline-sources --output dist/css/bootstrap.min.css dist/css/bootstrap.css && cleancss --level 1 --source-map --source-map-inline-sources --output dist/css/bootstrap-grid.min.css dist/css/bootstrap-grid.css && cleancss --level 1 --source-map --source-map-inline-sources --output dist/css/bootstrap-reboot.min.css dist/css/bootstrap-reboot.css",
"css-minify-docs": "cleancss --level 1 --source-map --source-map-inline-sources --output assets/css/docs.min.css assets/css/docs.min.css",
"js": "npm-run-all js-lint js-compile js-minify",
"js": "npm-run-all js-lint* js-compile js-minify",
"js-docs": "npm-run-all js-lint-docs js-minify-docs",
"js-lint": "eslint js/ && eslint --config js/tests/.eslintrc.json --env node build/ Gruntfile.js",
"js-lint-docs": "eslint --config js/tests/.eslintrc.json assets/js/",
"js-lint-docs": "eslint --config js/tests/.eslintrc.json assets/js/ sw.js",
"js-compile": "npm-run-all --parallel js-compile-*",
"js-compile-bundle": "shx cat js/src/util.js js/src/alert.js js/src/button.js js/src/carousel.js js/src/collapse.js js/src/dropdown.js js/src/modal.js js/src/scrollspy.js js/src/tab.js js/src/tooltip.js js/src/popover.js | shx sed \"s/^(import|export).*//\" | babel --filename js/src/bootstrap.js | node build/stamp.js > dist/js/bootstrap.js",
"js-compile-plugins": "babel js/src/ --out-dir js/dist/ --source-maps",
"js-minify": "uglifyjs --config-file build/uglifyjs.config.json --output dist/js/bootstrap.min.js dist/js/bootstrap.js",
"js-compile-standalone": "rollup --environment BUNDLE:false --config build/rollup.config.js",
"js-compile-bundle": "rollup --environment BUNDLE:true --config build/rollup.config.js",
"js-compile-plugins": "babel --no-babelrc js/src/ --out-dir js/dist/ --source-maps --presets=es2015 --plugins=transform-es2015-modules-strip",
"js-minify": "npm-run-all --parallel js-minify-standalone js-minify-bundle",
"js-minify-standalone": "uglifyjs --config-file build/uglifyjs.config.json --output dist/js/bootstrap.min.js dist/js/bootstrap.js",
"js-minify-bundle": "uglifyjs --config-file build/uglifyjs.config.json --output dist/js/bootstrap.bundle.min.js dist/js/bootstrap.bundle.js",
"js-minify-docs": "uglifyjs --config-file build/uglifyjs.config.json --output assets/js/docs.min.js assets/js/vendor/anchor.min.js assets/js/vendor/clipboard.min.js assets/js/vendor/holder.min.js assets/js/src/application.js assets/js/src/pwa.js",
"js-test": "phantomjs ./node_modules/qunit-phantomjs-runner/runner.js js/tests/index.html 60",
"js-test-cloud": "ruby -r webrick -e \"s = WEBrick::HTTPServer.new(:Port => 3000, :DocumentRoot => Dir.pwd, :Logger => WEBrick::Log.new('/dev/null'), :AccessLog => []); trap('INT') { s.shutdown }; s.start\" & grunt saucelabs-qunit",
@ -43,9 +46,9 @@
"docs-lint": "htmllint --rc build/.htmllintrc _gh_pages/*.html _gh_pages/**/*.html js/tests/visual/*.html",
"docs-compile": "bundle exec jekyll build",
"docs-serve": "bundle exec jekyll serve",
"docs-github": "shx echo 'github: true' > $npm_config_tmp/twbsconfig.yml && npm run docs-compile -- --config _config.yml,$npm_config_tmp/twbsconfig.yml && shx rm $npm_config_tmp/twbsconfig.yml",
"docs-github": "shx echo \"github: true\" > twbsconfig.yml && npm run docs-compile -- --config _config.yml,twbsconfig.yml && shx rm ./twbsconfig.yml",
"docs-upload-preview": "build/upload-preview.sh",
"maintenance-dependencies": "ncu -a -x jquery && npm update && bundle update && shx echo 'Manually update assets/js/vendor/*, js/tests/vendor/*, bower.json and .travis.yml'",
"maintenance-dependencies": "ncu -a -x jquery && npm update && bundle update && shx echo 'Manually update assets/js/vendor/*, js/tests/vendor/* and .travis.yml'",
"release-version": "node build/change-version.js",
"release-zip": "cd dist/ && zip -r9 bootstrap-$npm_package_version-dist.zip * && shx mv bootstrap-$npm_package_version-dist.zip ..",
"dist": "npm-run-all --parallel css js css-docs",
@ -67,13 +70,14 @@
"license": "MIT",
"dependencies": {},
"peerDependencies": {
"jquery": "3.0.0 - 4.0.0",
"jquery": "^3.0.0",
"popper.js": "^1.12.3"
},
"devDependencies": {
"autoprefixer": "^7.1.2",
"babel-cli": "^6.24.1",
"babel-eslint": "^7.2.3",
"babel-plugin-external-helpers": "^6.22.0",
"babel-plugin-transform-es2015-modules-strip": "^0.1.1",
"babel-preset-es2015": "^6.24.1",
"clean-css-cli": "^4.1.6",
@ -86,9 +90,13 @@
"nodemon": "^1.11.0",
"npm-run-all": "^4.0.2",
"phantomjs-prebuilt": "^2.1.14",
"popper.js": "^1.12.5",
"postcss-cli": "^4.1.0",
"qunit-phantomjs-runner": "^2.3.0",
"qunitjs": "^2.4.0",
"rollup": "^0.49.2",
"rollup-plugin-babel": "^3.0.2",
"rollup-plugin-node-resolve": "^3.0.0",
"shelljs": "^0.7.8",
"shx": "^0.2.2",
"uglify-js": "^3.0.24"
@ -110,6 +118,7 @@
"LICENSE"
],
"jspm": {
"registry": "npm",
"main": "js/bootstrap",
"directories": {
"lib": "dist"
@ -125,8 +134,8 @@
},
"dependencies": {},
"peerDependencies": {
"jquery": "3",
"popper.js": "npm:popper.js@^1.12.3"
"jquery": "^3.0.0",
"popper.js": "^1.12.3"
}
}
}

5
scss/_breadcrumb.scss
View file

@ -1,15 +1,14 @@
.breadcrumb {
display: flex;
flex-wrap: wrap;
padding: $breadcrumb-padding-y $breadcrumb-padding-x;
margin-bottom: $breadcrumb-margin-bottom;
list-style: none;
background-color: $breadcrumb-bg;
@include border-radius($border-radius);
@include clearfix;
}
.breadcrumb-item {
float: left;
// The separator between breadcrumbs (by default, a forward-slash: "/")
+ .breadcrumb-item::before {
display: inline-block; // Suppress underlining of the separator in modern browsers

1
scss/_forms.scss
View file

@ -130,6 +130,7 @@ select.form-control {
padding-bottom: $input-btn-padding-y;
margin-bottom: 0; // match inputs if this class comes on inputs with default margins
line-height: $input-btn-line-height;
background-color: transparent;
border: solid transparent;
border-width: $input-btn-border-width 0;

4
scss/_navbar.scss
View file

@ -98,6 +98,7 @@
// on the `.navbar` parent.
.navbar-collapse {
flex-basis: 100%;
flex-grow: 1;
// For always expanded or extra full navbars, ensure content aligns itself
// properly vertically. Can be easily overridden with flex utilities.
align-items: center;
@ -177,6 +178,9 @@
// scss-lint:disable ImportantRule
.navbar-collapse {
display: flex !important;
// Changes flex-bases to auto because of an IE10 bug
flex-basis: auto;
}
// scss-lint:enable ImportantRule

2
scss/mixins/_buttons.scss
View file

@ -10,7 +10,7 @@
@include box-shadow($btn-box-shadow);
@include hover {
@include color-yiq($background);
@include color-yiq($active-background);
background-color: $active-background;
border-color: $active-border;
}

4
scss/utilities/_borders.scss
View file

@ -44,9 +44,9 @@
}
.rounded-circle {
border-radius: 50%;
border-radius: 50% !important;
}
.rounded-0 {
border-radius: 0;
border-radius: 0 !important;
}