bootstrap 5.3.0 → 5.3.8

data/assets/stylesheets/bootstrap/forms/_floating-labels.scss

@@ -14,9 +14,11 @@
     top: 0;
     left: 0;
     z-index: 2;
+    max-width: 100%;
     height: 100%; // allow textareas
     padding: $form-floating-padding-y $form-floating-padding-x;
     overflow: hidden;
+    color: rgba(var(--#{$prefix}body-color-rgb), #{$form-floating-label-opacity});
     text-align: start;
     text-overflow: ellipsis;
     white-space: nowrap;
@@ -49,6 +51,7 @@
   > .form-select {
     padding-top: $form-floating-input-padding-t;
     padding-bottom: $form-floating-input-padding-b;
+    padding-left: $form-floating-padding-x;
   }
 
   > .form-control:focus,
@@ -56,27 +59,30 @@
   > .form-control-plaintext,
   > .form-select {
     ~ label {
-      color: rgba(var(--#{$prefix}body-color-rgb), #{$form-floating-label-opacity});
       transform: $form-floating-label-transform;
-
-      &::after {
-        position: absolute;
-        inset: $form-floating-padding-y ($form-floating-padding-x * .5);
-        z-index: -1;
-        height: $form-floating-label-height;
-        content: "";
-        background-color: $input-bg;
-        @include border-radius($input-border-radius);
-      }
     }
   }
   // Duplicated because `:-webkit-autofill` invalidates other selectors when grouped
   > .form-control:-webkit-autofill {
     ~ label {
-      color: rgba(var(--#{$prefix}body-color-rgb), #{$form-floating-label-opacity});
       transform: $form-floating-label-transform;
     }
   }
+  > textarea:focus,
+  > textarea:not(:placeholder-shown) {
+    ~ label::after {
+      position: absolute;
+      inset: $form-floating-padding-y ($form-floating-padding-x * .5);
+      z-index: -1;
+      height: $form-floating-label-height;
+      content: "";
+      background-color: $input-bg;
+      @include border-radius($input-border-radius);
+    }
+  }
+  > textarea:disabled ~ label::after {
+    background-color: $input-disabled-bg;
+  }
 
   > .form-control-plaintext {
     ~ label {
@@ -84,11 +90,8 @@
     }
   }
 
-  > :disabled ~ label {
+  > :disabled ~ label,
+  > .form-control:disabled ~ label { // Required for `.form-control`s because of specificity
     color: $form-floating-label-disabled-color;
-
-    &::after {
-      background-color: $input-disabled-bg;
-    }
   }
 }

data/assets/stylesheets/bootstrap/forms/_form-check.scss

@@ -29,17 +29,18 @@
 .form-check-input {
   --#{$prefix}form-check-bg: #{$form-check-input-bg};
 
+  flex-shrink: 0;
   width: $form-check-input-width;
   height: $form-check-input-width;
   margin-top: ($line-height-base - $form-check-input-width) * .5; // line-height minus check height
   vertical-align: top;
+  appearance: none;
   background-color: var(--#{$prefix}form-check-bg);
   background-image: var(--#{$prefix}form-check-bg-image);
   background-repeat: no-repeat;
   background-position: center;
   background-size: contain;
   border: $form-check-input-border;
-  appearance: none;
   print-color-adjust: exact; // Keep themed appearance for print
   @include transition($form-check-transition);
 
@@ -130,7 +131,7 @@
     margin-left: $form-switch-padding-start * -1;
     background-image: var(--#{$prefix}form-switch-bg);
     background-position: left center;
-    @include border-radius($form-switch-border-radius);
+    @include border-radius($form-switch-border-radius, 0);
     @include transition($form-switch-transition);
 
     &:focus {

data/assets/stylesheets/bootstrap/forms/_form-control.scss

@@ -11,10 +11,10 @@
   font-weight: $input-font-weight;
   line-height: $input-line-height;
   color: $input-color;
+  appearance: none; // Fix appearance for date inputs in Safari
   background-color: $input-bg;
   background-clip: padding-box;
   border: $input-border-width solid $input-border-color;
-  appearance: none; // Fix appearance for date inputs in Safari
 
   // Note: This has no effect on <select>s in some browsers, due to the limited stylability of `<select>`s in CSS.
   @include border-radius($input-border-radius, 0);

data/assets/stylesheets/bootstrap/forms/_form-range.scss

@@ -8,8 +8,8 @@
   width: 100%;
   height: add($form-range-thumb-height, $form-range-thumb-focus-box-shadow-width * 2);
   padding: 0; // Need to reset padding
-  background-color: transparent;
   appearance: none;
+  background-color: transparent;
 
   &:focus {
     outline: 0;
@@ -28,12 +28,12 @@
     width: $form-range-thumb-width;
     height: $form-range-thumb-height;
     margin-top: ($form-range-track-height - $form-range-thumb-height) * .5; // Webkit specific
+    appearance: none;
     @include gradient-bg($form-range-thumb-bg);
     border: $form-range-thumb-border;
     @include border-radius($form-range-thumb-border-radius);
     @include box-shadow($form-range-thumb-box-shadow);
     @include transition($form-range-thumb-transition);
-    appearance: none;
 
     &:active {
       @include gradient-bg($form-range-thumb-active-bg);
@@ -54,12 +54,12 @@
   &::-moz-range-thumb {
     width: $form-range-thumb-width;
     height: $form-range-thumb-height;
+    appearance: none;
     @include gradient-bg($form-range-thumb-bg);
     border: $form-range-thumb-border;
     @include border-radius($form-range-thumb-border-radius);
     @include box-shadow($form-range-thumb-box-shadow);
     @include transition($form-range-thumb-transition);
-    appearance: none;
 
     &:active {
       @include gradient-bg($form-range-thumb-active-bg);

data/assets/stylesheets/bootstrap/forms/_form-select.scss

@@ -14,6 +14,7 @@
   font-weight: $form-select-font-weight;
   line-height: $form-select-line-height;
   color: $form-select-color;
+  appearance: none;
   background-color: $form-select-bg;
   background-image: var(--#{$prefix}form-select-bg-img), var(--#{$prefix}form-select-bg-icon, none);
   background-repeat: no-repeat;
@@ -23,7 +24,6 @@
   @include border-radius($form-select-border-radius, 0);
   @include box-shadow($form-select-box-shadow);
   @include transition($form-select-transition);
-  appearance: none;
 
   &:focus {
     border-color: $form-select-focus-border-color;

data/assets/stylesheets/bootstrap/forms/_input-group.scss

@@ -121,7 +121,7 @@
   }
 
   > :not(:first-child):not(.dropdown-menu)#{$validation-messages} {
-    margin-left: calc(#{$input-border-width} * -1); // stylelint-disable-line function-disallowed-list
+    margin-left: calc(-1 * #{$input-border-width}); // stylelint-disable-line function-disallowed-list
     @include border-start-radius(0);
   }
 

data/assets/stylesheets/bootstrap/helpers/_color-bg.scss

@@ -1,8 +1,7 @@
 // All-caps `RGBA()` function used because of this Sass bug: https://github.com/sass/node-sass/issues/2251
 @each $color, $value in $theme-colors {
-  $color-rgb: to-rgb($value);
   .text-bg-#{$color} {
     color: color-contrast($value) if($enable-important-utilities, !important, null);
-    background-color: RGBA($color-rgb, var(--#{$prefix}bg-opacity, 1)) if($enable-important-utilities, !important, null);
+    background-color: RGBA(var(--#{$prefix}#{$color}-rgb), var(--#{$prefix}bg-opacity, 1)) if($enable-important-utilities, !important, null);
   }
 }

data/assets/stylesheets/bootstrap/helpers/_vr.scss

@@ -1,7 +1,7 @@
 .vr {
   display: inline-block;
   align-self: stretch;
-  width: 1px;
+  width: $vr-border-width;
   min-height: 1em;
   background-color: currentcolor;
   opacity: $hr-opacity;

data/assets/stylesheets/bootstrap/mixins/_banner.scss

@@ -1,7 +1,7 @@
 @mixin bsBanner($file) {
   /*!
-   * Bootstrap #{$file} v5.3.0 (https://getbootstrap.com/)
-   * Copyright 2011-2023 The Bootstrap Authors
+   * Bootstrap #{$file} v5.3.8 (https://getbootstrap.com/)
+   * Copyright 2011-2025 The Bootstrap Authors
    * Licensed under MIT (https://github.com/twbs/bootstrap/blob/main/LICENSE)
    */
 }

data/assets/stylesheets/bootstrap/mixins/_box-shadow.scss

@@ -1,17 +1,23 @@
 @mixin box-shadow($shadow...) {
   @if $enable-shadows {
     $result: ();
+    $has-single-value: false;
+    $single-value: null;
 
     @each $value in $shadow {
       @if $value != null {
-        $result: append($result, $value, "comma");
-      }
-      @if $value == none and length($shadow) > 1 {
-        @warn "The keyword 'none' must be used as a single argument.";
+        @if $value == none or $value == initial or $value == inherit or $value == unset {
+          $has-single-value: true;
+          $single-value: $value;
+        } @else {
+          $result: append($result, $value, "comma");
+        }
       }
     }
 
-    @if (length($result) > 0) {
+    @if $has-single-value {
+      box-shadow: $single-value;
+    } @else if (length($result) > 0) {
       box-shadow: $result;
     }
   }

data/assets/stylesheets/bootstrap/mixins/_forms.scss

@@ -69,7 +69,12 @@
 
       &:focus {
         border-color: $border-color;
-        box-shadow: $focus-box-shadow;
+        @if $enable-shadows {
+          @include box-shadow($input-box-shadow, $focus-box-shadow);
+        } @else {
+          // Avoid using mixin so we can pass custom focus shadow properly
+          box-shadow: $focus-box-shadow;
+        }
       }
     }
   }
@@ -100,7 +105,12 @@
 
       &:focus {
         border-color: $border-color;
-        box-shadow: $focus-box-shadow;
+        @if $enable-shadows {
+          @include box-shadow($form-select-box-shadow, $focus-box-shadow);
+        } @else {
+          // Avoid using mixin so we can pass custom focus shadow properly
+          box-shadow: $focus-box-shadow;
+        }
       }
     }
   }

data/assets/stylesheets/bootstrap/mixins/_grid.scss

@@ -56,7 +56,7 @@
 @mixin row-cols($count) {
   > * {
     flex: 0 0 auto;
-    width: divide(100%, $count);
+    width: percentage(divide(1, $count));
   }
 }
 
@@ -72,7 +72,7 @@
     @include media-breakpoint-up($breakpoint, $breakpoints) {
       // Provide basic `.col-{bp}` classes for equal-width flexbox columns
       .col#{$infix} {
-        flex: 1 0 0%; // Flexbugs #4: https://github.com/philipwalton/flexbugs#flexbug-4
+        flex: 1 0 0;
       }
 
       .row-cols#{$infix}-auto > * {
@@ -138,7 +138,7 @@
           }
         }
 
-        // Start with `1` because `0` is and invalid value.
+        // Start with `1` because `0` is an invalid value.
         // Ends with `$columns - 1` because offsetting by the width of an entire row isn't possible.
         @for $i from 1 through ($columns - 1) {
           .g-start#{$infix}-#{$i} {

data/assets/stylesheets/bootstrap/mixins/_visually-hidden.scss

@@ -19,12 +19,17 @@
   &:not(caption) {
     position: absolute !important;
   }
+
+  // Fix to prevent overflowing children to become focusable
+  * {
+    overflow: hidden !important;
+  }
 }
 
 // Use to only display content when it's focused, or one of its child elements is focused
 // (i.e. when focus is within the element/container that the class was applied to)
 //
-// Useful for "Skip to main content" links; see https://www.w3.org/TR/2013/NOTE-WCAG20-TECHS-20130905/G1
+// Useful for "Skip to main content" links; see https://www.w3.org/WAI/WCAG22/Techniques/general/G1.html
 
 @mixin visually-hidden-focusable() {
   &:not(:focus):not(:focus-within) {

data/bootstrap.gemspec

@@ -14,19 +14,19 @@ Gem::Specification.new do |s|
   # SassC requires Ruby 2.3.3. Also specify here to make it obvious.
   s.required_ruby_version = '>= 2.3.3'
 
-  s.add_runtime_dependency 'popper_js', '>= 2.11.7', '< 3'
+  s.add_runtime_dependency 'popper_js', '>= 2.11.8', '< 3'
 
-  s.add_runtime_dependency 'sassc-rails', '>= 2.0.0'
-  s.add_runtime_dependency 'autoprefixer-rails', '>= 9.1.0'
+  s.add_development_dependency 'rake'
 
   # Testing dependencies
-  s.add_development_dependency 'minitest', '~> 5.14.4'
+  s.add_development_dependency 'minitest', '>= 5.14.4', '< 7'
   s.add_development_dependency 'minitest-reporters', '~> 1.4.3'
   s.add_development_dependency 'term-ansicolor'
   # Integration testing
   s.add_development_dependency 'capybara', '>= 2.6.0'
   s.add_development_dependency 'cuprite'
   # Dummy Rails app dependencies
+  s.add_development_dependency 'railties'
   s.add_development_dependency 'actionpack', '>= 4.1.5'
   s.add_development_dependency 'activesupport', '>= 4.1.5'
   s.add_development_dependency 'json', '>= 1.8.1'

data/lib/bootstrap/engine.rb

@@ -1,7 +1,22 @@
 # frozen_string_literal: true
 
-require 'autoprefixer-rails'
-require 'sassc-rails'
+begin
+  require 'dartsass-sprockets'
+rescue LoadError
+  begin
+    require 'sassc-rails'
+  rescue LoadError
+    begin
+      require 'dartsass-rails'
+    rescue LoadError
+      begin
+        require 'cssbundling-rails'
+      rescue LoadError
+        raise LoadError.new("bootstrap-rubygem requires a Sass engine. Please add dartsass-sprockets, sassc-rails, dartsass-rails or cssbundling-rails to your dependencies.")
+      end
+    end
+  end
+end
 
 module Bootstrap
   module Rails

data/lib/bootstrap/version.rb

@@ -1,6 +1,6 @@
 # frozen_string_literal: true
 
 module Bootstrap
-  VERSION       = '5.3.0'
-  BOOTSTRAP_SHA = '60098ac499d30aa50575b0b7137391c06ef25429'
+  VERSION       = '5.3.8'
+  BOOTSTRAP_SHA = '25aa8cc0b32f0d1a54be575347e6d84b70b1acd7'
 end

data/tasks/updater/scss.rb

@@ -12,7 +12,7 @@ class Updater
       log_processed "#{bootstrap_scss_files * ' '}"
 
       log_status 'Updating scss main files'
-      %w(bootstrap bootstrap-grid bootstrap-reboot).each do |name|
+      %w(bootstrap bootstrap-grid bootstrap-reboot bootstrap-utilities).each do |name|
         # Compass treats non-partials as targets to copy into the main project, so make them partials.
         # Also move them up a level to clearly indicate entry points.
         from = "#{save_to}/#{name}.scss"

data/test/dummy_rails/config/application.rb

@@ -10,7 +10,6 @@ require 'rails'
   require "#{framework}/railtie"
 end
 
-require 'autoprefixer-rails'
 require 'uglifier'
 require 'bootstrap'
 
@@ -29,4 +28,3 @@ module Dummy
     end
   end
 end
-

data/test/gemfiles/rails_4_2.gemfile

@@ -2,6 +2,7 @@ source 'https://rubygems.org'
 
 gem 'actionpack', '~> 4.2.7'
 gem 'activesupport', '~> 4.2.7'
+gem 'sassc-rails', '~> 2.0'
+gem 'bigdecimal', '1.3.5'
 
 gemspec path: '../../'
-

data/test/gemfiles/rails_5_0.gemfile

@@ -2,7 +2,6 @@ source 'https://rubygems.org'
 
 gem 'actionpack', '~> 5.0.0'
 gem 'activesupport', '~> 5.0.0'
-gem 'autoprefixer-rails', '>= 6.3.6.1'
+gem 'sassc-rails', '~> 2.0'
 
 gemspec path: '../../'
-

data/test/gemfiles/rails_5_1.gemfile

@@ -2,7 +2,6 @@ source 'https://rubygems.org'
 
 gem 'actionpack', '~> 5.1.0'
 gem 'activesupport', '~> 5.1.0'
-gem 'autoprefixer-rails', '>= 7.1.1'
+gem 'sassc-rails', '~> 2.0'
 
 gemspec path: '../../'
-

data/test/gemfiles/rails_5_2.gemfile

@@ -2,7 +2,6 @@ source 'https://rubygems.org'
 
 gem 'actionpack', '~> 5.2.8'
 gem 'activesupport', '~> 5.2.8'
-gem 'autoprefixer-rails', '>= 7.1.1'
+gem 'sassc-rails', '~> 2.0'
 
 gemspec path: '../../'
-

data/test/gemfiles/rails_6_0.gemfile

@@ -2,6 +2,14 @@ source 'https://rubygems.org'
 
 gem 'actionpack', '~> 6.0.3'
 gem 'activesupport', '~> 6.0.3'
-gem 'autoprefixer-rails', '>= 9.7.6'
+gem 'sassc-rails', '~> 2.0'
 
 gemspec path: '../../'
+
+# no longer bundled as default gems in newer ruby
+gem 'base64'
+gem 'benchmark'
+gem 'drb'
+gem 'mutex_m'
+gem 'ruby2_keywords'
+gem 'tsort'

data/test/gemfiles/rails_6_1.gemfile

@@ -2,6 +2,14 @@ source 'https://rubygems.org'
 
 gem 'actionpack', '~> 6.1.3'
 gem 'activesupport', '~> 6.1.3'
-gem 'autoprefixer-rails', '>= 9.7.6'
+gem 'sassc-rails', '~> 2.0'
 
 gemspec path: '../../'
+
+# no longer bundled as default gems in newer ruby
+gem 'base64'
+gem 'benchmark'
+gem 'drb'
+gem 'mutex_m'
+gem 'ruby2_keywords'
+gem 'tsort'

data/test/gemfiles/rails_7_0_dartsass.gemfile

@@ -0,0 +1,15 @@
+source 'https://rubygems.org'
+
+gem 'actionpack', '~> 7.0.4'
+gem 'activesupport', '~> 7.0.4'
+gem 'dartsass-sprockets', '~> 3.0'
+
+gemspec path: '../../'
+
+# no longer bundled as default gems in newer ruby
+gem 'base64'
+gem 'benchmark'
+gem 'drb'
+gem 'mutex_m'
+gem 'ruby2_keywords'
+gem 'tsort'

data/test/gemfiles/rails_7_0_sassc.gemfile

@@ -0,0 +1,15 @@
+source 'https://rubygems.org'
+
+gem 'actionpack', '~> 7.0.4'
+gem 'activesupport', '~> 7.0.4'
+gem 'sassc-rails', '~> 2.0'
+
+gemspec path: '../../'
+
+# no longer bundled as default gems in newer ruby
+gem 'base64'
+gem 'benchmark'
+gem 'drb'
+gem 'mutex_m'
+gem 'ruby2_keywords'
+gem 'tsort'

data/test/rails_test.rb

@@ -12,11 +12,6 @@ class RailsTest < ActionDispatch::IntegrationTest
     screenshot!
   end
 
-  def test_autoprefixer
-    get ActionController::Base.helpers.stylesheet_path('application.css')
-    assert_match(/-webkit-(?:transition|transform)/, response.body)
-  end
-
   def test_precompile
     Dummy::Application.load_tasks
     Rake::Task['assets:precompile'].invoke

data/test/test_helper.rb

@@ -1,3 +1,5 @@
+require 'logger'
+
 require 'minitest/autorun'
 require 'minitest/reporters'
 Minitest::Reporters.use! Minitest::Reporters::SpecReporter.new
@@ -25,8 +27,8 @@ browser_path = ENV['CHROMIUM_BIN'] || %w[
 Capybara.register_driver :cuprite do |app|
   options = {
       window_size: [1280, 1024],
-      timeout: 15,
-      process_timeout: 15
+      timeout: 30,
+      process_timeout: 60
   }
   options[:browser_path] = browser_path if browser_path
   Capybara::Cuprite::Driver.new(app, options)
@@ -34,9 +36,9 @@ end
 
 Capybara.configure do |config|
   config.server = :webrick
-  config.app_host = 'http://localhost:7000'
+  config.app_host = 'http://localhost:8000'
   config.default_driver = :cuprite
   config.javascript_driver = :cuprite
-  config.server_port = 7000
+  config.server_port = 8000
   config.default_max_wait_time = 10
 end