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

package/dist/cjs/xpl-utility-bar.cjs.entry.js

@@ -0,0 +1,35 @@
+'use strict';
+
+Object.defineProperty(exports, '__esModule', { value: true });
+
+const index = require('./index-0fdb260e.js');
+
+const XplUtilityBar = class {
+  constructor(hostRef) {
+    index.registerInstance(this, hostRef);
+    this.navOpen = index.createEvent(this, "navOpen", 7);
+    this.bars = `
+        <svg aria-hidden="true" focusable="false" data-prefix="fas" data-icon="bars" class="svg-inline--fa fa-bars fa-w-14 xpl-utility-nav__bars" role="img" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 448 512"><path fill="currentColor" d="M16 132h416c8.837 0 16-7.163 16-16V76c0-8.837-7.163-16-16-16H16C7.163 60 0 67.163 0 76v40c0 8.837 7.163 16 16 16zm0 160h416c8.837 0 16-7.163 16-16v-40c0-8.837-7.163-16-16-16H16c-8.837 0-16 7.163-16 16v40c0 8.837 7.163 16 16 16zm0 160h416c8.837 0 16-7.163 16-16v-40c0-8.837-7.163-16-16-16H16c-8.837 0-16 7.163-16 16v40c0 8.837 7.163 16 16 16z"></path></svg>
+    `;
+    this.navControl = undefined;
+    this.isNavOpenAtStartup = undefined;
+    this.open = true;
+  }
+  onNavToggle() {
+    this.open = !this.open;
+    this.navOpen.emit(this.open);
+  }
+  componentWillLoad() {
+    this.open =
+      this.isNavOpenAtStartup !== undefined
+        ? this.isNavOpenAtStartup
+        : this.open;
+  }
+  render() {
+    return (index.h(index.Host, null, index.h("nav", { "aria-label": "utility navigation bar", class: "xpl-utility-bar" }, this.navControl ? (index.h("div", null, index.h("button", { class: "xpl-utility-bar__nav-control", onClick: () => this.onNavToggle(), innerHTML: `${this.bars}` }), index.h("slot", { name: "aside" }))) : (index.h("slot", { name: "aside" })), index.h("slot", { name: "main" }))));
+  }
+};
+
+exports.xpl_utility_bar = XplUtilityBar;
+
+//# sourceMappingURL=xpl-utility-bar.cjs.entry.js.map

package/dist/cjs/xpl-utility-bar.cjs.entry.js.map

@@ -0,0 +1 @@
+{"file":"xpl-utility-bar.entry.cjs.js","mappings":";;;;;;MAaa,aAAa;;;;IAuBd,SAAI,GAAG;;KAEd,CAAC;;;gBATuB,IAAI;;EAErB,WAAW;IACf,IAAI,CAAC,IAAI,GAAG,CAAC,IAAI,CAAC,IAAI,CAAC;IACvB,IAAI,CAAC,OAAO,CAAC,IAAI,CAAC,IAAI,CAAC,IAAI,CAAC,CAAC;GAChC;EAMD,iBAAiB;IACb,IAAI,CAAC,IAAI;MACL,IAAI,CAAC,kBAAkB,KAAK,SAAS;UAC/B,IAAI,CAAC,kBAAkB;UACvB,IAAI,CAAC,IAAI,CAAC;GACvB;EAED,MAAM;IACF,QACIA,QAACC,UAAI,QACDD,+BACe,wBAAwB,EACnC,KAAK,EAAC,iBAAiB,IAEtB,IAAI,CAAC,UAAU,IACZA,qBACIA,oBACI,KAAK,EAAC,8BAA8B,EACpC,OAAO,EAAE,MAAM,IAAI,CAAC,WAAW,EAAE,EACjC,SAAS,EAAE,GAAG,IAAI,CAAC,IAAI,EAAE,GACnB,EACVA,kBAAM,IAAI,EAAC,OAAO,GAAQ,CACxB,KAENA,kBAAM,IAAI,EAAC,OAAO,GAAQ,CAC7B,EACDA,kBAAM,IAAI,EAAC,MAAM,GAAQ,CACvB,CACH,EACT;GACL;;;;;","names":["h","Host"],"sources":["./src/components/components/xpl-utility-bar/xpl-utility-bar.tsx"],"sourcesContent":["import {\n    Component,\n    Event,\n    EventEmitter,\n    h,\n    Host,\n    Prop,\n    State,\n} from '@stencil/core';\n\n@Component({\n    tag: 'xpl-utility-bar',\n})\nexport class XplUtilityBar {\n    /**\n     * @event {boolean} - Emits the desired state of the navigation bar (open: true/false)\n     */\n    @Event() navOpen: EventEmitter<boolean>;\n\n    /**\n     * @property {boolean} - whether or not to show the bars to control the state of the navigation bar (open/close)\n     */\n    @Prop() navControl?: boolean;\n\n    /**\n     * @property {boolean} - Optional property that defines whether or not the main nav is open at startup.\n     */\n    @Prop() isNavOpenAtStartup?: boolean;\n\n    @State() open: boolean = true;\n\n    private onNavToggle() {\n        this.open = !this.open;\n        this.navOpen.emit(this.open);\n    }\n\n    private bars = `\n        <svg aria-hidden=\"true\" focusable=\"false\" data-prefix=\"fas\" data-icon=\"bars\" class=\"svg-inline--fa fa-bars fa-w-14 xpl-utility-nav__bars\" role=\"img\" xmlns=\"http://www.w3.org/2000/svg\" viewBox=\"0 0 448 512\"><path fill=\"currentColor\" d=\"M16 132h416c8.837 0 16-7.163 16-16V76c0-8.837-7.163-16-16-16H16C7.163 60 0 67.163 0 76v40c0 8.837 7.163 16 16 16zm0 160h416c8.837 0 16-7.163 16-16v-40c0-8.837-7.163-16-16-16H16c-8.837 0-16 7.163-16 16v40c0 8.837 7.163 16 16 16zm0 160h416c8.837 0 16-7.163 16-16v-40c0-8.837-7.163-16-16-16H16c-8.837 0-16 7.163-16 16v40c0 8.837 7.163 16 16 16z\"></path></svg>\n    `;\n\n    componentWillLoad() {\n        this.open =\n            this.isNavOpenAtStartup !== undefined\n                ? this.isNavOpenAtStartup\n                : this.open;\n    }\n\n    render() {\n        return (\n            <Host>\n                <nav\n                    aria-label=\"utility navigation bar\"\n                    class=\"xpl-utility-bar\"\n                >\n                    {this.navControl ? (\n                        <div>\n                            <button\n                                class=\"xpl-utility-bar__nav-control\"\n                                onClick={() => this.onNavToggle()}\n                                innerHTML={`${this.bars}`}\n                            ></button>\n                            <slot name=\"aside\"></slot>\n                        </div>\n                    ) : (\n                        <slot name=\"aside\"></slot>\n                    )}\n                    <slot name=\"main\"></slot>\n                </nav>\n            </Host>\n        );\n    }\n}\n"],"version":3}

package/dist/collection/collection-manifest.json

@@ -33,8 +33,8 @@
   ],
   "compiler": {
     "name": "@stencil/core",
-    "version": "2.22.2",
-    "typescriptVersion": "4.9.4"
+    "version": "3.1.0",
+    "typescriptVersion": "4.9.5"
   },
   "collections": [],
   "bundles": []

package/dist/collection/components/xpl-application-shell/xpl-application-shell.js

@@ -160,3 +160,4 @@ export class XplApplicationShell {
       }];
   }
 }
+//# sourceMappingURL=xpl-application-shell.js.map

