@xplortech/apollo-core 0.0.6 → 0.1.0

package/dist/custom-elements/index.d.ts

@@ -2,24 +2,60 @@
 
 import type { Components, JSX } from "../types/components";
 
+interface XplAvatar extends Components.XplAvatar, HTMLElement {}
+export const XplAvatar: {
+  prototype: XplAvatar;
+  new (): XplAvatar;
+};
+
+interface XplBadge extends Components.XplBadge, HTMLElement {}
+export const XplBadge: {
+  prototype: XplBadge;
+  new (): XplBadge;
+};
+
 interface XplButton extends Components.XplButton, HTMLElement {}
 export const XplButton: {
   prototype: XplButton;
   new (): XplButton;
 };
 
+interface XplCheckbox extends Components.XplCheckbox, HTMLElement {}
+export const XplCheckbox: {
+  prototype: XplCheckbox;
+  new (): XplCheckbox;
+};
+
+interface XplChoicelist extends Components.XplChoicelist, HTMLElement {}
+export const XplChoicelist: {
+  prototype: XplChoicelist;
+  new (): XplChoicelist;
+};
+
 interface XplPagination extends Components.XplPagination, HTMLElement {}
 export const XplPagination: {
   prototype: XplPagination;
   new (): XplPagination;
 };
 
+interface XplRadio extends Components.XplRadio, HTMLElement {}
+export const XplRadio: {
+  prototype: XplRadio;
+  new (): XplRadio;
+};
+
 interface XplTable extends Components.XplTable, HTMLElement {}
 export const XplTable: {
   prototype: XplTable;
   new (): XplTable;
 };
 
+interface XplUtilityBar extends Components.XplUtilityBar, HTMLElement {}
+export const XplUtilityBar: {
+  prototype: XplUtilityBar;
+  new (): XplUtilityBar;
+};
+
 /**
  * Utility to define all custom elements within this package using the tag name provided in the component's source. 
  * When defining each custom element, it will also check it's safe to define by:

package/dist/custom-elements/index.js

@@ -1,6 +1,38 @@
-import { h, Host, createEvent, proxyCustomElement } from '@stencil/core/internal/client';
+import { h, Host, attachShadow, createEvent, proxyCustomElement } from '@stencil/core/internal/client';
 export { setAssetPath, setPlatformOptions } from '@stencil/core/internal/client';
 
+const XplAvatar$1 = class extends HTMLElement {
+  constructor() {
+    super();
+    this.__registerHost();
+    this.disabled = false;
+  }
+  render() {
+    let className = "xpl-avatar";
+    if (this.size)
+      className += ` xpl-avatar--${this.size}`;
+    if (this.color)
+      className += ` xpl-avatar--${this.color}`;
+    const inner = (h("div", null, this.src ? (h("img", { alt: this.name, src: this.src })) : (h("div", { class: "xpl-avatar__placeholder" }, h("slot", null))), this.status && h("div", { class: `xpl-avatar__dot--${this.status}` })));
+    return (h(Host, null, this.href && !this.disabled ? (h("a", { href: this.href, class: className, target: this.target }, inner)) : this.href && this.disabled ? (h("div", { class: className + " xpl-avatar--disabled" }, inner)) : (h("div", { class: className }, inner))));
+  }
+};
+
+const XplBadge$1 = class extends HTMLElement {
+  constructor() {
+    super();
+    this.__registerHost();
+  }
+  render() {
+    let className = "xpl-badge";
+    if (this.dot)
+      className += " xpl-badge--dot";
+    if (this.variant)
+      className += " xpl-badge--" + this.variant;
+    return (h(Host, null, h("div", { class: className }, h("slot", null))));
+  }
+};
+
 /*!
  * Font Awesome Pro 5.15.3 by @fontawesome - https://fontawesome.com
  * License - https://fontawesome.com/license (Commercial License)
@@ -16047,7 +16079,6 @@ const XplButton$1 = class extends HTMLElement {
   constructor() {
     super();
     this.__registerHost();
-    this.disabled = undefined;
     this.size = "default";
     this.variant = "primary";
   }
@@ -16057,8 +16088,8 @@ const XplButton$1 = class extends HTMLElement {
       className += " xpl-button--secondary";
     if (this.variant === "subtle")
       className += " xpl-button--subtle";
-    if (this.variant === "error")
-      className += " xpl-button--error";
+    if (this.variant === "warning")
+      className += " xpl-button--warning";
     if (this.size === "sm")
       className += " xpl-button--sm";
     if (this.size === "xs")
@@ -16071,7 +16102,103 @@ const XplButton$1 = class extends HTMLElement {
      * Conditionally render either an <a> or <button> element
      * depending on if there's an `href` or not
      */
