Add Bootstrap 5 support #798

jstark518 · 2021-10-21T19:28:53Z

Fixes Any plans for BS5 support? #777 - Builds on PR791: Add support for bootstrap 5 while keeping support for 4
Changed test to use Chrome
Changed test to look for .btn-close when using BS5, .close when using BS4.
Added another test config, test both BS4 and BS5.
Change to @popperjs/core from popper, see PR746.

Change default date value in test to ISO 8601. Fix a problem where value is set to null in select in bootbox.prompt if it's not defined, this was causing the select to be empty and test fails. Move to newer version of popper.

Update test logic to test BS5 close buttons Add Test config for both BS5 and BS4

jstark518 · 2021-10-21T19:30:48Z

bootbox.js

@@ -789,7 +789,9 @@
        });

        // safe to set a select's value as per a normal input
-        input.val(options.value);


#798 This was causing problems with the existing test

http://jsfiddle.net/osuzjbxg/1

tarlepp · 2021-10-21T19:34:03Z

Hmm, if this is for BS5 and BS4 then we should - imho - have test matrix for each of those - to make sure that all works as expected.

jstark518 · 2021-10-21T19:50:07Z

have test matrix for each of those - to make sure that all works as expected.

I don't know enough about Karma to know how to do that, I just made two test configs and each runs all test on both BS4 & BS5.

jstark518 · 2021-10-21T20:31:04Z

package.json