package/dist/collection/components/xpl-application-shell/xpl-application-shell.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"xpl-application-shell.js","sourceRoot":"","sources":["../../../../src/components/components/xpl-application-shell/xpl-application-shell.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,SAAS,EAAE,CAAC,EAAE,IAAI,EAAE,MAAM,EAAE,IAAI,EAAE,KAAK,EAAE,MAAM,eAAe,CAAC;AAKxE,MAAM,OAAO,mBAAmB;;sBAUE,KAAK;uBAIJ,IAAI;oBAKR,SAAS;;mBAUR,IAAI;;EA5BxB,gBAAgB;IACpB,IAAI,MAAM,CAAC,UAAU,IAAI,GAAG,EAAE;MAC1B,IAAI,CAAC,OAAO,GAAG,KAAK,CAAC;KACxB;EACL,CAAC;EA2BD,gBAAgB;IACZ,IAAI,CAAC,OAAO,GAAG,CAAC,IAAI,CAAC,OAAO,CAAC;EACjC,CAAC;EAGD,cAAc,CAAC,KAAK;IAChB,IAAI,CAAC,QAAQ,GAAG,KAAK,CAAC,MAAM,CAAC;EACjC,CAAC;EAGD,cAAc;IACV,IAAI,CAAC,gBAAgB,EAAE,CAAC;EAC5B,CAAC;EAED,iBAAiB;IACb,IAAI,CAAC,gBAAgB,EAAE,CAAC;EAC5B,CAAC;EAED,iBAAiB;IACb,IAAI,CAAC,OAAO;MACR,IAAI,CAAC,kBAAkB,KAAK,SAAS;QACjC,CAAC,CAAC,IAAI,CAAC,kBAAkB;QACzB,CAAC,CAAC,IAAI,CAAC,OAAO,CAAC;EAC3B,CAAC;EAED,MAAM;IACF,IAAI,uBAAuB,GAAG,uBAAuB,CAAC;IACtD,IAAI,IAAI,CAAC,WAAW;MAChB,uBAAuB,IAAI,sCAAsC,CAAC;IAEtE,IAAI,UAAU,GAAG,4BAA4B,CAAC;IAC9C,UAAU,IAAI,IAAI,CAAC,OAAO;MACtB,CAAC,CAAC,gCAAgC,IAAI,CAAC,QAAQ,QAAQ;MACvD,CAAC,CAAC,gCAAgC,IAAI,CAAC,QAAQ,EAAE,CAAC;IAEtD,OAAO,CACH,EAAC,IAAI,IAAC,KAAK,EAAE,uBAAuB;MAChC,WAAK,KAAK,EAAE,UAAU;QAClB,YAAM,IAAI,EAAC,KAAK,GAAQ,CACtB;MACN,WAAK,KAAK,EAAC,+BAA+B;QACtC,YAAM,IAAI,EAAC,QAAQ,GAAQ,CACzB;MACN,WAAK,KAAK,EAAC,gCAAgC;QACvC,YAAM,IAAI,EAAC,SAAS,GAAQ,CAC1B;MACN,WAAK,KAAK,EAAC,gCAAgC;QACvC,YAAM,IAAI,EAAC,SAAS,GAAQ,CAC1B;MACN,oBACI,OAAO,EAAE,GAAG,EAAE,CAAC,IAAI,CAAC,gBAAgB,EAAE,EACtC,KAAK,EAAE;UACH,uCAAuC,EAAE,IAAI,CAAC,OAAO;SACxD,EACD,QAAQ,SACI,CACb,CACV,CAAC;EACN,CAAC;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CACJ","sourcesContent":["import { Component, h, Host, Listen, Prop, State } from '@stencil/core';\n\n@Component({\n    tag: 'xpl-application-shell',\n})\nexport class XplApplicationShell {\n    private closeNavOnMobile() {\n        if (window.innerWidth <= 640) {\n            this.navOpen = false;\n        }\n    }\n\n    /**\n     * @property {boolean} - Whether or not the Grid should have space for a secondary (sub) navigation bar\n     */\n    @Prop() withSubnav: boolean = false;\n    /**\n     * @property {boolean} - Whether or not the Grid should have space for a utility bar\n     */\n    @Prop() withUtility: boolean = true;\n\n    /**\n     * @property {string} - The width of the main navigation bar, can be passed or updated when nav-width event is emitted.\n     */\n    @Prop() navWidth: string = 'default';\n\n    /**\n     * @property {boolean} - * @property {boolean} - Optional property that defines whether or not the main nav is open at startup.\n     */\n    @Prop() isNavOpenAtStartup: boolean;\n\n    /**\n     * @state {boolean} - Whether or not the main nav is open, updates when the nav-open event is emitted.\n     */\n    @State() navOpen: boolean = true;\n\n    @Listen('navOpen')\n    navToggleHandler() {\n        this.navOpen = !this.navOpen;\n    }\n\n    @Listen('navWidth')\n    navWithHandler(event) {\n        this.navWidth = event.detail;\n    }\n\n    @Listen('resize', { target: 'window' })\n    onWindowResize() {\n        this.closeNavOnMobile();\n    }\n\n    connectedCallback() {\n        this.closeNavOnMobile();\n    }\n\n    componentWillLoad() {\n        this.navOpen =\n            this.isNavOpenAtStartup !== undefined\n                ? this.isNavOpenAtStartup\n                : this.navOpen;\n    }\n\n    render() {\n        let applicationShellClasses = 'xpl-application-shell';\n        if (this.withUtility)\n            applicationShellClasses += ' xpl-application-shell--with_utility';\n\n        let navClasses = 'xpl-application-shell__nav';\n        navClasses += this.navOpen\n            ? ` xpl-application-shell__nav--${this.navWidth}--open`\n            : ` xpl-application-shell__nav--${this.navWidth}`;\n\n        return (\n            <Host class={applicationShellClasses}>\n                <div class={navClasses}>\n                    <slot name=\"nav\"></slot>\n                </div>\n                <div class=\"xpl-application-shell__subnav\">\n                    <slot name=\"subnav\"></slot>\n                </div>\n                <div class=\"xpl-application-shell__utility\">\n                    <slot name=\"utility\"></slot>\n                </div>\n                <div class=\"xpl-application-shell__content\">\n                    <slot name=\"content\"></slot>\n                </div>\n                <xpl-backdrop\n                    onClick={() => this.navToggleHandler()}\n                    class={{\n                        'xpl-application-shell__backdrop--open': this.navOpen,\n                    }}\n                    relative\n                ></xpl-backdrop>\n            </Host>\n        );\n    }\n}\n"]}

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

@@ -162,3 +162,4 @@ export class XplAvatar {
     };
   }
 }
+//# sourceMappingURL=xpl-avatar.js.map

package/dist/collection/components/xpl-avatar/xpl-avatar.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"xpl-avatar.js","sourceRoot":"","sources":["../../../../src/components/components/xpl-avatar/xpl-avatar.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,SAAS,EAAE,IAAI,EAAE,CAAC,EAAE,IAAI,EAAE,MAAM,eAAe,CAAC;AAKzD,MAAM,OAAO,SAAS;;;oBAEW,KAAK;;;;;;;;EAQlC,MAAM;IACF,IAAI,SAAS,GAAG,YAAY,CAAC;IAC7B,IAAI,IAAI,CAAC,IAAI;MAAE,SAAS,IAAI,gBAAgB,IAAI,CAAC,IAAI,EAAE,CAAC;IACxD,IAAI,IAAI,CAAC,KAAK;MAAE,SAAS,IAAI,gBAAgB,IAAI,CAAC,KAAK,EAAE,CAAC;IAE1D,MAAM,KAAK,GAAG,CACV;MACK,IAAI,CAAC,GAAG,CAAC,CAAC,CAAC,CACR,WAAK,GAAG,EAAE,IAAI,CAAC,IAAI,EAAE,GAAG,EAAE,IAAI,CAAC,GAAG,GAAI,CACzC,CAAC,CAAC,CAAC,CACA,WAAK,KAAK,EAAC,yBAAyB;QAChC,eAAa,CACX,CACT;MACA,IAAI,CAAC,MAAM,IAAI,CACZ,WAAK,KAAK,EAAE,oBAAoB,IAAI,CAAC,MAAM,EAAE,GAAQ,CACxD,CACC,CACT,CAAC;IAEF,OAAO,CACH,EAAC,IAAI,QACA,IAAI,CAAC,IAAI,IAAI,CAAC,IAAI,CAAC,QAAQ,CAAC,CAAC,CAAC,CAC3B,SAAG,IAAI,EAAE,IAAI,CAAC,IAAI,EAAE,KAAK,EAAE,SAAS,EAAE,MAAM,EAAE,IAAI,CAAC,MAAM,IACpD,KAAK,CACN,CACP,CAAC,CAAC,CAAC,IAAI,CAAC,IAAI,IAAI,IAAI,CAAC,QAAQ,CAAC,CAAC,CAAC,CAC7B,WAAK,KAAK,EAAE,SAAS,GAAG,uBAAuB,IAC1C,KAAK,CACJ,CACT,CAAC,CAAC,CAAC,CACA,WAAK,KAAK,EAAE,SAAS,IAAG,KAAK,CAAO,CACvC,CACE,CACV,CAAC;EACN,CAAC;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CACJ","sourcesContent":["import { Component, Host, h, Prop } from '@stencil/core';\n\n@Component({\n    tag: 'xpl-avatar',\n})\nexport class XplAvatar {\n    @Prop() color?: 'green' | 'yellow' | 'pink' | 'primary' | 'secondary';\n    @Prop() disabled?: boolean = false;\n    @Prop() href?: string;\n    @Prop() name?: string;\n    @Prop() size?: 'md' | 'sm';\n    @Prop() src?: string;\n    @Prop() status?: 'active' | 'warning' | 'inactive';\n    @Prop() target?: string;\n\n    render() {\n        let className = 'xpl-avatar';\n        if (this.size) className += ` xpl-avatar--${this.size}`;\n        if (this.color) className += ` xpl-avatar--${this.color}`;\n\n        const inner = (\n            <div>\n                {this.src ? (\n                    <img alt={this.name} src={this.src} />\n                ) : (\n                    <div class=\"xpl-avatar__placeholder\">\n                        <slot></slot>\n                    </div>\n                )}\n                {this.status && (\n                    <div class={`xpl-avatar__dot--${this.status}`}></div>\n                )}\n            </div>\n        );\n\n        return (\n            <Host>\n                {this.href && !this.disabled ? (\n                    <a href={this.href} class={className} target={this.target}>\n                        {inner}\n                    </a>\n                ) : this.href && this.disabled ? (\n                    <div class={className + ' xpl-avatar--disabled'}>\n                        {inner}\n                    </div>\n                ) : (\n                    <div class={className}>{inner}</div>\n                )}\n            </Host>\n        );\n    }\n}\n"]}

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

@@ -37,3 +37,4 @@ export class XplBackdrop {
     };
   }
 }
+//# sourceMappingURL=xpl-backdrop.js.map

