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

package/dist/apollo-core/xpl-breadcrumbs.entry.js

@@ -0,0 +1,14 @@
+import { r as registerInstance, h, e as Host } from './index-307c7018.js';
+
+const XplBreadcrumbs = class {
+  constructor(hostRef) {
+    registerInstance(this, hostRef);
+  }
+  render() {
+    return (h(Host, null, h("nav", { class: "xpl-breadcrumbs", "aria-label": "Breadcrumb" }, h("ol", { role: "list" }, h("slot", null)))));
+  }
+};
+
+export { XplBreadcrumbs as xpl_breadcrumbs };
+
+//# sourceMappingURL=xpl-breadcrumbs.entry.js.map

package/dist/apollo-core/xpl-breadcrumbs.entry.js.map

@@ -0,0 +1 @@
+{"file":"xpl-breadcrumbs.entry.esm.js","mappings":";;MAQa,cAAc;;;;EACvB,MAAM;IACF,QACI,EAAC,IAAI,QACD,WAAK,KAAK,EAAC,iBAAiB,gBAAY,YAAY,IAChD,UAAI,IAAI,EAAC,MAAM,IACX,eAAa,CACZ,CACH,CACH,EACT;GACL;;;;;","names":[],"sources":["./src/components/components/xpl-breadcrumbs/xpl-breadcrumbs/xpl-breadcrumbs.tsx"],"sourcesContent":["import { Component, Host, h } from '@stencil/core';\n\n/**\n * @slot unnamed - content rendered <ol>, should be a group of <li> or <xpl-breadcrumb-item>\n */\n@Component({\n    tag: 'xpl-breadcrumbs',\n})\nexport class XplBreadcrumbs {\n    render() {\n        return (\n            <Host>\n                <nav class=\"xpl-breadcrumbs\" aria-label=\"Breadcrumb\">\n                    <ol role=\"list\">\n                        <slot></slot>\n                    </ol>\n                </nav>\n            </Host>\n        );\n    }\n}\n"],"version":3}

package/dist/apollo-core/xpl-button-row.entry.js

@@ -0,0 +1,23 @@
+import { r as registerInstance, f as createEvent, h, e as Host } from './index-307c7018.js';
+
+const XplButtonRow = class {
+  constructor(hostRef) {
+    registerInstance(this, hostRef);
+    this.clickPrimary = createEvent(this, "clickPrimary", 7);
+    this.clickSecondary = createEvent(this, "clickSecondary", 7);
+    this.clickTertiary = createEvent(this, "clickTertiary", 7);
+    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 (h(Host, { class: "xpl-button-row" }, h("div", { class: "xpl-button-row-inner" }, h("div", { class: "xpl-button-row__left" }, this.secondary && (h("xpl-button", { variant: "secondary", type: "button", onClick: this.onSecondary }, this.secondary))), h("div", { class: "xpl-button-row__right" }, this.tertiary && (h("xpl-button", { variant: "subtle", type: "button", onClick: this.onTertiary }, this.tertiary)), this.secondary && (h("xpl-button", { variant: "secondary", type: "button", onClick: this.onSecondary }, this.secondary)), this.primary && (h("xpl-button", { class: "xpl-button-row__primary", onClick: this.onPrimary }, this.primary))))));
+  }
+};
+
+export { XplButtonRow as xpl_button_row };
+
+//# sourceMappingURL=xpl-button-row.entry.js.map

package/dist/apollo-core/xpl-button-row.entry.js.map

@@ -0,0 +1 @@
+{"file":"xpl-button-row.entry.esm.js","mappings":";;MAKa,YAAY;;;;;;IA+Bb,cAAS,GAAG,MAAM,IAAI,CAAC,YAAY,CAAC,IAAI,EAAE,CAAC;IAC3C,gBAAW,GAAG,MAAM,IAAI,CAAC,cAAc,CAAC,IAAI,EAAE,CAAC;IAC/C,eAAU,GAAG,MAAM,IAAI,CAAC,aAAa,CAAC,IAAI,EAAE,CAAC;;;;;EAErD,MAAM;IACF,QACI,EAAC,IAAI,IAAC,KAAK,EAAC,gBAAgB,IACxB,WAAK,KAAK,EAAC,sBAAsB,IAC7B,WAAK,KAAK,EAAC,sBAAsB,IAC5B,IAAI,CAAC,SAAS,KACX,kBACI,OAAO,EAAC,WAAW,EACnB,IAAI,EAAC,QAAQ,EACb,OAAO,EAAE,IAAI,CAAC,WAAW,IAExB,IAAI,CAAC,SAAS,CACN,CAChB,CACC,EACN,WAAK,KAAK,EAAC,uBAAuB,IAC7B,IAAI,CAAC,QAAQ,KACV,kBACI,OAAO,EAAC,QAAQ,EAChB,IAAI,EAAC,QAAQ,EACb,OAAO,EAAE,IAAI,CAAC,UAAU,IAEvB,IAAI,CAAC,QAAQ,CACL,CAChB,EACA,IAAI,CAAC,SAAS,KACX,kBACI,OAAO,EAAC,WAAW,EACnB,IAAI,EAAC,QAAQ,EACb,OAAO,EAAE,IAAI,CAAC,WAAW,IAExB,IAAI,CAAC,SAAS,CACN,CAChB,EACA,IAAI,CAAC,OAAO,KACT,kBACI,KAAK,EAAC,yBAAyB,EAC/B,OAAO,EAAE,IAAI,CAAC,SAAS,IAEtB,IAAI,CAAC,OAAO,CACJ,CAChB,CACC,CACJ,CACH,EACT;GACL;;;;;","names":[],"sources":["./src/components/components/xpl-button-row/xpl-button-row.tsx"],"sourcesContent":["import { Component, Host, h, Prop, Event, EventEmitter } from '@stencil/core';\n\n@Component({\n    tag: 'xpl-button-row',\n})\nexport class XplButtonRow {\n    /**\n     * The text for the primary button.\n     */\n    @Prop({ reflect: false }) primary: 'string';\n    /**\n     * The text for the secondary button. If left\n     * empty, will not render a secondary button.\n     */\n    @Prop({ reflect: false }) secondary: 'string';\n    /**\n     * The text for the tertiary button. If left\n     * empty, will not render a secondary button.\n     */\n    @Prop({ reflect: false }) tertiary: 'string';\n\n    /**\n     * Fires on the primary button.\n     * If not set, the button can act as a standard\n     * submit button for a form.\n     */\n    @Event() clickPrimary: EventEmitter;\n    /**\n     * Adds an event listener to the secondary button.\n     */\n    @Event() clickSecondary: EventEmitter;\n    /**\n     * Adds an event listener to the tertiary button.\n     */\n    @Event() clickTertiary: EventEmitter;\n\n    private onPrimary = () => this.clickPrimary.emit();\n    private onSecondary = () => this.clickSecondary.emit();\n    private onTertiary = () => this.clickTertiary.emit();\n\n    render() {\n        return (\n            <Host class=\"xpl-button-row\">\n                <div class=\"xpl-button-row-inner\">\n                    <div class=\"xpl-button-row__left\">\n                        {this.secondary && (\n                            <xpl-button\n                                variant=\"secondary\"\n                                type=\"button\"\n                                onClick={this.onSecondary}\n                            >\n                                {this.secondary}\n                            </xpl-button>\n                        )}\n                    </div>\n                    <div class=\"xpl-button-row__right\">\n                        {this.tertiary && (\n                            <xpl-button\n                                variant=\"subtle\"\n                                type=\"button\"\n                                onClick={this.onTertiary}\n                            >\n                                {this.tertiary}\n                            </xpl-button>\n                        )}\n                        {this.secondary && (\n                            <xpl-button\n                                variant=\"secondary\"\n                                type=\"button\"\n                                onClick={this.onSecondary}\n                            >\n                                {this.secondary}\n                            </xpl-button>\n                        )}\n                        {this.primary && (\n                            <xpl-button\n                                class=\"xpl-button-row__primary\"\n                                onClick={this.onPrimary}\n                            >\n                                {this.primary}\n                            </xpl-button>\n                        )}\n                    </div>\n                </div>\n            </Host>\n        );\n    }\n}\n"],"version":3}

package/dist/apollo-core/xpl-button.entry.js

@@ -0,0 +1,60 @@
+import { r as registerInstance, h, e as Host, g as getElement } from './index-307c7018.js';
+
+const XplButton = class {
+  constructor(hostRef) {
+    registerInstance(this, hostRef);
+    this.disabled = undefined;
+    this.link = undefined;
+    this.iconOnly = undefined;
+    this.fullWidth = undefined;
+    this.name = undefined;
+    this.size = 'default';
+    this.type = undefined;
+    this.value = undefined;
+    this.variant = 'primary';
+    this.state = 'neutral';
+  }
+  componentDidRender() {
+    const attrs = this.el.attributes;
+    const dataAttrs = Object.keys(attrs)
+      .filter((k) => {
+      const propertyName = attrs[k].name;
+      if (propertyName) {
+        return (propertyName.includes('data-test') ||
+          propertyName.includes('aria-'));
+      }
+      return false;
+    })
+      .reduce((acc, k) => {
+      return Object.assign(Object.assign({}, acc), { [attrs[k].name]: attrs[k].value });
+    }, {});
+    const child = this.el.querySelector('button');
+    Object.keys(dataAttrs).forEach((k) => {
+      child.setAttribute(k, dataAttrs[k]);
+      this.el.removeAttribute(k);
+    });
+  }
+  render() {
+    let className = `xpl-button
+                    xpl-button--${this.size}
+                    xpl-button--${this.state}
+                    xpl-button--${this.variant}`;
+    if (this.iconOnly)
+      className += ' xpl-button--icon-only';
+    if (this.fullWidth)
+      className += ' xpl-button--full-width';
+    if (this.link && this.disabled)
+      className += ' xpl-button--link-disabled';
+    return (h(Host, { class: className }, 
+    /**
+     * Conditionally render either an <slot> or <button> element
+     * depending on if there's an `link` or not
+     */
+    this.link ? (h("slot", null)) : (h("button", { disabled: this.disabled, name: this.name, type: this.type, value: this.value }, h("slot", null)))));
+  }
+  get el() { return getElement(this); }
+};
+
+export { XplButton as xpl_button };
+
+//# sourceMappingURL=xpl-button.entry.js.map

