gd-bs 6.6.40 → 6.6.42

package/index.html

@@ -1351,6 +1351,7 @@
             });
             window["navbar"] = GD.Components.Navbar({
                 el: document.querySelector("#navbar"),
+                brand: "Test",
                 onClick: function(item) {
                     // Log
                     console.log("Nav Item Clicked: " + item.text);

package/package.json

@@ -1,6 +1,6 @@
 {
     "name": "gd-bs",
-    "version": "6.6.40",
+    "version": "6.6.42",
     "description": "Bootstrap JavaScript, TypeScript and Web Components library.",
     "main": "build/index.js",
     "typings": "src/index.d.ts",

package/src/components/form/control.ts

@@ -631,8 +631,14 @@ export class FormControl implements IFormControl {
         if (this._el) {
             // See if this is a row
             if (this._el.parentElement && this._el.parentElement.parentElement && this._el.parentElement.parentElement.classList.contains("row")) {
-                // Hide the row element
-                this._el.parentElement.parentElement.classList.add("d-none");
+                // See if there are other controls in this row
+                if (this._el.parentElement.parentElement.querySelectorAll(".col").length > 1) {
+                    // Hide the column element
+                    this._el.parentElement.classList.add("d-none");
+                } else {
+                    // Hide the row element
+                    this._el.parentElement.parentElement.classList.add("d-none");
+                }
             }
             // Else, ensure the parent element exists
             else if (this._el.parentElement) {
@@ -734,8 +740,14 @@ export class FormControl implements IFormControl {
         if (this._el) {
             // See if this is a row
             if (this._el.parentElement && this._el.parentElement.parentElement && this._el.parentElement.parentElement.classList.contains("row")) {
-                // Show the row element
-                this._el.parentElement.parentElement.classList.remove("d-none");
+                // See if there are other controls in this row
+                if (this._el.parentElement.parentElement.querySelectorAll(".col").length > 1) {
+                    // Show the column element
+                    this._el.parentElement.classList.remove("d-none");
+                } else {
+                    // Show the row element
+                    this._el.parentElement.parentElement.classList.remove("d-none");
+                }
             }
             // Else, ensure the parent element exists
             else if (this._el.parentElement) {

package/src/components/navbar/index.ts

@@ -40,19 +40,36 @@ class _Navbar extends Base<INavbarProps> implements INavbar {
 
     // Configure the card group
     private configure(itemTemplate: string) {
-        // See if there is a brand
-        let brand = this.el.querySelector(".navbar-brand") as HTMLAnchorElement;
-        if (brand) {
-            if (this.props.brand) {
+        // See if we are applying a brand
+        if (this.props.brand) {
+            let elBrand = this.el.querySelector("span.navbar-brand") as HTMLSpanElement;
+            let elBrandLink = this.el.querySelector("a.navbar-brand") as HTMLAnchorElement;
+
+            // See if we are using a link
+            if (this.props.brandUrl || this.props.onClickBrand) {
+                // Remove the element
+                elBrand ? elBrand.parentElement.removeChild(elBrand) : null;
+
                 // Update the brand
-                this.props.brandUrl ? brand.href = this.props.brandUrl : null;
+                elBrandLink ? elBrandLink.href = this.props.brandUrl : null;
 
                 // Append the content
-                appendContent(brand, this.props.brand);
+                appendContent(elBrandLink, this.props.brand);
             } else {
-                // Remove the brand
-                brand.parentNode.removeChild(brand);
+                // Remove the link element
+                elBrandLink ? elBrandLink.parentElement.removeChild(elBrandLink) : null;
+
+                // Append the content
+                appendContent(elBrand, this.props.brand);
             }
+        } else {
+            // Remove the brand link
+            let elBrandLink = this.el.querySelector("a.navbar-brand");
+            if (elBrandLink) { elBrandLink.parentNode.removeChild(elBrandLink); }
+
+            // Remove the brand element
+            let elBrand = this.el.querySelector("span.navbar-brand");
+            if (elBrand) { elBrand.parentNode.removeChild(elBrand); }
         }
 
         // Update the nav bar

package/src/components/navbar/templates.ts

@@ -3,6 +3,7 @@ export const HTML = `
 <nav class="navbar navbar-expand-lg">
     <div class="container-fluid">
         <a class="navbar-brand" href="#"></a>
+        <span class="navbar-brand mb-0 h1"></span>
         <button class="navbar-toggler" type="button" data-bs-toggle="collapse" aria-expanded="false"
             aria-label="Toggle Navigation">
             <span class="navbar-toggler-icon"></span>