package/dist/collection/components/xpl-backdrop/xpl-backdrop.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"xpl-backdrop.js","sourceRoot":"","sources":["../../../../src/components/components/xpl-backdrop/xpl-backdrop.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,SAAS,EAAE,IAAI,EAAE,CAAC,EAAE,IAAI,EAAE,MAAM,eAAe,CAAC;AAKzD,MAAM,OAAO,WAAW;;oBAKQ,KAAK;;EAEjC,MAAM;IACF,OAAO,CACH,EAAC,IAAI,IACD,KAAK,EAAE;QACH,cAAc,EAAE,IAAI;QACpB,qBAAqB,EAAE,CAAC,IAAI,CAAC,QAAQ;QACrC,wBAAwB,EAAE,IAAI,CAAC,QAAQ;OAC1C,iBACW,MAAM,GACd,CACX,CAAC;EACN,CAAC;;;;;;;;;;;;;;;;;;;;;;;;;CACJ","sourcesContent":["import { Component, Host, h, Prop } from '@stencil/core';\n\n@Component({\n    tag: 'xpl-backdrop',\n})\nexport class XplBackdrop {\n    /**\n     * @property {boolean} - When true, backdrop will have relative position. This is useful when the backdrop doesn't cover the whole view area.\n     * If false, the position will be fixed and cover the whole view area.\n     */\n    @Prop() relative: boolean = false;\n\n    render() {\n        return (\n            <Host\n                class={{\n                    'xpl-backdrop': true,\n                    'xpl-backdrop--fixed': !this.relative,\n                    'xpl-backdrop--relative': this.relative,\n                }}\n                aria-hidden=\"true\"\n            ></Host>\n        );\n    }\n}\n"]}

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

@@ -52,3 +52,4 @@ export class XplBadge {
     };
   }
 }
+//# sourceMappingURL=xpl-badge.js.map

package/dist/collection/components/xpl-badge/xpl-badge.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"xpl-badge.js","sourceRoot":"","sources":["../../../../src/components/components/xpl-badge/xpl-badge.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,SAAS,EAAE,IAAI,EAAE,CAAC,EAAE,IAAI,EAAE,MAAM,eAAe,CAAC;AAKzD,MAAM,OAAO,QAAQ;;;;;EAIjB,MAAM;IACF,IAAI,SAAS,GAAG,WAAW,CAAC;IAC5B,IAAI,IAAI,CAAC,GAAG;MAAE,SAAS,IAAI,iBAAiB,CAAC;IAC7C,IAAI,IAAI,CAAC,OAAO;MAAE,SAAS,IAAI,cAAc,GAAG,IAAI,CAAC,OAAO,CAAC;IAE7D,OAAO,CACH,EAAC,IAAI;MACD,WAAK,KAAK,EAAE,SAAS;QACjB,eAAa,CACX,CACH,CACV,CAAC;EACN,CAAC;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CACJ","sourcesContent":["import { Component, Host, h, Prop } from '@stencil/core';\n\n@Component({\n    tag: 'xpl-badge',\n})\nexport class XplBadge {\n    @Prop() dot?: boolean;\n    @Prop() variant?: 'success' | 'warning' | 'inactive' | 'error';\n\n    render() {\n        let className = 'xpl-badge';\n        if (this.dot) className += ' xpl-badge--dot';\n        if (this.variant) className += ' xpl-badge--' + this.variant;\n\n        return (\n            <Host>\n                <div class={className}>\n                    <slot></slot>\n                </div>\n            </Host>\n        );\n    }\n}\n"]}

package/dist/collection/components/xpl-breadcrumbs/xpl-breadcrumb-item/xpl-breadcrumb-item.js

@@ -15,3 +15,4 @@ export class XplBreadcrumbItem {
   }
   static get is() { return "xpl-breadcrumb-item"; }
 }
+//# sourceMappingURL=xpl-breadcrumb-item.js.map

package/dist/collection/components/xpl-breadcrumbs/xpl-breadcrumb-item/xpl-breadcrumb-item.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"xpl-breadcrumb-item.js","sourceRoot":"","sources":["../../../../../src/components/components/xpl-breadcrumbs/xpl-breadcrumb-item/xpl-breadcrumb-item.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,SAAS,EAAE,IAAI,EAAE,CAAC,EAAE,MAAM,eAAe,CAAC;AAEnD;;GAEG;AAIH,MAAM,OAAO,iBAAiB;EAH9B;IAII,iHAAiH;IACzG,YAAO,GAAG;;;KAGjB,CAAC;GAYL;EAVG,MAAM;IACF,OAAO,CACH,EAAC,IAAI,IAAC,KAAK,EAAC,qBAAqB,EAAC,IAAI,EAAC,UAAU;MAC7C,UAAI,IAAI,EAAC,MAAM;QACX,eAAa,CACZ;MACL,YAAM,SAAS,EAAE,GAAG,IAAI,CAAC,OAAO,EAAE,GAAI,CACnC,CACV,CAAC;EACN,CAAC;;CACJ","sourcesContent":["import { Component, Host, h } from '@stencil/core';\n\n/**\n * @slot unnamed - content rendered inside <li>, should be link or button (styled as link)\n */\n@Component({\n    tag: 'xpl-breadcrumb-item',\n})\nexport class XplBreadcrumbItem {\n    // This is temporary as we still don't have a xpl-icon component. When that's created we should update this code.\n    private chevron = `<svg aria-hidden=\"true\" focusable=\"false\" data-prefix=\"fas\" data-icon=\"chevron-right\" class=\"svg-inline--fa fa-chevron-right fa-w-10\" role=\"img\" xmlns=\"http://www.w3.org/2000/svg\" viewBox=\"0 0 320 512\">\n        <path fill=\"currentColor\" d=\"M285.476 272.971L91.132 467.314c-9.373 9.373-24.569 9.373-33.941 0l-22.667-22.667c-9.357-9.357-9.375-24.522-.04-33.901L188.505 256 34.484 101.255c-9.335-9.379-9.317-24.544.04-33.901l22.667-22.667c9.373-9.373 24.569-9.373 33.941 0L285.475 239.03c9.373 9.372 9.373 24.568.001 33.941z\"></path>\n    </svg>\n    `;\n\n    render() {\n        return (\n            <Host class=\"xpl-breadcrumb-item\" role=\"listitem\">\n                <li role=\"none\">\n                    <slot></slot>\n                </li>\n                <span innerHTML={`${this.chevron}`} />\n            </Host>\n        );\n    }\n}\n"]}

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

@@ -8,3 +8,4 @@ export class XplBreadcrumbs {
   }
   static get is() { return "xpl-breadcrumbs"; }
 }
+//# sourceMappingURL=xpl-breadcrumbs.js.map

package/dist/collection/components/xpl-breadcrumbs/xpl-breadcrumbs/xpl-breadcrumbs.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"xpl-breadcrumbs.js","sourceRoot":"","sources":["../../../../../src/components/components/xpl-breadcrumbs/xpl-breadcrumbs/xpl-breadcrumbs.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,SAAS,EAAE,IAAI,EAAE,CAAC,EAAE,MAAM,eAAe,CAAC;AAEnD;;GAEG;AAIH,MAAM,OAAO,cAAc;EACvB,MAAM;IACF,OAAO,CACH,EAAC,IAAI;MACD,WAAK,KAAK,EAAC,iBAAiB,gBAAY,YAAY;QAChD,UAAI,IAAI,EAAC,MAAM;UACX,eAAa,CACZ,CACH,CACH,CACV,CAAC;EACN,CAAC;;CACJ","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"]}

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

@@ -248,3 +248,4 @@ export class XplButton {
   }
   static get elementRef() { return "el"; }
 }
+//# sourceMappingURL=xpl-button.js.map

package/dist/collection/components/xpl-button/xpl-button.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"xpl-button.js","sourceRoot":"","sources":["../../../../src/components/components/xpl-button/xpl-button.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,SAAS,EAAE,OAAO,EAAE,IAAI,EAAE,CAAC,EAAE,IAAI,EAAE,MAAM,eAAe,CAAC;AAIlE,MAAM,OAAO,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,EAAE,EAAE;MACV,MAAM,YAAY,GAAG,KAAK,CAAC,CAAC,CAAC,CAAC,IAAI,CAAC;MACnC,IAAI,YAAY,EAAE;QACd,OAAO,CACH,YAAY,CAAC,QAAQ,CAAC,WAAW,CAAC;UAClC,YAAY,CAAC,QAAQ,CAAC,OAAO,CAAC,CACjC,CAAC;OACL;MACD,OAAO,KAAK,CAAC;IACjB,CAAC,CAAC;OACD,MAAM,CAAC,CAAC,GAAG,EAAE,CAAC,EAAE,EAAE;MACf,uCAAY,GAAG,KAAE,CAAC,KAAK,CAAC,CAAC,CAAC,CAAC,IAAI,CAAC,EAAE,KAAK,CAAC,CAAC,CAAC,CAAC,KAAK,IAAG;IACvD,CAAC,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,EAAE,EAAE;MACjC,KAAK,CAAC,YAAY,CAAC,CAAC,EAAE,SAAS,CAAC,CAAC,CAAC,CAAC,CAAC;MACpC,IAAI,CAAC,EAAE,CAAC,eAAe,CAAC,CAAC,CAAC,CAAC;IAC/B,CAAC,CAAC,CAAC;EACP,CAAC;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,OAAO,CACH,EAAC,IAAI,IAAC,KAAK,EAAE,SAAS;IAEd;;;OAGG;IACH,IAAI,CAAC,IAAI,CAAC,CAAC,CAAC,CACR,eAAa,CAChB,CAAC,CAAC,CAAC,CACA,cACI,QAAQ,EAAE,IAAI,CAAC,QAAQ,EACvB,IAAI,EAAE,IAAI,CAAC,IAAI,EACf,IAAI,EAAE,IAAI,CAAC,IAAI,EACf,KAAK,EAAE,IAAI,CAAC,KAAK;MAEjB,eAAa,CACR,CACZ,CAEF,CACV,CAAC;EACN,CAAC;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CACJ","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"]}