package/dist/apollo-core/xpl-button.entry.js.map

@@ -0,0 +1 @@
+{"file":"xpl-button.entry.esm.js","mappings":";;MAIa,SAAS;;;;;;;;gBAyBsB,SAAS;;;mBAYK,SAAS;iBAIZ,SAAS;;EAE5D,kBAAkB;IACd,MAAM,KAAK,GAAG,IAAI,CAAC,EAAE,CAAC,UAAU,CAAC;IACjC,MAAM,SAAS,GAAG,MAAM,CAAC,IAAI,CAAC,KAAK,CAAC;OAC/B,MAAM,CAAC,CAAC,CAAC;MACN,MAAM,YAAY,GAAG,KAAK,CAAC,CAAC,CAAC,CAAC,IAAI,CAAC;MACnC,IAAI,YAAY,EAAE;QACd,QACI,YAAY,CAAC,QAAQ,CAAC,WAAW,CAAC;UAClC,YAAY,CAAC,QAAQ,CAAC,OAAO,CAAC,EAChC;OACL;MACD,OAAO,KAAK,CAAC;KAChB,CAAC;OACD,MAAM,CAAC,CAAC,GAAG,EAAE,CAAC;MACX,uCAAY,GAAG,KAAE,CAAC,KAAK,CAAC,CAAC,CAAC,CAAC,IAAI,GAAG,KAAK,CAAC,CAAC,CAAC,CAAC,KAAK,IAAG;KACtD,EAAE,EAAE,CAAC,CAAC;IAEX,MAAM,KAAK,GAAG,IAAI,CAAC,EAAE,CAAC,aAAa,CAAC,QAAQ,CAAC,CAAC;IAC9C,MAAM,CAAC,IAAI,CAAC,SAAS,CAAC,CAAC,OAAO,CAAC,CAAC,CAAC;MAC7B,KAAK,CAAC,YAAY,CAAC,CAAC,EAAE,SAAS,CAAC,CAAC,CAAC,CAAC,CAAC;MACpC,IAAI,CAAC,EAAE,CAAC,eAAe,CAAC,CAAC,CAAC,CAAC;KAC9B,CAAC,CAAC;GACN;EAED,MAAM;IACF,IAAI,SAAS,GAAG;kCACU,IAAI,CAAC,IAAI;kCACT,IAAI,CAAC,KAAK;kCACV,IAAI,CAAC,OAAO,EAAE,CAAC;IACzC,IAAI,IAAI,CAAC,QAAQ;MAAE,SAAS,IAAI,wBAAwB,CAAC;IACzD,IAAI,IAAI,CAAC,SAAS;MAAE,SAAS,IAAI,yBAAyB,CAAC;IAC3D,IAAI,IAAI,CAAC,IAAI,IAAI,IAAI,CAAC,QAAQ;MAC1B,SAAS,IAAI,4BAA4B,CAAC;IAE9C,QACI,EAAC,IAAI,IAAC,KAAK,EAAE,SAAS;;;;;IAMd,IAAI,CAAC,IAAI,IACL,eAAa,KAEb,cACI,QAAQ,EAAE,IAAI,CAAC,QAAQ,EACvB,IAAI,EAAE,IAAI,CAAC,IAAI,EACf,IAAI,EAAE,IAAI,CAAC,IAAI,EACf,KAAK,EAAE,IAAI,CAAC,KAAK,IAEjB,eAAa,CACR,CACZ,CAEF,EACT;GACL;;;;;;","names":[],"sources":["./src/components/components/xpl-button/xpl-button.tsx"],"sourcesContent":["import { Component, Element, Host, h, Prop } from '@stencil/core';\n@Component({\n    tag: 'xpl-button',\n})\nexport class XplButton {\n    @Element() el: HTMLXplButtonElement;\n    /**\n     * whether button should be disabled\n     */\n    @Prop() disabled?: boolean;\n    /**\n     * whether button should yield a slot for a link tag\n     */\n    @Prop() link?: boolean;\n    /**\n     * whether button should render icon only\n     */\n    @Prop() iconOnly?: boolean;\n    /**\n     * whether button should render with full width\n     */\n    @Prop() fullWidth?: boolean;\n    /**\n     * @property {string} - button name attribute\n     */\n    @Prop() name?: string;\n    /**\n     * @property {\"default\" | \"sm\" | \"xs\"} - button size\n     */\n    @Prop() size: 'default' | 'sm' | 'xs' = 'default';\n    /**\n     * @property {\"submit\" | \"reset\" | \"button\"} - button type attribute\n     */\n    @Prop() type?: 'submit' | 'reset' | 'button';\n    /**\n     * @property {string} - button value attribute\n     */\n    @Prop() value?: string;\n    /**\n     * @property {\"primary\" | \"secondary\" | \"subtle\"} - button variant\n     */\n    @Prop() variant: 'primary' | 'secondary' | 'subtle' = 'primary';\n    /**\n     * @property {\"neutral\" | \"warning\" | \"success\"} - button state (color) neutral=purple, success=green, warning=red\n     */\n    @Prop() state: 'neutral' | 'warning' | 'success' = 'neutral';\n\n    componentDidRender() {\n        const attrs = this.el.attributes;\n        const dataAttrs = Object.keys(attrs)\n            .filter((k) => {\n                const propertyName = attrs[k].name;\n                if (propertyName) {\n                    return (\n                        propertyName.includes('data-test') ||\n                        propertyName.includes('aria-')\n                    );\n                }\n                return false;\n            })\n            .reduce((acc, k) => {\n                return { ...acc, [attrs[k].name]: attrs[k].value };\n            }, {});\n\n        const child = this.el.querySelector('button');\n        Object.keys(dataAttrs).forEach((k) => {\n            child.setAttribute(k, dataAttrs[k]);\n            this.el.removeAttribute(k);\n        });\n    }\n\n    render() {\n        let className = `xpl-button\n                    xpl-button--${this.size}\n                    xpl-button--${this.state}\n                    xpl-button--${this.variant}`;\n        if (this.iconOnly) className += ' xpl-button--icon-only';\n        if (this.fullWidth) className += ' xpl-button--full-width';\n        if (this.link && this.disabled)\n            className += ' xpl-button--link-disabled';\n\n        return (\n            <Host class={className}>\n                {\n                    /**\n                     * Conditionally render either an <slot> or <button> element\n                     * depending on if there's an `link` or not\n                     */\n                    this.link ? (\n                        <slot></slot>\n                    ) : (\n                        <button\n                            disabled={this.disabled}\n                            name={this.name}\n                            type={this.type}\n                            value={this.value}\n                        >\n                            <slot></slot>\n                        </button>\n                    )\n                }\n            </Host>\n        );\n    }\n}\n"],"version":3}

package/dist/apollo-core/xpl-checkbox.entry.js

@@ -0,0 +1,35 @@
+import { r as registerInstance, f as createEvent, h, e as Host } from './index-307c7018.js';
+import { v as v4 } from './index-912d1a21.js';
+
+const XplCheckbox = class {
+  constructor(hostRef) {
+    registerInstance(this, hostRef);
+    this.checkboxChange = 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();
+  }
+  render() {
+    return (h(Host, { class: {
+        'xpl-checkbox-radio-container': true,
+        styled: this.styled,
+        disabled: this.disabled,
+      } }, h("input", { class: "xpl-checkbox", type: "checkbox", checked: this.checked, disabled: this.disabled, id: this.id, indeterminate: this.indeterminate, onChange: () => this.checkboxChange.emit(this.input.checked), name: this.name, ref: (el) => (this.input = el), required: this.required, value: this.value }), h("label", { class: {
+        'xpl-label': true,
+        'xpl-label--disabled': this.disabled,
+      }, htmlFor: this.id }, h("slot", null), this.description && (h("small", { class: {
+        'xpl-description': true,
+        'xpl-description--disabled': this.disabled,
+      } }, this.description)))));
+  }
+};
+
+export { XplCheckbox as xpl_checkbox };
+
+//# sourceMappingURL=xpl-checkbox.entry.js.map

package/dist/apollo-core/xpl-checkbox.entry.js.map