-    this.href ? (h("a", { class: className, href: this.href, role: "button" }, !this.iconTrailing && icon, this.iconOnly ? h("span", { class: "sr-only" }, h("slot", null)) : h("slot", null), this.iconTrailing && icon)) : (h("button", { class: className, disabled: this.disabled, type: this.type }, !this.iconTrailing && icon, this.iconOnly ? h("span", { class: "sr-only" }, h("slot", null)) : h("slot", null), this.iconTrailing && icon))));
+    this.href ? (h("a", { class: className, href: this.href, role: "button" }, !this.iconTrailing && icon, this.iconOnly ? (h("span", { class: "sr-only" }, h("slot", null))) : (h("slot", null)), this.iconTrailing && icon)) : (h("button", { class: className, disabled: this.disabled, name: this.name, type: this.type, value: this.value }, !this.iconTrailing && icon, this.iconOnly ? (h("span", { class: "sr-only" }, h("slot", null))) : (h("slot", null)), this.iconTrailing && icon))));
+  }
+};
+
+// Unique ID creation requires a high quality random # generator. In the browser we therefore
+// require the crypto API and do not support built-in fallback to lower quality random number
+// generators (like Math.random()).
+var getRandomValues;
+var rnds8 = new Uint8Array(16);
+function rng() {
+  // lazy load so that environments that need to polyfill have a chance to do so
+  if (!getRandomValues) {
+    // getRandomValues needs to be invoked in a context where "this" is a Crypto implementation. Also,
+    // find the complete implementation of crypto (msCrypto) on IE11.
+    getRandomValues = typeof crypto !== 'undefined' && crypto.getRandomValues && crypto.getRandomValues.bind(crypto) || typeof msCrypto !== 'undefined' && typeof msCrypto.getRandomValues === 'function' && msCrypto.getRandomValues.bind(msCrypto);
+
+    if (!getRandomValues) {
+      throw new Error('crypto.getRandomValues() not supported. See https://github.com/uuidjs/uuid#getrandomvalues-not-supported');
+    }
+  }
+
+  return getRandomValues(rnds8);
+}
+
+const REGEX = /^(?:[0-9a-f]{8}-[0-9a-f]{4}-[1-5][0-9a-f]{3}-[89ab][0-9a-f]{3}-[0-9a-f]{12}|00000000-0000-0000-0000-000000000000)$/i;
+
+function validate(uuid) {
+  return typeof uuid === 'string' && REGEX.test(uuid);
+}
+
+/**
+ * Convert array of 16 byte values to UUID string format of the form:
+ * XXXXXXXX-XXXX-XXXX-XXXX-XXXXXXXXXXXX
+ */
+
+var byteToHex = [];
+
+for (var i = 0; i < 256; ++i) {
+  byteToHex.push((i + 0x100).toString(16).substr(1));
+}
+
+function stringify(arr) {
+  var offset = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : 0;
+  // Note: Be careful editing this code!  It's been tuned for performance
+  // and works in ways you may not expect. See https://github.com/uuidjs/uuid/pull/434
+  var uuid = (byteToHex[arr[offset + 0]] + byteToHex[arr[offset + 1]] + byteToHex[arr[offset + 2]] + byteToHex[arr[offset + 3]] + '-' + byteToHex[arr[offset + 4]] + byteToHex[arr[offset + 5]] + '-' + byteToHex[arr[offset + 6]] + byteToHex[arr[offset + 7]] + '-' + byteToHex[arr[offset + 8]] + byteToHex[arr[offset + 9]] + '-' + byteToHex[arr[offset + 10]] + byteToHex[arr[offset + 11]] + byteToHex[arr[offset + 12]] + byteToHex[arr[offset + 13]] + byteToHex[arr[offset + 14]] + byteToHex[arr[offset + 15]]).toLowerCase(); // Consistency check for valid UUID.  If this throws, it's likely due to one
+  // of the following:
+  // - One or more input array values don't map to a hex octet (leading to
+  // "undefined" in the uuid)
+  // - Invalid input values for the RFC `version` or `variant` fields
+
+  if (!validate(uuid)) {
+    throw TypeError('Stringified UUID is invalid');
+  }
+
+  return uuid;
+}
+
+function v4(options, buf, offset) {
+  options = options || {};
+  var rnds = options.random || (options.rng || rng)(); // Per 4.4, set bits for version and `clock_seq_hi_and_reserved`
+
+  rnds[6] = rnds[6] & 0x0f | 0x40;
+  rnds[8] = rnds[8] & 0x3f | 0x80; // Copy bytes to buffer, if provided
+
+  if (buf) {
+    offset = offset || 0;
+
+    for (var i = 0; i < 16; ++i) {
+      buf[offset + i] = rnds[i];
+    }
+
+    return buf;
+  }
+
+  return stringify(rnds);
+}
+
+const XplCheckbox$1 = class extends HTMLElement {
+  constructor() {
+    super();
+    this.__registerHost();
+    this.id = v4();
+  }
+  render() {
+    return (h(Host, { class: "xpl-checkbox-container" }, h("input", { class: "xpl-checkbox", type: "checkbox", checked: this.checked, disabled: this.disabled, id: this.id, indeterminate: this.indeterminate, name: this.name, required: this.required, value: this.value }), h("label", { htmlFor: this.id }, h("slot", null), this.description && h("small", null, this.description))));
+  }
+};
+
+const XplChoicelist$1 = class extends HTMLElement {
+  constructor() {
+    super();
+    this.__registerHost();
+    attachShadow(this);
+  }
+  render() {
+    return (h(Host, null, h("slot", null)));
   }
 };
 