package/dist/collection/components/xpl-button-row/xpl-button-row.js

@@ -116,3 +116,4 @@ export class XplButtonRow {
       }];
   }
 }
+//# sourceMappingURL=xpl-button-row.js.map

package/dist/collection/components/xpl-button-row/xpl-button-row.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"xpl-button-row.js","sourceRoot":"","sources":["../../../../src/components/components/xpl-button-row/xpl-button-row.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,SAAS,EAAE,IAAI,EAAE,CAAC,EAAE,IAAI,EAAE,KAAK,EAAgB,MAAM,eAAe,CAAC;AAK9E,MAAM,OAAO,YAAY;;IA+Bb,cAAS,GAAG,GAAG,EAAE,CAAC,IAAI,CAAC,YAAY,CAAC,IAAI,EAAE,CAAC;IAC3C,gBAAW,GAAG,GAAG,EAAE,CAAC,IAAI,CAAC,cAAc,CAAC,IAAI,EAAE,CAAC;IAC/C,eAAU,GAAG,GAAG,EAAE,CAAC,IAAI,CAAC,aAAa,CAAC,IAAI,EAAE,CAAC;;;;;EAErD,MAAM;IACF,OAAO,CACH,EAAC,IAAI,IAAC,KAAK,EAAC,gBAAgB;MACxB,WAAK,KAAK,EAAC,sBAAsB;QAC7B,WAAK,KAAK,EAAC,sBAAsB,IAC5B,IAAI,CAAC,SAAS,IAAI,CACf,kBACI,OAAO,EAAC,WAAW,EACnB,IAAI,EAAC,QAAQ,EACb,OAAO,EAAE,IAAI,CAAC,WAAW,IAExB,IAAI,CAAC,SAAS,CACN,CAChB,CACC;QACN,WAAK,KAAK,EAAC,uBAAuB;UAC7B,IAAI,CAAC,QAAQ,IAAI,CACd,kBACI,OAAO,EAAC,QAAQ,EAChB,IAAI,EAAC,QAAQ,EACb,OAAO,EAAE,IAAI,CAAC,UAAU,IAEvB,IAAI,CAAC,QAAQ,CACL,CAChB;UACA,IAAI,CAAC,SAAS,IAAI,CACf,kBACI,OAAO,EAAC,WAAW,EACnB,IAAI,EAAC,QAAQ,EACb,OAAO,EAAE,IAAI,CAAC,WAAW,IAExB,IAAI,CAAC,SAAS,CACN,CAChB;UACA,IAAI,CAAC,OAAO,IAAI,CACb,kBACI,KAAK,EAAC,yBAAyB,EAC/B,OAAO,EAAE,IAAI,CAAC,SAAS,IAEtB,IAAI,CAAC,OAAO,CACJ,CAChB,CACC,CACJ,CACH,CACV,CAAC;EACN,CAAC;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CACJ","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"]}

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

@@ -193,3 +193,4 @@ export class XplCheckbox {
       }];
   }
 }
+//# sourceMappingURL=xpl-checkbox.js.map

package/dist/collection/components/xpl-checkbox/xpl-checkbox.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"xpl-checkbox.js","sourceRoot":"","sources":["../../../../src/components/components/xpl-checkbox/xpl-checkbox.tsx"],"names":[],"mappings":"AAAA,OAAO,EACH,SAAS,EACT,IAAI,EACJ,CAAC,EACD,IAAI,EACJ,KAAK,EACL,KAAK,GAER,MAAM,eAAe,CAAC;AACvB,OAAO,EAAE,EAAE,IAAI,IAAI,EAAE,MAAM,MAAM,CAAC;AAKlC,MAAM,OAAO,WAAW;;;;;;;;;;cAUE,IAAI,EAAE;;EAO5B,MAAM;IACF,OAAO,CACH,EAAC,IAAI,IACD,KAAK,EAAE;QACH,8BAA8B,EAAE,IAAI;QACpC,MAAM,EAAE,IAAI,CAAC,MAAM;QACnB,QAAQ,EAAE,IAAI,CAAC,QAAQ;OAC1B;MAED,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,GAAG,EAAE,CACX,IAAI,CAAC,cAAc,CAAC,IAAI,CAAC,IAAI,CAAC,KAAK,CAAC,OAAO,CAAC,EAEhD,IAAI,EAAE,IAAI,CAAC,IAAI,EACf,GAAG,EAAE,CAAC,EAAE,EAAE,EAAE,CAAC,CAAC,IAAI,CAAC,KAAK,GAAG,EAAsB,CAAC,EAClD,QAAQ,EAAE,IAAI,CAAC,QAAQ,EACvB,KAAK,EAAE,IAAI,CAAC,KAAK,GACZ;MACT,aACI,KAAK,EAAE;UACH,WAAW,EAAE,IAAI;UACjB,qBAAqB,EAAE,IAAI,CAAC,QAAQ;SACvC,EACD,OAAO,EAAE,IAAI,CAAC,EAAE;QAEhB,eAAa;QACZ,IAAI,CAAC,WAAW,IAAI,CACjB,aACI,KAAK,EAAE;YACH,iBAAiB,EAAE,IAAI;YACvB,2BAA2B,EAAE,IAAI,CAAC,QAAQ;WAC7C,IAEA,IAAI,CAAC,WAAW,CACb,CACX,CACG,CACL,CACV,CAAC;EACN,CAAC;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CACJ","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"]}

package/dist/collection/components/xpl-choicelist/choice.js

@@ -1 +1,2 @@
 export {};
+//# sourceMappingURL=choice.js.map

package/dist/collection/components/xpl-choicelist/choice.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"choice.js","sourceRoot":"","sources":["../../../../src/components/components/xpl-choicelist/choice.ts"],"names":[],"mappings":"","sourcesContent":["export interface Choice {\n    checked?: boolean;\n    children?: Choice[];\n    description?: string;\n    label?: string;\n}\n"]}

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

@@ -155,3 +155,4 @@ export class XplChoicelist {
     };
   }
 }
+//# sourceMappingURL=xpl-choicelist.js.map

package/dist/collection/components/xpl-choicelist/xpl-choicelist.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"xpl-choicelist.js","sourceRoot":"","sources":["../../../../src/components/components/xpl-choicelist/xpl-choicelist.tsx"],"names":[],"mappings":"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","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"]}

package/dist/collection/components/xpl-content-area/xpl-content-area.js

@@ -33,3 +33,4 @@ export class XplContentArea {
     };
   }
 }
+//# sourceMappingURL=xpl-content-area.js.map

package/dist/collection/components/xpl-content-area/xpl-content-area.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"xpl-content-area.js","sourceRoot":"","sources":["../../../../src/components/components/xpl-content-area/xpl-content-area.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,SAAS,EAAE,IAAI,EAAE,CAAC,EAAE,IAAI,EAAE,MAAM,eAAe,CAAC;AAKzD,MAAM,OAAO,cAAc;;gBAIoB,MAAM;;EAEjD,MAAM;IACF,OAAO,CACH,EAAC,IAAI;MACD,YACI,KAAK,EAAE,sDAAsD,IAAI,CAAC,IAAI,EAAE;QAExE,WAAK,KAAK,EAAC,kBAAkB;UACzB,eAAa,CACX,CACH,CACJ,CACV,CAAC;EACN,CAAC;;;;;;;;;;;;;;;;;;;;;;;;;CACJ","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"]}

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

@@ -31,3 +31,4 @@ export class XplDivider {
     };
   }
 }
+//# sourceMappingURL=xpl-divider.js.map

package/dist/collection/components/xpl-divider/xpl-divider.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"xpl-divider.js","sourceRoot":"","sources":["../../../../src/components/components/xpl-divider/xpl-divider.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,SAAS,EAAE,IAAI,EAAE,CAAC,EAAE,IAAI,EAAE,MAAM,eAAe,CAAC;AAKzD,MAAM,OAAO,UAAU;;;;EAQnB,MAAM;IACF,IAAI,SAAS,GAAG,aAAa,CAAC;IAC9B,SAAS,IAAI,iBAAiB,IAAI,CAAC,IAAI,EAAE,CAAC;IAE1C,OAAO,CACH,EAAC,IAAI,IAAC,KAAK,EAAE,SAAS;MAClB;QACI,eAAa,CACV,CACJ,CACV,CAAC;EACN,CAAC;;;;;;;;;;;;;;;;;;;;;CACJ","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"]}

package/dist/collection/components/xpl-dropdown/dropdownoption.js

@@ -1 +1,2 @@
 export {};
+//# sourceMappingURL=dropdownoption.js.map