@@ -0,0 +1 @@
+{"file":"xpl-checkbox.entry.esm.js","mappings":";;;MAca,WAAW;;;;;;;;;;;;cAUEA,EAAI,EAAE;;EAO5B,MAAM;IACF,QACI,EAAC,IAAI,IACD,KAAK,EAAE;QACH,8BAA8B,EAAE,IAAI;QACpC,MAAM,EAAE,IAAI,CAAC,MAAM;QACnB,QAAQ,EAAE,IAAI,CAAC,QAAQ;OAC1B,IAED,aACI,KAAK,EAAC,cAAc,EACpB,IAAI,EAAC,UAAU,EACf,OAAO,EAAE,IAAI,CAAC,OAAO,EACrB,QAAQ,EAAE,IAAI,CAAC,QAAQ,EACvB,EAAE,EAAE,IAAI,CAAC,EAAE,EACX,aAAa,EAAE,IAAI,CAAC,aAAa,EACjC,QAAQ,EAAE,MACN,IAAI,CAAC,cAAc,CAAC,IAAI,CAAC,IAAI,CAAC,KAAK,CAAC,OAAO,CAAC,EAEhD,IAAI,EAAE,IAAI,CAAC,IAAI,EACf,GAAG,EAAE,CAAC,EAAE,MAAM,IAAI,CAAC,KAAK,GAAG,EAAsB,CAAC,EAClD,QAAQ,EAAE,IAAI,CAAC,QAAQ,EACvB,KAAK,EAAE,IAAI,CAAC,KAAK,GACZ,EACT,aACI,KAAK,EAAE;QACH,WAAW,EAAE,IAAI;QACjB,qBAAqB,EAAE,IAAI,CAAC,QAAQ;OACvC,EACD,OAAO,EAAE,IAAI,CAAC,EAAE,IAEhB,eAAa,EACZ,IAAI,CAAC,WAAW,KACb,aACI,KAAK,EAAE;QACH,iBAAiB,EAAE,IAAI;QACvB,2BAA2B,EAAE,IAAI,CAAC,QAAQ;OAC7C,IAEA,IAAI,CAAC,WAAW,CACb,CACX,CACG,CACL,EACT;GACL;;;;;","names":["uuid"],"sources":["./src/components/components/xpl-checkbox/xpl-checkbox.tsx"],"sourcesContent":["import {\n    Component,\n    Host,\n    h,\n    Prop,\n    State,\n    Event,\n    EventEmitter,\n} from '@stencil/core';\nimport { v4 as uuid } from 'uuid';\n\n@Component({\n    tag: 'xpl-checkbox',\n})\nexport class XplCheckbox {\n    @Prop() checked?: boolean;\n    @Prop() description?: string;\n    @Prop() disabled?: boolean;\n    @Prop() indeterminate?: boolean;\n    @Prop() name?: string;\n    @Prop() required?: boolean;\n    @Prop() styled?: boolean;\n    @Prop() value?: string;\n\n    @State() id: string = uuid();\n\n    /** @private */\n    @Event() checkboxChange: EventEmitter;\n\n    private input!: HTMLInputElement;\n\n    render() {\n        return (\n            <Host\n                class={{\n                    'xpl-checkbox-radio-container': true,\n                    styled: this.styled,\n                    disabled: this.disabled,\n                }}\n            >\n                <input\n                    class=\"xpl-checkbox\"\n                    type=\"checkbox\"\n                    checked={this.checked}\n                    disabled={this.disabled}\n                    id={this.id}\n                    indeterminate={this.indeterminate}\n                    onChange={() =>\n                        this.checkboxChange.emit(this.input.checked)\n                    }\n                    name={this.name}\n                    ref={(el) => (this.input = el as HTMLInputElement)}\n                    required={this.required}\n                    value={this.value}\n                ></input>\n                <label\n                    class={{\n                        'xpl-label': true,\n                        'xpl-label--disabled': this.disabled,\n                    }}\n                    htmlFor={this.id}\n                >\n                    <slot></slot>\n                    {this.description && (\n                        <small\n                            class={{\n                                'xpl-description': true,\n                                'xpl-description--disabled': this.disabled,\n                            }}\n                        >\n                            {this.description}\n                        </small>\n                    )}\n                </label>\n            </Host>\n        );\n    }\n}\n"],"version":3}

package/dist/apollo-core/xpl-choicelist.entry.js

@@ -0,0 +1,48 @@
+import { r as registerInstance, h, e as Host } from './index-307c7018.js';
+
+const XplChoicelist = class {
+  constructor(hostRef) {
+    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 =
+      this.choices !== undefined &&
+        this.choices !== null &&
+        this.choices.length > 0
+        ? this.choices.map(() => false)
+        : [];
+  }
+  render() {
+    let className = 'xpl-choicelist';
+    if (this.styled)
+      className += ' xpl-choicelist--styled';
+    return (h(Host, { class: "xpl-choicelist-container" }, this.heading !== undefined ||
+      this.description !== undefined ? (h("div", { class: "xpl-choicelist-heading" }, this.heading && h("h3", null, this.heading), this.description && h("p", null, this.description))) : null, this.choices && (h("ul", { class: className }, this.choices.map(({ children, description, label }, i) => {
+      const inner = this.multi ? (h("xpl-checkbox", { description: description, name: this.name, onCheckboxChange: (e) => {
+          const { detail } = e;
+          this.selected = this.selected.map((v, j) => (i === j ? detail : v));
+        } }, label)) : (h("xpl-radio", { description: description, name: this.name, onRadioChange: () => {
+          this.selected = this.selected.map((_, j) => i === j);
+        } }, label));
+      let className = this.styled && this.selected[i]
+        ? 'selected'
+        : '';
+      return (h("li", { class: className }, inner, children && (h("ul", null, children.map((child) => {
+        const childInner = this
+          .multi ? (h("xpl-checkbox", { description: child.description }, child.label)) : (h("xpl-radio", { description: child.description }, child.label));
+        return (h("li", null, childInner));
+      })))));
+    })))));
+  }
+};
+
+export { XplChoicelist as xpl_choicelist };
+
+//# sourceMappingURL=xpl-choicelist.entry.js.map

package/dist/apollo-core/xpl-choicelist.entry.js.map

