@xplortech/apollo-core 2.5.0 → 2.6.0

package/dist/collection/components/xpl-progress-bar/xpl-progress-bar.js

@@ -0,0 +1,158 @@
+import { Host, h } from "@stencil/core";
+export class ProgressBar {
+    constructor() {
+        this.max = 100;
+        this.size = 'lg';
+        this.value = 0;
+        this.variant = 'default';
+    }
+    get clampedValue() {
+        return Math.max(0, Math.min(this.max, this.value));
+    }
+    get isComplete() {
+        return this.value >= this.max && this.variant === 'default';
+    }
+    get isError() {
+        return this.variant === 'error';
+    }
+    get isSuccess() {
+        return this.variant === 'success' || this.isComplete;
+    }
+    get showStatusIcon() {
+        return this.isSuccess || this.isError;
+    }
+    get isIndeterminate() {
+        return this.variant === 'indeterminate';
+    }
+    render() {
+        return (h(Host, { key: 'e07eee1ea1614d68190290be2ad16df663337215', class: {
+                'xpl-progress-bar': true,
+                [`xpl-progress-bar--${this.size}`]: true,
+                [`xpl-progress-bar--${this.variant}`]: true,
+                'xpl-progress-bar--complete': this.isComplete,
+            } }, h("div", { key: 'e46025a05d42e0c275444f1057c8ee9827ce4d15', class: "xpl-progress-bar__wrapper" }, (this.label || this.showStatusIcon) && (h("div", { key: 'afc59b2fb32d9ac60afda9a40544121da045b237', class: "xpl-progress-bar__header" }, this.label && h("div", { key: '39d7add736c856c43bdecb61d083cf537e4da454', class: "xpl-progress-bar__label" }, this.label), this.showStatusIcon && (h("div", { key: '4e54b04a314136cdae066f7b48a8449b20a8daff', class: "xpl-progress-bar__icon" }, this.isError ? (h("xpl-icon", { icon: "circle-xmark-1" })) : (h("xpl-icon", { icon: "circle-check-1" })))))), h("div", { key: '6950cefcd5e90be2362201ae830bae73293b275a', class: "xpl-progress-bar__row" }, this.isIndeterminate ? (h("div", { class: "xpl-progress-bar__track xpl-progress-bar__track--indeterminate", role: "progressbar", "aria-label": this.label || 'Progress' }, h("div", { class: "xpl-progress-bar__indeterminate" }))) : (h("progress", { class: "xpl-progress-bar__progress", value: this.clampedValue, max: this.max, "aria-label": this.label || 'Progress' }))), this.helperText && (h("div", { key: 'e56af1b27ff6201a1eaa5cca7160c963a0fca529', class: "xpl-progress-bar__helper" }, this.helperText)))));
+    }
+    static get is() { return "xpl-progress-bar"; }
+    static get properties() {
+        return {
+            "helperText": {
+                "type": "string",
+                "mutable": false,
+                "complexType": {
+                    "original": "string",
+                    "resolved": "string",
+                    "references": {}
+                },
+                "required": false,
+                "optional": true,
+                "docs": {
+                    "tags": [],
+                    "text": "The helper text displayed below the progress bar (recommended for error state)"
+                },
+                "getter": false,
+                "setter": false,
+                "reflect": false,
+                "attribute": "helper-text"
+            },
+            "label": {
+                "type": "string",
+                "mutable": false,
+                "complexType": {
+                    "original": "string",
+                    "resolved": "string",
+                    "references": {}
+                },
+                "required": false,
+                "optional": true,
+                "docs": {
+                    "tags": [],
+                    "text": "The label text displayed above the progress bar"
+                },
+                "getter": false,
+                "setter": false,
+                "reflect": false,
+                "attribute": "label"
+            },
+            "max": {
+                "type": "number",
+                "mutable": false,
+                "complexType": {
+                    "original": "number",
+                    "resolved": "number",
+                    "references": {}
+                },
+                "required": false,
+                "optional": false,
+                "docs": {
+                    "tags": [],
+                    "text": "The maximum value of the progress (mirrors native <progress> max attribute)"
+                },
+                "getter": false,
+                "setter": false,
+                "reflect": false,
+                "attribute": "max",
+                "defaultValue": "100"
+            },
+            "size": {
+                "type": "string",
+                "mutable": false,
+                "complexType": {
+                    "original": "'sm' | 'lg'",
+                    "resolved": "\"lg\" | \"sm\"",
+                    "references": {}
+                },
+                "required": false,
+                "optional": false,
+                "docs": {
+                    "tags": [],
+                    "text": "The size of the progress bar height: sm = 4px, lg = 6px"
+                },
+                "getter": false,
+                "setter": false,
+                "reflect": false,
+                "attribute": "size",
+                "defaultValue": "'lg'"
+            },
+            "value": {
+                "type": "number",
+                "mutable": false,
+                "complexType": {
+                    "original": "number",
+                    "resolved": "number",
+                    "references": {}
+                },
+                "required": false,
+                "optional": false,
+                "docs": {
+                    "tags": [],
+                    "text": "The current value of the progress (mirrors native <progress> value attribute)"
+                },
+                "getter": false,
+                "setter": false,
+                "reflect": false,
+                "attribute": "value",
+                "defaultValue": "0"
+            },
+            "variant": {
+                "type": "string",
+                "mutable": false,
+                "complexType": {
+                    "original": "'default' | 'success' | 'error' | 'indeterminate'",
+                    "resolved": "\"default\" | \"error\" | \"indeterminate\" | \"success\"",
+                    "references": {}
+                },
+                "required": false,
+                "optional": false,
+                "docs": {
+                    "tags": [],
+                    "text": "The visual variant of the progress bar"
+                },
+                "getter": false,
+                "setter": false,
+                "reflect": false,
+                "attribute": "variant",
+                "defaultValue": "'default'"
+            }
+        };
+    }
+}