package/dist/collection/components/xpl-dropdown/dropdownoption.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"dropdownoption.js","sourceRoot":"","sources":["../../../../src/components/components/xpl-dropdown/dropdownoption.ts"],"names":[],"mappings":"","sourcesContent":["export interface DropdownOption {\n    label: string;\n    value?: string;\n    isSelected?: boolean;\n    isDisabled?: boolean;\n}\n\nexport type DropdownItem = Partial<DropdownOption & DropdownOptionGroup>;\n\nexport interface DropdownOptionGroup {\n    groupName: string;\n    options: DropdownItem[];\n}\n"]}

package/dist/collection/components/xpl-dropdown/xpl-dropdown-group/xpl-dropdown-group.js

@@ -69,3 +69,4 @@ export class XplDropdownGroup {
     };
   }
 }
+//# sourceMappingURL=xpl-dropdown-group.js.map

package/dist/collection/components/xpl-dropdown/xpl-dropdown-group/xpl-dropdown-group.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"xpl-dropdown-group.js","sourceRoot":"","sources":["../../../../../src/components/components/xpl-dropdown/xpl-dropdown-group/xpl-dropdown-group.tsx"],"names":[],"mappings":";;;;;;;;;;;AAAA,OAAO,EAAE,SAAS,EAAE,IAAI,EAAE,CAAC,EAAE,IAAI,EAAE,MAAM,eAAe,CAAC;AAIzD,MAAM,OAAO,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,EAAE,EAAE;YAAhC,EAAE,SAAS,OAAiB,EAAZ,UAAU,cAA1B,aAA4B,CAAF;QACnC,OAAA,SAAS,CAAC,CAAC,CAAC,CACR,wCACI,KAAK,EAAE,SAAS,IACZ,UAAU,EACI,CACzB,CAAC,CAAC,CAAC,CACA,2CAAyB,UAAU,EAAwB,CAC9D,CAAA;OAAA,CACJ,CAAC;IACN,OAAO,CACH,EAAC,IAAI,IAAC,IAAI,EAAC,OAAO,gBAAa,SAAS;MACpC,UAAI,KAAK,EAAC,wBAAwB;QAC9B,4BACI,KAAK,EAAE,SAAS,GACI;QACxB,UAAI,KAAK,EAAC,mBAAmB,IACxB,aAAa,IAAI,YAAM,IAAI,EAAC,SAAS,GAAQ,CAC7C,CACJ,CACF,CACV,CAAC;EACN,CAAC;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CACJ","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"]}

package/dist/collection/components/xpl-dropdown/xpl-dropdown-heading/xpl-dropdown-heading.js

@@ -29,3 +29,4 @@ export class XplDropdownHeading {
     };
   }
 }
+//# sourceMappingURL=xpl-dropdown-heading.js.map

package/dist/collection/components/xpl-dropdown/xpl-dropdown-heading/xpl-dropdown-heading.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"xpl-dropdown-heading.js","sourceRoot":"","sources":["../../../../../src/components/components/xpl-dropdown/xpl-dropdown-heading/xpl-dropdown-heading.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,SAAS,EAAE,IAAI,EAAE,CAAC,EAAE,IAAI,EAAE,MAAM,eAAe,CAAC;AAGzD,MAAM,OAAO,kBAAkB;;;;EAI3B,MAAM;IACF,OAAO,CACH,EAAC,IAAI,IAAC,KAAK,EAAE,EAAE,sBAAsB,EAAE,IAAI,EAAE,EAAE,IAAI,EAAC,cAAc;MAC9D,gBAAO,IAAI,CAAC,KAAK,IAAI,YAAM,IAAI,EAAC,SAAS,GAAQ,CAAQ,CACtD,CACV,CAAC;EACN,CAAC;;;;;;;;;;;;;;;;;;;;;CACJ","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"]}

package/dist/collection/components/xpl-dropdown/xpl-dropdown-option/xpl-dropdown-option.js

@@ -3,6 +3,7 @@ export class XplDropdownOption {
   constructor() {
     this.isDisabled = undefined;
     this.label = undefined;
+    this.value = undefined;
     this.isSelected = undefined;
   }
   componentWillLoad() {
@@ -52,12 +53,12 @@ export class XplDropdownOption {
     this.hostElement.removeEventListener('keyup', this.handleKeyup);
   }
   render() {
-    const { label, isSelected, isDisabled } = this;
+    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 }, h("li", { class: "xpl-dropdown-list-item" }, label || h("slot", { name: "option" }))));
+      }, 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" }))));
   }
   static get is() { return "xpl-dropdown-option"; }
   static get properties() {
@@ -96,9 +97,26 @@ export class XplDropdownOption {
         "attribute": "label",
         "reflect": false
       },
+      "value": {
+        "type": "string",
+        "mutable": false,
+        "complexType": {
+          "original": "string",
+          "resolved": "string",
+          "references": {}
+        },
+        "required": false,
+        "optional": true,
+        "docs": {
+          "tags": [],
+          "text": "The selected options value to be submitted with the form, should this option be selected."
+        },
+        "attribute": "value",
+        "reflect": false
+      },
       "isSelected": {
         "type": "boolean",
-        "mutable": true,
+        "mutable": false,
         "complexType": {
           "original": "boolean",
           "resolved": "boolean",
@@ -111,9 +129,10 @@ export class XplDropdownOption {
           "text": "whether option is selected"
         },
         "attribute": "selected",
-        "reflect": true
+        "reflect": false
       }
     };
   }
   static get elementRef() { return "hostElement"; }
 }
+//# sourceMappingURL=xpl-dropdown-option.js.map

package/dist/collection/components/xpl-dropdown/xpl-dropdown-option/xpl-dropdown-option.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"xpl-dropdown-option.js","sourceRoot":"","sources":["../../../../../src/components/components/xpl-dropdown/xpl-dropdown-option/xpl-dropdown-option.tsx"],"names":[],"mappings":"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","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"]}

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

@@ -10,7 +10,7 @@ var __rest = (this && this.__rest) || function (s, e) {
     }
   return t;
 };