@@ -0,0 +1 @@
+{"file":"xpl-choicelist.entry.esm.js","mappings":";;MAMa,aAAa;;;;;;;;;;;EAiCtB,iBAAiB;IACb,IAAI,CAAC,QAAQ;MACT,IAAI,CAAC,OAAO,KAAK,SAAS;QAC1B,IAAI,CAAC,OAAO,KAAK,IAAI;QACrB,IAAI,CAAC,OAAO,CAAC,MAAM,GAAG,CAAC;UACjB,IAAI,CAAC,OAAO,CAAC,GAAG,CAAC,MAAM,KAAK,CAAC;UAC7B,EAAE,CAAC;GAChB;EAED,MAAM;IACF,IAAI,SAAS,GAAG,gBAAgB,CAAC;IACjC,IAAI,IAAI,CAAC,MAAM;MAAE,SAAS,IAAI,yBAAyB,CAAC;IAExD,QACI,EAAC,IAAI,IAAC,KAAK,EAAC,0BAA0B,IACjC,IAAI,CAAC,OAAO,KAAK,SAAS;MAC3B,IAAI,CAAC,WAAW,KAAK,SAAS,IAC1B,WAAK,KAAK,EAAC,wBAAwB,IAC9B,IAAI,CAAC,OAAO,IAAI,cAAK,IAAI,CAAC,OAAO,CAAM,EACvC,IAAI,CAAC,WAAW,IAAI,aAAI,IAAI,CAAC,WAAW,CAAK,CAC5C,IACN,IAAI,EACP,IAAI,CAAC,OAAO,KACT,UAAI,KAAK,EAAE,SAAS,IACf,IAAI,CAAC,OAAO,CAAC,GAAG,CACb,CAAC,EAAE,QAAQ,EAAE,WAAW,EAAE,KAAK,EAAE,EAAE,CAAC;MAChC,MAAM,KAAK,GAAG,IAAI,CAAC,KAAK,IACpB,oBACI,WAAW,EAAE,WAAW,EACxB,IAAI,EAAE,IAAI,CAAC,IAAI,EACf,gBAAgB,EAAE,CAAC,CAElB;UACG,MAAM,EAAE,MAAM,EAAE,GAAG,CAAC,CAAC;UACrB,IAAI,CAAC,QAAQ,GAAG,IAAI,CAAC,QAAQ,CAAC,GAAG,CAC7B,CAAC,CAAC,EAAE,CAAC,MAAM,CAAC,KAAK,CAAC,GAAG,MAAM,GAAG,CAAC,CAAC,CACnC,CAAC;SACL,IAEA,KAAK,CACK,KAEf,iBACI,WAAW,EAAE,WAAW,EACxB,IAAI,EAAE,IAAI,CAAC,IAAI,EACf,aAAa,EAAE;UACX,IAAI,CAAC,QAAQ,GAAG,IAAI,CAAC,QAAQ,CAAC,GAAG,CAC7B,CAAC,CAAC,EAAE,CAAC,KAAK,CAAC,KAAK,CAAC,CACpB,CAAC;SACL,IAEA,KAAK,CACE,CACf,CAAC;MAEF,IAAI,SAAS,GACT,IAAI,CAAC,MAAM,IAAI,IAAI,CAAC,QAAQ,CAAC,CAAC,CAAC;UACzB,UAAU;UACV,EAAE,CAAC;MAEb,QACI,UAAI,KAAK,EAAE,SAAS,IACf,KAAK,EACL,QAAQ,KACL,cACK,QAAQ,CAAC,GAAG,CAAC,CAAC,KAAK;QAChB,MAAM,UAAU,GAAG,IAAI;WAClB,KAAK,IACN,oBACI,WAAW,EACP,KAAK,CAAC,WAAW,IAGpB,KAAK,CAAC,KAAK,CACD,KAEf,iBACI,WAAW,EACP,KAAK,CAAC,WAAW,IAGpB,KAAK,CAAC,KAAK,CACJ,CACf,CAAC;QACF,QACI,cAAK,UAAU,CAAM,EACvB;OACL,CAAC,CACD,CACR,CACA,EACP;KACL,CACJ,CACA,CACR,CACE,EACT;GACL;;;;;","names":[],"sources":["./src/components/components/xpl-choicelist/xpl-choicelist.tsx"],"sourcesContent":["import { Component, Host, h, Prop, State } from '@stencil/core';\nimport { Choice } from './choice';\n\n@Component({\n    tag: 'xpl-choicelist',\n})\nexport class XplChoicelist {\n    /**\n     * An array of choices to be displayed in the list.\n     * Each choice should be an object with keys:\n     * - `checked` [boolean] - whether to pre-check or not\n     * - `children` [Choice[]] - an array of child choices (recursive)\n     * - `description` [string]\n     * - `label` [string]\n     */\n    @Prop() choices: Choice[];\n    /**\n     * Descriptive text to be displayed above the choicelist.\n     */\n    @Prop() description?: string;\n    /**\n     * The title text to be displayed above the choicelist.\n     */\n    @Prop() heading?: string;\n    /**\n     * Whether the user can select more than one choice (true) or only a single choice (false). Corresponds to checkboxes vs. radio buttons.\n     */\n    @Prop() multi?: boolean;\n    /**\n     * The `name` to be associated with form data.\n     */\n    @Prop() name?: string;\n    /**\n     * If `true`, will include borders around the list and between individual choices.\n     */\n    @Prop() styled?: boolean;\n\n    @State() selected: boolean[];\n\n    componentWillLoad() {\n        this.selected =\n            this.choices !== undefined &&\n            this.choices !== null &&\n            this.choices.length > 0\n                ? this.choices.map(() => false)\n                : [];\n    }\n\n    render() {\n        let className = 'xpl-choicelist';\n        if (this.styled) className += ' xpl-choicelist--styled';\n\n        return (\n            <Host class=\"xpl-choicelist-container\">\n                {this.heading !== undefined ||\n                this.description !== undefined ? (\n                    <div class=\"xpl-choicelist-heading\">\n                        {this.heading && <h3>{this.heading}</h3>}\n                        {this.description && <p>{this.description}</p>}\n                    </div>\n                ) : null}\n                {this.choices && (\n                    <ul class={className}>\n                        {this.choices.map(\n                            ({ children, description, label }, i) => {\n                                const inner = this.multi ? (\n                                    <xpl-checkbox\n                                        description={description}\n                                        name={this.name}\n                                        onCheckboxChange={(e: {\n                                            detail: boolean;\n                                        }) => {\n                                            const { detail } = e;\n                                            this.selected = this.selected.map(\n                                                (v, j) => (i === j ? detail : v)\n                                            );\n                                        }}\n                                    >\n                                        {label}\n                                    </xpl-checkbox>\n                                ) : (\n                                    <xpl-radio\n                                        description={description}\n                                        name={this.name}\n                                        onRadioChange={() => {\n                                            this.selected = this.selected.map(\n                                                (_, j) => i === j\n                                            );\n                                        }}\n                                    >\n                                        {label}\n                                    </xpl-radio>\n                                );\n\n                                let className =\n                                    this.styled && this.selected[i]\n                                        ? 'selected'\n                                        : '';\n\n                                return (\n                                    <li class={className}>\n                                        {inner}\n                                        {children && (\n                                            <ul>\n                                                {children.map((child) => {\n                                                    const childInner = this\n                                                        .multi ? (\n                                                        <xpl-checkbox\n                                                            description={\n                                                                child.description\n                                                            }\n                                                        >\n                                                            {child.label}\n                                                        </xpl-checkbox>\n                                                    ) : (\n                                                        <xpl-radio\n                                                            description={\n                                                                child.description\n                                                            }\n                                                        >\n                                                            {child.label}\n                                                        </xpl-radio>\n                                                    );\n                                                    return (\n                                                        <li>{childInner}</li>\n                                                    );\n                                                })}\n                                            </ul>\n                                        )}\n                                    </li>\n                                );\n                            }\n                        )}\n                    </ul>\n                )}\n            </Host>\n        );\n    }\n}\n"],"version":3}

package/dist/apollo-core/xpl-content-area.entry.js

@@ -0,0 +1,15 @@
+import { r as registerInstance, h, e as Host } from './index-307c7018.js';
+
+const XplContentArea = class {
+  constructor(hostRef) {
+    registerInstance(this, hostRef);
+    this.size = 'wide';
+  }
+  render() {
+    return (h(Host, null, h("main", { class: `xpl-content-area-wrapper xpl-content-area-wrapper__${this.size}` }, h("div", { class: "xpl-content-area" }, h("slot", null)))));
+  }
+};
+
+export { XplContentArea as xpl_content_area };
+
+//# sourceMappingURL=xpl-content-area.entry.js.map

package/dist/apollo-core/xpl-content-area.entry.js.map

@@ -0,0 +1 @@
+{"file":"xpl-content-area.entry.esm.js","mappings":";;MAKa,cAAc;;;gBAIoB,MAAM;;EAEjD,MAAM;IACF,QACI,EAAC,IAAI,QACD,YACI,KAAK,EAAE,sDAAsD,IAAI,CAAC,IAAI,EAAE,IAExE,WAAK,KAAK,EAAC,kBAAkB,IACzB,eAAa,CACX,CACH,CACJ,EACT;GACL;;;;;","names":[],"sources":["./src/components/components/xpl-content-area/xpl-content-area.tsx"],"sourcesContent":["import { Component, Host, h, Prop } from '@stencil/core';\n\n@Component({\n    tag: 'xpl-content-area',\n})\nexport class XplContentArea {\n    /**\n     * @property {string}  size  - The content-area size.\n     */\n    @Prop() size: 'wide' | 'narrow' | 'full' = 'wide';\n\n    render() {\n        return (\n            <Host>\n                <main\n                    class={`xpl-content-area-wrapper xpl-content-area-wrapper__${this.size}`}\n                >\n                    <div class=\"xpl-content-area\">\n                        <slot></slot>\n                    </div>\n                </main>\n            </Host>\n        );\n    }\n}\n"],"version":3}

package/dist/apollo-core/xpl-divider.entry.js

@@ -0,0 +1,17 @@
+import { r as registerInstance, h, e as Host } from './index-307c7018.js';
+
+const XplDivider = class {
+  constructor(hostRef) {
+    registerInstance(this, hostRef);
+    this.tier = undefined;
+  }
+  render() {
+    let className = 'xpl-divider';
+    className += ` xpl-divider--${this.tier}`;
+    return (h(Host, { class: className }, h("span", null, h("slot", null))));
+  }
+};
+
+export { XplDivider as xpl_divider };
+
+//# sourceMappingURL=xpl-divider.entry.js.map

package/dist/apollo-core/xpl-divider.entry.js.map

@@ -0,0 +1 @@
+{"file":"xpl-divider.entry.esm.js","mappings":";;MAKa,UAAU;;;;;EAQnB,MAAM;IACF,IAAI,SAAS,GAAG,aAAa,CAAC;IAC9B,SAAS,IAAI,iBAAiB,IAAI,CAAC,IAAI,EAAE,CAAC;IAE1C,QACI,EAAC,IAAI,IAAC,KAAK,EAAE,SAAS,IAClB,gBACI,eAAa,CACV,CACJ,EACT;GACL;;;;;","names":[],"sources":["./src/components/components/xpl-divider/xpl-divider.tsx"],"sourcesContent":["import { Component, Host, h, Prop } from '@stencil/core';\n\n@Component({\n    tag: 'xpl-divider',\n})\nexport class XplDivider {\n    /**\n     * The tier should be an integer between 0 and 3.\n     * Tier 0 dividers do not display text, and 1-3 increase\n     * in size with each increasing tier.\n     */\n    @Prop() tier?: number;\n\n    render() {\n        let className = 'xpl-divider';\n        className += ` xpl-divider--${this.tier}`;\n\n        return (\n            <Host class={className}>\n                <span>\n                    <slot></slot>\n                </span>\n            </Host>\n        );\n    }\n}\n"],"version":3}

package/dist/apollo-core/xpl-dropdown-group.entry.js

