@xplortech/apollo-core 1.0.0-beta.6 → 1.0.0-beta.8

package/dist/cjs/loader.cjs.js

@@ -2,10 +2,10 @@
 
 Object.defineProperty(exports, '__esModule', { value: true });
 
-const index = require('./index-acf3dd7a.js');
+const index = require('./index-2ab4832e.js');
 
 /*
- Stencil Client Patch Esm v2.8.0 | MIT Licensed | https://stenciljs.com
+ Stencil Client Patch Esm v2.22.2 | MIT Licensed | https://stenciljs.com
  */
 const patchEsm = () => {
     return index.promiseResolve();
@@ -18,4 +18,5 @@ const defineCustomElements = (win, options) => {
   });
 };
 
+exports.setNonce = index.setNonce;
 exports.defineCustomElements = defineCustomElements;

package/dist/cjs/xpl-application-shell.cjs.entry.js

@@ -2,26 +2,15 @@
 
 Object.defineProperty(exports, '__esModule', { value: true });
 
-const index = require('./index-acf3dd7a.js');
+const index = require('./index-2ab4832e.js');
 
 const XplApplicationShell = class {
   constructor(hostRef) {
     index.registerInstance(this, hostRef);
-    /**
-     * @property {boolean} - Whether or not the Grid should have space for a secondary (sub) navigation bar
-     */
     this.withSubnav = false;
-    /**
-     * @property {boolean} - Whether or not the Grid should have space for a utility bar
-     */
     this.withUtility = true;
-    /**
-     * @property {string} - The width of the main navigation bar, can be passed or updated when nav-width event is emitted.
-     */
     this.navWidth = 'default';
-    /**
-     * @state {boolean} - Whether or not the main nav is open, updates when the nav-open event is emitted.
-     */
+    this.isNavOpenAtStartup = undefined;
     this.navOpen = true;
   }
   closeNavOnMobile() {

package/dist/cjs/xpl-avatar_12.cjs.entry.js

@@ -2,13 +2,20 @@
 
 Object.defineProperty(exports, '__esModule', { value: true });
 
-const index = require('./index-acf3dd7a.js');
+const index = require('./index-2ab4832e.js');
 const v4 = require('./v4-14140ff3.js');
 
 const XplAvatar = class {
   constructor(hostRef) {
     index.registerInstance(this, hostRef);
+    this.color = undefined;
     this.disabled = false;
+    this.href = undefined;
+    this.name = undefined;
+    this.size = undefined;
+    this.src = undefined;
+    this.status = undefined;
+    this.target = undefined;
   }
   render() {
     let className = 'xpl-avatar';
@@ -24,6 +31,8 @@ const XplAvatar = class {
 const XplBadge = class {
   constructor(hostRef) {
     index.registerInstance(this, hostRef);
+    this.dot = undefined;
+    this.variant = undefined;
   }
   render() {
     let className = 'xpl-badge';
@@ -61,17 +70,15 @@ const XplBreadcrumbs = class {
 const XplButton = class {
   constructor(hostRef) {
     index.registerInstance(this, hostRef);
-    /**
-     * @property {"default" | "sm" | "xs"} - button size
-     */
+    this.disabled = undefined;
+    this.link = undefined;
+    this.iconOnly = undefined;
+    this.fullWidth = undefined;
+    this.name = undefined;
     this.size = 'default';
-    /**
-     * @property {"primary" | "secondary" | "subtle"} - button variant
-     */
+    this.type = undefined;
+    this.value = undefined;
     this.variant = 'primary';
-    /**
-     * @property {"neutral" | "warning" | "success"} - button state (color) neutral=purple, success=green, warning=red
-     */
     this.state = 'neutral';
   }
   componentDidRender() {
@@ -119,6 +126,14 @@ const XplCheckbox = class {
   constructor(hostRef) {
     index.registerInstance(this, hostRef);
     this.checkboxChange = index.createEvent(this, "checkboxChange", 7);
+    this.checked = undefined;
+    this.description = undefined;
+    this.disabled = undefined;
+    this.indeterminate = undefined;
+    this.name = undefined;
+    this.required = undefined;
+    this.styled = undefined;
+    this.value = undefined;
     this.id = v4.v4();
   }
   render() {
@@ -139,9 +154,6 @@ const XplCheckbox = class {
 const XplContentArea = class {
   constructor(hostRef) {
     index.registerInstance(this, hostRef);
-    /**
-     * @property {string}  size  - The content-area size.
-     */
     this.size = 'wide';
   }
   render() {
@@ -153,9 +165,6 @@ const XplNavItem = class {
   constructor(hostRef) {
     index.registerInstance(this, hostRef);
     this.navOpen = index.createEvent(this, "navOpen", 7);
-    /**
-     * @property {boolean} - Whether or not the item should control the main nav state on click
-     */
     this.navControl = false;
   }
   onNavToggle() {
@@ -176,6 +185,13 @@ const XplRadio = class {
   constructor(hostRef) {
     index.registerInstance(this, hostRef);
     this.radioChange = index.createEvent(this, "radioChange", 7);
+    this.checked = undefined;
+    this.description = undefined;
+    this.disabled = undefined;
+    this.name = undefined;
+    this.required = undefined;
+    this.styled = undefined;
+    this.value = undefined;
     this.id = v4.v4();
   }
   render() {
@@ -206,8 +222,6 @@ const XplTable = class {
   constructor(hostRef) {
     index.registerInstance(this, hostRef);
     this.tableSelect = index.createEvent(this, "tableSelect", 7);
-    this.areAllSelected = false;
-    this.hasScrolled = false;
     this.selectAll = (e) => {
       const { target } = e;
       if (!(target instanceof HTMLInputElement))
@@ -235,28 +249,43 @@ const XplTable = class {
     this.onScroll = () => {
       this.hasScrolled = this.container.scrollLeft > 0;
     };
+    /**
+     * TODO: Need to figure out how this interplays with data
+     * received from an API/server
+     */
+    // private sortBy = (col: number, ascending = true) => {
+    //     this.rowData.sort((a, b) => {
+    //         const A = a[col];
+    //         const B = b[col];
+    //         if (typeof A === 'number' && typeof B === 'number') {
+    //             const f = ascending ? 1 : -1;
+    //             return A > B ? f : -f;
+    //         }
+    //         return -1;
+    //     });
+    //     this.rowData = Array.from(this.rowData);
+    //     this.render();
+    // };
+    this.setData = () => {
+      this.rowData = this.data !== undefined ? Array.from(this.data) : [];
+      this.selected = new Array(this.rowData.length).fill(false);
+    };
+    this.columns = undefined;
+    this.data = undefined;
+    this.freeze = undefined;
+    this.multiselect = undefined;
+    this.striped = undefined;
+    this.areAllSelected = false;
+    this.rowData = undefined;
+    this.hasScrolled = false;
+    this.selected = undefined;
+  }
+  watchData() {
+    this.setData();
   }
-  /**
-   * TODO: Need to figure out how this interplays with data
-   * received from an API/server
-   */
-  // private sortBy = (col: number, ascending = true) => {
-  //     this.rowData.sort((a, b) => {
-  //         const A = a[col];
-  //         const B = b[col];
-  //         if (typeof A === 'number' && typeof B === 'number') {
-  //             const f = ascending ? 1 : -1;
-  //             return A > B ? f : -f;
-  //         }
-  //         return -1;
-  //     });
-  //     this.rowData = Array.from(this.rowData);
-  //     this.render();
-  // };
   componentWillLoad() {
     this.areAllSelected = false;
-    this.rowData = this.data !== undefined ? Array.from(this.data) : [];
-    this.selected = new Array(this.rowData.length).fill(false);
+    this.setData();
   }
   render() {
     let className = 'xpl-table';
@@ -288,16 +317,21 @@ const XplTable = class {
       })));
     }))))));
   }
+  static get watchers() { return {
+    "data": ["watchData"]
+  }; }
 };
 
 const XplUtilityBar = class {
   constructor(hostRef) {
     index.registerInstance(this, hostRef);
     this.navOpen = index.createEvent(this, "navOpen", 7);
-    this.open = true;
     this.bars = `
         <svg aria-hidden="true" focusable="false" data-prefix="fas" data-icon="bars" class="svg-inline--fa fa-bars fa-w-14 xpl-utility-nav__bars" role="img" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 448 512"><path fill="currentColor" d="M16 132h416c8.837 0 16-7.163 16-16V76c0-8.837-7.163-16-16-16H16C7.163 60 0 67.163 0 76v40c0 8.837 7.163 16 16 16zm0 160h416c8.837 0 16-7.163 16-16v-40c0-8.837-7.163-16-16-16H16c-8.837 0-16 7.163-16 16v40c0 8.837 7.163 16 16 16zm0 160h416c8.837 0 16-7.163 16-16v-40c0-8.837-7.163-16-16-16H16c-8.837 0-16 7.163-16 16v40c0 8.837 7.163 16 16 16z"></path></svg>
     `;
+    this.navControl = undefined;
+    this.isNavOpenAtStartup = undefined;
+    this.open = true;
   }
   onNavToggle() {
     this.open = !this.open;

package/dist/cjs/xpl-backdrop.cjs.entry.js

@@ -2,15 +2,11 @@
 
 Object.defineProperty(exports, '__esModule', { value: true });
 
-const index = require('./index-acf3dd7a.js');
+const index = require('./index-2ab4832e.js');
 
 const XplBackdrop = class {
   constructor(hostRef) {
     index.registerInstance(this, hostRef);
-    /**
-     * @property {boolean} - When true, backdrop will have relative position. This is useful when the backdrop doesn't cover the whole view area.
-     * If false, the position will be fixed and cover the whole view area.
-     */
     this.relative = false;
   }
   render() {

package/dist/cjs/xpl-button-row.cjs.entry.js

@@ -2,7 +2,7 @@
 
 Object.defineProperty(exports, '__esModule', { value: true });
 
-const index = require('./index-acf3dd7a.js');
+const index = require('./index-2ab4832e.js');
 
 const XplButtonRow = class {
   constructor(hostRef) {
@@ -13,6 +13,9 @@ const XplButtonRow = class {
     this.onPrimary = () => this.clickPrimary.emit();
     this.onSecondary = () => this.clickSecondary.emit();
     this.onTertiary = () => this.clickTertiary.emit();
+    this.primary = undefined;
+    this.secondary = undefined;
+    this.tertiary = undefined;
   }
   render() {
     return (index.h(index.Host, { class: "xpl-button-row" }, index.h("div", { class: "xpl-button-row-inner" }, index.h("div", { class: "xpl-button-row__left" }, this.secondary && (index.h("xpl-button", { variant: "secondary", type: "button", onClick: this.onSecondary }, this.secondary))), index.h("div", { class: "xpl-button-row__right" }, this.tertiary && (index.h("xpl-button", { variant: "subtle", type: "button", onClick: this.onTertiary }, this.tertiary)), this.secondary && (index.h("xpl-button", { variant: "secondary", type: "button", onClick: this.onSecondary }, this.secondary)), this.primary && (index.h("xpl-button", { class: "xpl-button-row__primary", onClick: this.onPrimary }, this.primary))))));

package/dist/cjs/xpl-choicelist.cjs.entry.js

@@ -2,11 +2,18 @@
 
 Object.defineProperty(exports, '__esModule', { value: true });
 
-const index = require('./index-acf3dd7a.js');
+const index = require('./index-2ab4832e.js');
 
 const XplChoicelist = class {
   constructor(hostRef) {
     index.registerInstance(this, hostRef);
+    this.choices = undefined;
+    this.description = undefined;
+    this.heading = undefined;
+    this.multi = undefined;
+    this.name = undefined;
+    this.styled = undefined;
+    this.selected = undefined;
   }
   componentWillLoad() {
     this.selected =

package/dist/cjs/xpl-divider.cjs.entry.js

@@ -2,11 +2,12 @@
 
 Object.defineProperty(exports, '__esModule', { value: true });
 
-const index = require('./index-acf3dd7a.js');
+const index = require('./index-2ab4832e.js');
 
 const XplDivider = class {
   constructor(hostRef) {
     index.registerInstance(this, hostRef);
+    this.tier = undefined;
   }
   render() {
     let className = 'xpl-divider';

package/dist/cjs/xpl-dropdown-group_3.cjs.entry.js

@@ -2,7 +2,7 @@
 
 Object.defineProperty(exports, '__esModule', { value: true });
 
-const index = require('./index-acf3dd7a.js');
+const index = require('./index-2ab4832e.js');
 
 var __rest = (undefined && undefined.__rest) || function (s, e) {
   var t = {};
@@ -19,6 +19,8 @@ var __rest = (undefined && undefined.__rest) || function (s, e) {
 const XplDropdownGroup = class {
   constructor(hostRef) {
     index.registerInstance(this, hostRef);
+    this.groupName = undefined;
+    this.options = undefined;
   }
   render() {
     const { groupName, options } = this;
@@ -35,6 +37,7 @@ const XplDropdownGroup = class {
 const XplDropdownHeading = class {
   constructor(hostRef) {
     index.registerInstance(this, hostRef);
+    this.label = undefined;
   }
   render() {
     return (index.h(index.Host, { class: { 'xpl-dropdown-heading': true }, role: "presentation" }, index.h("span", null, this.label || index.h("slot", { name: "heading" }))));
@@ -44,6 +47,9 @@ const XplDropdownHeading = class {
 const XplDropdownOption = class {
   constructor(hostRef) {
     index.registerInstance(this, hostRef);
+    this.isDisabled = undefined;
+    this.label = undefined;
+    this.isSelected = undefined;
   }
   componentWillLoad() {
     this.dropdown = this.hostElement.closest('xpl-dropdown');

package/dist/cjs/xpl-dropdown_2.cjs.entry.js

@@ -2,7 +2,7 @@
 
 Object.defineProperty(exports, '__esModule', { value: true });
 
-const index = require('./index-acf3dd7a.js');
+const index = require('./index-2ab4832e.js');
 
 var __rest = (undefined && undefined.__rest) || function (s, e) {
   var t = {};
@@ -19,14 +19,6 @@ var __rest = (undefined && undefined.__rest) || function (s, e) {
 const XplDropdown = class {
   constructor(hostRef) {
     index.registerInstance(this, hostRef);
-    /** text to display as heading */
-    this.isOpen = false;
-    /** options that are listed */
-    this.closeOnSelect = true;
-    /** constant representing number of options that can be selected */
-    this.mode = 'single';
-    /** whether selection should be made when focusing on interactable element */
-    this.selectOnFocus = false;
     this.handleClickOutside = ({ target }) => {
       const { triggerId } = this;
       const isTrigger = triggerId && target.id === triggerId;
@@ -34,6 +26,13 @@ const XplDropdown = class {
       if (!isInside && !isTrigger)
         this.isOpen = false;
     };
+    this.isOpen = false;
+    this.closeOnSelect = true;
+    this.mode = 'single';
+    this.options = undefined;
+    this.selectOnFocus = false;
+    this.triggerId = undefined;
+    this.update = undefined;
   }
   /**
    * called on dropdown option click and keydown events to update isSelected states

package/dist/cjs/xpl-grid-item.cjs.entry.js

@@ -2,7 +2,7 @@
 
 Object.defineProperty(exports, '__esModule', { value: true });
 
-const index = require('./index-acf3dd7a.js');
+const index = require('./index-2ab4832e.js');
 
 const XplGridItem = class {
   constructor(hostRef) {

package/dist/cjs/xpl-grid.cjs.entry.js

@@ -2,7 +2,7 @@
 
 Object.defineProperty(exports, '__esModule', { value: true });
 
-const index = require('./index-acf3dd7a.js');
+const index = require('./index-2ab4832e.js');
 
 const XplGrid = class {
   constructor(hostRef) {