-import { Host, h } from '@stencil/core';
+import { h, Host } from '@stencil/core';
 export class XplDropdown {
   constructor() {
     this.handleClickOutside = ({ target }) => {
@@ -42,7 +42,9 @@ export class XplDropdown {
         ...(curr.groupName ? curr.options : [curr]),
       ], [])
         .forEach((option) => {
-        const isMatch = option.label === component.hostElement.label;
+        const isMatch = (option.value || option.label) ===
+          (component.hostElement.value ||
+            component.hostElement.label);
         if (isSingle) {
           option.isSelected = isMatch;
           component.hostElement.isSelected = option.isSelected;
@@ -210,12 +212,9 @@ export class XplDropdown {
         "type": "unknown",
         "mutable": false,
         "complexType": {
-          "original": "(\n        e: Event,\n        { component }: { component: XplDropdown }\n    ) => void",
-          "resolved": "(e: Event, { component }: { component: XplDropdown; }) => void",
+          "original": "(e, { component }: { component: XplDropdown }) => void",
+          "resolved": "(e: any, { component }: { component: XplDropdown; }) => void",
           "references": {
-            "Event": {
-              "location": "global"
-            },
             "XplDropdown": {
               "location": "global"
             }
@@ -234,7 +233,7 @@ export class XplDropdown {
     return {
       "handleSelect": {
         "complexType": {
-          "signature": "(e: Event, { component }: { component: XplDropdownOption; }) => Promise<void>",
+          "signature": "(e: any, { component }: { component: XplDropdownOption; }) => Promise<void>",
           "parameters": [{
               "tags": [],
               "text": ""
@@ -246,9 +245,6 @@ export class XplDropdown {
             "Promise": {
               "location": "global"
             },
-            "Event": {
-              "location": "global"
-            },
             "XplDropdownOption": {
               "location": "import",
               "path": "./xpl-dropdown-option/xpl-dropdown-option"
@@ -269,3 +265,4 @@ export class XplDropdown {
   }
   static get elementRef() { return "hostElement"; }
 }
+//# sourceMappingURL=xpl-dropdown.js.map

package/dist/collection/components/xpl-dropdown/xpl-dropdown.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"xpl-dropdown.js","sourceRoot":"","sources":["../../../../src/components/components/xpl-dropdown/xpl-dropdown.tsx"],"names":[],"mappings":"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","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"]}

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

@@ -24,3 +24,4 @@ export class XplGrid {
   static get is() { return "xpl-grid"; }
   static get elementRef() { return "container"; }
 }
+//# sourceMappingURL=xpl-grid.js.map

package/dist/collection/components/xpl-grid/xpl-grid.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"xpl-grid.js","sourceRoot":"","sources":["../../../../src/components/components/xpl-grid/xpl-grid.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,SAAS,EAAE,IAAI,EAAE,CAAC,EAAE,OAAO,EAAE,MAAM,eAAe,CAAC;AAK5D,MAAM,OAAO,OAAO;EAGhB,gBAAgB;IACZ,MAAM,KAAK,GAAG,KAAK,CAAC,IAAI,CACpB,IAAI,CAAC,SAAS,CAAC,gBAAgB,CAAC,gBAAgB,CAAC,CACpD,CAAC;IAEF,IAAI,SAAS,GAAG,CAAC,EACb,SAAS,GAAG,CAAC,EACb,SAAS,GAAG,CAAC,EACb,SAAS,GAAG,CAAC,CAAC;IAElB,KAAK,CAAC,OAAO,CAAC,CAAC,IAAI,EAAE,EAAE;MACnB,SAAS,IAAI,CAAC,IAAI,CAAC,YAAY,CAAC,IAAI,CAAC,IAAI,CAAC,CAAC;MAC3C,SAAS,IAAI,CAAC,IAAI,CAAC,YAAY,CAAC,IAAI,CAAC,IAAI,CAAC,CAAC;MAC3C,SAAS,IAAI,CAAC,IAAI,CAAC,YAAY,CAAC,IAAI,CAAC,IAAI,CAAC,CAAC;MAC3C,SAAS,IAAI,CAAC,IAAI,CAAC,YAAY,CAAC,IAAI,CAAC,IAAI,CAAC,CAAC;MAE3C,IAAI,SAAS,GAAG,CAAC,KAAK,CAAC;QACnB,IAAI,CAAC,SAAS,CAAC,GAAG,CAAC,uBAAuB,CAAC,CAAC;MAChD,IAAI,SAAS,GAAG,CAAC,KAAK,CAAC;QACnB,IAAI,CAAC,SAAS,CAAC,GAAG,CAAC,uBAAuB,CAAC,CAAC;MAChD,IAAI,SAAS,GAAG,CAAC,KAAK,CAAC;QACnB,IAAI,CAAC,SAAS,CAAC,GAAG,CAAC,uBAAuB,CAAC,CAAC;MAChD,IAAI,SAAS,GAAG,CAAC,KAAK,CAAC;QACnB,IAAI,CAAC,SAAS,CAAC,GAAG,CAAC,uBAAuB,CAAC,CAAC;IACpD,CAAC,CAAC,CAAC;EACP,CAAC;EAED,MAAM;IACF,OAAO,EAAC,IAAI,IAAC,KAAK,EAAC,UAAU,GAAG,CAAC;EACrC,CAAC;;;CACJ","sourcesContent":["import { Component, Host, h, Element } from '@stencil/core';\n\n@Component({\n    tag: 'xpl-grid',\n})\nexport class XplGrid {\n    @Element() container: HTMLXplGridElement;\n\n    componentDidLoad() {\n        const items = Array.from(\n            this.container.querySelectorAll('.xpl-grid-item')\n        );\n\n        let lgCounter = 0,\n            mdCounter = 0,\n            smCounter = 0,\n            xsCounter = 0;\n\n        items.forEach((item) => {\n            lgCounter += +item.getAttribute('lg') || 6;\n            mdCounter += +item.getAttribute('md') || 6;\n            smCounter += +item.getAttribute('sm') || 6;\n            xsCounter += +item.getAttribute('xs') || 6;\n\n            if (lgCounter % 6 === 0)\n                item.classList.add('xpl-grid-item-lg-last');\n            if (mdCounter % 6 === 0)\n                item.classList.add('xpl-grid-item-md-last');\n            if (smCounter % 6 === 0)\n                item.classList.add('xpl-grid-item-sm-last');\n            if (xsCounter % 6 === 0)\n                item.classList.add('xpl-grid-item-xs-last');\n        });\n    }\n\n    render() {\n        return <Host class=\"xpl-grid\" />;\n    }\n}\n"]}

package/dist/collection/components/xpl-grid-item/xpl-grid-item.js

@@ -92,3 +92,4 @@ export class XplGridItem {
     };
   }
 }
+//# sourceMappingURL=xpl-grid-item.js.map

package/dist/collection/components/xpl-grid-item/xpl-grid-item.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"xpl-grid-item.js","sourceRoot":"","sources":["../../../../src/components/components/xpl-grid-item/xpl-grid-item.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,SAAS,EAAE,IAAI,EAAE,CAAC,EAAE,IAAI,EAAE,MAAM,eAAe,CAAC;AAKzD,MAAM,OAAO,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,OAAO,CACH,EAAC,IAAI,IAAC,KAAK,EAAE,SAAS;MAClB,eAAa,CACV,CACV,CAAC;EACN,CAAC;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CACJ","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"]}

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

@@ -463,3 +463,4 @@ export class XplInput {
     };
   }
 }
+//# sourceMappingURL=xpl-input.js.map

package/dist/collection/components/xpl-input/xpl-input.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"xpl-input.js","sourceRoot":"","sources":["../../../../src/components/components/xpl-input/xpl-input.tsx"],"names":[],"mappings":"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","sourcesContent":["import { Component, Host, h, Prop, State } from '@stencil/core';\nimport { v4 as uuid } from 'uuid';\nimport flatpickr from 'flatpickr';\nimport '../../../font-awesome/fontawesome';\nimport '../../../font-awesome/regular';\n\nconst arrowSvg = (rotate: boolean = false) =>\n    `<svg width=\"8\" height=\"12\" viewBox=\"0 0 8 12\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\"><path d=\"${\n        rotate\n            ? 'M0.557948 5.6813L6.06209 0.132167C6.23831 -0.0440556 6.52327 -0.0440556 6.69949 0.132167L7.44187 0.874551C7.61809 1.05077 7.61809 1.33573 7.44187 1.51195L2.99882 6L7.44187 10.488C7.61809 10.6643 7.61809 10.9492 7.44187 11.1254L6.69949 11.8678C6.52327 12.0441 6.23831 12.0441 6.06209 11.8678L0.557948 6.3187C0.381726 6.14248 0.381726 5.85752 0.557948 5.6813Z'\n            : 'M7.44187 6.3187L1.93773 11.8678C1.76151 12.0441 1.47655 12.0441 1.30033 11.8678L0.557948 11.1254C0.381726 10.9492 0.381726 10.6643 0.557948 10.488L5.001 6L0.557948 1.51195C0.381726 1.33573 0.381726 1.05077 0.557948 0.874551L1.30033 0.132167C1.47655 -0.0440556 1.76151 -0.0440556 1.93773 0.132167L7.44187 5.6813C7.6181 5.85752 7.6181 6.14248 7.44187 6.3187Z'\n    }\" /></svg>`;\n\n@Component({\n    tag: 'xpl-input',\n})\nexport class XplInput {\n    /**\n     * Because `id` is a reserved HTMLElement attribute,\n     * we prefix it with an underscore here so that it\n     * doesn't get automatically applied to the outer container.\n     */\n    @Prop() _id?: string;\n    @Prop() autocomplete?: string;\n    /**\n     * See https://flatpickr.js.org/formatting/\n     */\n    @Prop() dateFormat?: string = 'Y-m-d';\n    /**\n     * Optional text that appears below the input label.\n     */\n    @Prop() description?: string;\n    @Prop() disabled?: boolean;\n    /**\n     * If an empty string (attribute present with no value),\n     * will display visually as an error. If a string is\n     * included, will display visually as an error and include\n     * the value as an error message.\n     */\n    @Prop() error?: string;\n    @Prop() label: string;\n    /**\n     * Only used when `type` = 'number' or 'date'\n     */\n    @Prop() max?: number | string;\n    /**\n     * For multiline inputs, a max. character count will\n     * display along with the current character count,\n     * and will automatically render as an error if the\n     * character count exceeds the max.\n     */\n    @Prop() maxCharacterCount?: number;\n    /**\n     * Only used when `type` = 'number' or 'date'\n     */\n    @Prop() min?: number | string;\n    /**\n     * For datepicker inputs, whether to allow only a single\n     * date or a range of dates. (Multiple non-consecutive\n     * dates planned to be supported in the future.)\n     */\n    @Prop() mode?: 'single' | /* \"multiple\" | */ 'range' = 'single';\n    /**\n     * Whether to render as a singleline text input or\n     * as a multiline textarea. (If `true`, `pre` and `post`\n     * values will be ignored, if present.)\n     */\n    @Prop() multiline?: boolean = false;\n    /**\n     * Most inputs are used in forms, and should have a\n     * `name` associated with the input for handling form data.\n     */\n    @Prop() name?: string;\n    @Prop() placeholder?: string;\n    /**\n     * A string (recommended max 3 characters) that gets shown\n     * visually to the left of (before) the input.\n     */\n    @Prop() post?: string;\n    /**\n     * A string (recommended max 8 characters) that gets shown\n     * visually to the right of (after) the input.\n     */\n    @Prop() pre?: string;\n    @Prop() readonly?: boolean;\n    @Prop() required?: boolean;\n    @Prop() step?: number;\n    @Prop() type?: 'date' | 'text' | 'number' | 'password' = 'text';\n    /**\n     * Including a `value` will prepopulate the input\n     * with the given string.\n     */\n    @Prop() value?: string;\n\n    @State() characterCount: number = 0;\n    @State() passwordVisible: boolean = false;\n\n    private input!: HTMLInputElement | HTMLTextAreaElement;\n\n    private updateCharacterCount() {\n        this.characterCount = this.input.value.length;\n    }\n\n    componentWillLoad() {\n        if (this._id === undefined || this._id === null || this._id === '')\n            this._id = uuid();\n\n        if (this.multiline && this.maxCharacterCount !== undefined) {\n            this.characterCount =\n                this.value !== undefined ? this.value.length : 0;\n        }\n    }\n\n    componentDidLoad() {\n        if (this.type === 'date') {\n            flatpickr(this.input, {\n                allowInput: true,\n                dateFormat: this.dateFormat,\n                defaultDate: this.value,\n                maxDate: this.max,\n                minDate: this.min,\n                mode: this.mode,\n                nextArrow: arrowSvg(),\n                prevArrow: arrowSvg(true),\n            });\n        }\n    }\n\n    render() {\n        let className = 'xpl-input';\n        if (this.disabled) className += ' xpl-input--disabled';\n\n        let hasError = false;\n\n        if (this.error !== undefined) hasError = true;\n        if (\n            this.multiline &&\n            this.maxCharacterCount !== undefined &&\n            this.characterCount > this.maxCharacterCount\n        )\n            hasError = true;\n        if (hasError) className += ' xpl-input--error';\n\n        let type = this.type;\n        if (type === 'password' && this.passwordVisible) {\n            type = 'text';\n        }\n\n        return (\n            <Host class={className}>\n                <label class=\"xpl-input-label\" htmlFor={this._id}>\n                    {this.label}\n                    {this.description && <small>{this.description}</small>}\n                </label>\n                <div class=\"xpl-input-wrapper\">\n                    {this.pre && !this.multiline && (\n                        <label class=\"xpl-input-pre\" htmlFor={this._id}>\n                            {this.pre}\n                        </label>\n                    )}\n                    {!this.multiline ? (\n                        <input\n                            autocomplete={\n                                this.type === 'date' ? 'off' : this.autocomplete\n                            }\n                            disabled={this.disabled}\n                            id={this._id}\n                            max={this.max}\n                            min={this.min}\n                            name={this.name}\n                            placeholder={this.placeholder}\n                            readonly={this.readonly}\n                            ref={(el) => {\n                                this.input = el as HTMLInputElement;\n                            }}\n                            required={this.required}\n                            step={this.step}\n                            type={type}\n                            value={this.value}\n                        />\n                    ) : (\n                        <textarea\n                            disabled={this.disabled}\n                            id={this._id}\n                            name={this.name}\n                            onInput={() => this.updateCharacterCount()}\n                            placeholder={this.placeholder}\n                            readonly={this.readonly}\n                            ref={(el) => {\n                                this.input = el as HTMLTextAreaElement;\n                            }}\n                            required={this.required}\n                        >\n                            {this.value}\n                        </textarea>\n                    )}\n                    {this.type === 'date' && (\n                        <span class=\"xpl-input-calendar\">\n                            <i class=\"far fa-calendar-alt\"></i>\n                        </span>\n                    )}\n                    {this.type === 'password' && (\n                        <button\n                            class=\"xpl-input-password\"\n                            onClick={() => {\n                                this.passwordVisible = !this.passwordVisible;\n                            }}\n                            role=\"presentation\"\n                        >\n                            <span class=\"sr-only\">\n                                Toggle password visibility\n                            </span>\n                            {/* This is a little ugly, but it seems that Font Awesome doesn't handle adding/removing from the DOM very well -- but if both are present in the DOM from the get-go, then we have no problem just conditionally showing/hiding the icons */}\n                            <i\n                                class=\"far fa-eye\"\n                                style={{\n                                    display: this.passwordVisible\n                                        ? 'none'\n                                        : 'block',\n                                }}\n                            ></i>\n                            <i\n                                class=\"far fa-eye-slash\"\n                                style={{\n                                    display: this.passwordVisible\n                                        ? 'block'\n                                        : 'none',\n                                }}\n                            ></i>\n                        </button>\n                    )}\n                    {this.post && !this.multiline && (\n                        <label class=\"xpl-input-post\" htmlFor={this._id}>\n                            {this.post}\n                        </label>\n                    )}\n                    {this.multiline && this.maxCharacterCount !== undefined && (\n                        <span class=\"xpl-input-characters\">\n                            {this.characterCount}/{this.maxCharacterCount}\n                        </span>\n                    )}\n                </div>\n                {this.error !== undefined && this.error.length > 0 && (\n                    <label class=\"xpl-input-error\" htmlFor={this._id}>\n                        <svg\n                            width=\"10\"\n                            height=\"11\"\n                            viewBox=\"0 0 10 11\"\n                            fill=\"none\"\n                            xmlns=\"http://www.w3.org/2000/svg\"\n                        >\n                            <path d=\"M9.84375 5.25C9.84375 2.59375 7.65625 0.40625 5 0.40625C2.32422 0.40625 0.15625 2.59375 0.15625 5.25C0.15625 7.92578 2.32422 10.0938 5 10.0938C7.65625 10.0938 9.84375 7.92578 9.84375 5.25ZM5 6.22656C5.48828 6.22656 5.89844 6.63672 5.89844 7.125C5.89844 7.63281 5.48828 8.02344 5 8.02344C4.49219 8.02344 4.10156 7.63281 4.10156 7.125C4.10156 6.63672 4.49219 6.22656 5 6.22656ZM4.14062 3.00391C4.12109 2.86719 4.23828 2.75 4.375 2.75H5.60547C5.74219 2.75 5.85938 2.86719 5.83984 3.00391L5.70312 5.66016C5.68359 5.79688 5.58594 5.875 5.46875 5.875H4.51172C4.39453 5.875 4.29688 5.79688 4.27734 5.66016L4.14062 3.00391Z\" />\n                        </svg>\n                        {this.error}\n                    </label>\n                )}\n            </Host>\n        );\n    }\n}\n"]}

package/dist/collection/components/xpl-list/listitem.js

@@ -1 +1,2 @@
 export {};
+//# sourceMappingURL=listitem.js.map

package/dist/collection/components/xpl-list/listitem.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"listitem.js","sourceRoot":"","sources":["../../../../src/components/components/xpl-list/listitem.ts"],"names":[],"mappings":"","sourcesContent":["export interface ListItem {\n    avatar?: string;\n    avatars?: string[];\n    badges?:\n        | string[]\n        | {\n              dot?: boolean;\n              text: string;\n              variant?: string;\n          }[];\n    href?: string;\n    title: string;\n    metadata?:\n        | string[]\n        | {\n              icon: string;\n              text: string;\n          }[];\n    subtext?: string;\n}\n"]}

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

@@ -56,3 +56,4 @@ export class XplList {
     };
   }
 }
+//# sourceMappingURL=xpl-list.js.map

package/dist/collection/components/xpl-list/xpl-list.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"xpl-list.js","sourceRoot":"","sources":["../../../../src/components/components/xpl-list/xpl-list.tsx"],"names":[],"mappings":"AAAA,OAAO,EACH,SAAS,EACT,IAAI,EACJ,CAAC,EACD,IAAI,EAEJ,QAAQ,GACX,MAAM,eAAe,CAAC;AACvB,OAAO,mCAAmC,CAAC;AAC3C,OAAO,+BAA+B,CAAC;AAGvC,MAAM,WAAW,GAAkC,CAAC,EAChD,MAAM,EACN,OAAO,EACP,MAAM,EACN,IAAI,EACJ,KAAK,EACL,OAAO,EACP,QAAQ,GACX,EAAE,EAAE;EACD,MAAM,QAAQ,GAAG,OAAO,IAAI,MAAM,IAAI,OAAO,CAAC;EAC9C,MAAM,KAAK,GAAG,CACV,EAAC,QAAQ;IACJ,MAAM;MACH,CAAC,MAAM,CAAC,KAAK,CAAC,CAAC,EAAE,CAAC,CAAC,KAAK,GAAG,IAAI,MAAM,CAAC,KAAK,CAAC,CAAC,EAAE,CAAC,CAAC,KAAK,MAAM,CAAC,CAAC,CAAC,CAC3D,kBAAY,GAAG,EAAE,MAAM,EAAE,IAAI,EAAE,KAAK,GAAe,CACtD,CAAC,CAAC,CAAC,CACA,kBAAY,IAAI,EAAE,KAAK,IAAG,MAAM,CAAc,CACjD,CAAC;IACN,WAAK,KAAK,EAAC,uBAAuB;MAC9B,WAAK,KAAK,EAAC,eAAe;QACtB;UACI,cAAK,KAAK,CAAM;UACf,QAAQ,IAAI,CACT,UAAI,KAAK,EAAC,wBAAwB,IAC7B,QAAQ,CAAC,GAAG,CAAC,CAAC,CAAC,EAAE,EAAE;YAChB,IAAI,OAAO,CAAC,KAAK,QAAQ,EAAE;cACvB,OAAO,cAAK,CAAC,CAAM,CAAC;aACvB;iBAAM;cACH,OAAO,CACH;gBACI,YACI,KAAK,EAAE,UAAU,CAAC,CAAC,IAAI,EAAE,GACrB;gBAAC,GAAG;gBACX,CAAC,CAAC,IAAI,CACN,CACR,CAAC;aACL;UACL,CAAC,CAAC,CACD,CACR,CACC,CACJ;MACL,QAAQ,IAAI,CACT,WAAK,KAAK,EAAC,gBAAgB;QACtB,OAAO,IAAI,CACR,WAAK,KAAK,EAAC,uBAAuB,IAAE,OAAO,CAAO,CACrD;QACA,OAAO,IAAI,CACR,WAAK,KAAK,EAAC,sCAAsC,IAC5C,OAAO,CAAC,GAAG,CAAC,CAAC,CAAC,EAAE,EAAE,CAAC,CAChB,WAAK,GAAG,EAAE,CAAC,EAAE,GAAG,EAAC,EAAE,GAAG,CACzB,CAAC,CACA,CACT;QACA,MAAM;UACH,MAAM,CAAC,GAAG,CAAC,CAAC,CAAC,EAAE,EAAE;YACb,IAAI,OAAO,CAAC,KAAK,QAAQ,EAAE;cACvB,OAAO,qBAAY,CAAC,CAAa,CAAC;aACrC;iBAAM;cACH,OAAO,CACH,iBACI,GAAG,EAAE,CAAC,CAAC,GAAG,EACV,OAAO,EAAE,CAAC,CAAC,OAAO,IAEjB,CAAC,CAAC,IAAI,CACC,CACf,CAAC;aACL;UACL,CAAC,CAAC,CACJ,CACT,CACC,CACC,CACd,CAAC;EACF,OAAO,IAAI,CAAC,CAAC,CAAC,CACV,SAAG,KAAK,EAAC,eAAe,EAAC,IAAI,EAAE,IAAI,IAC9B,KAAK,CACN,CACP,CAAC,CAAC,CAAC,CACA,WAAK,KAAK,EAAC,eAAe,IAAE,KAAK,CAAO,CAC3C,CAAC;AACN,CAAC,CAAC;AAKF,MAAM,OAAO,OAAO;;iBAuBa,EAAE;;EAE/B,MAAM;IACF,OAAO,CACH,EAAC,IAAI,QACA,IAAI,CAAC,KAAK,CAAC,GAAG,CAAC,CAAC,IAAI,EAAE,EAAE,CAAC,CACtB,EAAC,WAAW,oBAAK,IAAI,EAAI,CAC5B,CAAC,CACC,CACV,CAAC;EACN,CAAC;;;;;;;;;;;;;;;;;;;;;;;;;CACJ","sourcesContent":["import {\n    Component,\n    Host,\n    h,\n    Prop,\n    FunctionalComponent,\n    Fragment,\n} from '@stencil/core';\nimport '../../../font-awesome/fontawesome';\nimport '../../../font-awesome/regular';\nimport type { ListItem } from './listitem';\n\nconst ListItemCpt: FunctionalComponent<ListItem> = ({\n    avatar,\n    avatars,\n    badges,\n    href,\n    title,\n    subtext,\n    metadata,\n}) => {\n    const hasRight = avatars || badges || subtext;\n    const inner = (\n        <Fragment>\n            {avatar &&\n                (avatar.slice(0, 1) === '/' || avatar.slice(0, 4) === 'http' ? (\n                    <xpl-avatar src={avatar} name={title}></xpl-avatar>\n                ) : (\n                    <xpl-avatar name={title}>{avatar}</xpl-avatar>\n                ))}\n            <div class=\"xpl-list-item-content\">\n                <div class=\"xpl-list-left\">\n                    <div>\n                        <h4>{title}</h4>\n                        {metadata && (\n                            <ul class=\"xpl-list-item-metadata\">\n                                {metadata.map((d) => {\n                                    if (typeof d === 'string') {\n                                        return <li>{d}</li>;\n                                    } else {\n                                        return (\n                                            <li>\n                                                <span\n                                                    class={`far fa-${d.icon}`}\n                                                ></span>{' '}\n                                                {d.text}\n                                            </li>\n                                        );\n                                    }\n                                })}\n                            </ul>\n                        )}\n                    </div>\n                </div>\n                {hasRight && (\n                    <div class=\"xpl-list-right\">\n                        {subtext && (\n                            <div class=\"xpl-list-item-subtext\">{subtext}</div>\n                        )}\n                        {avatars && (\n                            <div class=\"xpl-avatar-group xpl-avatar-group--s\">\n                                {avatars.map((a) => (\n                                    <img src={a} alt=\"\" />\n                                ))}\n                            </div>\n                        )}\n                        {badges &&\n                            badges.map((b) => {\n                                if (typeof b === 'string') {\n                                    return <xpl-badge>{b}</xpl-badge>;\n                                } else {\n                                    return (\n                                        <xpl-badge\n                                            dot={b.dot}\n                                            variant={b.variant}\n                                        >\n                                            {b.text}\n                                        </xpl-badge>\n                                    );\n                                }\n                            })}\n                    </div>\n                )}\n            </div>\n        </Fragment>\n    );\n    return href ? (\n        <a class=\"xpl-list-item\" href={href}>\n            {inner}\n        </a>\n    ) : (\n        <div class=\"xpl-list-item\">{inner}</div>\n    );\n};\n\n@Component({\n    tag: 'xpl-list',\n})\nexport class XplList {\n    /**\n     * `items` should be an array of objects with the following signature:\n     * {\n     *   avatar?: string;        // The URL of the avatar, or the placeholder initials (ex. \"SPD\").\n     *   avatars?: string[];     // The URLs of multiple avatars to be displayed in a group on the right.\n     *   badges?: string[] | {   // An array of strings or badge-like objects to be displayed as badges\n     *     dot?: boolean;        // in a group on the right. See <xpl-badge> for more details.\n     *     text: string;\n     *     variant?: string;\n     *   }[];\n     *   href?: string;          // A URL, if this list item is meant to link somewhere.\n     *   title: string;          // The text to be displayed for the list item.\n     *   metadata?: string[] | { // An array of strings or strings with icons (reference the allowed\n     *     icon: string;         // Font Awesome icons) to be displayed as metadata below the title.\n     *     text: string;\n     *   }[];\n     *   subtext?: string;       // Subtext to be displayed on the right.\n     * }\n     *\n     * - Note that you should *only use one of* `avatars`, `badges`, or `subtext`, to avoid cluttering\n     *   the right-hand side of the list item.\n     */\n    @Prop() items?: ListItem[] = [];\n\n    render() {\n        return (\n            <Host>\n                {this.items.map((item) => (\n                    <ListItemCpt {...item} />\n                ))}\n            </Host>\n        );\n    }\n}\n"]}

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

@@ -63,3 +63,4 @@ export class XplMainNav {
       }];
   }
 }