@@ -0,0 +1,35 @@
+import { r as registerInstance, h, e as Host } from './index-307c7018.js';
+
+var __rest = (undefined && undefined.__rest) || function (s, e) {
+  var t = {};
+  for (var p in s)
+    if (Object.prototype.hasOwnProperty.call(s, p) && e.indexOf(p) < 0)
+      t[p] = s[p];
+  if (s != null && typeof Object.getOwnPropertySymbols === "function")
+    for (var i = 0, p = Object.getOwnPropertySymbols(s); i < p.length; i++) {
+      if (e.indexOf(p[i]) < 0 && Object.prototype.propertyIsEnumerable.call(s, p[i]))
+        t[p[i]] = s[p[i]];
+    }
+  return t;
+};
+const XplDropdownGroup = class {
+  constructor(hostRef) {
+    registerInstance(this, hostRef);
+    this.groupName = undefined;
+    this.options = undefined;
+  }
+  render() {
+    const { groupName, options } = this;
+    const hasOptions = options && options.length;
+    const mappedOptions = hasOptions &&
+      options.map((_a) => {
+        var { groupName } = _a, properties = __rest(_a, ["groupName"]);
+        return groupName ? (h("xpl-dropdown-group", Object.assign({ label: groupName }, properties))) : (h("xpl-dropdown-option", Object.assign({}, properties)));
+      });
+    return (h(Host, { role: "group", "aria-label": groupName }, h("li", { class: "xpl-dropdown-list-item" }, h("xpl-dropdown-heading", { label: groupName }), h("ul", { class: "xpl-dropdown-list" }, mappedOptions || h("slot", { name: "options" })))));
+  }
+};
+
+export { XplDropdownGroup as xpl_dropdown_group };
+
+//# sourceMappingURL=xpl-dropdown-group.entry.js.map

package/dist/apollo-core/xpl-dropdown-group.entry.js.map

@@ -0,0 +1 @@
+{"file":"xpl-dropdown-group.entry.esm.js","mappings":";;;;;;;;;;;;;;MAIa,gBAAgB;;;;;;EAOzB,MAAM;IACF,MAAM,EAAE,SAAS,EAAE,OAAO,EAAE,GAAG,IAAI,CAAC;IAEpC,MAAM,UAAU,GAAG,OAAO,IAAI,OAAO,CAAC,MAAM,CAAC;IAC7C,MAAM,aAAa,GACf,UAAU;MACV,OAAO,CAAC,GAAG,CAAC,CAAC,EAA4B;YAA5B,EAAE,SAAS,OAAiB,EAAZ,UAAU,cAA1B,aAA4B,CAAF;QACnC,OAAA,SAAS,IACL,wCACI,KAAK,EAAE,SAAS,IACZ,UAAU,EACI,KAEtB,2CAAyB,UAAU,EAAwB,CAC9D,CAAA;OAAA,CACJ,CAAC;IACN,QACI,EAAC,IAAI,IAAC,IAAI,EAAC,OAAO,gBAAa,SAAS,IACpC,UAAI,KAAK,EAAC,wBAAwB,IAC9B,4BACI,KAAK,EAAE,SAAS,GACI,EACxB,UAAI,KAAK,EAAC,mBAAmB,IACxB,aAAa,IAAI,YAAM,IAAI,EAAC,SAAS,GAAQ,CAC7C,CACJ,CACF,EACT;GACL;;;;;","names":[],"sources":["./src/components/components/xpl-dropdown/xpl-dropdown-group/xpl-dropdown-group.tsx"],"sourcesContent":["import { Component, Host, h, Prop } from '@stencil/core';\nimport type { DropdownOptionGroup } from '../dropdownoption';\n\n@Component({ tag: 'xpl-dropdown-group' })\nexport class XplDropdownGroup {\n    /** text to display as heading */\n    @Prop({ attribute: 'label' }) groupName: string;\n\n    /** options that are listed */\n    @Prop() options?: DropdownOptionGroup['options'];\n\n    render() {\n        const { groupName, options } = this;\n\n        const hasOptions = options && options.length;\n        const mappedOptions =\n            hasOptions &&\n            options.map(({ groupName, ...properties }) =>\n                groupName ? (\n                    <xpl-dropdown-group\n                        label={groupName}\n                        {...properties}\n                    ></xpl-dropdown-group>\n                ) : (\n                    <xpl-dropdown-option {...properties}></xpl-dropdown-option>\n                )\n            );\n        return (\n            <Host role=\"group\" aria-label={groupName}>\n                <li class=\"xpl-dropdown-list-item\">\n                    <xpl-dropdown-heading\n                        label={groupName}\n                    ></xpl-dropdown-heading>\n                    <ul class=\"xpl-dropdown-list\">\n                        {mappedOptions || <slot name=\"options\"></slot>}\n                    </ul>\n                </li>\n            </Host>\n        );\n    }\n}\n"],"version":3}

package/dist/apollo-core/xpl-dropdown-heading.entry.js

@@ -0,0 +1,15 @@
+import { r as registerInstance, h, e as Host } from './index-307c7018.js';
+
+const XplDropdownHeading = class {
+  constructor(hostRef) {
+    registerInstance(this, hostRef);
+    this.label = undefined;
+  }
+  render() {
+    return (h(Host, { class: { 'xpl-dropdown-heading': true }, role: "presentation" }, h("span", null, this.label || h("slot", { name: "heading" }))));
+  }
+};
+
+export { XplDropdownHeading as xpl_dropdown_heading };
+
+//# sourceMappingURL=xpl-dropdown-heading.entry.js.map

package/dist/apollo-core/xpl-dropdown-heading.entry.js.map

@@ -0,0 +1 @@
+{"file":"xpl-dropdown-heading.entry.esm.js","mappings":";;MAGa,kBAAkB;;;;;EAI3B,MAAM;IACF,QACI,EAAC,IAAI,IAAC,KAAK,EAAE,EAAE,sBAAsB,EAAE,IAAI,EAAE,EAAE,IAAI,EAAC,cAAc,IAC9D,gBAAO,IAAI,CAAC,KAAK,IAAI,YAAM,IAAI,EAAC,SAAS,GAAQ,CAAQ,CACtD,EACT;GACL;;;;;","names":[],"sources":["./src/components/components/xpl-dropdown/xpl-dropdown-heading/xpl-dropdown-heading.tsx"],"sourcesContent":["import { Component, Host, h, Prop } from '@stencil/core';\n\n@Component({ tag: 'xpl-dropdown-heading' })\nexport class XplDropdownHeading {\n    /** text to display as heading */\n    @Prop() label: string;\n\n    render() {\n        return (\n            <Host class={{ 'xpl-dropdown-heading': true }} role=\"presentation\">\n                <span>{this.label || <slot name=\"heading\"></slot>}</span>\n            </Host>\n        );\n    }\n}\n"],"version":3}

package/dist/apollo-core/xpl-dropdown-option.entry.js

@@ -0,0 +1,70 @@
+import { r as registerInstance, h, e as Host, g as getElement } from './index-307c7018.js';
+
+const XplDropdownOption = class {
+  constructor(hostRef) {
+    registerInstance(this, hostRef);
+    this.isDisabled = undefined;
+    this.label = undefined;
+    this.value = undefined;
+    this.isSelected = undefined;
+  }
+  componentWillLoad() {
+    this.dropdown = this.hostElement.closest('xpl-dropdown');
+  }
+  handleClick(ev) {
+    const { closeOnSelect, mode } = this.dropdown;
+    if (Boolean(ev.x && ev.y)) {
+      this.dropdown.handleSelect(ev, { component: this });
+      if (mode === 'single' && closeOnSelect)
+        this.dropdown.isOpen = false;
+    }
+  }
+  handleKeyup(ev) {
+    const { dropdown } = this;
+    const navigationKeys = [
+      'ArrowDown',
+      'ArrowLeft',
+      'ArrowRight',
+      'ArrowUp',
+      'Tab',
+    ];
+    const { closeOnSelect, mode, selectOnFocus } = this.dropdown;
+    if (selectOnFocus && navigationKeys.includes(ev.key)) {
+      const hostElement = document.activeElement.closest('xpl-dropdown-option');
+      const component = {
+        component: { hostElement },
+      };
+      dropdown.handleSelect(ev, component);
+      if (mode === 'single' && closeOnSelect)
+        this.dropdown.isOpen = false;
+      return;
+    }
+    const selectionKeys = ['Escape', 'Enter'];
+    if (selectionKeys.includes(ev.key)) {
+      dropdown.handleSelect(ev, { component: this });
+      if (this.dropdown.closeOnSelect)
+        this.dropdown.isOpen = false;
+    }
+  }
+  connectedCallback() {
+    this.hostElement.addEventListener('click', this.handleClick.bind(this));
+    this.hostElement.addEventListener('keyup', this.handleKeyup.bind(this));
+  }
+  disconnectedCallback() {
+    this.hostElement.removeEventListener('click', this.handleClick);
+    this.hostElement.removeEventListener('keyup', this.handleKeyup);
+  }
+  render() {
+    const { label, isSelected, isDisabled, value } = this;
+    return (h(Host, { class: {
+        'xpl-dropdown-option': true,
+        'xpl-dropdown-option--disabled': isDisabled,
+        'xpl-dropdown-option--selected': isSelected,
+      }, role: "option", "aria-checked": isSelected, "aria-disabled": isDisabled, "aria-selected": isSelected, value: value }, h("li", { class: "xpl-dropdown-list-item" }, label || h("slot", { name: "option" }))));
+  }
+  get hostElement() { return getElement(this); }
+};
+
+export { XplDropdownOption as xpl_dropdown_option };
+
+//# sourceMappingURL=xpl-dropdown-option.entry.js.map

package/dist/apollo-core/xpl-dropdown-option.entry.js.map

