gd-bs 6.1.4 → 6.1.6

package/build/components/form/control.js

@@ -647,94 +647,98 @@ var FormControl = /** @class */ (function () {
     };
     // Updates the control validation
     FormControl.prototype.updateValidation = function (elControl, validation) {
-        // Get the form control
-        var elFormControl = 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 {
-            var validateControls = function (controls) {
-                // Parse the controls
-                for (var i = 0; i < controls.length; i++) {
-                    var 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
-            var elCheckboxes = elControl.querySelectorAll(".form-check-input");
-            if (elCheckboxes.length > 0) {
-                // Validate the controls
-                validateControls(elCheckboxes);
-                // Set the form control
-                elFormControl = elCheckboxes.length > 0 ? elCheckboxes[elCheckboxes.length - 1] : elFormControl;
-            }
-            // Get the custom controls
-            var elCustomControls = elControl.querySelectorAll(".custom-control-input");
-            if (elCustomControls.length > 0) {
-                // Validate the controls
-                validateControls(elCustomControls);
-                // Set the form control
-                elFormControl = elCustomControls.length > 0 ? elCustomControls[elCustomControls.length - 1] : elFormControl;
-            }
-        }
-        // Ensure the form control exists
-        if (elFormControl) {
-            var useTooltip = this._formProps.validationType == _1.FormValidationTypes.Tooltip;
-            // Clear the old valid message if it exists
-            var validClassName = useTooltip ? "valid-tooltip" : "valid-feedback";
-            var elMessage = elFormControl.parentNode.querySelector("." + validClassName);
-            if (elMessage) {
-                // Clear the message
-                elMessage.innerHTML = "";
-                elMessage.style.display = "";
+        // Get the form controls
+        var elFormControls = elControl.querySelectorAll(".form-control") || elControl.querySelectorAll(".form-select");
+        for (var i = 0; i < elFormControls.length; i++) {
+            // Ensure the control exists
+            var elFormControl = elFormControls[i];
+            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");
             }
-            // Clear the old valid message if it exists
-            var invalidClassName = useTooltip ? "invalid-tooltip" : "invalid-feedback";
-            elMessage = elFormControl.parentNode.querySelector("." + invalidClassName);
-            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
-                var invalidClassName_1 = useTooltip ? "invalid-tooltip" : "invalid-feedback";
-                elMessage = elFormControl.parentNode.querySelector("." + invalidClassName_1);
-                if (elMessage == null) {
-                    // Create the element
-                    elMessage = document.createElement("div");
-                    elMessage.className = invalidClassName_1;
-                    elFormControl.parentNode.appendChild(elMessage);
+            else {
+                var validateControls = function (controls) {
+                    // Parse the controls
+                    for (var i_1 = 0; i_1 < controls.length; i_1++) {
+                        var control = controls[i_1];
+                        // 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
+                var elCheckboxes = elControl.querySelectorAll(".form-check-input");
+                if (elCheckboxes.length > 0) {
+                    // Validate the controls
+                    validateControls(elCheckboxes);
+                    // Set the form control
+                    elFormControl = elCheckboxes.length > 0 ? elCheckboxes[elCheckboxes.length - 1] : elFormControl;
+                }
+                // Get the custom controls
+                var elCustomControls = elControl.querySelectorAll(".custom-control-input");
+                if (elCustomControls.length > 0) {
+                    // Validate the controls
+                    validateControls(elCustomControls);
+                    // Set the form control
+                    elFormControl = elCustomControls.length > 0 ? elCustomControls[elCustomControls.length - 1] : elFormControl;
                 }
-                // 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
-                var validClassName_1 = useTooltip ? "valid-tooltip" : "valid-feedback";
-                elMessage = elFormControl.parentNode.querySelector("." + validClassName_1);
-                if (elMessage == null) {
-                    // Create the element
-                    elMessage = document.createElement("div");
-                    elMessage.className = validClassName_1;
-                    elFormControl.parentNode.appendChild(elMessage);
+            // Ensure the form control exists
+            if (elFormControl) {
+                var useTooltip = this._formProps.validationType == _1.FormValidationTypes.Tooltip;
+                // Clear the old valid message if it exists
+                var validClassName = useTooltip ? "valid-tooltip" : "valid-feedback";
+                var elMessage = elFormControl.parentNode.querySelector("." + validClassName);
+                if (elMessage) {
+                    // Clear the message
+                    elMessage.innerHTML = "";
+                    elMessage.style.display = "";
+                }
+                // Clear the old valid message if it exists
+                var invalidClassName = useTooltip ? "invalid-tooltip" : "invalid-feedback";
+                elMessage = elFormControl.parentNode.querySelector("." + invalidClassName);
+                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
+                    var invalidClassName_1 = useTooltip ? "invalid-tooltip" : "invalid-feedback";
+                    elMessage = elFormControl.parentNode.querySelector("." + invalidClassName_1);
+                    if (elMessage == null) {
+                        // Create the element
+                        elMessage = document.createElement("div");
+                        elMessage.className = invalidClassName_1;
+                        elFormControl.parentNode.appendChild(elMessage);
+                    }
+                    // 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
+                    var validClassName_1 = useTooltip ? "valid-tooltip" : "valid-feedback";
+                    elMessage = elFormControl.parentNode.querySelector("." + validClassName_1);
+                    if (elMessage == null) {
+                        // Create the element
+                        elMessage = document.createElement("div");
+                        elMessage.className = validClassName_1;
+                        elFormControl.parentNode.appendChild(elMessage);
+                    }
+                    // Set the message
+                    elMessage.innerHTML = validation.validMessage;
+                    // 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" : "";
             }
         }
     };

package/build/components/iconLink/index.js

@@ -0,0 +1,84 @@
+"use strict";
+var __extends = (this && this.__extends) || (function () {
+    var extendStatics = function (d, b) {
+        extendStatics = Object.setPrototypeOf ||
+            ({ __proto__: [] } instanceof Array && function (d, b) { d.__proto__ = b; }) ||
+            function (d, b) { for (var p in b) if (Object.prototype.hasOwnProperty.call(b, p)) d[p] = b[p]; };
+        return extendStatics(d, b);
+    };
+    return function (d, b) {
+        if (typeof b !== "function" && b !== null)
+            throw new TypeError("Class extends value " + String(b) + " is not a constructor or null");
+        extendStatics(d, b);
+        function __() { this.constructor = d; }
+        d.prototype = b === null ? Object.create(b) : (__.prototype = b.prototype, new __());
+    };
+})();
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.IconLink = exports.IconLinkTypes = void 0;
+var base_1 = require("../base");
+var common_1 = require("../common");
+var templates_1 = require("./templates");
+/**
+ * Icon Link Types
+ */
+var IconLinkTypes;
+(function (IconLinkTypes) {
+    IconLinkTypes[IconLinkTypes["AfterText"] = 1] = "AfterText";
+    IconLinkTypes[IconLinkTypes["BeforeText"] = 2] = "BeforeText";
+})(IconLinkTypes = exports.IconLinkTypes || (exports.IconLinkTypes = {}));
+/**
+ * Icon Link
+ * @property props - The list box properties.
+ */
+var _IconLink = /** @class */ (function (_super) {
+    __extends(_IconLink, _super);
+    // Constructor
+    function _IconLink(props, template) {
+        if (template === void 0) { template = templates_1.HTML; }
+        var _this = _super.call(this, template, props) || this;
+        _this._elIcon = null;
+        // Configure the list box
+        _this.configure();
+        // Configure the events
+        _this.configureEvents();
+        // Configure the parent
+        _this.configureParent();
+        return _this;
+    }
+    // Configures the list box
+    _IconLink.prototype.configure = function () {
+        // Render the content
+        (0, common_1.appendContent)(this.el, this.props.content);
+        // Set the icon if it exists
+        if (this.props.iconType) {
+            if (typeof (this.props.iconType) === "function") {
+                // Set the icon
+                this._elIcon = this.props.iconType(this.props.iconSize, this.props.iconSize, this.props.iconClassName);
+            }
+            // Else, it's an element
+            else if (typeof (this.props.iconType === "object")) {
+                // Set the icon
+                this._elIcon = this.props.iconType;
+            }
+            else {
+                return;
+            }
+            // See if we are rendering the content first
+            if (this.props.type == IconLinkTypes.AfterText) {
+                // Append the icon
+                this.el.appendChild(this._elIcon);
+            }
+            else {
+                // Prepend the icon
+                this.el.prepend(this._elIcon);
+            }
+        }
+    };
+    // Configures the events
+    _IconLink.prototype.configureEvents = function () {
+    };
+    return _IconLink;
+}(base_1.Base));
+var IconLink = function (props, template) { return new _IconLink(props, template); };
+exports.IconLink = IconLink;

package/build/components/iconLink/templates.js

@@ -0,0 +1,5 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.HTML = void 0;
+// Form
+exports.HTML = "<a class=\"icon-link\" href=\"#\"></a>".trim();

package/build/components/index.js

@@ -27,6 +27,7 @@ __exportStar(require("./checkboxGroup"), exports);
 __exportStar(require("./collapse"), exports);
 __exportStar(require("./dropdown"), exports);
 __exportStar(require("./form"), exports);
+__exportStar(require("./iconLink"), exports);
 __exportStar(require("./inputGroup"), exports);
 __exportStar(require("./jumbotron"), exports);
 __exportStar(require("./listBox"), exports);

package/build/components/nav/index.js

@@ -41,13 +41,14 @@ var _Nav = /** @class */ (function (_super) {
     // Configure the card group
     _Nav.prototype.configure = function (itemTemplate) {
         // Update the navigation
-        var nav = this.el.querySelector(".nav");
+        var nav = this.el.classList.contains("nav") ? this.el : this.el.querySelector(".nav");
         if (nav) {
             this.props.id ? nav.id = this.props.id : null;
             this.props.enableFill ? this.el.classList.add("nav-fill") : null;
             this.props.isJustified ? this.el.classList.add("nav-justified") : null;
             this.props.isPills ? this.el.classList.add("nav-pills") : null;
             this.props.isTabs ? this.el.classList.add("nav-tabs") : null;
+            this.props.isUnderline ? this.el.classList.add("nav-underline") : null;
             this.props.isVertical ? this.el.classList.add("flex-column") : null;
         }
         // Render the nav links
@@ -59,25 +60,25 @@ var _Nav = /** @class */ (function (_super) {
         this.props.onRendered ? this.props.onRendered(this.el) : null;
     };
     // Configures the tab link event
-    _Nav.prototype.configureTabEvents = function (tab) {
+    _Nav.prototype.configureLinkEvents = function (link) {
         var _this = this;
         // Add a click event
-        tab.el.addEventListener("click", function () {
+        link.el.addEventListener("click", function () {
             var prevTab = null;
-            var newTab = tab;
+            var newTab = link;
             // Parse the links
             for (var i = 0; i < _this._links.length; i++) {
-                var link = _this._links[i];
+                var link_2 = _this._links[i];
                 // See if it's active
-                if (link.isActive) {
+                if (link_2.isActive) {
                     // Set the old tab
-                    prevTab = link;
+                    prevTab = link_2;
                     // Toggle it
-                    link.toggle(_this.props.fadeTabs);
+                    link_2.toggle(_this.props.fadeTabs);
                 }
             }
             // Toggle the link
-            tab.toggle(_this.props.fadeTabs);
+            link.toggle(_this.props.fadeTabs);
             // Call the click event
             _this.props.onClick ? _this.props.onClick(newTab, prevTab) : null;
         });
@@ -87,7 +88,7 @@ var _Nav = /** @class */ (function (_super) {
         // Clear the links
         this._links = [];
         // Get the nav and tab elements
-        var nav = this.el.querySelector(".nav") || this.el;
+        var nav = this.el.classList.contains("nav") ? this.el : this.el.querySelector(".nav");
         if (nav) {
             var tabs = this.el.querySelector(".tab-content");
             // Parse the navigation items
@@ -97,10 +98,10 @@ var _Nav = /** @class */ (function (_super) {
                 var link = new link_1.NavLink(links[i], tabs ? true : false, itemTemplate);
                 nav.appendChild(link.el);
                 this._links.push(link);
+                // Configure the link event
+                this.configureLinkEvents(link);
                 // See if we are rendering tabs
                 if (tabs) {
-                    // Configure the events
-                    this.configureTabEvents(link);
                     // Add the tab content
                     tabs.appendChild(link.elTabContent);
                     // See if the fade option is enabled

package/build/components/nav/link.js

@@ -129,14 +129,14 @@ var NavLink = /** @class */ (function (_super) {
         if (this.isActive) {
             // Hide this link and tab
             this._elLink.classList.remove("active");
-            this._elTab.classList.remove("active");
-            this._elTab.classList.remove("show");
+            this._elTab ? this._elTab.classList.remove("active") : null;
+            this._elTab ? this._elTab.classList.remove("show") : null;
         }
         else {
             // Show this link and tab
             this._elLink.classList.add("active");
-            this._elTab.classList.add("active");
-            fadeTabs ? this._elTab.classList.add("show") : null;
+            this._elTab ? this._elTab.classList.add("active") : null;
+            this._elTab && fadeTabs ? this._elTab.classList.add("show") : null;
         }
     };
     return NavLink;