From ef0bc661cfce6b5709189aa2d3edb85e0b1392e4 Mon Sep 17 00:00:00 2001 From: "dependabot[bot]" <49699333+dependabot[bot]@users.noreply.github.com> Date: Thu, 17 Dec 2020 15:01:11 +0200 Subject: [PATCH 01/89] Bump @babel/preset-env from 7.12.10 to 7.12.11 (#32515) * Bump @babel/preset-env from 7.12.10 to 7.12.11 Bumps [@babel/preset-env](https://github.com/babel/babel/tree/HEAD/packages/babel-preset-env) from 7.12.10 to 7.12.11. - [Release notes](https://github.com/babel/babel/releases) - [Changelog](https://github.com/babel/babel/blob/main/CHANGELOG.md) - [Commits](https://github.com/babel/babel/commits/v7.12.11/packages/babel-preset-env) Signed-off-by: dependabot[bot] * Update package-lock.json Co-authored-by: dependabot[bot] <49699333+dependabot[bot]@users.noreply.github.com> Co-authored-by: XhmikosR --- package-lock.json | 92 +++++++++++++++++++++++------------------------ package.json | 2 +- 2 files changed, 47 insertions(+), 47 deletions(-) diff --git a/package-lock.json b/package-lock.json index 8d835ff5b..af1b0d0b9 100644 --- a/package-lock.json +++ b/package-lock.json @@ -23,9 +23,9 @@ } }, "@babel/code-frame": { - "version": "7.10.4", - "resolved": "https://registry.npmjs.org/@babel/code-frame/-/code-frame-7.10.4.tgz", - "integrity": "sha512-vG6SvB6oYEhvgisZNFRmRCUkLz11c7rp+tbNTynGqc6mS1d5ATd/sGyV6W0KZZnXRKMTzZDRgQT3Ou9jhpAfUg==", + "version": "7.12.11", + "resolved": "https://registry.npmjs.org/@babel/code-frame/-/code-frame-7.12.11.tgz", + "integrity": "sha512-Zt1yodBx1UcyiePMSkWnU4hPqhwq7hGi2nFL1LeA3EUl+q2LQx16MISgJ0+z7dnmgvP9QtIleuETGOiOH1RcIw==", "dev": true, "requires": { "@babel/highlight": "^7.10.4" @@ -78,12 +78,12 @@ } }, "@babel/generator": { - "version": "7.12.10", - "resolved": "https://registry.npmjs.org/@babel/generator/-/generator-7.12.10.tgz", - "integrity": "sha512-6mCdfhWgmqLdtTkhXjnIz0LcdVCd26wS2JXRtj2XY0u5klDsXBREA/pG5NVOuVnF2LUrBGNFtQkIqqTbblg0ww==", + "version": "7.12.11", + "resolved": "https://registry.npmjs.org/@babel/generator/-/generator-7.12.11.tgz", + "integrity": "sha512-Ggg6WPOJtSi8yYQvLVjG8F/TlpWDlKx0OpS4Kt+xMQPs5OaGYWy+v1A+1TvxI6sAMGZpKWWoAQ1DaeQbImlItA==", "dev": true, "requires": { - "@babel/types": "^7.12.10", + "@babel/types": "^7.12.11", "jsesc": "^2.5.1", "source-map": "^0.5.0" } @@ -163,14 +163,14 @@ } }, "@babel/helper-function-name": { - "version": "7.10.4", - "resolved": "https://registry.npmjs.org/@babel/helper-function-name/-/helper-function-name-7.10.4.tgz", - "integrity": "sha512-YdaSyz1n8gY44EmN7x44zBn9zQ1Ry2Y+3GTA+3vH6Mizke1Vw0aWDM66FOYEPw8//qKkmqOckrGgTYa+6sceqQ==", + "version": "7.12.11", + "resolved": "https://registry.npmjs.org/@babel/helper-function-name/-/helper-function-name-7.12.11.tgz", + "integrity": "sha512-AtQKjtYNolKNi6nNNVLQ27CP6D9oFR6bq/HPYSizlzbp7uC1M59XJe8L+0uXjbIaZaUJF99ruHqVGiKXU/7ybA==", "dev": true, "requires": { - "@babel/helper-get-function-arity": "^7.10.4", - "@babel/template": "^7.10.4", - "@babel/types": "^7.10.4" + "@babel/helper-get-function-arity": "^7.12.10", + "@babel/template": "^7.12.7", + "@babel/types": "^7.12.11" } }, "@babel/helper-get-function-arity": { @@ -253,15 +253,15 @@ } }, "@babel/helper-replace-supers": { - "version": "7.12.5", - "resolved": "https://registry.npmjs.org/@babel/helper-replace-supers/-/helper-replace-supers-7.12.5.tgz", - "integrity": "sha512-5YILoed0ZyIpF4gKcpZitEnXEJ9UoDRki1Ey6xz46rxOzfNMAhVIJMoune1hmPVxh40LRv1+oafz7UsWX+vyWA==", + "version": "7.12.11", + "resolved": "https://registry.npmjs.org/@babel/helper-replace-supers/-/helper-replace-supers-7.12.11.tgz", + "integrity": "sha512-q+w1cqmhL7R0FNzth/PLLp2N+scXEK/L2AHbXUyydxp828F4FEa5WcVoqui9vFRiHDQErj9Zof8azP32uGVTRA==", "dev": true, "requires": { - "@babel/helper-member-expression-to-functions": "^7.12.1", - "@babel/helper-optimise-call-expression": "^7.10.4", - "@babel/traverse": "^7.12.5", - "@babel/types": "^7.12.5" + "@babel/helper-member-expression-to-functions": "^7.12.7", + "@babel/helper-optimise-call-expression": "^7.12.10", + "@babel/traverse": "^7.12.10", + "@babel/types": "^7.12.11" } }, "@babel/helper-simple-access": { @@ -283,24 +283,24 @@ } }, "@babel/helper-split-export-declaration": { - "version": "7.11.0", - "resolved": "https://registry.npmjs.org/@babel/helper-split-export-declaration/-/helper-split-export-declaration-7.11.0.tgz", - "integrity": "sha512-74Vejvp6mHkGE+m+k5vHY93FX2cAtrw1zXrZXRlG4l410Nm9PxfEiVTn1PjDPV5SnmieiueY4AFg2xqhNFuuZg==", + "version": "7.12.11", + "resolved": "https://registry.npmjs.org/@babel/helper-split-export-declaration/-/helper-split-export-declaration-7.12.11.tgz", + "integrity": "sha512-LsIVN8j48gHgwzfocYUSkO/hjYAOJqlpJEc7tGXcIm4cubjVUf8LGW6eWRyxEu7gA25q02p0rQUWoCI33HNS5g==", "dev": true, "requires": { - "@babel/types": "^7.11.0" + "@babel/types": "^7.12.11" } }, "@babel/helper-validator-identifier": { - "version": "7.10.4", - "resolved": "https://registry.npmjs.org/@babel/helper-validator-identifier/-/helper-validator-identifier-7.10.4.tgz", - "integrity": "sha512-3U9y+43hz7ZM+rzG24Qe2mufW5KhvFg/NhnNph+i9mgCtdTCtMJuI1TMkrIUiK7Ix4PYlRF9I5dhqaLYA/ADXw==", + "version": "7.12.11", + "resolved": "https://registry.npmjs.org/@babel/helper-validator-identifier/-/helper-validator-identifier-7.12.11.tgz", + "integrity": "sha512-np/lG3uARFybkoHokJUmf1QfEvRVCPbmQeUQpKow5cQ3xWrV9i3rUHodKDJPQfTVX61qKi+UdYk8kik84n7XOw==", "dev": true }, "@babel/helper-validator-option": { - "version": "7.12.1", - "resolved": "https://registry.npmjs.org/@babel/helper-validator-option/-/helper-validator-option-7.12.1.tgz", - "integrity": "sha512-YpJabsXlJVWP0USHjnC/AQDTLlZERbON577YUVO/wLpqyj6HAtVYnWaQaN0iUN+1/tWn3c+uKKXjRut5115Y2A==", + "version": "7.12.11", + "resolved": "https://registry.npmjs.org/@babel/helper-validator-option/-/helper-validator-option-7.12.11.tgz", + "integrity": "sha512-TBFCyj939mFSdeX7U7DDj32WtzYY7fDcalgq8v3fBZMNOJQNn7nOYzMaUCiPxPYfCup69mtIpqlKgMZLvQ8Xhw==", "dev": true }, "@babel/helper-wrap-function": { @@ -338,9 +338,9 @@ } }, "@babel/parser": { - "version": "7.12.10", - "resolved": "https://registry.npmjs.org/@babel/parser/-/parser-7.12.10.tgz", - "integrity": "sha512-PJdRPwyoOqFAWfLytxrWwGrAxghCgh/yTNCYciOz8QgjflA7aZhECPZAa2VUedKg2+QMWkI0L9lynh2SNmNEgA==", + "version": "7.12.11", + "resolved": "https://registry.npmjs.org/@babel/parser/-/parser-7.12.11.tgz", + "integrity": "sha512-N3UxG+uuF4CMYoNj8AhnbAcJF0PiuJ9KHuy1lQmkYsxTer/MAH9UBNHsBoAX/4s6NvlDD047No8mYVGGzLL4hg==", "dev": true }, "@babel/plugin-proposal-async-generator-functions": { @@ -614,9 +614,9 @@ } }, "@babel/plugin-transform-block-scoping": { - "version": "7.12.1", - "resolved": "https://registry.npmjs.org/@babel/plugin-transform-block-scoping/-/plugin-transform-block-scoping-7.12.1.tgz", - "integrity": "sha512-zJyAC9sZdE60r1nVQHblcfCj29Dh2Y0DOvlMkcqSo0ckqjiCwNiUezUKw+RjOCwGfpLRwnAeQ2XlLpsnGkvv9w==", + "version": "7.12.11", + "resolved": "https://registry.npmjs.org/@babel/plugin-transform-block-scoping/-/plugin-transform-block-scoping-7.12.11.tgz", + "integrity": "sha512-atR1Rxc3hM+VPg/NvNvfYw0npQEAcHuJ+MGZnFn6h3bo+1U3BWXMdFMlvVRApBTWKQMX7SOwRJZA5FBF/JQbvA==", "dev": true, "requires": { "@babel/helper-plugin-utils": "^7.10.4" @@ -898,16 +898,16 @@ } }, "@babel/preset-env": { - "version": "7.12.10", - "resolved": "https://registry.npmjs.org/@babel/preset-env/-/preset-env-7.12.10.tgz", - "integrity": "sha512-Gz9hnBT/tGeTE2DBNDkD7BiWRELZt+8lSysHuDwmYXUIvtwZl0zI+D6mZgXZX0u8YBlLS4tmai9ONNY9tjRgRA==", + "version": "7.12.11", + "resolved": "https://registry.npmjs.org/@babel/preset-env/-/preset-env-7.12.11.tgz", + "integrity": "sha512-j8Tb+KKIXKYlDBQyIOy4BLxzv1NUOwlHfZ74rvW+Z0Gp4/cI2IMDPBWAgWceGcE7aep9oL/0K9mlzlMGxA8yNw==", "dev": true, "requires": { "@babel/compat-data": "^7.12.7", "@babel/helper-compilation-targets": "^7.12.5", "@babel/helper-module-imports": "^7.12.5", "@babel/helper-plugin-utils": "^7.10.4", - "@babel/helper-validator-option": "^7.12.1", + "@babel/helper-validator-option": "^7.12.11", "@babel/plugin-proposal-async-generator-functions": "^7.12.1", "@babel/plugin-proposal-class-properties": "^7.12.1", "@babel/plugin-proposal-dynamic-import": "^7.12.1", @@ -936,7 +936,7 @@ "@babel/plugin-transform-arrow-functions": "^7.12.1", "@babel/plugin-transform-async-to-generator": "^7.12.1", "@babel/plugin-transform-block-scoped-functions": "^7.12.1", - "@babel/plugin-transform-block-scoping": "^7.12.1", + "@babel/plugin-transform-block-scoping": "^7.12.11", "@babel/plugin-transform-classes": "^7.12.1", "@babel/plugin-transform-computed-properties": "^7.12.1", "@babel/plugin-transform-destructuring": "^7.12.1", @@ -966,7 +966,7 @@ "@babel/plugin-transform-unicode-escapes": "^7.12.1", "@babel/plugin-transform-unicode-regex": "^7.12.1", "@babel/preset-modules": "^0.1.3", - "@babel/types": "^7.12.10", + "@babel/types": "^7.12.11", "core-js-compat": "^3.8.0", "semver": "^5.5.0" } @@ -1039,12 +1039,12 @@ } }, "@babel/types": { - "version": "7.12.10", - "resolved": "https://registry.npmjs.org/@babel/types/-/types-7.12.10.tgz", - "integrity": "sha512-sf6wboJV5mGyip2hIpDSKsr80RszPinEFjsHTalMxZAZkoQ2/2yQzxlcFN52SJqsyPfLtPmenL4g2KB3KJXPDw==", + "version": "7.12.11", + "resolved": "https://registry.npmjs.org/@babel/types/-/types-7.12.11.tgz", + "integrity": "sha512-ukA9SQtKThINm++CX1CwmliMrE54J6nIYB5XTwL5f/CLFW9owfls+YSU8tVW15RQ2w+a3fSbPjC6HdQNtWZkiA==", "dev": true, "requires": { - "@babel/helper-validator-identifier": "^7.10.4", + "@babel/helper-validator-identifier": "^7.12.11", "lodash": "^4.17.19", "to-fast-properties": "^2.0.0" } diff --git a/package.json b/package.json index 4e82b78ca..11e06e03f 100644 --- a/package.json +++ b/package.json @@ -100,7 +100,7 @@ "devDependencies": { "@babel/cli": "^7.12.10", "@babel/core": "^7.12.10", - "@babel/preset-env": "^7.12.10", + "@babel/preset-env": "^7.12.11", "@popperjs/core": "^2.6.0", "@rollup/plugin-babel": "^5.2.2", "@rollup/plugin-commonjs": "^17.0.0", From f07106e604c3bb3d7ea80b91f79378b55218d039 Mon Sep 17 00:00:00 2001 From: Marc Jansing Date: Fri, 18 Dec 2020 06:39:39 +0100 Subject: [PATCH 02/89] Add helpers to utilities bundle (#32324) Adds currently missing utilities classes which are located in scss/helpers to boostrap-utilities dist files. Co-authored-by: XhmikosR --- .bundlewatch.config.json | 4 ++-- scss/bootstrap-utilities.scss | 4 ++-- site/content/docs/5.0/migration.md | 3 +++ 3 files changed, 7 insertions(+), 4 deletions(-) diff --git a/.bundlewatch.config.json b/.bundlewatch.config.json index 074066390..da47da480 100644 --- a/.bundlewatch.config.json +++ b/.bundlewatch.config.json @@ -18,11 +18,11 @@ }, { "path": "./dist/css/bootstrap-utilities.css", - "maxSize": "7 kB" + "maxSize": "7.5 kB" }, { "path": "./dist/css/bootstrap-utilities.min.css", - "maxSize": "6.25 kB" + "maxSize": "6.75 kB" }, { "path": "./dist/css/bootstrap.css", diff --git a/scss/bootstrap-utilities.scss b/scss/bootstrap-utilities.scss index 8d96cf9d7..265aa890a 100644 --- a/scss/bootstrap-utilities.scss +++ b/scss/bootstrap-utilities.scss @@ -6,13 +6,13 @@ */ // Configuration - @import "functions"; @import "variables"; @import "mixins"; @import "utilities"; +// Helpers +@import "helpers"; // Utilities - @import "utilities/api"; diff --git a/site/content/docs/5.0/migration.md b/site/content/docs/5.0/migration.md index b2e08c3ab..1a442d516 100644 --- a/site/content/docs/5.0/migration.md +++ b/site/content/docs/5.0/migration.md @@ -11,7 +11,10 @@ toc: true ### Sass +#### Utilities + - Extended the `.visually-hidden-focusable` helper to also work on containers, using `:focus-within`. +- `bootstrap-utilities.css` now also includes our helpers. Helpers don't need to be imported in custom builds anymore. - Extended form validation states customization capabilities. Added three new optional parameters to the `form-validation-state` mixin: `tooltip-color`, `tooltip-bg-color`, `focus-box-shadow`. These parameters can be set in the `$form-validation-states` map. [See #31757](https://github.com/twbs/bootstrap/pull/31757). ### JavaScript From 5c8890687aa631a315438529346e89f4943d82a8 Mon Sep 17 00:00:00 2001 From: joke2k Date: Sat, 12 Dec 2020 00:54:29 +0000 Subject: [PATCH 03/89] Restore offset option for dropdown component --- js/src/dropdown.js | 31 +++++++++++++++++++ site/content/docs/5.0/components/dropdowns.md | 10 ++++++ 2 files changed, 41 insertions(+) diff --git a/js/src/dropdown.js b/js/src/dropdown.js index 4d65008f8..8824935d7 100644 --- a/js/src/dropdown.js +++ b/js/src/dropdown.js @@ -289,6 +289,31 @@ class Dropdown extends BaseComponent { return this._element.closest(`.${CLASS_NAME_NAVBAR}`) !== null } + _getOffset() { + let offset = [0, 0] + + if (!this._config.offset) { + return offset + } + + if (typeof this._config.offset === 'number') { + offset[0] = this._config.offset + } else if (typeof this._config.offset === 'string') { + offset = offset.split(',') + if (offset.length === 1) { + offset = [offset[0], 0] + } + + offset = offset.map(val => Number.parseInt(val, 10)) + } else if (typeof this._config.offset === 'function') { + offset = (popper, reference, placement) => { + return offset({ popper, reference, placement }, this._element) + } + } + + return offset + } + _getPopperConfig() { const popperConfig = { placement: this._getPlacement(), @@ -304,6 +329,12 @@ class Dropdown extends BaseComponent { options: { fallbackPlacements: ['top', 'right', 'bottom', 'left'] } + }, + { + name: 'offset', + options: { + offset: this._getOffset() + } }] } diff --git a/site/content/docs/5.0/components/dropdowns.md b/site/content/docs/5.0/components/dropdowns.md index 50dcde2ba..416b80fd0 100644 --- a/site/content/docs/5.0/components/dropdowns.md +++ b/site/content/docs/5.0/components/dropdowns.md @@ -896,6 +896,16 @@ Options can be passed via data attributes or JavaScript. For data attributes, ap 'dynamic' By default, we use Popper for dynamic positioning. Disable this with static. + + offset + number | string | function + 0 + +

Offset of the dropdown relative to its target.

+

When a function is used to determine the offset, it is called with an object containing the popper offsets object data as its first argument. The function must return an array with two numbers: [skidding, distance]. The triggering element DOM node is passed as the second argument.

+

For more information refer to Popper.js's offset docs.

+ + popperConfig null | object From 5d22c10d081c3fb77221283715d49f59c8ee17c3 Mon Sep 17 00:00:00 2001 From: joke2k Date: Sat, 12 Dec 2020 01:27:54 +0000 Subject: [PATCH 04/89] tests for dropdown offsets --- js/src/dropdown.js | 14 ++++---- js/tests/unit/dropdown.spec.js | 36 +++++++++++++++++++ site/content/docs/5.0/components/dropdowns.md | 2 +- 3 files changed, 44 insertions(+), 8 deletions(-) diff --git a/js/src/dropdown.js b/js/src/dropdown.js index 8824935d7..177c7f7d5 100644 --- a/js/src/dropdown.js +++ b/js/src/dropdown.js @@ -290,22 +290,22 @@ class Dropdown extends BaseComponent { } _getOffset() { - let offset = [0, 0] + let { offset } = this._config - if (!this._config.offset) { - return offset + if (!offset) { + return [0, 0] } - if (typeof this._config.offset === 'number') { - offset[0] = this._config.offset - } else if (typeof this._config.offset === 'string') { + if (typeof offset === 'number') { + offset = [offset, 0] + } else if (typeof offset === 'string') { offset = offset.split(',') if (offset.length === 1) { offset = [offset[0], 0] } offset = offset.map(val => Number.parseInt(val, 10)) - } else if (typeof this._config.offset === 'function') { + } else if (typeof offset === 'function') { offset = (popper, reference, placement) => { return offset({ popper, reference, placement }, this._element) } diff --git a/js/tests/unit/dropdown.spec.js b/js/tests/unit/dropdown.spec.js index d2171f369..c59cd3b02 100644 --- a/js/tests/unit/dropdown.spec.js +++ b/js/tests/unit/dropdown.spec.js @@ -54,6 +54,42 @@ describe('Dropdown', () => { expect(dropdown.toggle).toHaveBeenCalled() }) + it('should create offset modifier correctly when offset option is a function', () => { + fixtureEl.innerHTML = [ + '
', + ' ', + '
', + ' Secondary link', + '
', + '
' + ].join('') + + const getOffset = () => [10, 20] + const btnDropdown = fixtureEl.querySelector('[data-bs-toggle="dropdown"]') + const dropdown = new Dropdown(btnDropdown, { + offset: getOffset + }) + const offset = dropdown._getOffset() + + expect(typeof offset).toEqual('function') + }) + + it('should create offset modifier correctly when offset option is a string into data attribute', () => { + fixtureEl.innerHTML = [ + '
', + ' ', + '
', + ' Secondary link', + '
', + '
' + ].join('') + + const btnDropdown = fixtureEl.querySelector('[data-bs-toggle="dropdown"]') + const dropdown = new Dropdown(btnDropdown) + + expect(dropdown._getOffset()).toEqual([10, 20]) + }) + it('should allow to pass config to Popper with `popperConfig`', () => { fixtureEl.innerHTML = [ '
', diff --git a/site/content/docs/5.0/components/dropdowns.md b/site/content/docs/5.0/components/dropdowns.md index 416b80fd0..948eedeb8 100644 --- a/site/content/docs/5.0/components/dropdowns.md +++ b/site/content/docs/5.0/components/dropdowns.md @@ -899,7 +899,7 @@ Options can be passed via data attributes or JavaScript. For data attributes, ap offset number | string | function - 0 + "0,0"

Offset of the dropdown relative to its target.

When a function is used to determine the offset, it is called with an object containing the popper offsets object data as its first argument. The function must return an array with two numbers: [skidding, distance]. The triggering element DOM node is passed as the second argument.

From 2090329d546cbce97c8f2756bfa0cc6781a7f5f5 Mon Sep 17 00:00:00 2001 From: joke2k Date: Sun, 13 Dec 2020 11:31:49 +0000 Subject: [PATCH 05/89] simplify offset config --- js/src/dropdown.js | 17 +++++------------ 1 file changed, 5 insertions(+), 12 deletions(-) diff --git a/js/src/dropdown.js b/js/src/dropdown.js index 177c7f7d5..78ad80371 100644 --- a/js/src/dropdown.js +++ b/js/src/dropdown.js @@ -72,7 +72,7 @@ const PLACEMENT_RIGHT = isRTL ? 'left-start' : 'right-start' const PLACEMENT_LEFT = isRTL ? 'right-start' : 'left-start' const Default = { - offset: 0, + offset: [0, 0], flip: true, boundary: 'clippingParents', reference: 'toggle', @@ -81,7 +81,7 @@ const Default = { } const DefaultType = { - offset: '(number|string|function)', + offset: '(array|string|function)', flip: 'boolean', boundary: '(string|element)', reference: '(string|element)', @@ -296,17 +296,10 @@ class Dropdown extends BaseComponent { return [0, 0] } - if (typeof offset === 'number') { - offset = [offset, 0] - } else if (typeof offset === 'string') { - offset = offset.split(',') - if (offset.length === 1) { - offset = [offset[0], 0] - } - - offset = offset.map(val => Number.parseInt(val, 10)) + if (typeof offset === 'string') { + offset = offset.split(',').map(val => Number.parseInt(val, 10)) } else if (typeof offset === 'function') { - offset = (popper, reference, placement) => { + offset = ({ popper, reference, placement }) => { return offset({ popper, reference, placement }, this._element) } } From 7ab1dfea03815d1863d4a991a8fcc387a7725c15 Mon Sep 17 00:00:00 2001 From: joke2k Date: Sun, 13 Dec 2020 15:56:10 +0000 Subject: [PATCH 06/89] fix getOffset with function with test --- js/src/dropdown.js | 16 ++++++---------- js/tests/unit/dropdown.spec.js | 14 +++++++++++--- 2 files changed, 17 insertions(+), 13 deletions(-) diff --git a/js/src/dropdown.js b/js/src/dropdown.js index 78ad80371..bd93b2bb0 100644 --- a/js/src/dropdown.js +++ b/js/src/dropdown.js @@ -290,18 +290,14 @@ class Dropdown extends BaseComponent { } _getOffset() { - let { offset } = this._config - - if (!offset) { - return [0, 0] - } + const { offset } = this._config if (typeof offset === 'string') { - offset = offset.split(',').map(val => Number.parseInt(val, 10)) - } else if (typeof offset === 'function') { - offset = ({ popper, reference, placement }) => { - return offset({ popper, reference, placement }, this._element) - } + return offset.split(',').map(val => Number.parseInt(val, 10)) + } + + if (typeof offset === 'function') { + return popperData => offset(popperData, this._element) } return offset diff --git a/js/tests/unit/dropdown.spec.js b/js/tests/unit/dropdown.spec.js index c59cd3b02..0b7e1621f 100644 --- a/js/tests/unit/dropdown.spec.js +++ b/js/tests/unit/dropdown.spec.js @@ -54,7 +54,7 @@ describe('Dropdown', () => { expect(dropdown.toggle).toHaveBeenCalled() }) - it('should create offset modifier correctly when offset option is a function', () => { + it('should create offset modifier correctly when offset option is a function', done => { fixtureEl.innerHTML = [ '
', ' ', @@ -64,14 +64,22 @@ describe('Dropdown', () => { '
' ].join('') - const getOffset = () => [10, 20] + const getOffset = jasmine.createSpy('getOffset').and.returnValue([10, 20]) const btnDropdown = fixtureEl.querySelector('[data-bs-toggle="dropdown"]') const dropdown = new Dropdown(btnDropdown, { - offset: getOffset + offset: getOffset, + popperConfig: { + onFirstUpdate: state => { + expect(getOffset).toHaveBeenCalledWith({ ...state.rects, placement: state.placement }, btnDropdown) + done() + } + } }) const offset = dropdown._getOffset() expect(typeof offset).toEqual('function') + + dropdown.show() }) it('should create offset modifier correctly when offset option is a string into data attribute', () => { From 7270c8ddc3cc3794ae7fe69acddce62adaab16f6 Mon Sep 17 00:00:00 2001 From: joke2k Date: Sun, 13 Dec 2020 19:46:22 +0000 Subject: [PATCH 07/89] fix dropdown offset docs --- js/tests/unit/dropdown.spec.js | 6 +++++- site/content/docs/5.0/components/dropdowns.md | 8 ++++---- 2 files changed, 9 insertions(+), 5 deletions(-) diff --git a/js/tests/unit/dropdown.spec.js b/js/tests/unit/dropdown.spec.js index 0b7e1621f..628b09d2d 100644 --- a/js/tests/unit/dropdown.spec.js +++ b/js/tests/unit/dropdown.spec.js @@ -70,7 +70,11 @@ describe('Dropdown', () => { offset: getOffset, popperConfig: { onFirstUpdate: state => { - expect(getOffset).toHaveBeenCalledWith({ ...state.rects, placement: state.placement }, btnDropdown) + expect(getOffset).toHaveBeenCalledWith({ + popper: state.rects.popper, + reference: state.rects.reference, + placement: state.placement + }, btnDropdown) done() } } diff --git a/site/content/docs/5.0/components/dropdowns.md b/site/content/docs/5.0/components/dropdowns.md index 948eedeb8..0aee28b32 100644 --- a/site/content/docs/5.0/components/dropdowns.md +++ b/site/content/docs/5.0/components/dropdowns.md @@ -898,12 +898,12 @@ Options can be passed via data attributes or JavaScript. For data attributes, ap offset - number | string | function - "0,0" + array | string | function + [0, 0]

Offset of the dropdown relative to its target.

-

When a function is used to determine the offset, it is called with an object containing the popper offsets object data as its first argument. The function must return an array with two numbers: [skidding, distance]. The triggering element DOM node is passed as the second argument.

-

For more information refer to Popper.js's offset docs.

+

When a function is used to determine the offset, it is called with an object containing the popper instance, the refecence Element and the placement as its first argument. The function must return an array with two numbers: [skidding, distance]. The triggering element DOM node is passed as the second argument.

+

For more information refer to Popper.js's offset docs.

From 98fe781fa5d8693ec8d8eacf44b9b74a8f5a1a10 Mon Sep 17 00:00:00 2001 From: Rohit Sharma Date: Wed, 16 Dec 2020 20:39:24 +0530 Subject: [PATCH 08/89] WIP: Fix the Popper warning issue - Set the default margin to 0 for dropdowns - Set the required offset in dropdowns --- js/src/dropdown.js | 2 +- scss/_dropdown.scss | 7 ++++++- 2 files changed, 7 insertions(+), 2 deletions(-) diff --git a/js/src/dropdown.js b/js/src/dropdown.js index bd93b2bb0..9e9fba6b1 100644 --- a/js/src/dropdown.js +++ b/js/src/dropdown.js @@ -72,7 +72,7 @@ const PLACEMENT_RIGHT = isRTL ? 'left-start' : 'right-start' const PLACEMENT_LEFT = isRTL ? 'right-start' : 'left-start' const Default = { - offset: [0, 0], + offset: [0, 2], flip: true, boundary: 'clippingParents', reference: 'toggle', diff --git a/scss/_dropdown.scss b/scss/_dropdown.scss index 594c06399..6941c9e8d 100644 --- a/scss/_dropdown.scss +++ b/scss/_dropdown.scss @@ -22,7 +22,7 @@ display: none; // none by default, but block on "open" of the menu min-width: $dropdown-min-width; padding: $dropdown-padding-y $dropdown-padding-x; - margin: $dropdown-spacer 0 0; // override default ul + margin: 0; // Let Popper handle the space by offset @include font-size($dropdown-font-size); color: $dropdown-color; text-align: left; // Ensures proper alignment if parent has it changed (e.g., modal footer) @@ -174,6 +174,11 @@ .dropdown-menu.show { display: block; + + &:not([data-popper-placement]) { + margin: $dropdown-spacer 0 0; // override default ul for dropdown not using Popper + } + } // Dropdown section headers From 517446069a60daddaf5e53651661851f9b44e9a0 Mon Sep 17 00:00:00 2001 From: Siju Samson Date: Fri, 18 Dec 2020 13:49:30 +0530 Subject: [PATCH 09/89] docs: Fix popover example showing above navbar (#32445) Co-authored-by: XhmikosR --- site/assets/scss/_subnav.scss | 2 +- site/assets/scss/_variables.scss | 3 +++ 2 files changed, 4 insertions(+), 1 deletion(-) diff --git a/site/assets/scss/_subnav.scss b/site/assets/scss/_subnav.scss index 8377ff423..8979aa3cd 100644 --- a/site/assets/scss/_subnav.scss +++ b/site/assets/scss/_subnav.scss @@ -1,7 +1,7 @@ .bd-subnavbar { // The position and z-index are needed for the dropdown to stay on top of the content position: relative; - z-index: $zindex-sticky; + z-index: $bd-navbar-zindex; background-color: rgba($white, .95); box-shadow: 0 .5rem 1rem rgba(0, 0, 0, .05), inset 0 -1px 0 rgba(0, 0, 0, .15); diff --git a/site/assets/scss/_variables.scss b/site/assets/scss/_variables.scss index 110600260..6e1ae2efd 100644 --- a/site/assets/scss/_variables.scss +++ b/site/assets/scss/_variables.scss @@ -11,3 +11,6 @@ $bd-warning: #f0ad4e; $bd-danger: #d9534f; $dropdown-active-icon: url("data:image/svg+xml,"); $sidebar-collapse-icon: url("data:image/svg+xml,"); + +// Higher than core's $zindex-tooltip, which is 1070 +$bd-navbar-zindex: 1080; From 66f323af7015346ef401f241a8082a27d37e1d67 Mon Sep 17 00:00:00 2001 From: "dependabot[bot]" <49699333+dependabot[bot]@users.noreply.github.com> Date: Fri, 18 Dec 2020 15:11:07 +0200 Subject: [PATCH 10/89] Bump eslint-plugin-unicorn from 23.0.0 to 24.0.0 (#32516) * Bump eslint-plugin-unicorn from 23.0.0 to 24.0.0 Bumps [eslint-plugin-unicorn](https://github.com/sindresorhus/eslint-plugin-unicorn) from 23.0.0 to 24.0.0. - [Release notes](https://github.com/sindresorhus/eslint-plugin-unicorn/releases) - [Commits](https://github.com/sindresorhus/eslint-plugin-unicorn/compare/v23.0.0...v24.0.0) Signed-off-by: dependabot[bot] * Update karma.conf.js Co-authored-by: dependabot[bot] <49699333+dependabot[bot]@users.noreply.github.com> Co-authored-by: XhmikosR --- js/tests/karma.conf.js | 2 +- package-lock.json | 8 ++++---- package.json | 2 +- 3 files changed, 6 insertions(+), 6 deletions(-) diff --git a/js/tests/karma.conf.js b/js/tests/karma.conf.js index d0dd8bdd9..38c7003bb 100644 --- a/js/tests/karma.conf.js +++ b/js/tests/karma.conf.js @@ -59,7 +59,7 @@ const conf = { colors: true, autoWatch: false, singleRun: true, - concurrency: Infinity, + concurrency: Number.POSITIVE_INFINITY, client: { clearContext: false }, diff --git a/package-lock.json b/package-lock.json index af1b0d0b9..d94ad7929 100644 --- a/package-lock.json +++ b/package-lock.json @@ -4031,9 +4031,9 @@ } }, "eslint-plugin-unicorn": { - "version": "23.0.0", - "resolved": "https://registry.npmjs.org/eslint-plugin-unicorn/-/eslint-plugin-unicorn-23.0.0.tgz", - "integrity": "sha512-Vabo3cjl6cjyhcf+76CdQEY6suOFzK0Xh3xo0uL9VDYrDJP5+B6PjV0tHTYm82WZmFWniugFJM3ywHSNYTi/ZQ==", + "version": "24.0.0", + "resolved": "https://registry.npmjs.org/eslint-plugin-unicorn/-/eslint-plugin-unicorn-24.0.0.tgz", + "integrity": "sha512-NfLjIZas/ZUwc3S+pUtbTRqgCkODxPEkJBJ5ZR8wIu90BmX4jmXp10hoOZMScR2CR1NYTtrx0OX4BQvBnbzZzA==", "dev": true, "requires": { "ci-info": "^2.0.0", @@ -4048,7 +4048,7 @@ "regexp-tree": "^0.1.21", "reserved-words": "^0.1.2", "safe-regex": "^2.1.1", - "semver": "^7.3.2" + "semver": "^7.3.4" }, "dependencies": { "safe-regex": { diff --git a/package.json b/package.json index 11e06e03f..16d2fc935 100644 --- a/package.json +++ b/package.json @@ -113,7 +113,7 @@ "eslint": "^7.15.0", "eslint-config-xo": "^0.33.1", "eslint-plugin-import": "^2.22.1", - "eslint-plugin-unicorn": "^23.0.0", + "eslint-plugin-unicorn": "^24.0.0", "find-unused-sass-variables": "^3.0.0", "glob": "^7.1.6", "hammer-simulator": "0.0.1", From 58ab1c2cd53b51b57e425e4f4926b9d29de424be Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?Ga=C3=ABl=20Poupard?= Date: Fri, 18 Dec 2020 16:22:16 +0100 Subject: [PATCH 11/89] test(carousel): french word in the wild (#32528) --- js/tests/unit/carousel.spec.js | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/js/tests/unit/carousel.spec.js b/js/tests/unit/carousel.spec.js index 07b8fc311..0286762fa 100644 --- a/js/tests/unit/carousel.spec.js +++ b/js/tests/unit/carousel.spec.js @@ -905,7 +905,7 @@ describe('Carousel', () => { }) describe('to', () => { - it('should go directement to the provided index', done => { + it('should go directly to the provided index', done => { fixtureEl.innerHTML = [ '