@@ -0,0 +1 @@
+{"file":"xpl-dropdown-option.entry.esm.js","mappings":";;MAGa,iBAAiB;;;;;;;;EAqB1B,iBAAiB;IACb,IAAI,CAAC,QAAQ,GAAG,IAAI,CAAC,WAAW,CAAC,OAAO,CAAC,cAAc,CAAC,CAAC;GAC5D;EAEO,WAAW,CAAC,EAAgB;IAChC,MAAM,EAAE,aAAa,EAAE,IAAI,EAAE,GAAG,IAAI,CAAC,QAAQ,CAAC;IAE9C,IAAI,OAAO,CAAC,EAAE,CAAC,CAAC,IAAI,EAAE,CAAC,CAAC,CAAC,EAAE;MACvB,IAAI,CAAC,QAAQ,CAAC,YAAY,CAAC,EAAE,EAAE,EAAE,SAAS,EAAE,IAAI,EAAE,CAAC,CAAC;MAEpD,IAAI,IAAI,KAAK,QAAQ,IAAI,aAAa;QAClC,IAAI,CAAC,QAAQ,CAAC,MAAM,GAAG,KAAK,CAAC;KACpC;GACJ;EAEO,WAAW,CAAC,EAAiB;IACjC,MAAM,EAAE,QAAQ,EAAE,GAAG,IAAI,CAAC;IAE1B,MAAM,cAAc,GAAG;MACnB,WAAW;MACX,WAAW;MACX,YAAY;MACZ,SAAS;MACT,KAAK;KACR,CAAC;IACF,MAAM,EAAE,aAAa,EAAE,IAAI,EAAE,aAAa,EAAE,GAAG,IAAI,CAAC,QAAQ,CAAC;IAE7D,IAAI,aAAa,IAAI,cAAc,CAAC,QAAQ,CAAC,EAAE,CAAC,GAAG,CAAC,EAAE;MAClD,MAAM,WAAW,GAAG,QAAQ,CAAC,aAAa,CAAC,OAAO,CAC9C,qBAAqB,CACxB,CAAC;MACF,MAAM,SAAS,GAAG;QACd,SAAS,EAAE,EAAE,WAAW,EAAuB;OAClD,CAAC;MACF,QAAQ,CAAC,YAAY,CAAC,EAAE,EAAE,SAAS,CAAC,CAAC;MAErC,IAAI,IAAI,KAAK,QAAQ,IAAI,aAAa;QAClC,IAAI,CAAC,QAAQ,CAAC,MAAM,GAAG,KAAK,CAAC;MACjC,OAAO;KACV;IAED,MAAM,aAAa,GAAG,CAAC,QAAQ,EAAE,OAAO,CAAC,CAAC;IAC1C,IAAI,aAAa,CAAC,QAAQ,CAAC,EAAE,CAAC,GAAG,CAAC,EAAE;MAChC,QAAQ,CAAC,YAAY,CAAC,EAAE,EAAE,EAAE,SAAS,EAAE,IAAI,EAAE,CAAC,CAAC;MAE/C,IAAI,IAAI,CAAC,QAAQ,CAAC,aAAa;QAAE,IAAI,CAAC,QAAQ,CAAC,MAAM,GAAG,KAAK,CAAC;KACjE;GACJ;EAED,iBAAiB;IACb,IAAI,CAAC,WAAW,CAAC,gBAAgB,CAAC,OAAO,EAAE,IAAI,CAAC,WAAW,CAAC,IAAI,CAAC,IAAI,CAAC,CAAC,CAAC;IACxE,IAAI,CAAC,WAAW,CAAC,gBAAgB,CAAC,OAAO,EAAE,IAAI,CAAC,WAAW,CAAC,IAAI,CAAC,IAAI,CAAC,CAAC,CAAC;GAC3E;EAED,oBAAoB;IAChB,IAAI,CAAC,WAAW,CAAC,mBAAmB,CAAC,OAAO,EAAE,IAAI,CAAC,WAAW,CAAC,CAAC;IAChE,IAAI,CAAC,WAAW,CAAC,mBAAmB,CAAC,OAAO,EAAE,IAAI,CAAC,WAAW,CAAC,CAAC;GACnE;EAED,MAAM;IACF,MAAM,EAAE,KAAK,EAAE,UAAU,EAAE,UAAU,EAAE,KAAK,EAAE,GAAG,IAAI,CAAC;IAEtD,QACI,EAAC,IAAI,IACD,KAAK,EAAE;QACH,qBAAqB,EAAE,IAAI;QAC3B,+BAA+B,EAAE,UAAU;QAC3C,+BAA+B,EAAE,UAAU;OAC9C,EACD,IAAI,EAAC,QAAQ,kBACC,UAAU,mBACT,UAAU,mBACV,UAAU,EACzB,KAAK,EAAE,KAAK,IAEZ,UAAI,KAAK,EAAC,wBAAwB,IAC7B,KAAK,IAAI,YAAM,IAAI,EAAC,QAAQ,GAAQ,CACpC,CACF,EACT;GACL;;;;;;","names":[],"sources":["./src/components/components/xpl-dropdown/xpl-dropdown-option/xpl-dropdown-option.tsx"],"sourcesContent":["import { Component, Element, Host, h, Prop } from '@stencil/core';\n\n@Component({ tag: 'xpl-dropdown-option' })\nexport class XplDropdownOption {\n    /** whether option is disabled */\n    @Prop({ attribute: 'disabled', reflect: true }) isDisabled?: boolean;\n\n    /**\n     * text to display for option\n     */\n    @Prop() label: string;\n\n    /**\n     * The selected options value to be submitted with the form, should this option be selected.\n     */\n    @Prop() value?: string;\n\n    /** whether option is selected */\n    @Prop({ attribute: 'selected' })\n    isSelected?: boolean;\n\n    @Element() hostElement: HTMLXplDropdownOptionElement;\n    private dropdown: HTMLXplDropdownElement;\n\n    componentWillLoad() {\n        this.dropdown = this.hostElement.closest('xpl-dropdown');\n    }\n\n    private handleClick(ev: PointerEvent) {\n        const { closeOnSelect, mode } = this.dropdown;\n\n        if (Boolean(ev.x && ev.y)) {\n            this.dropdown.handleSelect(ev, { component: this });\n\n            if (mode === 'single' && closeOnSelect)\n                this.dropdown.isOpen = false;\n        }\n    }\n\n    private handleKeyup(ev: KeyboardEvent) {\n        const { dropdown } = this;\n\n        const navigationKeys = [\n            'ArrowDown',\n            'ArrowLeft',\n            'ArrowRight',\n            'ArrowUp',\n            'Tab',\n        ];\n        const { closeOnSelect, mode, selectOnFocus } = this.dropdown;\n\n        if (selectOnFocus && navigationKeys.includes(ev.key)) {\n            const hostElement = document.activeElement.closest(\n                'xpl-dropdown-option'\n            );\n            const component = {\n                component: { hostElement } as XplDropdownOption,\n            };\n            dropdown.handleSelect(ev, component);\n\n            if (mode === 'single' && closeOnSelect)\n                this.dropdown.isOpen = false;\n            return;\n        }\n\n        const selectionKeys = ['Escape', 'Enter'];\n        if (selectionKeys.includes(ev.key)) {\n            dropdown.handleSelect(ev, { component: this });\n\n            if (this.dropdown.closeOnSelect) this.dropdown.isOpen = false;\n        }\n    }\n\n    connectedCallback() {\n        this.hostElement.addEventListener('click', this.handleClick.bind(this));\n        this.hostElement.addEventListener('keyup', this.handleKeyup.bind(this));\n    }\n\n    disconnectedCallback() {\n        this.hostElement.removeEventListener('click', this.handleClick);\n        this.hostElement.removeEventListener('keyup', this.handleKeyup);\n    }\n\n    render() {\n        const { label, isSelected, isDisabled, value } = this;\n\n        return (\n            <Host\n                class={{\n                    'xpl-dropdown-option': true,\n                    'xpl-dropdown-option--disabled': isDisabled,\n                    'xpl-dropdown-option--selected': isSelected,\n                }}\n                role=\"option\"\n                aria-checked={isSelected}\n                aria-disabled={isDisabled}\n                aria-selected={isSelected}\n                value={value}\n            >\n                <li class=\"xpl-dropdown-list-item\">\n                    {label || <slot name=\"option\"></slot>}\n                </li>\n            </Host>\n        );\n    }\n}\n"],"version":3}

package/dist/apollo-core/xpl-dropdown.entry.js

