diff --git a/README.md b/README.md index 9c49e82526..df022a1c4c 100644 --- a/README.md +++ b/README.md @@ -144,7 +144,7 @@ Have a bug or a feature request? Please first read the [issue guidelines](https: Bootstrap's documentation, included in this repo in the root directory, is built with [Hugo](https://gohugo.io/) and publicly hosted on GitHub Pages at . The docs may also be run locally. -Documentation search is powered by [Algolia's DocSearch](https://docsearch.algolia.com/). Working on our search? Be sure to set `debug: true` in `site/assets/js/search.js`. +Documentation search is powered by [Algolia's DocSearch](https://docsearch.algolia.com/). ### Running documentation locally diff --git a/config.yml b/config.yml index b217aaa537..9835646069 100644 --- a/config.yml +++ b/config.yml @@ -82,6 +82,7 @@ params: js_bundle_hash: "sha384-w76AqPfDkMBDXo30jS1Sgez6pr3x5MlQ1ZAGC+nuZB+EYdgRZgiwxhTBTkF7CXvN" popper: "https://cdn.jsdelivr.net/npm/@popperjs/core@2.11.6/dist/umd/popper.min.js" popper_hash: "sha384-oBqDVmMz9ATKxIep9tiCxS/Z9fNfEXiDAYTujMAeBAsjFuCZSmKbSSUnQlmh/jp3" + popper_esm: "https://cdn.jsdelivr.net/npm/@popperjs/core@2.11.6/dist/esm/popper.min.js" anchors: min: 2 diff --git a/js/src/modal.js b/js/src/modal.js index 0a38586cef..a5adc8466e 100644 --- a/js/src/modal.js +++ b/js/src/modal.js @@ -208,7 +208,6 @@ class Modal extends BaseComponent { } if (this._config.keyboard) { - event.preventDefault() this.hide() return } diff --git a/js/src/offcanvas.js b/js/src/offcanvas.js index 54adf86ccb..4d5975c0f6 100644 --- a/js/src/offcanvas.js +++ b/js/src/offcanvas.js @@ -198,12 +198,12 @@ class Offcanvas extends BaseComponent { return } - if (!this._config.keyboard) { - EventHandler.trigger(this._element, EVENT_HIDE_PREVENTED) + if (this._config.keyboard) { + this.hide() return } - this.hide() + EventHandler.trigger(this._element, EVENT_HIDE_PREVENTED) }) } diff --git a/js/tests/unit/tooltip.spec.js b/js/tests/unit/tooltip.spec.js index 4330571b47..1c85640c07 100644 --- a/js/tests/unit/tooltip.spec.js +++ b/js/tests/unit/tooltip.spec.js @@ -56,7 +56,7 @@ describe('Tooltip', () => { describe('constructor', () => { it('should take care of element either passed as a CSS selector or DOM element', () => { - fixtureEl.innerHTML = '' + fixtureEl.innerHTML = '' const tooltipEl = fixtureEl.querySelector('#tooltipEl') const tooltipBySelector = new Tooltip('#tooltipEl') @@ -67,7 +67,7 @@ describe('Tooltip', () => { }) it('should not take care of disallowed data attributes', () => { - fixtureEl.innerHTML = '' + fixtureEl.innerHTML = '' const tooltipEl = fixtureEl.querySelector('a') const tooltip = new Tooltip(tooltipEl) @@ -76,7 +76,7 @@ describe('Tooltip', () => { }) it('should convert title and content to string if numbers', () => { - fixtureEl.innerHTML = '' + fixtureEl.innerHTML = '' const tooltipEl = fixtureEl.querySelector('a') const tooltip = new Tooltip(tooltipEl, { @@ -98,7 +98,7 @@ describe('Tooltip', () => { trigger: 'click' }) - containerEl.innerHTML = '' + containerEl.innerHTML = '' const tooltipInContainerEl = containerEl.querySelector('a') @@ -114,7 +114,7 @@ describe('Tooltip', () => { it('should create offset modifier when offset is passed as a function', () => { return new Promise(resolve => { - fixtureEl.innerHTML = '' + fixtureEl.innerHTML = '' const getOffset = jasmine.createSpy('getOffset').and.returnValue([10, 20]) const tooltipEl = fixtureEl.querySelector('a') @@ -141,7 +141,7 @@ describe('Tooltip', () => { }) it('should create offset modifier when offset option is passed in data attribute', () => { - fixtureEl.innerHTML = '' + fixtureEl.innerHTML = '' const tooltipEl = fixtureEl.querySelector('a') const tooltip = new Tooltip(tooltipEl) @@ -150,7 +150,7 @@ describe('Tooltip', () => { }) it('should allow to pass config to Popper with `popperConfig`', () => { - fixtureEl.innerHTML = '' + fixtureEl.innerHTML = '' const tooltipEl = fixtureEl.querySelector('a') const tooltip = new Tooltip(tooltipEl, { @@ -165,7 +165,7 @@ describe('Tooltip', () => { }) it('should allow to pass config to Popper with `popperConfig` as a function', () => { - fixtureEl.innerHTML = '' + fixtureEl.innerHTML = '' const tooltipEl = fixtureEl.querySelector('a') const getPopperConfig = jasmine.createSpy('getPopperConfig').and.returnValue({ placement: 'left' }) @@ -192,7 +192,7 @@ describe('Tooltip', () => { describe('enable', () => { it('should enable a tooltip', () => { return new Promise(resolve => { - fixtureEl.innerHTML = '' + fixtureEl.innerHTML = '' const tooltipEl = fixtureEl.querySelector('a') const tooltip = new Tooltip(tooltipEl) @@ -212,7 +212,7 @@ describe('Tooltip', () => { describe('disable', () => { it('should disable tooltip', () => { return new Promise((resolve, reject) => { - fixtureEl.innerHTML = '' + fixtureEl.innerHTML = '' const tooltipEl = fixtureEl.querySelector('a') const tooltip = new Tooltip(tooltipEl) @@ -235,7 +235,7 @@ describe('Tooltip', () => { describe('toggleEnabled', () => { it('should toggle enabled', () => { - fixtureEl.innerHTML = '' + fixtureEl.innerHTML = '' const tooltipEl = fixtureEl.querySelector('a') const tooltip = new Tooltip(tooltipEl) @@ -251,7 +251,7 @@ describe('Tooltip', () => { describe('toggle', () => { it('should do nothing if disabled', () => { return new Promise((resolve, reject) => { - fixtureEl.innerHTML = '' + fixtureEl.innerHTML = '' const tooltipEl = fixtureEl.querySelector('a') const tooltip = new Tooltip(tooltipEl) @@ -273,7 +273,7 @@ describe('Tooltip', () => { it('should show a tooltip', () => { return new Promise(resolve => { - fixtureEl.innerHTML = '' + fixtureEl.innerHTML = '' const tooltipEl = fixtureEl.querySelector('a') const tooltip = new Tooltip(tooltipEl) @@ -289,7 +289,7 @@ describe('Tooltip', () => { it('should call toggle and show the tooltip when trigger is "click"', () => { return new Promise(resolve => { - fixtureEl.innerHTML = '' + fixtureEl.innerHTML = '' const tooltipEl = fixtureEl.querySelector('a') const tooltip = new Tooltip(tooltipEl, { @@ -309,7 +309,7 @@ describe('Tooltip', () => { it('should hide a tooltip', () => { return new Promise(resolve => { - fixtureEl.innerHTML = '' + fixtureEl.innerHTML = '' const tooltipEl = fixtureEl.querySelector('a') const tooltip = new Tooltip(tooltipEl) @@ -329,7 +329,7 @@ describe('Tooltip', () => { it('should call toggle and hide the tooltip when trigger is "click"', () => { return new Promise(resolve => { - fixtureEl.innerHTML = '' + fixtureEl.innerHTML = '' const tooltipEl = fixtureEl.querySelector('a') const tooltip = new Tooltip(tooltipEl, { @@ -354,7 +354,7 @@ describe('Tooltip', () => { describe('dispose', () => { it('should destroy a tooltip', () => { - fixtureEl.innerHTML = '' + fixtureEl.innerHTML = '' const tooltipEl = fixtureEl.querySelector('a') const addEventSpy = spyOn(tooltipEl, 'addEventListener').and.callThrough() @@ -381,7 +381,7 @@ describe('Tooltip', () => { it('should destroy a tooltip after it is shown and hidden', () => { return new Promise(resolve => { - fixtureEl.innerHTML = '' + fixtureEl.innerHTML = '' const tooltipEl = fixtureEl.querySelector('a') const tooltip = new Tooltip(tooltipEl) @@ -402,7 +402,7 @@ describe('Tooltip', () => { it('should destroy a tooltip and remove it from the dom', () => { return new Promise(resolve => { - fixtureEl.innerHTML = '' + fixtureEl.innerHTML = '' const tooltipEl = fixtureEl.querySelector('a') const tooltip = new Tooltip(tooltipEl) @@ -443,7 +443,7 @@ describe('Tooltip', () => { describe('show', () => { it('should show a tooltip', () => { return new Promise(resolve => { - fixtureEl.innerHTML = '' + fixtureEl.innerHTML = '' const tooltipEl = fixtureEl.querySelector('a') const tooltip = new Tooltip(tooltipEl) @@ -488,7 +488,7 @@ describe('Tooltip', () => { it('should show a tooltip on mobile', () => { return new Promise(resolve => { - fixtureEl.innerHTML = '' + fixtureEl.innerHTML = '' const tooltipEl = fixtureEl.querySelector('a') const tooltip = new Tooltip(tooltipEl) @@ -509,7 +509,7 @@ describe('Tooltip', () => { it('should show a tooltip relative to placement option', () => { return new Promise(resolve => { - fixtureEl.innerHTML = '' + fixtureEl.innerHTML = '' const tooltipEl = fixtureEl.querySelector('a') const tooltip = new Tooltip(tooltipEl, { @@ -532,7 +532,7 @@ describe('Tooltip', () => { it('should not error when trying to show a tooltip that has been removed from the dom', () => { return new Promise(resolve => { - fixtureEl.innerHTML = '' + fixtureEl.innerHTML = '' const tooltipEl = fixtureEl.querySelector('a') const tooltip = new Tooltip(tooltipEl) @@ -561,7 +561,7 @@ describe('Tooltip', () => { it('should show a tooltip with a dom element container', () => { return new Promise(resolve => { - fixtureEl.innerHTML = '' + fixtureEl.innerHTML = '' const tooltipEl = fixtureEl.querySelector('a') const tooltip = new Tooltip(tooltipEl, { @@ -579,7 +579,7 @@ describe('Tooltip', () => { it('should show a tooltip with a jquery element container', () => { return new Promise(resolve => { - fixtureEl.innerHTML = '' + fixtureEl.innerHTML = '' const tooltipEl = fixtureEl.querySelector('a') const tooltip = new Tooltip(tooltipEl, { @@ -600,7 +600,7 @@ describe('Tooltip', () => { it('should show a tooltip with a selector in container', () => { return new Promise(resolve => { - fixtureEl.innerHTML = '' + fixtureEl.innerHTML = '' const tooltipEl = fixtureEl.querySelector('a') const tooltip = new Tooltip(tooltipEl, { @@ -618,7 +618,7 @@ describe('Tooltip', () => { it('should show a tooltip with placement as a function', () => { return new Promise(resolve => { - fixtureEl.innerHTML = '' + fixtureEl.innerHTML = '' const spy = jasmine.createSpy('placement').and.returnValue('top') const tooltipEl = fixtureEl.querySelector('a') @@ -638,7 +638,7 @@ describe('Tooltip', () => { it('should show a tooltip without the animation', () => { return new Promise(resolve => { - fixtureEl.innerHTML = '' + fixtureEl.innerHTML = '' const tooltipEl = fixtureEl.querySelector('a') const tooltip = new Tooltip(tooltipEl, { @@ -658,7 +658,7 @@ describe('Tooltip', () => { }) it('should throw an error the element is not visible', () => { - fixtureEl.innerHTML = '' + fixtureEl.innerHTML = '' const tooltipEl = fixtureEl.querySelector('a') const tooltip = new Tooltip(tooltipEl) @@ -672,7 +672,7 @@ describe('Tooltip', () => { it('should not show a tooltip if show.bs.tooltip is prevented', () => { return new Promise((resolve, reject) => { - fixtureEl.innerHTML = '' + fixtureEl.innerHTML = '' const tooltipEl = fixtureEl.querySelector('a') const tooltip = new Tooltip(tooltipEl) @@ -699,7 +699,7 @@ describe('Tooltip', () => { it('should show tooltip if leave event hasn\'t occurred before delay expires', () => { return new Promise(resolve => { - fixtureEl.innerHTML = '' + fixtureEl.innerHTML = '' const tooltipEl = fixtureEl.querySelector('a') const tooltip = new Tooltip(tooltipEl, { @@ -723,7 +723,7 @@ describe('Tooltip', () => { it('should not show tooltip if leave event occurs before delay expires', () => { return new Promise(resolve => { - fixtureEl.innerHTML = '' + fixtureEl.innerHTML = '' const tooltipEl = fixtureEl.querySelector('a') const tooltip = new Tooltip(tooltipEl, { @@ -845,7 +845,7 @@ describe('Tooltip', () => { it('should only trigger inserted event if a new tooltip element was created', () => { return new Promise(resolve => { - fixtureEl.innerHTML = '' + fixtureEl.innerHTML = '' const tooltipEl = fixtureEl.querySelector('a') const tooltip = new Tooltip(tooltipEl) @@ -878,7 +878,7 @@ describe('Tooltip', () => { it('should show a tooltip with custom class provided in data attributes', () => { return new Promise(resolve => { - fixtureEl.innerHTML = '' + fixtureEl.innerHTML = '' const tooltipEl = fixtureEl.querySelector('a') const tooltip = new Tooltip(tooltipEl) @@ -896,7 +896,7 @@ describe('Tooltip', () => { it('should show a tooltip with custom class provided as a string in config', () => { return new Promise(resolve => { - fixtureEl.innerHTML = '' + fixtureEl.innerHTML = '' const tooltipEl = fixtureEl.querySelector('a') const tooltip = new Tooltip(tooltipEl, { @@ -917,7 +917,7 @@ describe('Tooltip', () => { it('should show a tooltip with custom class provided as a function in config', () => { return new Promise(resolve => { - fixtureEl.innerHTML = '' + fixtureEl.innerHTML = '' const spy = jasmine.createSpy('customClass').and.returnValue('custom-class') const tooltipEl = fixtureEl.querySelector('a') @@ -956,7 +956,7 @@ describe('Tooltip', () => { describe('hide', () => { it('should hide a tooltip', () => { return new Promise(resolve => { - fixtureEl.innerHTML = '' + fixtureEl.innerHTML = '' const tooltipEl = fixtureEl.querySelector('a') const tooltip = new Tooltip(tooltipEl) @@ -974,7 +974,7 @@ describe('Tooltip', () => { it('should hide a tooltip on mobile', () => { return new Promise(resolve => { - fixtureEl.innerHTML = '' + fixtureEl.innerHTML = '' const tooltipEl = fixtureEl.querySelector('a') const tooltip = new Tooltip(tooltipEl) @@ -998,7 +998,7 @@ describe('Tooltip', () => { it('should hide a tooltip without animation', () => { return new Promise(resolve => { - fixtureEl.innerHTML = '' + fixtureEl.innerHTML = '' const tooltipEl = fixtureEl.querySelector('a') const tooltip = new Tooltip(tooltipEl, { @@ -1018,7 +1018,7 @@ describe('Tooltip', () => { it('should not hide a tooltip if hide event is prevented', () => { return new Promise((resolve, reject) => { - fixtureEl.innerHTML = '' + fixtureEl.innerHTML = '' const assertDone = () => { setTimeout(() => { @@ -1063,7 +1063,7 @@ describe('Tooltip', () => { describe('update', () => { it('should call popper update', () => { return new Promise(resolve => { - fixtureEl.innerHTML = '' + fixtureEl.innerHTML = '' const tooltipEl = fixtureEl.querySelector('a') const tooltip = new Tooltip(tooltipEl) @@ -1082,7 +1082,7 @@ describe('Tooltip', () => { }) it('should do nothing if the tooltip is not shown', () => { - fixtureEl.innerHTML = '' + fixtureEl.innerHTML = '' const tooltipEl = fixtureEl.querySelector('a') const tooltip = new Tooltip(tooltipEl) @@ -1094,7 +1094,7 @@ describe('Tooltip', () => { describe('_isWithContent', () => { it('should return true if there is content', () => { - fixtureEl.innerHTML = '' + fixtureEl.innerHTML = '' const tooltipEl = fixtureEl.querySelector('a') const tooltip = new Tooltip(tooltipEl) @@ -1103,7 +1103,7 @@ describe('Tooltip', () => { }) it('should return false if there is no content', () => { - fixtureEl.innerHTML = '' + fixtureEl.innerHTML = '' const tooltipEl = fixtureEl.querySelector('a') const tooltip = new Tooltip(tooltipEl) @@ -1114,7 +1114,7 @@ describe('Tooltip', () => { describe('_getTipElement', () => { it('should create the tip element and return it', () => { - fixtureEl.innerHTML = '' + fixtureEl.innerHTML = '' const tooltipEl = fixtureEl.querySelector('a') const tooltip = new Tooltip(tooltipEl) @@ -1126,7 +1126,7 @@ describe('Tooltip', () => { }) it('should return the created tip element', () => { - fixtureEl.innerHTML = '' + fixtureEl.innerHTML = '' const tooltipEl = fixtureEl.querySelector('a') const tooltip = new Tooltip(tooltipEl) @@ -1145,7 +1145,7 @@ describe('Tooltip', () => { describe('setContent', () => { it('should set tip content', () => { - fixtureEl.innerHTML = '' + fixtureEl.innerHTML = '' const tooltipEl = fixtureEl.querySelector('a') const tooltip = new Tooltip(tooltipEl, { animation: false }) @@ -1160,7 +1160,7 @@ describe('Tooltip', () => { }) it('should re-show tip if it was already shown', () => { - fixtureEl.innerHTML = '' + fixtureEl.innerHTML = '' const tooltipEl = fixtureEl.querySelector('a') const tooltip = new Tooltip(tooltipEl) @@ -1175,7 +1175,7 @@ describe('Tooltip', () => { }) it('should keep tip hidden, if it was already hidden before', () => { - fixtureEl.innerHTML = '' + fixtureEl.innerHTML = '' const tooltipEl = fixtureEl.querySelector('a') const tooltip = new Tooltip(tooltipEl) @@ -1190,7 +1190,7 @@ describe('Tooltip', () => { }) it('"setContent" should keep the initial template', () => { - fixtureEl.innerHTML = '' + fixtureEl.innerHTML = '' const tooltipEl = fixtureEl.querySelector('a') const tooltip = new Tooltip(tooltipEl) @@ -1207,7 +1207,7 @@ describe('Tooltip', () => { describe('setContent', () => { it('should do nothing if the element is null', () => { - fixtureEl.innerHTML = '' + fixtureEl.innerHTML = '' const tooltipEl = fixtureEl.querySelector('a') const tooltip = new Tooltip(tooltipEl) diff --git a/package-lock.json b/package-lock.json index 781d7128da..3258a39257 100644 --- a/package-lock.json +++ b/package-lock.json @@ -31,7 +31,7 @@ "bundlewatch": "^0.3.3", "clean-css-cli": "^5.6.2", "cross-env": "^7.0.3", - "eslint": "^8.32.0", + "eslint": "^8.34.0", "eslint-config-xo": "^0.43.1", "eslint-plugin-html": "^7.1.0", "eslint-plugin-import": "^2.27.5", @@ -53,15 +53,15 @@ "karma-jasmine": "^5.1.0", "karma-jasmine-html-reporter": "^2.0.0", "karma-rollup-preprocessor": "7.0.7", - "lockfile-lint": "^4.10.0", + "lockfile-lint": "^4.10.1", "nodemon": "^2.0.20", "npm-run-all": "^4.1.5", "postcss": "^8.4.21", "postcss-cli": "^10.1.0", - "rollup": "^3.10.1", + "rollup": "^3.15.0", "rollup-plugin-istanbul": "^4.0.0", "rtlcss": "^4.0.0", - "sass": "^1.57.1", + "sass": "^1.58.1", "sass-true": "^7.0.0", "shelljs": "^0.8.5", "stylelint": "^14.16.1", @@ -2228,9 +2228,9 @@ "dev": true }, "node_modules/@yarnpkg/parsers": { - "version": "3.0.0-rc.34", - "resolved": "https://registry.npmjs.org/@yarnpkg/parsers/-/parsers-3.0.0-rc.34.tgz", - "integrity": "sha512-NhEA0BusInyk7EiJ7i7qF1Mkrb6gGjZcQQ/W1xxGazxapubEmGO7v5WSll6hWxFXE2ngtLj8lflq1Ff5VtqEww==", + "version": "3.0.0-rc.39", + "resolved": "https://registry.npmjs.org/@yarnpkg/parsers/-/parsers-3.0.0-rc.39.tgz", + "integrity": "sha512-BsD4zq3EVmaHqlynXTceNuEFAtrfToV4fI9GA54moKlWZL4Eb2eXrhgf1jV2nMYx18SZxYO4Jc5Kf1sCDNRjOg==", "dev": true, "dependencies": { "js-yaml": "^3.10.0", @@ -4340,9 +4340,9 @@ } }, "node_modules/eslint": { - "version": "8.32.0", - "resolved": "https://registry.npmjs.org/eslint/-/eslint-8.32.0.tgz", - "integrity": "sha512-nETVXpnthqKPFyuY2FNjz/bEd6nbosRgKbkgS/y1C7LJop96gYHWpiguLecMHQ2XCPxn77DS0P+68WzG6vkZSQ==", + "version": "8.34.0", + "resolved": "https://registry.npmjs.org/eslint/-/eslint-8.34.0.tgz", + "integrity": "sha512-1Z8iFsucw+7kSqXNZVslXS8Ioa4u2KM7GPwuKtkTFAqZ/cHMcEaR+1+Br0wLlot49cNxIiZk5wp8EAbPcYZxTg==", "dev": true, "dependencies": { "@eslint/eslintrc": "^1.4.1", @@ -7074,14 +7074,14 @@ } }, "node_modules/lockfile-lint": { - "version": "4.10.0", - "resolved": "https://registry.npmjs.org/lockfile-lint/-/lockfile-lint-4.10.0.tgz", - "integrity": "sha512-OM11m0txImBLFzC8DVoNx+Oca11K8jXndwQV9WLwXgMeLDJtlXGbLwRBFINjyo1YQr/STrdsx3OBth3cee+41A==", + "version": "4.10.1", + "resolved": "https://registry.npmjs.org/lockfile-lint/-/lockfile-lint-4.10.1.tgz", + "integrity": "sha512-I45oGDBSKThsXiogy0hABI2T8TiR4Bk1cxpPrtA2J/MdqQYZIDl1k2+KqjD/fKRJtmaWfds70nK7Hl4K6r8veQ==", "dev": true, "dependencies": { "cosmiconfig": "^7.0.1", "debug": "^4.1.1", - "lockfile-lint-api": "^5.5.0", + "lockfile-lint-api": "^5.5.1", "yargs": "^16.0.0" }, "bin": { @@ -7092,9 +7092,9 @@ } }, "node_modules/lockfile-lint-api": { - "version": "5.5.0", - "resolved": "https://registry.npmjs.org/lockfile-lint-api/-/lockfile-lint-api-5.5.0.tgz", - "integrity": "sha512-L/Jk109tOSmTCPHjUEQSH/bYDRt7rgT1E2NN8/p3tmAwJuKwuWplJliVzZ+bBiIRWKmtXBDcfHnXJ9yT1shevQ==", + "version": "5.5.1", + "resolved": "https://registry.npmjs.org/lockfile-lint-api/-/lockfile-lint-api-5.5.1.tgz", + "integrity": "sha512-/29lQyXOSOgqgh5dbItWYE3sm7WAO2kWH7WmbbovUDAHyRLYtVqFfDzG35zlIOzlEydEJ33DKXl8GPoLjBAvEg==", "dev": true, "dependencies": { "@yarnpkg/parsers": "^3.0.0-rc.32", @@ -9192,9 +9192,9 @@ } }, "node_modules/rollup": { - "version": "3.10.1", - "resolved": "https://registry.npmjs.org/rollup/-/rollup-3.10.1.tgz", - "integrity": "sha512-3Er+yel3bZbZX1g2kjVM+FW+RUWDxbG87fcqFM5/9HbPCTpbVp6JOLn7jlxnNlbu7s/N/uDA4EV/91E2gWnxzw==", + "version": "3.15.0", + "resolved": "https://registry.npmjs.org/rollup/-/rollup-3.15.0.tgz", + "integrity": "sha512-F9hrCAhnp5/zx/7HYmftvsNBkMfLfk/dXUh73hPSM2E3CRgap65orDNJbLetoiUFwSAk6iHPLvBrZ5iHYvzqsg==", "dev": true, "bin": { "rollup": "dist/bin/rollup" @@ -9316,9 +9316,9 @@ "dev": true }, "node_modules/sass": { - "version": "1.57.1", - "resolved": "https://registry.npmjs.org/sass/-/sass-1.57.1.tgz", - "integrity": "sha512-O2+LwLS79op7GI0xZ8fqzF7X2m/m8WFfI02dHOdsK5R2ECeS5F62zrwg/relM1rjSLy7Vd/DiMNIvPrQGsA0jw==", + "version": "1.58.1", + "resolved": "https://registry.npmjs.org/sass/-/sass-1.58.1.tgz", + "integrity": "sha512-bnINi6nPXbP1XNRaranMFEBZWUfdW/AF16Ql5+ypRxfTvCRTTKrLsMIakyDcayUt2t/RZotmL4kgJwNH5xO+bg==", "dev": true, "dependencies": { "chokidar": ">=3.0.0 <4.0.0", @@ -10420,9 +10420,9 @@ } }, "node_modules/tslib": { - "version": "2.4.1", - "resolved": "https://registry.npmjs.org/tslib/-/tslib-2.4.1.tgz", - "integrity": "sha512-tGyy4dAjRIEwI7BzsB0lynWgOpfqjUdq91XXAlIWD2OwKBH7oCl/GZG/HT4BOHrTlPMOASlMQ7veyTqpmRcrNA==", + "version": "2.5.0", + "resolved": "https://registry.npmjs.org/tslib/-/tslib-2.5.0.tgz", + "integrity": "sha512-336iVw3rtn2BUK7ORdIAHTyxHGRIHVReokCR3XjbckJMK7ms8FysBfhLR8IXnAgy7T0PTPNBWKiH514FOW/WSg==", "dev": true }, "node_modules/tunnel-agent": { @@ -12448,9 +12448,9 @@ "dev": true }, "@yarnpkg/parsers": { - "version": "3.0.0-rc.34", - "resolved": "https://registry.npmjs.org/@yarnpkg/parsers/-/parsers-3.0.0-rc.34.tgz", - "integrity": "sha512-NhEA0BusInyk7EiJ7i7qF1Mkrb6gGjZcQQ/W1xxGazxapubEmGO7v5WSll6hWxFXE2ngtLj8lflq1Ff5VtqEww==", + "version": "3.0.0-rc.39", + "resolved": "https://registry.npmjs.org/@yarnpkg/parsers/-/parsers-3.0.0-rc.39.tgz", + "integrity": "sha512-BsD4zq3EVmaHqlynXTceNuEFAtrfToV4fI9GA54moKlWZL4Eb2eXrhgf1jV2nMYx18SZxYO4Jc5Kf1sCDNRjOg==", "dev": true, "requires": { "js-yaml": "^3.10.0", @@ -14044,9 +14044,9 @@ "dev": true }, "eslint": { - "version": "8.32.0", - "resolved": "https://registry.npmjs.org/eslint/-/eslint-8.32.0.tgz", - "integrity": "sha512-nETVXpnthqKPFyuY2FNjz/bEd6nbosRgKbkgS/y1C7LJop96gYHWpiguLecMHQ2XCPxn77DS0P+68WzG6vkZSQ==", + "version": "8.34.0", + "resolved": "https://registry.npmjs.org/eslint/-/eslint-8.34.0.tgz", + "integrity": "sha512-1Z8iFsucw+7kSqXNZVslXS8Ioa4u2KM7GPwuKtkTFAqZ/cHMcEaR+1+Br0wLlot49cNxIiZk5wp8EAbPcYZxTg==", "dev": true, "requires": { "@eslint/eslintrc": "^1.4.1", @@ -16086,21 +16086,21 @@ } }, "lockfile-lint": { - "version": "4.10.0", - "resolved": "https://registry.npmjs.org/lockfile-lint/-/lockfile-lint-4.10.0.tgz", - "integrity": "sha512-OM11m0txImBLFzC8DVoNx+Oca11K8jXndwQV9WLwXgMeLDJtlXGbLwRBFINjyo1YQr/STrdsx3OBth3cee+41A==", + "version": "4.10.1", + "resolved": "https://registry.npmjs.org/lockfile-lint/-/lockfile-lint-4.10.1.tgz", + "integrity": "sha512-I45oGDBSKThsXiogy0hABI2T8TiR4Bk1cxpPrtA2J/MdqQYZIDl1k2+KqjD/fKRJtmaWfds70nK7Hl4K6r8veQ==", "dev": true, "requires": { "cosmiconfig": "^7.0.1", "debug": "^4.1.1", - "lockfile-lint-api": "^5.5.0", + "lockfile-lint-api": "^5.5.1", "yargs": "^16.0.0" } }, "lockfile-lint-api": { - "version": "5.5.0", - "resolved": "https://registry.npmjs.org/lockfile-lint-api/-/lockfile-lint-api-5.5.0.tgz", - "integrity": "sha512-L/Jk109tOSmTCPHjUEQSH/bYDRt7rgT1E2NN8/p3tmAwJuKwuWplJliVzZ+bBiIRWKmtXBDcfHnXJ9yT1shevQ==", + "version": "5.5.1", + "resolved": "https://registry.npmjs.org/lockfile-lint-api/-/lockfile-lint-api-5.5.1.tgz", + "integrity": "sha512-/29lQyXOSOgqgh5dbItWYE3sm7WAO2kWH7WmbbovUDAHyRLYtVqFfDzG35zlIOzlEydEJ33DKXl8GPoLjBAvEg==", "dev": true, "requires": { "@yarnpkg/parsers": "^3.0.0-rc.32", @@ -17611,9 +17611,9 @@ } }, "rollup": { - "version": "3.10.1", - "resolved": "https://registry.npmjs.org/rollup/-/rollup-3.10.1.tgz", - "integrity": "sha512-3Er+yel3bZbZX1g2kjVM+FW+RUWDxbG87fcqFM5/9HbPCTpbVp6JOLn7jlxnNlbu7s/N/uDA4EV/91E2gWnxzw==", + "version": "3.15.0", + "resolved": "https://registry.npmjs.org/rollup/-/rollup-3.15.0.tgz", + "integrity": "sha512-F9hrCAhnp5/zx/7HYmftvsNBkMfLfk/dXUh73hPSM2E3CRgap65orDNJbLetoiUFwSAk6iHPLvBrZ5iHYvzqsg==", "dev": true, "requires": { "fsevents": "~2.3.2" @@ -17683,9 +17683,9 @@ "dev": true }, "sass": { - "version": "1.57.1", - "resolved": "https://registry.npmjs.org/sass/-/sass-1.57.1.tgz", - "integrity": "sha512-O2+LwLS79op7GI0xZ8fqzF7X2m/m8WFfI02dHOdsK5R2ECeS5F62zrwg/relM1rjSLy7Vd/DiMNIvPrQGsA0jw==", + "version": "1.58.1", + "resolved": "https://registry.npmjs.org/sass/-/sass-1.58.1.tgz", + "integrity": "sha512-bnINi6nPXbP1XNRaranMFEBZWUfdW/AF16Ql5+ypRxfTvCRTTKrLsMIakyDcayUt2t/RZotmL4kgJwNH5xO+bg==", "dev": true, "requires": { "chokidar": ">=3.0.0 <4.0.0", @@ -18550,9 +18550,9 @@ } }, "tslib": { - "version": "2.4.1", - "resolved": "https://registry.npmjs.org/tslib/-/tslib-2.4.1.tgz", - "integrity": "sha512-tGyy4dAjRIEwI7BzsB0lynWgOpfqjUdq91XXAlIWD2OwKBH7oCl/GZG/HT4BOHrTlPMOASlMQ7veyTqpmRcrNA==", + "version": "2.5.0", + "resolved": "https://registry.npmjs.org/tslib/-/tslib-2.5.0.tgz", + "integrity": "sha512-336iVw3rtn2BUK7ORdIAHTyxHGRIHVReokCR3XjbckJMK7ms8FysBfhLR8IXnAgy7T0PTPNBWKiH514FOW/WSg==", "dev": true }, "tunnel-agent": { diff --git a/package.json b/package.json index cd4a138af0..d09e04c935 100644 --- a/package.json +++ b/package.json @@ -74,8 +74,9 @@ "js-test-cloud": "cross-env BROWSERSTACK=true npm run js-test-karma", "js-test-jquery": "cross-env JQUERY=true npm run js-test-karma", "lint": "npm-run-all --aggregate-output --continue-on-error --parallel js-lint css-lint lockfile-lint", - "docs": "npm-run-all docs-build docs-lint", + "docs": "npm-run-all docs-build docs-lint docs-check-unused-templates", "docs-build": "hugo --cleanDestinationDir", + "docs-check-unused-templates": "hugo --printUnusedTemplates", "docs-compile": "npm run docs-build", "docs-vnu": "node build/vnu-jar.js", "docs-lint": "npm run docs-vnu", @@ -115,7 +116,7 @@ "bundlewatch": "^0.3.3", "clean-css-cli": "^5.6.2", "cross-env": "^7.0.3", - "eslint": "^8.32.0", + "eslint": "^8.34.0", "eslint-config-xo": "^0.43.1", "eslint-plugin-html": "^7.1.0", "eslint-plugin-import": "^2.27.5", @@ -137,15 +138,15 @@ "karma-jasmine": "^5.1.0", "karma-jasmine-html-reporter": "^2.0.0", "karma-rollup-preprocessor": "7.0.7", - "lockfile-lint": "^4.10.0", + "lockfile-lint": "^4.10.1", "nodemon": "^2.0.20", "npm-run-all": "^4.1.5", "postcss": "^8.4.21", "postcss-cli": "^10.1.0", - "rollup": "^3.10.1", + "rollup": "^3.15.0", "rollup-plugin-istanbul": "^4.0.0", "rtlcss": "^4.0.0", - "sass": "^1.57.1", + "sass": "^1.58.1", "sass-true": "^7.0.0", "shelljs": "^0.8.5", "stylelint": "^14.16.1", diff --git a/scss/_alert.scss b/scss/_alert.scss index 8647851b17..b8cff9b71e 100644 --- a/scss/_alert.scss +++ b/scss/_alert.scss @@ -59,10 +59,10 @@ // Generate contextual modifier classes for colorizing the alert @each $state in map-keys($theme-colors) { .alert-#{$state} { - --#{$prefix}alert-color: var(--#{$prefix}#{$state}-text); + --#{$prefix}alert-color: var(--#{$prefix}#{$state}-text-emphasis); --#{$prefix}alert-bg: var(--#{$prefix}#{$state}-bg-subtle); --#{$prefix}alert-border-color: var(--#{$prefix}#{$state}-border-subtle); - --#{$prefix}alert-link-color: var(--#{$prefix}#{$state}-text); + --#{$prefix}alert-link-color: var(--#{$prefix}#{$state}-text-emphasis); } } // scss-docs-end alert-modifiers diff --git a/scss/_list-group.scss b/scss/_list-group.scss index fd42cec3ae..455531eec0 100644 --- a/scss/_list-group.scss +++ b/scss/_list-group.scss @@ -182,7 +182,7 @@ @each $state in map-keys($theme-colors) { .list-group-item-#{$state} { - --#{$prefix}list-group-color: var(--#{$prefix}#{$state}-text); + --#{$prefix}list-group-color: var(--#{$prefix}#{$state}-text-emphasis); --#{$prefix}list-group-bg: var(--#{$prefix}#{$state}-bg-subtle); --#{$prefix}list-group-border-color: var(--#{$prefix}#{$state}-border-subtle); --#{$prefix}list-group-action-hover-color: var(--#{$prefix}emphasis-color); @@ -190,8 +190,8 @@ --#{$prefix}list-group-action-active-color: var(--#{$prefix}emphasis-color); --#{$prefix}list-group-action-active-bg: var(--#{$prefix}#{$state}-border-subtle); --#{$prefix}list-group-active-color: var(--#{$prefix}#{$state}-bg-subtle); - --#{$prefix}list-group-active-bg: var(--#{$prefix}#{$state}-text); - --#{$prefix}list-group-active-border-color: var(--#{$prefix}#{$state}-text); + --#{$prefix}list-group-active-bg: var(--#{$prefix}#{$state}-text-emphasis); + --#{$prefix}list-group-active-border-color: var(--#{$prefix}#{$state}-text-emphasis); } } // scss-docs-end list-group-modifiers diff --git a/scss/_nav.scss b/scss/_nav.scss index 5eb77b6348..aedbdba540 100644 --- a/scss/_nav.scss +++ b/scss/_nav.scss @@ -146,11 +146,6 @@ gap: var(--#{$prefix}nav-underline-gap); - // .nav-item + .nav-item, - // .nav-link + .nav-link { - // margin-left: $nav-link-padding-x; - // } - .nav-link { padding-right: 0; padding-left: 0; diff --git a/scss/_utilities.scss b/scss/_utilities.scss index 5ffb3feb82..9d4123d774 100644 --- a/scss/_utilities.scss +++ b/scss/_utilities.scss @@ -177,8 +177,9 @@ $utilities: map-merge( values: $utilities-border-subtle ), "border-width": ( - css-var: true, - css-variable-name: border-width, + property: border-width, + // css-var: true, + // css-variable-name: border-width, class: border, values: $border-widths ), diff --git a/scss/_variables.scss b/scss/_variables.scss index bf9b30afa1..6f255d4042 100644 --- a/scss/_variables.scss +++ b/scss/_variables.scss @@ -1234,7 +1234,7 @@ $dropdown-link-hover-bg: var(--#{$prefix}tertiary-bg) !default; $dropdown-link-active-color: $component-active-color !default; $dropdown-link-active-bg: $component-active-bg !default; -$dropdown-link-disabled-color: $gray-500 !default; +$dropdown-link-disabled-color: var(--#{$prefix}tertiary-color) !default; $dropdown-item-padding-y: $spacer * .25 !default; $dropdown-item-padding-x: $spacer !default; diff --git a/scss/tests/utilities/_api.test.scss b/scss/tests/utilities/_api.test.scss index b764cba5cb..304d8d1c94 100644 --- a/scss/tests/utilities/_api.test.scss +++ b/scss/tests/utilities/_api.test.scss @@ -27,10 +27,9 @@ $utilities: (); $grid-breakpoints: ( xs: 0, - sm: 576px, - md: 768px - ); - + sm: 333px, + md: 666px + ) !global; @include assert() { @include output() { @@ -52,13 +51,13 @@ $utilities: (); font-size: 1.25rem !important; } - @media (min-width: 576px) { + @media (min-width: 333px) { .padding-sm-1rem { padding: 1rem !important; } } - @media (min-width: 768px) { + @media (min-width: 666px) { .padding-md-1rem { padding: 1rem !important; } diff --git a/site/assets/js/search.js b/site/assets/js/search.js index 9bad2749f5..b095d3bbd9 100644 --- a/site/assets/js/search.js +++ b/site/assets/js/search.js @@ -40,8 +40,6 @@ return item }) - }, - // Set debug to `true` if you want to inspect the dropdown - debug: false + } }) })() diff --git a/site/assets/scss/_scrolling.scss b/site/assets/scss/_scrolling.scss new file mode 100644 index 0000000000..dcd9f3d395 --- /dev/null +++ b/site/assets/scss/_scrolling.scss @@ -0,0 +1,5 @@ +// When navigating with the keyboard, prevent focus from landing behind the sticky header + +main *:focus { + scroll-margin-top: 100px; +} diff --git a/site/assets/scss/_toc.scss b/site/assets/scss/_toc.scss index 38915aaee7..32bf3cf625 100644 --- a/site/assets/scss/_toc.scss +++ b/site/assets/scss/_toc.scss @@ -1,4 +1,4 @@ -// stylelint-disable selector-max-type, selector-no-qualifying-type, selector-max-compound-selectors +// stylelint-disable selector-max-type, selector-no-qualifying-type .bd-toc { @include media-breakpoint-up(lg) { @@ -16,22 +16,16 @@ ul { padding-left: 0; margin-bottom: 0; - margin-left: -.75rem; list-style: none; ul { padding-left: 1rem; - margin-left: -1rem; - - a { - padding-left: 1.375rem; - } } } a { display: block; - padding: .125rem 0 .125rem .625rem; + padding: .125rem 0 .125rem .75rem; color: inherit; text-decoration: none; border-left: .125rem solid transparent; @@ -86,7 +80,7 @@ .bd-toc-collapse { @include media-breakpoint-down(md) { nav { - padding: 1.25rem; + padding: 1.25rem 1.25rem 1.25rem 1rem; background-color: var(--bs-tertiary-bg); border: 1px solid var(--bs-border-color); @include border-radius(var(--bs-border-radius)); diff --git a/site/assets/scss/docs.scss b/site/assets/scss/docs.scss index 9d71147a80..fb85262e78 100644 --- a/site/assets/scss/docs.scss +++ b/site/assets/scss/docs.scss @@ -52,6 +52,7 @@ $enable-cssgrid: true; // stylelint-disable-line scss/dollar-variable-default @import "colors"; @import "clipboard-js"; @import "placeholder-img"; +@import "scrolling"; // Load docs dependencies @import "syntax"; diff --git a/site/content/docs/5.3/components/navs-tabs.md b/site/content/docs/5.3/components/navs-tabs.md index ca1effd700..3242506649 100644 --- a/site/content/docs/5.3/components/navs-tabs.md +++ b/site/content/docs/5.3/components/navs-tabs.md @@ -183,7 +183,7 @@ Take that same HTML, but use `.nav-underline` instead: Link
  • - Disabled + Disabled
    • {{< /example >}} diff --git a/site/content/docs/5.3/components/progress.md b/site/content/docs/5.3/components/progress.md index ea9e3d2d27..73f1315897 100644 --- a/site/content/docs/5.3/components/progress.md +++ b/site/content/docs/5.3/components/progress.md @@ -15,7 +15,7 @@ toc: true Progress components are built with two HTML elements, some CSS to set the width, and a few attributes. We don't use [the HTML5 `` element](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/progress), ensuring you can stack progress bars, animate them, and place text labels over them. - We use the `.progress` as a wrapper to indicate the max value of the progress bar. -- The `.progress` wrapper also requires a `role="progress"` and `aria` attributes to make it accessible, including an accessible name (using `aria-label`, `aria-labelledby`, or similar). +- The `.progress` wrapper also requires a `role="progressbar"` and `aria` attributes to make it accessible, including an accessible name (using `aria-label`, `aria-labelledby`, or similar). - We use the inner `.progress-bar` purely for the visual bar and label. - The `.progress-bar` requires an inline style, utility class, or custom CSS to set its width. - We provide a special `.progress-stacked` class to create multiple/stacked progress bars. @@ -57,7 +57,7 @@ Bootstrap provides a handful of [utilities for setting width]({{< docsref "/util You only set a `height` value on the `.progress` container, so if you change that value, the inner `.progress-bar` will automatically resize accordingly. {{< example >}} -
    +
    diff --git a/site/content/docs/5.3/forms/validation.md b/site/content/docs/5.3/forms/validation.md index d16a2d9f82..cf2a87e80a 100644 --- a/site/content/docs/5.3/forms/validation.md +++ b/site/content/docs/5.3/forms/validation.md @@ -127,7 +127,7 @@ While these feedback styles cannot be styled with CSS, you can still customize t
    @ - +
    diff --git a/site/content/docs/5.3/getting-started/introduction.md b/site/content/docs/5.3/getting-started/introduction.md index a4192fb658..d296d18ff5 100644 --- a/site/content/docs/5.3/getting-started/introduction.md +++ b/site/content/docs/5.3/getting-started/introduction.md @@ -119,7 +119,7 @@ Bootstrap requires the use of the HTML5 doctype. Without it, you'll see some fun ``` -### Responsive meta tag +### Viewport meta Bootstrap is developed *mobile first*, a strategy in which we optimize code for mobile devices first and then scale up components as necessary using CSS media queries. To ensure proper rendering and touch zooming for all devices, add the responsive viewport meta tag to your ``. diff --git a/site/content/docs/5.3/getting-started/javascript.md b/site/content/docs/5.3/getting-started/javascript.md index 80eed9ce1f..f80e6f26a5 100644 --- a/site/content/docs/5.3/getting-started/javascript.md +++ b/site/content/docs/5.3/getting-started/javascript.md @@ -71,7 +71,7 @@ To fix this, you can use an `importmap` to resolve the arbitrary module names to