v5: Floating labels (#30449)

* v5: Promote floating labels example to component

- Adds new .form-floating
- Stubs out basics of a docs page
- Removes existing Example

* Update floating labels to support .form-select, make inputs and selects more consistent

- To do this, I made the .form-control and .form-select consistent in min-height vs height
- Removed some unused variables now
- Updated -color to be the -color because I don't know why this was any different before
- Update page to include some examples for layout, validation, and value
- Rewrite styles to not modify padding, but instead transform and opacity

* Streamline and bulletproof some things

- Apply some optimizations from code review
- Removed unecessary properties from the label
- Add some comments for what properties are required
- Move from fixed height for labels to height 100% so we can support textareas
- Improve docs a little bit, add ToC

* Move some values to variables, switch from scaling font-size to scale, update transforms

* Bring over changes from #30966 and add to them to tighten things up

* Delete the now unused example images

* Fix typo

* Allowlist the calc function

* Add transform-origin, update transform values

* Test out autofill fix

* Fix linter issue

* Mention it in the migration guide

* Bump bundlesize

* Add one more variable per review

* Shave .25rem off the height

Co-authored-by: XhmikosR <xhmikosr@gmail.com>

1 files changed, 8 insertions, 15 deletions

diff --git a/dist/js/bootstrap.bundle.js b/dist/js/bootstrap.bundle.js
index 4767e2f826..ec2a964888 100644
--- a/dist/js/bootstrap.bundle.js
+++ b/dist/js/bootstrap.bundle.js
@@ -975,17 +975,6 @@
         top: element.offsetTop,
         left: element.offsetLeft
       };
-    },
-    toggleClass: function toggleClass(element, className) {
-      if (!element) {
-        return;
-      }
-
-      if (element.classList.contains(className)) {
-        element.classList.remove(className);
-      } else {
-        element.classList.add(className);
-      }
     }
   };
 
@@ -4844,8 +4833,10 @@
 
       this._element.setAttribute('aria-expanded', true);
 
-      Manipulator.toggleClass(this._menu, CLASS_NAME_SHOW$1);
-      Manipulator.toggleClass(this._element, CLASS_NAME_SHOW$1);
+      this._menu.classList.toggle(CLASS_NAME_SHOW$1);
+
+      this._element.classList.toggle(CLASS_NAME_SHOW$1);
+
       EventHandler.trigger(parent, EVENT_SHOWN$1, relatedTarget);
     };
 
@@ -4868,8 +4859,10 @@
         this._popper.destroy();
       }
 
-      Manipulator.toggleClass(this._menu, CLASS_NAME_SHOW$1);
-      Manipulator.toggleClass(this._element, CLASS_NAME_SHOW$1);
+      this._menu.classList.toggle(CLASS_NAME_SHOW$1);
+
+      this._element.classList.toggle(CLASS_NAME_SHOW$1);
+
       EventHandler.trigger(parent, EVENT_HIDDEN$1, relatedTarget);
     };