@@ -0,0 +1,106 @@
+import { r as registerInstance, h, e as Host, g as getElement } from './index-307c7018.js';
+
+var __rest = (undefined && undefined.__rest) || function (s, e) {
+  var t = {};
+  for (var p in s)
+    if (Object.prototype.hasOwnProperty.call(s, p) && e.indexOf(p) < 0)
+      t[p] = s[p];
+  if (s != null && typeof Object.getOwnPropertySymbols === "function")
+    for (var i = 0, p = Object.getOwnPropertySymbols(s); i < p.length; i++) {
+      if (e.indexOf(p[i]) < 0 && Object.prototype.propertyIsEnumerable.call(s, p[i]))
+        t[p[i]] = s[p[i]];
+    }
+  return t;
+};
+const XplDropdown = class {
+  constructor(hostRef) {
+    registerInstance(this, hostRef);
+    this.handleClickOutside = ({ target }) => {
+      const { triggerId } = this;
+      const isTrigger = triggerId && target.id === triggerId;
+      const isInside = this.hostElement.contains(target);
+      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
+   */
+  async handleSelect(e, { component }) {
+    const { hostElement, mode, options, update } = this;
+    const isSingle = mode === 'single';
+    const isMulti = mode === 'multi';
+    if (Boolean(options)) {
+      options
+        .reduce((acc, curr) => [
+        ...acc,
+        ...(curr.groupName ? curr.options : [curr]),
+      ], [])
+        .forEach((option) => {
+        const isMatch = (option.value || option.label) ===
+          (component.hostElement.value ||
+            component.hostElement.label);
+        if (isSingle) {
+          option.isSelected = isMatch;
+          component.hostElement.isSelected = option.isSelected;
+        }
+        else if (isMulti && isMatch) {
+          option.isSelected = !option.isSelected;
+          component.hostElement.isSelected = option.isSelected;
+        }
+      });
+      const mapOptions = (option) => {
+        option.options = option.groupName
+          ? option.options.map(mapOptions)
+          : undefined;
+        return option;
+      };
+      this.options = options.map(mapOptions);
+    }
+    else if (isSingle) {
+      const optionNodes = Array.from(hostElement.querySelectorAll('xpl-dropdown-option'));
+      optionNodes.forEach((node) => (node.isSelected = node === component.hostElement));
+    }
+    else if (isMulti) {
+      component.isSelected = !component.isSelected;
+    }
+    if (Boolean(update))
+      update(e, { component: this });
+  }
+  componentWillLoad() {
+    this.handleSelect = this.handleSelect.bind(this);
+  }
+  connectedCallback() {
+    document.addEventListener('mousedown', this.handleClickOutside.bind(this));
+  }
+  disconnectedCallback() {
+    document.removeEventListener('mousedown', this.handleClickOutside);
+  }
+  render() {
+    let { isOpen } = this;
+    const { mode, options } = this;
+    const hasOptions = options && options.length;
+    const mappedOptions = hasOptions &&
+      options.map((_a) => {
+        var { groupName, options } = _a, properties = __rest(_a, ["groupName", "options"]);
+        return groupName ? (h("xpl-dropdown-group", Object.assign({ groupName: groupName, options: options }, properties))) : (h("xpl-dropdown-option", Object.assign({}, properties)));
+      });
+    return (h(Host, { "aria-expanded": isOpen, class: {
+        'xpl-dropdown': true,
+        'xpl-dropdown--multi': mode === 'multi',
+        'xpl-dropdown--open': isOpen,
+      }, role: "listbox" }, h("ul", { class: "xpl-dropdown-list" }, mappedOptions || h("slot", { name: "options" }))));
+  }
+  get hostElement() { return getElement(this); }
+};
+
+export { XplDropdown as xpl_dropdown };
+
+//# sourceMappingURL=xpl-dropdown.entry.js.map

package/dist/apollo-core/xpl-dropdown.entry.js.map

@@ -0,0 +1 @@
+{"file":"xpl-dropdown.entry.esm.js","mappings":";;;;;;;;;;;;;;MAKa,WAAW;;;IAsFZ,uBAAkB,GAAG,CAAC,EAAE,MAAM,EAAc;MAChD,MAAM,EAAE,SAAS,EAAE,GAAG,IAAI,CAAC;MAC3B,MAAM,SAAS,GAAG,SAAS,IAAK,MAAsB,CAAC,EAAE,KAAK,SAAS,CAAC;MACxE,MAAM,QAAQ,GAAG,IAAI,CAAC,WAAW,CAAC,QAAQ,CACtC,MAAkC,CACrC,CAAC;MAEF,IAAI,CAAC,QAAQ,IAAI,CAAC,SAAS;QAAE,IAAI,CAAC,MAAM,GAAG,KAAK,CAAC;KACpD,CAAC;kBA3FE,KAAK;yBAGwB,IAAI;gBAGF,QAAQ;;yBAMV,KAAK;;;;;;;EAmBtC,MAAM,YAAY,CACd,CAAC,EACD,EAAE,SAAS,EAAoC;IAE/C,MAAM,EAAE,WAAW,EAAE,IAAI,EAAE,OAAO,EAAE,MAAM,EAAE,GAAG,IAAI,CAAC;IACpD,MAAM,QAAQ,GAAG,IAAI,KAAK,QAAQ,CAAC;IACnC,MAAM,OAAO,GAAG,IAAI,KAAK,OAAO,CAAC;IAEjC,IAAI,OAAO,CAAC,OAAO,CAAC,EAAE;MAClB,OAAO;SACF,MAAM,CACH,CAAC,GAAG,EAAE,IAAI,KAAK;QACX,GAAG,GAAG;QACN,IAAI,IAAI,CAAC,SAAS,GAAG,IAAI,CAAC,OAAO,GAAG,CAAC,IAAI,CAAC,CAAC;OAC9C,EACD,EAAE,CACL;SACA,OAAO,CAAC,CAAC,MAAM;QACZ,MAAM,OAAO,GACT,CAAC,MAAM,CAAC,KAAK,IAAI,MAAM,CAAC,KAAK;WAC5B,SAAS,CAAC,WAAW,CAAC,KAAK;YACxB,SAAS,CAAC,WAAW,CAAC,KAAK,CAAC,CAAC;QACrC,IAAI,QAAQ,EAAE;UACV,MAAM,CAAC,UAAU,GAAG,OAAO,CAAC;UAC5B,SAAS,CAAC,WAAW,CAAC,UAAU,GAAG,MAAM,CAAC,UAAU,CAAC;SACxD;aAAM,IAAI,OAAO,IAAI,OAAO,EAAE;UAC3B,MAAM,CAAC,UAAU,GAAG,CAAC,MAAM,CAAC,UAAU,CAAC;UACvC,SAAS,CAAC,WAAW,CAAC,UAAU,GAAG,MAAM,CAAC,UAAU,CAAC;SACxD;OACJ,CAAC,CAAC;MAEP,MAAM,UAAU,GAAG,CAAC,MAAoB;QACpC,MAAM,CAAC,OAAO,GAAG,MAAM,CAAC,SAAS;YAC3B,MAAM,CAAC,OAAO,CAAC,GAAG,CAAC,UAAU,CAAC;YAC9B,SAAS,CAAC;QAChB,OAAO,MAAM,CAAC;OACjB,CAAC;MACF,IAAI,CAAC,OAAO,GAAG,OAAO,CAAC,GAAG,CAAC,UAAU,CAAC,CAAC;KAC1C;SAAM,IAAI,QAAQ,EAAE;MACjB,MAAM,WAAW,GAAG,KAAK,CAAC,IAAI,CAC1B,WAAW,CAAC,gBAAgB,CAAC,qBAAqB,CAAC,CACtD,CAAC;MACF,WAAW,CAAC,OAAO,CACf,CAAC,IAAI,MAAM,IAAI,CAAC,UAAU,GAAG,IAAI,KAAK,SAAS,CAAC,WAAW,CAAC,CAC/D,CAAC;KACL;SAAM,IAAI,OAAO,EAAE;MAChB,SAAS,CAAC,UAAU,GAAG,CAAC,SAAS,CAAC,UAAU,CAAC;KAChD;IAED,IAAI,OAAO,CAAC,MAAM,CAAC;MAAE,MAAM,CAAC,CAAC,EAAE,EAAE,SAAS,EAAE,IAAI,EAAE,CAAC,CAAC;GACvD;EAYD,iBAAiB;IACb,IAAI,CAAC,YAAY,GAAG,IAAI,CAAC,YAAY,CAAC,IAAI,CAAC,IAAI,CAAC,CAAC;GACpD;EAED,iBAAiB;IACb,QAAQ,CAAC,gBAAgB,CACrB,WAAW,EACX,IAAI,CAAC,kBAAkB,CAAC,IAAI,CAAC,IAAI,CAAC,CACrC,CAAC;GACL;EAED,oBAAoB;IAChB,QAAQ,CAAC,mBAAmB,CAAC,WAAW,EAAE,IAAI,CAAC,kBAAkB,CAAC,CAAC;GACtE;EAED,MAAM;IACF,IAAI,EAAE,MAAM,EAAE,GAAG,IAAI,CAAC;IAEtB,MAAM,EAAE,IAAI,EAAE,OAAO,EAAE,GAAG,IAAI,CAAC;IAE/B,MAAM,UAAU,GAAG,OAAO,IAAI,OAAO,CAAC,MAAM,CAAC;IAC7C,MAAM,aAAa,GACf,UAAU;MACV,OAAO,CAAC,GAAG,CAAC,CAAC,EAAqC;YAArC,EAAE,SAAS,EAAE,OAAO,OAAiB,EAAZ,UAAU,cAAnC,wBAAqC,CAAF;QAC5C,OAAA,SAAS,IACL,wCACI,SAAS,EAAE,SAAS,EACpB,OAAO,EAAE,OAAO,IACZ,UAAU,EACI,KAEtB,2CAAyB,UAAU,EAAwB,CAC9D,CAAA;OAAA,CACJ,CAAC;IAEN,QACI,EAAC,IAAI,qBACc,MAAM,EACrB,KAAK,EAAE;QACH,cAAc,EAAE,IAAI;QACpB,qBAAqB,EAAE,IAAI,KAAK,OAAO;QACvC,oBAAoB,EAAE,MAAM;OAC/B,EACD,IAAI,EAAC,SAAS,IAEd,UAAI,KAAK,EAAC,mBAAmB,IACxB,aAAa,IAAI,YAAM,IAAI,EAAC,SAAS,GAAQ,CAC7C,CACF,EACT;GACL;;;;;;","names":[],"sources":["./src/components/components/xpl-dropdown/xpl-dropdown.tsx"],"sourcesContent":["import { Component, Element, h, Host, Method, Prop } from '@stencil/core';\nimport type { DropdownItem } from './dropdownoption';\nimport type { XplDropdownOption } from './xpl-dropdown-option/xpl-dropdown-option';\n\n@Component({ tag: 'xpl-dropdown' })\nexport class XplDropdown {\n    /** text to display as heading */\n    @Prop({ attribute: 'open', mutable: true, reflect: true }) isOpen: boolean =\n        false;\n\n    /** options that are listed */\n    @Prop() closeOnSelect: boolean = true;\n\n    /** constant representing number of options that can be selected */\n    @Prop() mode: 'single' | 'multi' = 'single';\n\n    /** options that are listed */\n    @Prop() options?: DropdownItem[];\n\n    /** whether selection should be made when focusing on interactable element */\n    @Prop() selectOnFocus: boolean = false;\n\n    /** the id for the element that triggers the open state */\n    @Prop() triggerId: string;\n\n    /**\n     * @callback update\n     * @param {Object} e - event object\n     * @param {Object} options - component\n     */\n    /** call back function invoked when a selection is made */\n    @Prop() update?: (e, { component }: { component: XplDropdown }) => void;\n\n    @Element() hostElement: HTMLXplDropdownElement;\n\n    /**\n     * called on dropdown option click and keydown events to update isSelected states\n     */\n    @Method()\n    async handleSelect(\n        e,\n        { component }: { component: XplDropdownOption }\n    ): Promise<void> {\n        const { hostElement, mode, options, update } = this;\n        const isSingle = mode === 'single';\n        const isMulti = mode === 'multi';\n\n        if (Boolean(options)) {\n            options\n                .reduce<typeof options>(\n                    (acc, curr) => [\n                        ...acc,\n                        ...(curr.groupName ? curr.options : [curr]),\n                    ],\n                    []\n                )\n                .forEach((option) => {\n                    const isMatch =\n                        (option.value || option.label) ===\n                        (component.hostElement.value ||\n                            component.hostElement.label);\n                    if (isSingle) {\n                        option.isSelected = isMatch;\n                        component.hostElement.isSelected = option.isSelected;\n                    } else if (isMulti && isMatch) {\n                        option.isSelected = !option.isSelected;\n                        component.hostElement.isSelected = option.isSelected;\n                    }\n                });\n\n            const mapOptions = (option: DropdownItem): DropdownItem => {\n                option.options = option.groupName\n                    ? option.options.map(mapOptions)\n                    : undefined;\n                return option;\n            };\n            this.options = options.map(mapOptions);\n        } else if (isSingle) {\n            const optionNodes = Array.from(\n                hostElement.querySelectorAll('xpl-dropdown-option')\n            );\n            optionNodes.forEach(\n                (node) => (node.isSelected = node === component.hostElement)\n            );\n        } else if (isMulti) {\n            component.isSelected = !component.isSelected;\n        }\n\n        if (Boolean(update)) update(e, { component: this });\n    }\n\n    private handleClickOutside = ({ target }: MouseEvent): void => {\n        const { triggerId } = this;\n        const isTrigger = triggerId && (target as HTMLElement).id === triggerId;\n        const isInside = this.hostElement.contains(\n            target as undefined as HTMLElement\n        );\n\n        if (!isInside && !isTrigger) this.isOpen = false;\n    };\n\n    componentWillLoad() {\n        this.handleSelect = this.handleSelect.bind(this);\n    }\n\n    connectedCallback() {\n        document.addEventListener(\n            'mousedown',\n            this.handleClickOutside.bind(this)\n        );\n    }\n\n    disconnectedCallback() {\n        document.removeEventListener('mousedown', this.handleClickOutside);\n    }\n\n    render() {\n        let { isOpen } = this;\n\n        const { mode, options } = this;\n\n        const hasOptions = options && options.length;\n        const mappedOptions =\n            hasOptions &&\n            options.map(({ groupName, options, ...properties }) =>\n                groupName ? (\n                    <xpl-dropdown-group\n                        groupName={groupName}\n                        options={options}\n                        {...properties}\n                    ></xpl-dropdown-group>\n                ) : (\n                    <xpl-dropdown-option {...properties}></xpl-dropdown-option>\n                )\n            );\n\n        return (\n            <Host\n                aria-expanded={isOpen}\n                class={{\n                    'xpl-dropdown': true,\n                    'xpl-dropdown--multi': mode === 'multi',\n                    'xpl-dropdown--open': isOpen,\n                }}\n                role=\"listbox\"\n            >\n                <ul class=\"xpl-dropdown-list\">\n                    {mappedOptions || <slot name=\"options\"></slot>}\n                </ul>\n            </Host>\n        );\n    }\n}\n"],"version":3}

package/dist/apollo-core/xpl-grid-item.entry.js

@@ -0,0 +1,23 @@
+import { r as registerInstance, h, e as Host } from './index-307c7018.js';
+
+const XplGridItem = class {
+  constructor(hostRef) {
+    registerInstance(this, hostRef);
+    this.xs = 6;
+    this.sm = 6;
+    this.md = 6;
+    this.lg = 6;
+  }
+  render() {
+    let className = 'xpl-grid-item';
+    className += ` xpl-grid-item-xs-${this.xs}`;
+    className += ` xpl-grid-item-sm-${this.sm}`;
+    className += ` xpl-grid-item-md-${this.md}`;
+    className += ` xpl-grid-item-lg-${this.lg}`;
+    return (h(Host, { class: className }, h("slot", null)));
+  }
+};
+
+export { XplGridItem as xpl_grid_item };
+
+//# sourceMappingURL=xpl-grid-item.entry.js.map

package/dist/apollo-core/xpl-grid-item.entry.js.map

@@ -0,0 +1 @@
+{"file":"xpl-grid-item.entry.esm.js","mappings":";;MAKa,WAAW;;;cACC,CAAC;cACD,CAAC;cACD,CAAC;cACD,CAAC;;EAEtB,MAAM;IACF,IAAI,SAAS,GAAG,eAAe,CAAC;IAChC,SAAS,IAAI,qBAAqB,IAAI,CAAC,EAAE,EAAE,CAAC;IAC5C,SAAS,IAAI,qBAAqB,IAAI,CAAC,EAAE,EAAE,CAAC;IAC5C,SAAS,IAAI,qBAAqB,IAAI,CAAC,EAAE,EAAE,CAAC;IAC5C,SAAS,IAAI,qBAAqB,IAAI,CAAC,EAAE,EAAE,CAAC;IAE5C,QACI,EAAC,IAAI,IAAC,KAAK,EAAE,SAAS,IAClB,eAAa,CACV,EACT;GACL;;;;;","names":[],"sources":["./src/components/components/xpl-grid-item/xpl-grid-item.tsx"],"sourcesContent":["import { Component, Host, h, Prop } from '@stencil/core';\n\n@Component({\n    tag: 'xpl-grid-item',\n})\nexport class XplGridItem {\n    @Prop() xs: number = 6;\n    @Prop() sm: number = 6;\n    @Prop() md: number = 6;\n    @Prop() lg: number = 6;\n\n    render() {\n        let className = 'xpl-grid-item';\n        className += ` xpl-grid-item-xs-${this.xs}`;\n        className += ` xpl-grid-item-sm-${this.sm}`;\n        className += ` xpl-grid-item-md-${this.md}`;\n        className += ` xpl-grid-item-lg-${this.lg}`;\n\n        return (\n            <Host class={className}>\n                <slot></slot>\n            </Host>\n        );\n    }\n}\n"],"version":3}

package/dist/apollo-core/xpl-grid.entry.js

@@ -0,0 +1,33 @@
+import { r as registerInstance, h, e as Host, g as getElement } from './index-307c7018.js';
+
+const XplGrid = class {
+  constructor(hostRef) {
+    registerInstance(this, hostRef);
+  }
+  componentDidLoad() {
+    const items = Array.from(this.container.querySelectorAll('.xpl-grid-item'));
+    let lgCounter = 0, mdCounter = 0, smCounter = 0, xsCounter = 0;
+    items.forEach((item) => {
+      lgCounter += +item.getAttribute('lg') || 6;
+      mdCounter += +item.getAttribute('md') || 6;
+      smCounter += +item.getAttribute('sm') || 6;
+      xsCounter += +item.getAttribute('xs') || 6;
+      if (lgCounter % 6 === 0)
+        item.classList.add('xpl-grid-item-lg-last');
+      if (mdCounter % 6 === 0)
+        item.classList.add('xpl-grid-item-md-last');
+      if (smCounter % 6 === 0)
+        item.classList.add('xpl-grid-item-sm-last');
+      if (xsCounter % 6 === 0)
+        item.classList.add('xpl-grid-item-xs-last');
+    });
+  }
+  render() {
+    return h(Host, { class: "xpl-grid" });
+  }
+  get container() { return getElement(this); }
+};
+
+export { XplGrid as xpl_grid };
+
+//# sourceMappingURL=xpl-grid.entry.js.map