@@ -16145,6 +16272,17 @@ const XplPagination$1 = class extends HTMLElement {
   }
 };
 
+const XplRadio$1 = class extends HTMLElement {
+  constructor() {
+    super();
+    this.__registerHost();
+    this.id = v4();
+  }
+  render() {
+    return (h(Host, { class: "xpl-radio-container" }, h("input", { class: "xpl-radio", type: "radio", checked: this.checked, disabled: this.disabled, id: this.id, name: this.name, required: this.required, value: this.value }), h("label", { htmlFor: this.id }, h("slot", null), this.description && h("small", null, this.description))));
+  }
+};
+
 const XplTable$1 = class extends HTMLElement {
   constructor() {
     super();
@@ -16211,28 +16349,54 @@ const XplTable$1 = class extends HTMLElement {
     if (this.hasScrolled)
       className += " xpl-table--has-scrolled";
     return (h(Host, null, h("div", { class: "xpl-table-container", onScroll: this.onScroll, ref: (el) => (this.container = el) }, h("table", { class: className }, this.columns && (h("thead", null, this.columns.map((column, i) => {
-      return (h("th", null, this.multiselect && i === 0 ? (h("label", { htmlFor: "__xpl-table-th" }, h("input", { id: "__xpl-table-th", type: "checkbox", onChange: (e) => {
+      return (h("th", null, this.multiselect && i === 0 ? (h("label", { htmlFor: "__xpl-table-th" }, h("input", { checked: this.areAllSelected, id: "__xpl-table-th",
+        // appear indeterminate when at least one but not all
+        // are selected
+        indeterminate: !this.areAllSelected &&
+          this.selected.some((a) => a), onChange: (e) => {
           this.selectAll(e);
-        }, checked: this.areAllSelected }), column)) : (column)));
+        }, type: "checkbox" }), column)) : (column)));
     }))), h("tbody", null, this.rowData.map((row, rowNum) => {
       return (h("tr", { class: this.selected && this.selected[rowNum]
           ? "xpl-table-row-selected"
           : "" }, row.map((cell, i) => {
-        return (h("td", null, this.multiselect && i === 0 ? (h("label", { htmlFor: "__xpl-table-row-" + rowNum }, h("input", { id: "__xpl-table-row-" + rowNum, checked: this.selected[rowNum], type: "checkbox", onChange: (e) => this.selectOne(e, rowNum) }), cell)) : (cell)));
+        return (h("td", null, this.multiselect && i === 0 ? (h("label", { htmlFor: "__xpl-table-row-" + rowNum }, h("input", { id: "__xpl-table-row-" + rowNum, checked: this.selected[rowNum], type: "checkbox", onChange: (e) => this.selectOne(e, rowNum) }), h("div", { innerHTML: cell }))) : (h("div", { innerHTML: cell }))));
       })));
     }))))));
   }
 };
 
-const XplButton = /*@__PURE__*/proxyCustomElement(XplButton$1, [4,"xpl-button",{"disabled":[4],"href":[1],"icon":[1],"iconOnly":[4,"icon-only"],"iconTrailing":[4,"icon-trailing"],"size":[1],"type":[1],"variant":[1]}]);
+const XplUtilityBar$1 = class extends HTMLElement {
+  constructor() {
+    super();
+    this.__registerHost();
+  }
+  render() {
+    return (h(Host, null, h("nav", { "aria-label": "utility navigation bar", class: "xpl-utility-bar" }, h("slot", { name: "main" }), h("slot", { name: "aside" }))));
+  }
+};
+
+const XplAvatar = /*@__PURE__*/proxyCustomElement(XplAvatar$1, [4,"xpl-avatar",{"color":[1],"disabled":[4],"href":[1],"name":[1],"size":[1],"src":[1],"status":[1],"target":[1]}]);
+const XplBadge = /*@__PURE__*/proxyCustomElement(XplBadge$1, [4,"xpl-badge",{"dot":[4],"variant":[1]}]);
+const XplButton = /*@__PURE__*/proxyCustomElement(XplButton$1, [4,"xpl-button",{"disabled":[4],"href":[1],"icon":[1],"iconOnly":[4,"icon-only"],"iconTrailing":[4,"icon-trailing"],"name":[1],"size":[1],"type":[1],"value":[1],"variant":[1]}]);
+const XplCheckbox = /*@__PURE__*/proxyCustomElement(XplCheckbox$1, [4,"xpl-checkbox",{"checked":[4],"description":[1],"disabled":[4],"indeterminate":[4],"name":[1],"required":[4],"value":[1],"id":[32]}]);
+const XplChoicelist = /*@__PURE__*/proxyCustomElement(XplChoicelist$1, [1,"xpl-choicelist"]);
 const XplPagination = /*@__PURE__*/proxyCustomElement(XplPagination$1, [0,"xpl-pagination",{"total":[2],"perPage":[2,"per-page"],"waitForCallback":[4,"wait-for-callback"],"current":[32]}]);
+const XplRadio = /*@__PURE__*/proxyCustomElement(XplRadio$1, [4,"xpl-radio",{"checked":[4],"description":[1],"disabled":[4],"name":[1],"required":[4],"value":[1],"id":[32]}]);
 const XplTable = /*@__PURE__*/proxyCustomElement(XplTable$1, [0,"xpl-table",{"columns":[16],"data":[16],"freeze":[4],"multiselect":[4],"striped":[4],"areAllSelected":[32],"rowData":[32],"hasScrolled":[32],"selected":[32]}]);
+const XplUtilityBar = /*@__PURE__*/proxyCustomElement(XplUtilityBar$1, [4,"xpl-utility-bar"]);
 const defineCustomElements = (opts) => {
   if (typeof customElements !== 'undefined') {
     [
-      XplButton,
+      XplAvatar,
+  XplBadge,
+  XplButton,
+  XplCheckbox,
+  XplChoicelist,
   XplPagination,
-  XplTable
+  XplRadio,
+  XplTable,
+  XplUtilityBar
     ].forEach(cmp => {
       if (!customElements.get(cmp.is)) {
         customElements.define(cmp.is, cmp, opts);
@@ -16241,4 +16405,4 @@ const defineCustomElements = (opts) => {
   }
 };
 
-export { XplButton, XplPagination, XplTable, defineCustomElements };
+export { XplAvatar, XplBadge, XplButton, XplCheckbox, XplChoicelist, XplPagination, XplRadio, XplTable, XplUtilityBar, defineCustomElements };

package/dist/esm/apollo-core.js

@@ -1,7 +1,7 @@
-import { p as promiseResolve, b as bootstrapLazy } from './index-252a5f91.js';
+import { p as promiseResolve, b as bootstrapLazy } from './index-4c8962a5.js';
 
 /*
- Stencil Client Patch Browser v2.6.0 | MIT Licensed | https://stenciljs.com
+ Stencil Client Patch Browser v2.8.0 | MIT Licensed | https://stenciljs.com
  */
 const patchBrowser = () => {
     const importMeta = import.meta.url;
@@ -13,5 +13,5 @@ const patchBrowser = () => {
 };
 
 patchBrowser().then(options => {
-  return bootstrapLazy([["xpl-button_2",[[4,"xpl-button",{"disabled":[4],"href":[1],"icon":[1],"iconOnly":[4,"icon-only"],"iconTrailing":[4,"icon-trailing"],"size":[1],"type":[1],"variant":[1]}],[0,"xpl-table",{"columns":[16],"data":[16],"freeze":[4],"multiselect":[4],"striped":[4],"areAllSelected":[32],"rowData":[32],"hasScrolled":[32],"selected":[32]}]]],["xpl-pagination",[[0,"xpl-pagination",{"total":[2],"perPage":[2,"per-page"],"waitForCallback":[4,"wait-for-callback"],"current":[32],"goto":[64]}]]]], options);
+  return bootstrapLazy([["xpl-avatar_7",[[4,"xpl-avatar",{"color":[1],"disabled":[4],"href":[1],"name":[1],"size":[1],"src":[1],"status":[1],"target":[1]}],[4,"xpl-badge",{"dot":[4],"variant":[1]}],[4,"xpl-button",{"disabled":[4],"href":[1],"icon":[1],"iconOnly":[4,"icon-only"],"iconTrailing":[4,"icon-trailing"],"name":[1],"size":[1],"type":[1],"value":[1],"variant":[1]}],[4,"xpl-checkbox",{"checked":[4],"description":[1],"disabled":[4],"indeterminate":[4],"name":[1],"required":[4],"value":[1],"id":[32]}],[4,"xpl-radio",{"checked":[4],"description":[1],"disabled":[4],"name":[1],"required":[4],"value":[1],"id":[32]}],[0,"xpl-table",{"columns":[16],"data":[16],"freeze":[4],"multiselect":[4],"striped":[4],"areAllSelected":[32],"rowData":[32],"hasScrolled":[32],"selected":[32]}],[4,"xpl-utility-bar"]]],["xpl-choicelist",[[1,"xpl-choicelist"]]],["xpl-pagination",[[0,"xpl-pagination",{"total":[2],"perPage":[2,"per-page"],"waitForCallback":[4,"wait-for-callback"],"current":[32],"goto":[64]}]]]], options);
 });