gd-bs 6.1.3 → 6.1.5

package/src/components/form/control.ts

@@ -651,109 +651,113 @@ export class FormControl implements IFormControl {
 
     // Updates the control validation
     updateValidation(elControl: Element, validation: IFormControlValidationResult) {
-        // Get the form control
-        let elFormControl: HTMLElement = elControl.querySelector(".form-control") || elControl.querySelector(".form-select");
-        if (elFormControl) {
-            // Clear the invalid/valid classes
-            elFormControl.classList.remove("is-invalid");
-            elFormControl.classList.remove("is-valid");
-
-            // Set the class
-            elFormControl.classList.add(validation.isValid ? "is-valid" : "is-invalid");
-        } else {
-            let validateControls = (controls: Array<HTMLElement>) => {
-                // Parse the controls
-                for (let i = 0; i < controls.length; i++) {
-                    let control = controls[i];
-
-                    // Clear the invalid/valid classes
-                    control.classList.remove("is-invalid");
-                    control.classList.remove("is-valid");
-
-                    // Set the class
-                    control.classList.add(validation.isValid ? "is-valid" : "is-invalid");
+        // Get the form controls
+        let elFormControls = elControl.querySelectorAll(".form-control") || elControl.querySelectorAll(".form-select");
+        for (let i = 0; i < elFormControls.length; i++) {
+            // Ensure the control exists
+            let elFormControl = elFormControls[i] as HTMLElement;
+            if (elFormControl) {
+                // Clear the invalid/valid classes
+                elFormControl.classList.remove("is-invalid");
+                elFormControl.classList.remove("is-valid");
+
+                // Set the class
+                elFormControl.classList.add(validation.isValid ? "is-valid" : "is-invalid");
+            } else {
+                let validateControls = (controls: Array<HTMLElement>) => {
+                    // Parse the controls
+                    for (let i = 0; i < controls.length; i++) {
+                        let control = controls[i];
+
+                        // Clear the invalid/valid classes
+                        control.classList.remove("is-invalid");
+                        control.classList.remove("is-valid");
+
+                        // Set the class
+                        control.classList.add(validation.isValid ? "is-valid" : "is-invalid");
+                    }
                 }
-            }
 
-            // Get the checkboxes
-            let elCheckboxes = elControl.querySelectorAll(".form-check-input");
-            if (elCheckboxes.length > 0) {
-                // Validate the controls
-                validateControls(elCheckboxes as any);
+                // Get the checkboxes
+                let elCheckboxes = elControl.querySelectorAll(".form-check-input");
+                if (elCheckboxes.length > 0) {
+                    // Validate the controls
+                    validateControls(elCheckboxes as any);
 
-                // Set the form control
-                elFormControl = elCheckboxes.length > 0 ? elCheckboxes[elCheckboxes.length - 1] as any : elFormControl;
-            }
+                    // Set the form control
+                    elFormControl = elCheckboxes.length > 0 ? elCheckboxes[elCheckboxes.length - 1] as any : elFormControl;
+                }
 
-            // Get the custom controls
-            let elCustomControls = elControl.querySelectorAll(".custom-control-input");
-            if (elCustomControls.length > 0) {
-                // Validate the controls
-                validateControls(elCustomControls as any);
+                // Get the custom controls
+                let elCustomControls = elControl.querySelectorAll(".custom-control-input");
+                if (elCustomControls.length > 0) {
+                    // Validate the controls
+                    validateControls(elCustomControls as any);
 
-                // Set the form control
-                elFormControl = elCustomControls.length > 0 ? elCustomControls[elCustomControls.length - 1] as any : elFormControl;
+                    // Set the form control
+                    elFormControl = elCustomControls.length > 0 ? elCustomControls[elCustomControls.length - 1] as any : elFormControl;
+                }
             }
-        }
 
-        // Ensure the form control exists
-        if (elFormControl) {
-            let useTooltip = this._formProps.validationType == FormValidationTypes.Tooltip;
-
-            // Clear the old valid message if it exists
-            let validClassName = useTooltip ? "valid-tooltip" : "valid-feedback";
-            let elMessage = elFormControl.parentNode.querySelector("." + validClassName) as HTMLElement;
-            if (elMessage) {
-                // Clear the message
-                elMessage.innerHTML = "";
-                elMessage.style.display = "";
-            }
+            // Ensure the form control exists
+            if (elFormControl) {
+                let useTooltip = this._formProps.validationType == FormValidationTypes.Tooltip;
 
-            // Clear the old valid message if it exists
-            let invalidClassName = useTooltip ? "invalid-tooltip" : "invalid-feedback";
-            elMessage = elFormControl.parentNode.querySelector("." + invalidClassName) as HTMLElement;
-            if (elMessage) {
-                // Clear the message
-                elMessage.innerHTML = "";
-                elMessage.style.display = "";
-            }
+                // Clear the old valid message if it exists
+                let validClassName = useTooltip ? "valid-tooltip" : "valid-feedback";
+                let elMessage = elFormControl.parentNode.querySelector("." + validClassName) as HTMLElement;
+                if (elMessage) {
+                    // Clear the message
+                    elMessage.innerHTML = "";
+                    elMessage.style.display = "";
+                }
 
-            // See if there is invalid feedback
-            if (validation.invalidMessage || this._props.errorMessage) {
-                // Get the element
+                // Clear the old valid message if it exists
                 let invalidClassName = useTooltip ? "invalid-tooltip" : "invalid-feedback";
                 elMessage = elFormControl.parentNode.querySelector("." + invalidClassName) as HTMLElement;
-                if (elMessage == null) {
-                    // Create the element
-                    elMessage = document.createElement("div");
-                    elMessage.className = invalidClassName;
-                    elFormControl.parentNode.appendChild(elMessage);
+                if (elMessage) {
+                    // Clear the message
+                    elMessage.innerHTML = "";
+                    elMessage.style.display = "";
                 }
 
-                // Set the message
-                elMessage.innerHTML = validation.invalidMessage || this._props.errorMessage;
-
-                // Update the display
-                elMessage.style.display = validation.isValid ? "" : "block";
-            }
-
-            // See if there is valid feedback
-            if (validation.validMessage) {
-                // Get the element
-                let validClassName = useTooltip ? "valid-tooltip" : "valid-feedback";
-                elMessage = elFormControl.parentNode.querySelector("." + validClassName) as HTMLElement;
-                if (elMessage == null) {
-                    // Create the element
-                    elMessage = document.createElement("div");
-                    elMessage.className = validClassName;
-                    elFormControl.parentNode.appendChild(elMessage);
+                // See if there is invalid feedback
+                if (validation.invalidMessage || this._props.errorMessage) {
+                    // Get the element
+                    let invalidClassName = useTooltip ? "invalid-tooltip" : "invalid-feedback";
+                    elMessage = elFormControl.parentNode.querySelector("." + invalidClassName) as HTMLElement;
+                    if (elMessage == null) {
+                        // Create the element
+                        elMessage = document.createElement("div");
+                        elMessage.className = invalidClassName;
+                        elFormControl.parentNode.appendChild(elMessage);
+                    }
+
+                    // Set the message
+                    elMessage.innerHTML = validation.invalidMessage || this._props.errorMessage;
+
+                    // Update the display
+                    elMessage.style.display = validation.isValid ? "" : "block";
                 }
 
-                // Set the message
-                elMessage.innerHTML = validation.validMessage;
-
-                // Update the display
-                elMessage.style.display = validation.isValid ? "block" : "";
+                // See if there is valid feedback
+                if (validation.validMessage) {
+                    // Get the element
+                    let validClassName = useTooltip ? "valid-tooltip" : "valid-feedback";
+                    elMessage = elFormControl.parentNode.querySelector("." + validClassName) as HTMLElement;
+                    if (elMessage == null) {
+                        // Create the element
+                        elMessage = document.createElement("div");
+                        elMessage.className = validClassName;
+                        elFormControl.parentNode.appendChild(elMessage);
+                    }
+
+                    // Set the message
+                    elMessage.innerHTML = validation.validMessage;
+
+                    // Update the display
+                    elMessage.style.display = validation.isValid ? "block" : "";
+                }
             }
         }
     }

package/src/styles/_core.scss

@@ -1,6 +1,7 @@
 // Configuration
 @import "~bootstrap/scss/functions";
 @import "~bootstrap/scss/variables";
+@import "~bootstrap/scss/variables-dark";
 @import "~bootstrap/scss/maps";
 @import "~bootstrap/scss/mixins";
 @import "~bootstrap/scss/utilities";

package/src/styles/_custom.scss

@@ -185,6 +185,7 @@
     /* Color match form elements */
     .form-control {
         border-color: #6c757d;
+        border-radius: var(--bs-border-radius);
     }
     /* Color match disabled form elements */
     .form-control:disabled,
@@ -393,6 +394,15 @@
     .popover-body>* {
         position: relative !important;
     }
+    /* Fix Rich Textbox rounded corners */
+    .rich-textbox {
+        .editor-container {
+            border-radius: 0 0 var(--bs-border-radius) var(--bs-border-radius) !important;
+        }
+        .toolbar-container {
+            border-radius: var(--bs-border-radius) var(--bs-border-radius) 0 0 !important;
+        }
+    }
     /* Fix extra top margin in Firefox */
     table.dataTable {
         margin-top: 0rem !important;
@@ -423,11 +433,11 @@
     }
     /* Fix validation styling */
     .form-control.is-invalid {
-        border-color: #dc3545;
+        border-color: #dc3545 !important;
         background-image: url("data:image/svg+xml,<svg xmlns=%27http://www.w3.org/2000/svg%27 viewBox=%270 0 12 12%27 width=%2712%27 height=%2712%27 fill=%27none%27 stroke=%27%23dc3545%27%3e%3ccircle cx=%276%27 cy=%276%27 r=%274.5%27/%3e%3cpath stroke-linejoin=%27round%27 d=%27M5.8 3.6h.4L6 6.5z%27/%3e%3ccircle cx=%276%27 cy=%278.2%27 r=%27.6%27 fill=%27%23dc3545%27 stroke=%27none%27/></svg>");
     }
     .form-control.is-valid {
-        border-color: #198754;
+        border-color: #198754 !important;
         background-image: url("data:image/svg+xml,<svg xmlns=%27http://www.w3.org/2000/svg%27 viewBox=%270 0 8 8%27%3e%3cpath fill=%27%23198754%27 d=%27M2.3 6.73.6 4.53c-.4-1.04.46-1.4 1.1-.8l1.1 1.4 3.4-3.8c.6-.63 1.6-.27 1.2.7l-4 4.6c-.43.5-.8.4-1.1.1z%27/></svg>");
     }
     .form-select.is-invalid:not([multiple]):not([size]), .form-select.is-invalid:not([multiple])[size="1"] {