gd-bs 5.0.4 → 5.0.8

package/package.json

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

package/src/components/listBox/index.ts

@@ -81,6 +81,22 @@ class _ListBox extends Base<IListBoxProps> implements IListBox {
 
     // Configures the events
     private configureEvents() {
+        // Execute the load event
+        let returnVal: any = this.props.onLoadData ? this.props.onLoadData() : null;
+        if (returnVal) {
+            // See if a promise was returned
+            if (typeof (returnVal.then) === "function") {
+                // Wait for the promise to complete
+                returnVal.then(items => {
+                    // Set the options
+                    this.setOptions(items);
+                });
+            } else {
+                // Set the options
+                this.setOptions(returnVal);
+            }
+        }
+
         // Set the change event on the search box
         this._elSearchBox.addEventListener("input", ev => {
             let value = this._elSearchBox.value;

package/src/components/listBox/types.d.ts

@@ -30,6 +30,7 @@ export interface IListBoxProps {
     items: Array<IDropdownItem>;
     multi?: boolean;
     placeholder?: string;
+    onLoadData?: () => Array<IDropdownItem> | PromiseLike<Array<IDropdownItem>>;
     onChange?: (items: IDropdownItem | Array<IDropdownItem>, ev?: Event) => void;
     value?: string | Array<string>;
 }

package/src/components/nav/index.ts

@@ -91,24 +91,24 @@ class _Nav extends Base<INavProps> implements INav {
                     this.configureEvents(link);
 
                     // Add the tab content
-                    tabs.appendChild(link.elTab);
+                    tabs.appendChild(link.elTabContent);
 
                     // See if the fade option is enabled
                     if (this.props.fadeTabs) {
                         // Set the class name
-                        link.elTab.classList.add("fade");
+                        link.elTabContent.classList.add("fade");
 
                         // See if the tab is active
                         if (link.props.isActive) {
                             // Set the class name
-                            link.elTab.classList.add("show");
+                            link.elTabContent.classList.add("show");
                         }
                     }
                 }
 
                 // Call the render events
-                this.props.onLinkRendered ? this.props.onLinkRendered(link.el, links[i]) : null;
-                this.props.onTabRendered ? this.props.onTabRendered(link.elTab, links[i]) : null;
+                this.props.onLinkRendered ? this.props.onLinkRendered(link.elTab, links[i]) : null;
+                this.props.onTabRendered ? this.props.onTabRendered(link.elTabContent, links[i]) : null;
             }
         }
     }
@@ -143,7 +143,7 @@ class _Nav extends Base<INavProps> implements INav {
                 let link = this._links[i];
 
                 // See if this is the target tab
-                if (tabId === i + 1 || link.elTab.getAttribute("data-title") == tabId) {
+                if (tabId === i + 1 || link.elTabContent.getAttribute("data-title") == tabId) {
                     // Toggle it if it's not active
                     link.isActive ? null : link.toggle(this.props.fadeTabs);
                 }

package/src/components/nav/link.ts

@@ -94,11 +94,18 @@ export class NavLink extends Base<INavLinkProps> implements INavLink {
      */
 
     // The HTML tab element
-    get elTab(): HTMLDivElement { return this._elTab; }
+    get elTab(): HTMLAnchorElement { return this._elLink; }
+
+    // The HTML tab content element
+    get elTabContent(): HTMLDivElement { return this._elTab; }
 
     // Returns true if the link is active
     get isActive(): boolean { return this._elLink.classList.contains("active"); }
 
+    // Gets the tab name
+    get tabName(): string { return this._elLink.innerHTML.trim(); }
+    set tabName(value: string) { this._elLink.innerHTML = (value || "").trim(); }
+
     // Toggles a link
     toggle(fadeTabs?: boolean) {
         // See if this item is currently active

package/src/components/nav/types.d.ts

@@ -96,8 +96,10 @@ export interface INavProps<T = Element> extends IBaseProps<INav> {
  * Navigation Link
  */
 export interface INavLink {
-    elTab: HTMLDivElement;
+    elTab: HTMLAnchorElement;
+    elTabContent: HTMLDivElement;
     isActive: boolean;
+    tabName: string;
     toggle: (fadeTabs?: boolean) => void;
 }
 

package/src/index-icons.d.ts

@@ -1,4 +1,4 @@
-import * as Components from "./components";
+import * as Components from "./components/components";
 import { Icons, IconTypes } from "./icons";
 declare var tippy: Function;
 

package/src/index.d.ts

@@ -1,4 +1,4 @@
-import * as Components from "./components";
+import * as Components from "./components/components";
 declare var tippy: Function;
 
 export {