+//# sourceMappingURL=xpl-main-nav.js.map

package/dist/collection/components/xpl-main-nav/xpl-main-nav.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"xpl-main-nav.js","sourceRoot":"","sources":["../../../../src/components/components/xpl-main-nav/xpl-main-nav.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,SAAS,EAAE,IAAI,EAAE,CAAC,EAAE,IAAI,EAAE,KAAK,EAAgB,MAAM,eAAe,CAAC;AAK9E,MAAM,OAAO,UAAU;;iBAIsB,SAAS;;EAO1C,eAAe;IACnB,IAAI,CAAC,QAAQ,CAAC,IAAI,CAAC,IAAI,CAAC,KAAK,CAAC,CAAC;EACnC,CAAC;EAED,iBAAiB;IACb,IAAI,CAAC,eAAe,EAAE,CAAC;EAC3B,CAAC;EAED,kBAAkB;IACd,IAAI,CAAC,eAAe,EAAE,CAAC;EAC3B,CAAC;EAED,MAAM;IACF,OAAO,CACH,EAAC,IAAI,IACD,KAAK,EAAE,8BAA8B,IAAI,CAAC,KAAK,EAAE,gBACtC,SAAS;MAEpB;QACI,4BAAmB,gBAAgB;UAC/B,YAAM,IAAI,EAAC,MAAM,GAAQ;UACzB,YAAM,IAAI,EAAC,YAAY,GAAQ,CAC1B;QACT,WAAK,KAAK,EAAC,4BAA4B;UACnC,YAAM,IAAI,EAAC,YAAY,GAAQ,CAC7B;QACN,cACI,KAAK,EAAC,sBAAsB,gBACjB,gBAAgB;UAE3B,YAAM,IAAI,EAAC,QAAQ,GAAQ,CACtB,CACP,CACH,CACV,CAAC;EACN,CAAC;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CACJ","sourcesContent":["import { Component, Host, h, Prop, Event, EventEmitter } from '@stencil/core';\n\n@Component({\n    tag: 'xpl-main-nav',\n})\nexport class XplMainNav {\n    /**\n     * @property {string}  width  - The width of the Main Nav.\n     */\n    @Prop() width: 'default' | 'md' | 'sm' = 'default';\n\n    /**\n     * @event {string} navWidth - Emits the `nav-width` prop set by the user\n     * when the component is attached to the DOM and when the component is updated.\n     */\n    @Event() navWidth: EventEmitter<string>;\n    private navWidthHandler() {\n        this.navWidth.emit(this.width);\n    }\n\n    connectedCallback() {\n        this.navWidthHandler();\n    }\n\n    componentDidUpdate() {\n        this.navWidthHandler();\n    }\n\n    render() {\n        return (\n            <Host\n                class={`xpl-main-nav xpl-main-nav--${this.width}`}\n                aria-label=\"Sidebar\"\n            >\n                <nav>\n                    <header aria-label=\"Sidebar Header\">\n                        <slot name=\"logo\"></slot>\n                        <slot name=\"brand-name\"></slot>\n                    </header>\n                    <div class=\"xpl-main-nav__main_section\">\n                        <slot name=\"navigation\"></slot>\n                    </div>\n                    <footer\n                        class=\"xpl-main-nav__footer\"\n                        aria-label=\"Sidebar Footer\"\n                    >\n                        <slot name=\"footer\"></slot>\n                    </footer>\n                </nav>\n            </Host>\n        );\n    }\n}\n"]}