package/dist/collection/components/xpl-radio/xpl-radio.js

@@ -1,6 +1,6 @@
 import { Host, h } from "@stencil/core";
 import { v4 as uuid } from "uuid";
-export class XplRadio {
+export class Radio {
     constructor() {
         this.id = uuid();
         this.onChange = (event) => {
@@ -14,14 +14,14 @@ export class XplRadio {
         };
     }
     render() {
-        return (h(Host, { key: 'cc375ac47add5a4fddc8744186d1600431cb998d', class: {
+        return (h(Host, { key: 'c5b11522a1b9b21adf40318ff7f74f2ff76aa3c2', class: {
                 'xpl-checkbox-radio-container': true,
                 styled: this.styled,
                 disabled: this.disabled,
-            } }, h("input", { key: 'ccc9a14ec86cf5d455558298f367dd1eb2835399', class: "xpl-radio", type: "radio", checked: this.checked, disabled: this.disabled, id: this.id, name: this.name, required: this.required, onChange: this.onChange, value: this.value }), h("label", { key: '5c0661fded4424d6b758ef55953cfde8da1f2af5', class: {
+            } }, h("input", { key: '950a769704369e2084834876242cb44d1609a166', class: "xpl-radio", type: "radio", checked: this.checked, disabled: this.disabled, id: this.id, name: this.name, required: this.required, onChange: this.onChange, value: this.value }), h("label", { key: '09f34b6e4a60d2c63e94734599b46f2ce1fc9a90', class: {
                 'xpl-label': true,
                 'xpl-label--disabled': this.disabled,
-            }, htmlFor: this.id }, h("slot", { key: '9e203d6010f049c74294f543c75b091c129a323d' }), this.description && (h("small", { key: '15447fa65dff82fda1cb7981bbf3160b7f526c53', class: {
+            }, htmlFor: this.id }, h("slot", { key: '2552eb83722cdf2e4b9d1a691fe2712d16e0fb84' }), this.description && (h("small", { key: '3bc230b6c18922aee661033b1ea5a1bc72384aac', class: {
                 'xpl-description': true,
                 'xpl-description--disabled': this.disabled,
             } }, this.description)))));

package/dist/collection/components/xpl-secondary-nav/xpl-secondary-nav.js

@@ -1,7 +1,7 @@
 import { Host, h } from "@stencil/core";
-export class XplSecondaryNav {
+export class SecondaryNav {
     render() {
-        return (h(Host, { key: '86273edf300aa07f9d95d602eba079a3e5585d63', class: "xpl-secondary-nav" }, h("nav", { key: '1756c028fe605e00683b6fa07e7235a6e18c1f68', "aria-label": "Secondary Nav" }, h("slot", { key: '74d5e209c31456877c40267d16d4020faac7ca33' }))));
+        return (h(Host, { key: '3b015722c6fb8cf3cafb0c85054fab81a8362209', class: "xpl-secondary-nav" }, h("nav", { key: 'ffc4e57cc2ebdf792196477ff01d6b1f03da567f', "aria-label": "Secondary Nav" }, h("slot", { key: 'b15b8bcadf7faa41f155e11dcd9f2e11231efbc4' }))));
     }
     static get is() { return "xpl-secondary-nav"; }
 }

package/dist/collection/components/xpl-select/xpl-select.js

@@ -12,7 +12,7 @@ function getDisplayValue(choice) {
 function flattenChoices(choices) {
     return choices.reduce((acc, curr) => [...acc, ...(curr.groupName ? curr.options : [curr])], []);
 }
-export class XplSelect {
+export class Select {
     constructor() {
         this.choices = [];
         this.selectIcon = 'chevron-down';
@@ -222,21 +222,21 @@ export class XplSelect {
             this.truncate &&
             !this.customDisplayValue;
         const truncatedText = `+ ${Math.abs(this.choicesState.filter((a) => a.isSelected).length - this.visibleChoices)} more`;
-        return (h(Host, { key: '90390e373035b7915dd5ca7c6bcbb5269b3059ea', class: {
+        return (h(Host, { key: '5c6008a31abe121ac946c9c5fc23721d28df86eb', class: {
                 'xpl-select': true,
                 'xpl-select--disabled': this.disabled,
                 'xpl-select--no-truncate': !this.truncate,
                 [(_c = this.classNames) !== null && _c !== void 0 ? _c : '']: !!this.classNames,
             }, onKeyDown: this.handleTabKeyDown, ref: (el) => {
                 this.container = el;
-            } }, this.renderLabel(), h("div", { key: '399f1b864db799c42fa973ae3907e22c2cd95098', class: {
+            } }, this.renderLabel(), h("div", { key: 'f2de31e5b84fe2fdffa1e2b35ec611a4842a8323', class: {
                 'xpl-input': true,
                 'xpl-input--disabled': this.disabled,
                 'xpl-input--error': ((_d = this.error) === null || _d === void 0 ? void 0 : _d.length) >= 0,
-            } }, h("div", { key: '4e9842f8a6ff0916af58dd4a6bc9dbb330d79a29', class: "xpl-input-wrapper" }, h("button", { key: 'a5719a38fdd7b3819cb1d68f887260f3eaf41c5e', class: "xpl-select__trigger", disabled: this.disabled, id: this.id, onKeyDown: this.handleTabKeyDown, onClick: (e) => {
+            } }, h("div", { key: '8a2192b28d75c56261f7a104ad02c76d49fb8787', class: "xpl-input-wrapper" }, h("button", { key: 'bb881153cd7cdbf4e43c40a96dfba8d95ca94aa6', class: "xpl-select__trigger", disabled: this.disabled, id: this.id, onKeyDown: this.handleTabKeyDown, onClick: (e) => {
                 e.preventDefault();
                 this.handleDropdownTrigger();
-            }, type: "button" }, h("div", { key: '7c0d8f94dc5b6afe38b1ab0b4a1cb1572255d640', class: {
+            }, type: "button" }, h("div", { key: '1518f2ef57c7eeaa0fedc1832222a0345c4c46ab', class: {
                 'xpl-select-value': true,
                 'xpl-select-value--active': this.mode === 'multi' && this.value.length > 0,
                 'has-value': this.value.length > 0,
@@ -256,7 +256,7 @@ export class XplSelect {
                 return this.renderSelectedTags();
             }
             return this.placeholder;
-        })(), isTextTruncated && truncatedText), h("xpl-icon", { key: '8002d17b99c8b53d47ed3a3139c4a18bcce7baba', class: "xpl-select__chevron-down", icon: this.selectIcon }))), !this.disabled && (h("xpl-dropdown", { key: '87bbe302cbf364c6e3592699e93eb03523e16833', ref: (el) => {
+        })(), isTextTruncated && truncatedText), h("xpl-icon", { key: 'f37a879df93e5078a4b1a4950291a3bf65d81f43', class: "xpl-select__chevron-down", icon: this.selectIcon }))), !this.disabled && (h("xpl-dropdown", { key: '920d7d4e1916613b0056e6da80e055e7cf94fba6', ref: (el) => {
                 this.dropdown = el;
             }, isOpen: this.dropdownOpenState, options: this.choicesState, selectedValues: this.selectedValues, mode: this.mode, triggerId: this.id, update: (_e, { component }) => {
                 const { options } = component;
@@ -265,7 +265,7 @@ export class XplSelect {
                 }
             }, onIsOpenChange: (e) => {
                 this.dropdownOpenState = e.detail;
-            }, onWheel: this.handleDropdownScroll, anchorToTrigger: true })), this.renderError()), h("input", { key: '3ef234a4953e9133c3817ba14d0336c0cb8de8f9', type: "hidden", name: this.name, value: this.value })));
+            }, onWheel: this.handleDropdownScroll, anchorToTrigger: true })), this.renderError()), h("input", { key: '0137e17e78152e2ebc600156896df9a4c691f18a', type: "hidden", name: this.name, value: this.value })));
     }
     static get is() { return "xpl-select"; }
     static get properties() {