@@ -6,7 +6,7 @@
    "test": "tests"
  },
  "scripts": {
-    "test": "./node_modules/.bin/karma start"
+    "test": "./node_modules/.bin/karma start karma.conf.js && ./node_modules/.bin/karma start karma-bs4.conf.js"


Yeah, sorry about that - I remember that there was some TravisCI / GitHub Actions to run those tests on this repository - Seems like I didn't remember that correctly :(

jstark518 · 2021-10-26T22:09:38Z

Is this project abandoned?

tiesont · 2021-10-29T01:21:09Z

Is this project abandoned?

Depends on what you mean. I haven't seen @makeusabrew around for a while, but @tarlepp and I do what we can, when we can, to address issues as they come up. If your expectation was for your pull-request to be immediately either approved or rejected, then I guess it's up to you how you view the status of this project.

If you want a simple answer: no, the project is not abandoned, we just don't move very quickly.

jstark518 · 2021-10-29T11:55:48Z

Ah ok ty

rajpt · 2021-11-09T02:07:28Z

Good Stuff. Just waiting to get this merged and have bootstrap 5 support.

Yohn · 2021-11-27T06:58:45Z

Thanks for this PR!

One thing I found is when modal-header is not there, the X / close button still appears but within the modal-body, and is on the left side. Looks out of place. I'll let you know if I find anything else popping up while I play with it for a bit.

jstark518 · 2021-11-28T00:38:58Z

Thanks for this PR!

One thing I found is when modal-header is not there, the X / close button still appears but within the modal-body, and is on the left side. Looks out of place. I'll let you know if I find anything else popping up while I play with it for a bit.

Thank you, I'll fix that Monday.

jstark518 · 2021-11-30T02:24:31Z

Thanks for this PR!

One thing I found is when modal-header is not there, the X / close button still appears but within the modal-body, and is on the left side. Looks out of place. I'll let you know if I find anything else popping up while I play with it for a bit.

@Yohn Fixed

bobrundle · 2022-02-12T16:42:42Z

Would like to see this PR merged. I have a site that uses bootbox heavily and I am updating it to bootstrap 5. bootbox and a few other packages are holding me back. If there was a replacement to bootbox I would use it. I spent a day trying to hammer SweetAlert2 in only to give up. Nothing out there that I can find has the dialog functionality.

jstark518 · 2022-02-12T21:33:29Z

Would like to see this PR merged. I have a site that uses bootbox heavily and I am updating it to bootstrap 5. bootbox and a few other packages are holding me back. If there was a replacement to bootbox I would use it. I spent a day trying to hammer SweetAlert2 in only to give up. Nothing out there that I can find has the dialog functionality.

@bobrundle I wouldn't hold out hope it gets merged, do you use scss?

bobrundle · 2022-02-13T14:04:07Z

@jstark518 I would not be so pessimistic. Your BS5 support will be merged eventually. Things move slow here as they often when free labor is at work. BS5 support is a major improvement and needs to be carefully evaluated.

The site I am working on does not use scss but I have integrated your changes into it as I await the official bootbox BS5 support.

davidvandertuijn · 2022-02-14T15:35:53Z

Can't wait for Bootstrap 5 support, this is my workaround written in Sass based on Bootstrap 5 .btn-close, changed the color to transparant to prevent a double cross icon. Hope this temporary fix is helpfull:

.bootbox-close-button {
    box-sizing: content-box;
    width: $btn-close-width;
    height: $btn-close-height;
    padding: $btn-close-padding-y $btn-close-padding-x;
    // color: $btn-close-color;
    color: transparent;
    background: transparent escape-svg($btn-close-bg) center / $btn-close-width auto no-repeat; // include transparent for button elements
    border: 0; // for button elements
    @include border-radius();
    opacity: $btn-close-opacity;

    // Override <a>'s hover style
    &:hover {
        // color: $btn-close-color;
        color: transparent;
        text-decoration: none;
        opacity: $btn-close-hover-opacity;
    }

    &:focus {
        outline: 0;
        box-shadow: $btn-close-focus-shadow;
        opacity: $btn-close-focus-opacity;
    }

    &:disabled,
    &.disabled {
        pointer-events: none;
        user-select: none;
        opacity: $btn-close-disabled-opacity;
    }
}

jstark518 · 2022-02-15T21:33:54Z

Can't wait for Bootstrap 5 support, this is my workaround written in Sass based on Bootstrap 5 .btn-close, changed the color to transparant to prevent a double cross icon. Hope this temporary fix is helpfull:

.bootbox-close-button {
    box-sizing: content-box;
    width: $btn-close-width;
    height: $btn-close-height;
    padding: $btn-close-padding-y $btn-close-padding-x;
    // color: $btn-close-color;
    color: transparent;
    background: transparent escape-svg($btn-close-bg) center / $btn-close-width auto no-repeat; // include transparent for button elements
    border: 0; // for button elements
    @include border-radius();
    opacity: $btn-close-opacity;

    // Override <a>'s hover style
    &:hover {
        // color: $btn-close-color;
        color: transparent;
        text-decoration: none;
        opacity: $btn-close-hover-opacity;
    }

    &:focus {
        outline: 0;
        box-shadow: $btn-close-focus-shadow;
        opacity: $btn-close-focus-opacity;
    }

    &:disabled,
    &.disabled {
        pointer-events: none;
        user-select: none;
        opacity: $btn-close-disabled-opacity;
    }
}

I did the same exact thing

Bumps [follow-redirects](https://github.com/follow-redirects/follow-redirects) from 1.14.4 to 1.14.8. - [Release notes](https://github.com/follow-redirects/follow-redirects/releases) - [Commits](follow-redirects/follow-redirects@v1.14.4...v1.14.8) --- updated-dependencies: - dependency-name: follow-redirects dependency-type: indirect ... Signed-off-by: dependabot[bot] <[email protected]>

Bumps [log4js](https://github.com/log4js-node/log4js-node) from 6.3.0 to 6.4.1. - [Release notes](https://github.com/log4js-node/log4js-node/releases) - [Changelog](https://github.com/log4js-node/log4js-node/blob/master/CHANGELOG.md) - [Commits](log4js-node/log4js-node@v6.3.0...v6.4.1) --- updated-dependencies: - dependency-name: log4js dependency-type: indirect ... Signed-off-by: dependabot[bot] <[email protected]>

erobertson42 · 2022-02-27T02:03:01Z

Would like to see this PR merged. I have a site that uses bootbox heavily and I am updating it to bootstrap 5. bootbox and a few other packages are holding me back. If there was a replacement to bootbox I would use it. I spent a day trying to hammer SweetAlert2 in only to give up. Nothing out there that I can find has the dialog functionality.

@bobrundle

https://github.com/erobertson42/bootstrap-modbox

Yes, this is my library. It is vanilla JavaScript for Bootstrap 5, no dependencies, and uses standard Bootstrap classes/styling with no custom CSS. So if you're already using a theme or your own Bootstrap Sass modifications, they should automatically "just work".

I was on the fence about replying with this, as I wasn't sure if it was bad form or not, though that wasn't my intention. Mods, if you disapprove of me posting this here, I understand if you remove it - apologies and no hard feelings. I'm not really out for advertising my library, I've never even posted about it anywhere before this, just trying to help with a possible alternative.

I also wanted to mention that while the library has no relation to bootbox, I did model the docs site layout after bootbox's (imitation -> flattery 🙂 ).

tiesont · 2022-02-27T04:18:00Z

I also wanted to mention that while the library has no relation to bootbox, I did model the docs site layout after bootbox's (imitation -> flattery 🙂 ).

Ha. Glad to know that the docs were useful. Did you hard-code everything, as I did, or are you using Jekyll, Gatsby, or similar to build them?

erobertson42 · 2022-02-27T04:56:09Z

Ha. Glad to know that the docs were useful. Did you hard-code everything, as I did, or are you using Jekyll, Gatsby, or similar to build them?

I originally considered automating it, but I had (and still have) no experience with those tools, so it I figured it was faster/simpler to keep it old school and hardcode it all.

It's funny, one of my first ideas for naming the library was actually "bootbox", before I did a search and realized it was already taken.

tiesont · 2022-02-27T05:01:38Z

@erobertson42 I won't pretend it's the best example, but this uses Jekyll: https://github.com/tiesont/bootboxdocs

erobertson42 · 2022-02-27T05:11:35Z

@erobertson42 I won't pretend it's the best example, but this uses Jekyll: https://github.com/tiesont/bootboxdocs

Great, thank you. I'll take a look when I get a chance.

picov · 2022-03-25T22:34:20Z

Any news about BS5 support in an official release?

tiesont · 2022-03-25T22:44:40Z

Any news about BS5 support in an official release?

Depends on what you mean by "BS5 support". Properly supporting Bootstrap 5 requires rewriting Bootbox to eliminate our jQuery dependencies, adjust for changes in the JavaScript functions, and figure out how to keep a fair amount of backward compatibility.

None of those are trivial tasks, and I haven't had a ton of free time lately. The above changes also necessitate a major version bump, which I'm not entirely sure I want to commit to at this point. @erobertson42 's project looks pretty promising, so if you need something right now, I'd suggest taking a look at https://github.com/erobertson42/bootstrap-modbox

Probably not the answer you were looking for, but it's all I have for you (and others) at the moment.

tarlepp · 2022-03-25T23:01:17Z

And really if we're going to add that BS5 support - imho - we should just create new major version, just because we could just drop all the old things with that - there haven't been so much changes in years in this repository so I think that would be the "proper" way to add BS5 support.

Although we haven't hear anything from @makeusabrew for a while (we've tried to contact him, but no luck yet - we hope that he's ok), but because we haven't hear anything from him a long time - I think that someone should make fork of this repository and continue working within that with new features.

And yes there is couple of those forks already - but I think that we should choose which one to start to use - and recommend that here too.

And I really hope that new fork repository maintainers (see the plurar format) could provide their time to maintain and development this great library.

tiesont · 2022-03-26T23:34:58Z

And really if we're going to add that BS5 support - imho - we should just create new major version, just because we could just drop all the old things with that - there haven't been so much changes in years in this repository so I think that would be the "proper" way to add BS5 support.

Although we haven't hear anything from @makeusabrew for a while (we've tried to contact him, but no luck yet - we hope that he's ok), but because we haven't hear anything from him a long time - I think that someone should make fork of this repository and continue working within that with new features.

And yes there is couple of those forks already - but I think that we should choose which one to start to use - and recommend that here too.

And I really hope that new fork repository maintainers (see the plurar format) could provide their time to maintain and development this great library.

@tarlepp I did create https://github.com/BootboxJS/bootbox at one point - do you think it makes more sense to just work from that project, since we'd have full control of all settings, or do enough work here to make it fully BS5 compatible and then basically halt development?

I do still use Bootbox on a daily basis, but I haven't been able to upgrade those projects to BS5 yet (heck, one is stuck on 3.4 until I can convince the bossmen that it really needs to be updated), so the current Bootbox works just fine for me.

I really don't want to abandon this repo, but without @makeusabrew popping in long enough to transfer ownership, it doesn't really make sense to keep working here long term - we can't add any more maintainers or pretty much anything else that requires admin privileges...

jstark518 · 2022-03-28T19:53:04Z

According to Bootstrap'd doc, jQuery works fine.

Still want to use jQuery? It’s possible!
Bootstrap 5 is designed to be used without jQuery, but it’s still possible to use our components with jQuery. If Bootstrap detects jQuery in the window object it’ll add all of our components in jQuery’s plugin system; this means you’ll be able to do $('[data-bs-toggle="tooltip"]').tooltip() to enable tooltips. The same goes for our other components.

tiesont · 2022-03-28T20:18:31Z

According to Bootstrap'd doc, jQuery works fine.

Still want to use jQuery? It’s possible! Bootstrap 5 is designed to be used without jQuery, but it’s still possible to use our components with jQuery. If Bootstrap detects jQuery in the window object it’ll add all of our components in jQuery’s plugin system; this means you’ll be able to do $('[data-bs-toggle="tooltip"]').tooltip() to enable tooltips. The same goes for our other components.

I'm aware of that, but it's also possible to use Bootstrap 5 without jQuery. We use jQuery internally to build the modal (among other things), so for real Bootstrap 5 compatibility, we need to assume jQuery won't be used.

Bumps [minimist](https://github.com/substack/minimist) from 1.2.5 to 1.2.6. - [Release notes](https://github.com/substack/minimist/releases) - [Commits](https://github.com/substack/minimist/compare/1.2.5...1.2.6) --- updated-dependencies: - dependency-name: minimist dependency-type: indirect ... Signed-off-by: dependabot[bot] <[email protected]>

….4.1 Bump log4js from 6.3.0 to 6.4.1

…edirects-1.14.8 Bump follow-redirects from 1.14.4 to 1.14.8

…-1.2.6 Bump minimist from 1.2.5 to 1.2.6

Bumps [karma](https://github.com/karma-runner/karma) from 6.3.5 to 6.3.16. - [Release notes](https://github.com/karma-runner/karma/releases) - [Changelog](https://github.com/karma-runner/karma/blob/master/CHANGELOG.md) - [Commits](karma-runner/karma@v6.3.5...v6.3.16) --- updated-dependencies: - dependency-name: karma dependency-type: direct:development ... Signed-off-by: dependabot[bot] <[email protected]>

…3.16

Bumps [grunt](https://github.com/gruntjs/grunt) from 1.4.1 to 1.5.2. - [Release notes](https://github.com/gruntjs/grunt/releases) - [Changelog](https://github.com/gruntjs/grunt/blob/main/CHANGELOG) - [Commits](gruntjs/grunt@v1.4.1...v1.5.2) --- updated-dependencies: - dependency-name: grunt dependency-type: direct:development ... Signed-off-by: dependabot[bot] <[email protected]>

Bump grunt from 1.4.1 to 1.5.2

Bumps [async](https://github.com/caolan/async) from 3.2.1 to 3.2.3. - [Release notes](https://github.com/caolan/async/releases) - [Changelog](https://github.com/caolan/async/blob/master/CHANGELOG.md) - [Commits](caolan/async@v3.2.1...v3.2.3) --- updated-dependencies: - dependency-name: async dependency-type: indirect ... Signed-off-by: dependabot[bot] <[email protected]>

Bump async from 3.2.1 to 3.2.3

tiesont · 2022-04-27T23:26:50Z

@jstark518 I don't think I'm going to merge this pull-request. I did fix some of the issues you noted, in the master branch, but I think I want to take a slightly different approach to maintaining Bootstrap 4.6 compatibility. It's up to you at this point whether you want to leave the pull-request open or not.

I've deleted and then recreated the v5.x branch, to serve as a snapshot of the current Bootbox version (5.5.2), and am going to spend some time this week working on a basic v6 version. Not going to drop jQuery at this point, but I have a few relatively minor updates I can make to generate the correct markup for both Bootstrap 4 and Bootstrap 5, and add a few features that are in a customized version I use at work.

jstark518 · 2022-04-27T23:52:25Z

@jstark518 I don't think I'm going to merge this pull-request. I did fix some of the issues you noted, in the master branch, but I think I want to take a slightly different approach to maintaining Bootstrap 4.6 compatibility. It's up to you at this point whether you want to leave the pull-request open or not.

I've deleted and then recreated the v5.x branch, to serve as a snapshot of the current Bootbox version (5.5.2), and am going to spend some time this week working on a basic v6 version. Not going to drop jQuery at this point, but I have a few relatively minor updates I can make to generate the correct markup for both Bootstrap 4 and Bootstrap 5, and add a few features that are in a customized version I use at work.

Looking forward to it.

I like the idea of keeping jQuery.
We use bootbox across a few projects at work and they're all moving to BS5, would be nice to use an official release again, we have no plans of removing jQuery.

jstark518 · 2022-04-28T01:55:24Z

Need to delete the repo to make a new fork

jstark518 added 4 commits October 21, 2021 13:42

Update Karma to use chrome.

095b789

Change default date value in test to ISO 8601. Fix a problem where value is set to null in select in bootbox.prompt if it's not defined, this was causing the select to be empty and test fails. Move to newer version of popper.

Move dependencies to the correct area

b133905

Missing lock file for some reason

6d7c6ef

Add support for bootstrap 5

23f5430

Update test logic to test BS5 close buttons Add Test config for both BS5 and BS4

jstark518 commented Oct 21, 2021

View reviewed changes

jstark518 requested a review from tarlepp October 23, 2021 13:48

jstark518 added 2 commits November 29, 2021 19:21

Update Dist

1107fc1

Add float for close without title, and add the code to all.

bbd877c

jstark518 mentioned this pull request Feb 6, 2022

Bootstrap 5 modifications #801

Closed

dependabot bot added 2 commits February 15, 2022 21:47

dependabot bot and others added 10 commits April 1, 2022 21:51

Merge pull request #4 from jstark518/dependabot/npm_and_yarn/log4js-6…

5864253

….4.1 Bump log4js from 6.3.0 to 6.4.1

Merge pull request #3 from jstark518/dependabot/npm_and_yarn/follow-r…

226e2a8

…edirects-1.14.8 Bump follow-redirects from 1.14.4 to 1.14.8

Merge pull request #6 from jstark518/dependabot/npm_and_yarn/minimist…

c1e9894

…-1.2.6 Bump minimist from 1.2.5 to 1.2.6

Merge pull request #5 from jstark518/dependabot/npm_and_yarn/karma-6.…

c1f0531

…3.16

Merge pull request #7 from jstark518/dependabot/npm_and_yarn/grunt-1.5.2

e95ed47

Bump grunt from 1.4.1 to 1.5.2

Merge pull request #8 from jstark518/dependabot/npm_and_yarn/async-3.2.3

02b3089

Bump async from 3.2.1 to 3.2.3

Create npm-grunt.yml

8c58170

jstark518 closed this Apr 28, 2022

Provide feedback

Saved searches

Use saved searches to filter your results more quickly

Add Bootstrap 5 support #798

Add Bootstrap 5 support #798

jstark518 commented Oct 21, 2021 •

edited

Loading

jstark518 Oct 21, 2021

jstark518 Oct 21, 2021

tarlepp commented Oct 21, 2021

jstark518 commented Oct 21, 2021

jstark518 Oct 21, 2021

tarlepp Oct 21, 2021

jstark518 commented Oct 26, 2021

tiesont commented Oct 29, 2021

jstark518 commented Oct 29, 2021

rajpt commented Nov 9, 2021

Yohn commented Nov 27, 2021

jstark518 commented Nov 28, 2021

jstark518 commented Nov 30, 2021

bobrundle commented Feb 12, 2022

jstark518 commented Feb 12, 2022

bobrundle commented Feb 13, 2022

davidvandertuijn commented Feb 14, 2022

jstark518 commented Feb 15, 2022

erobertson42 commented Feb 27, 2022 •

edited

Loading

tiesont commented Feb 27, 2022

erobertson42 commented Feb 27, 2022

tiesont commented Feb 27, 2022

erobertson42 commented Feb 27, 2022

picov commented Mar 25, 2022

tiesont commented Mar 25, 2022

tarlepp commented Mar 25, 2022

tiesont commented Mar 26, 2022 •

edited

Loading

jstark518 commented Mar 28, 2022

tiesont commented Mar 28, 2022

tiesont commented Apr 27, 2022

jstark518 commented Apr 27, 2022 •

edited

Loading

jstark518 commented Apr 28, 2022

Add Bootstrap 5 support #798

Add Bootstrap 5 support #798

Conversation

jstark518 commented Oct 21, 2021 • edited Loading

jstark518 Oct 21, 2021

Choose a reason for hiding this comment

jstark518 Oct 21, 2021

Choose a reason for hiding this comment

tarlepp commented Oct 21, 2021

jstark518 commented Oct 21, 2021

jstark518 Oct 21, 2021

Choose a reason for hiding this comment

tarlepp Oct 21, 2021

Choose a reason for hiding this comment

jstark518 commented Oct 26, 2021

tiesont commented Oct 29, 2021

jstark518 commented Oct 29, 2021

rajpt commented Nov 9, 2021

Yohn commented Nov 27, 2021

jstark518 commented Nov 28, 2021

jstark518 commented Nov 30, 2021

bobrundle commented Feb 12, 2022

jstark518 commented Feb 12, 2022

bobrundle commented Feb 13, 2022

davidvandertuijn commented Feb 14, 2022

jstark518 commented Feb 15, 2022

erobertson42 commented Feb 27, 2022 • edited Loading

tiesont commented Feb 27, 2022

erobertson42 commented Feb 27, 2022

tiesont commented Feb 27, 2022

erobertson42 commented Feb 27, 2022

picov commented Mar 25, 2022

tiesont commented Mar 25, 2022

tarlepp commented Mar 25, 2022

tiesont commented Mar 26, 2022 • edited Loading

jstark518 commented Mar 28, 2022

tiesont commented Mar 28, 2022

tiesont commented Apr 27, 2022

jstark518 commented Apr 27, 2022 • edited Loading

jstark518 commented Apr 28, 2022

jstark518 commented Oct 21, 2021 •

edited

Loading

erobertson42 commented Feb 27, 2022 •

edited

Loading

tiesont commented Mar 26, 2022 •

edited

Loading

jstark518 commented Apr 27, 2022 •

edited

Loading