npm - @nyaruka/temba-components - Versions diffs - 0.29.1 → 0.31.0 - Mend

@nyaruka/temba-components 0.29.1 → 0.31.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.

Files changed (1463) hide show

package/out-tsc/src/list/RunList.js ADDED Viewed

@@ -0,0 +1,317 @@
+import { __decorate } from "tslib";
+import { html } from 'lit';
+import { property } from 'lit/decorators';
+import { capitalize } from '../utils';
+import { TembaList } from './TembaList';
+const FLOW_COLOR = 'rgb(223, 65, 159)';
+export class RunList extends TembaList {
+    constructor() {
+        super();
+        this.responses = true;
+        this.resultKeys = {};
+        this.reverseRefresh = false;
+        this.valueKey = 'uuid';
+        this.hideShadow = true;
+        this.createRenderOption();
+    }
+    firstUpdated(changedProperties) {
+        super.firstUpdated(changedProperties);
+    }
+    updated(changedProperties) {
+        super.updated(changedProperties);
+        if (changedProperties.has('responses') || changedProperties.has('flow')) {
+            if (this.flow) {
+                this.endpoint = `/api/v2/runs.json?flow=${this.flow}${this.responses ? '&responded=1' : ''}`;
+            }
+        }
+        if (changedProperties.has('resultPreview')) {
+            this.createRenderOption();
+        }
+        if (changedProperties.has('results')) {
+            if (this.results) {
+                const select = this.shadowRoot.querySelector('temba-select');
+                select.setOptions(this.results);
+                this.resultKeys = this.results.reduce((current, result) => ({ ...current, [result.key]: result }), {});
+            }
+        }
+    }
+    renderResultPreview(run) {
+        if (this.resultPreview) {
+            const runResult = run.values[this.resultPreview.key];
+            if (runResult) {
+                if (this.resultPreview.categories.length > 1) {
+                    if (runResult.category) {
+                        return runResult.category;
+                    }
+                }
+                else {
+                    return runResult.value;
+                }
+            }
+        }
+        return null;
+    }
+    removeRun(id) {
+        this.items = this.items.filter(run => run.id !== id);
+        this.cursorIndex = Math.min(this.cursorIndex, this.items.length);
+        this.requestUpdate('cursorIndex');
+    }
+    getIcon(run) {
+        let icon = null;
+        if (run.exit_type == 'completed') {
+            icon = html `<temba-icon
+        name="check"
+        style="--icon-color:#666;margin-left:0.5em"
+      />`;
+        }
+        else if (run.exit_type == 'interrupted') {
+            icon = html `<temba-icon
+        name="x-octagon"
+        style="--icon-color:${FLOW_COLOR};margin-left:0.5em"
+      />`;
+        }
+        else if (run.exit_type == 'expired') {
+            icon = html `<temba-icon
+        name="clock"
+        style="--icon-color:${FLOW_COLOR};margin-left:0.5em"
+      />`;
+        }
+        else if (!run.exit_type) {
+            if (run.responded) {
+                icon = html `<temba-icon
+          name="activity"
+          style="--icon-color:var(--color-primary-dark);margin-left:0.5em"
+        />`;
+            }
+            else {
+                icon = html `<temba-icon
+          name="hourglass"
+          style="--icon-color:var(--color-primary-dark);margin-left:0.5em"
+        />`;
+            }
+        }
+        return icon;
+    }
+    createRenderOption() {
+        this.renderOption = (run) => {
+            let statusStyle = '';
+            if (!run.exited_on) {
+                statusStyle = 'font-weight:400;';
+            }
+            if (!run.responded) {
+                statusStyle += '';
+            }
+            return html `
+        <div class="row" style="${statusStyle}display:flex;align-items:center">
+          <div
+            style="width: 12em;white-space:nowrap;overflow: hidden; text-overflow: ellipsis;"
+          >
+            <temba-contact-name
+              name=${run.contact.name}
+              urn=${run.contact.urn}
+              icon-size="15"
+            />
+          </div>
+          <div
+            style="margin: 0em 1em;flex:1;white-space:nowrap; overflow:hidden; text-overflow: ellipsis;"
+          >
+            ${this.renderResultPreview(run)}
+          </div>
+          <div style="flex-shrink:1">
+            ${this.store.getShortDuration(run.modified_on)}
+          </div>
+          ${this.getIcon(run)}
+        </div>
+      `;
+        };
+    }
+    getRefreshEndpoint() {
+        if (this.items.length > 0) {
+            const modifiedOn = this.items[0].modified_on;
+            return this.endpoint + '&after=' + modifiedOn;
+        }
+        return this.endpoint;
+    }
+    toggleResponded() {
+        this.responses = this.shadowRoot.querySelector('#responded').checked;
+    }
+    handleColumnChanged(event) {
+        if (event.target.values.length > 0) {
+            this.resultPreview = event.target.values[0];
+        }
+        else {
+            this.resultPreview = null;
+        }
+    }
+    handleSelected(selected) {
+        this.selectedRun = selected;
+    }
+    getListStyle() {
+        return '';
+    }
+    renderHeader() {
+        return html `
+      <div style="display:flex;width:100%;margin-bottom: 1em;">
+        <div style="flex-grow:1">
+          ${this.results
+            ? html `
+                <temba-select
+                  clearable
+                  placeholder="Result Preview"
+                  @change=${this.handleColumnChanged}
+                />
+              `
+            : null}
+        </div>
+        <div style="margin-left:1em;">
+          <temba-checkbox
+            id="responded"
+            label="Responses Only"
+            checked="true"
+            @click=${this.toggleResponded}
+          />
+        </div>
+      </div>
+      <div
+        style="
+        font-size:0.8em;
+        color:rgba(0,0,0,.4);
+        text-align:right;
+        background:#f9f9f9;
+        border: 1px solid var(--color-widget-border);
+        margin-bottom:-0.5em;
+        padding-bottom: 0.6em;
+        padding-top: 0.3em;
+        padding-right: 4.5em;
+        border-top-right-radius: var(--curvature);
+        border-top-left-radius: var(--curvature)
+    "
+      >
+        Last Updated
+      </div>
+    `;
+    }
+    renderFooter() {
+        if (!this.selectedRun || !this.resultKeys) {
+            return null;
+        }
+        const exitType = this.selectedRun.exit_type;
+        const resultKeys = Object.keys(this.selectedRun.values);
+        return html ` <div
+      style="margin-top: 1.5em; margin-bottom:0.5em;flex-grow:1;border-radius:var(--curvature); border: 1px solid var(--color-widget-border);"
+    >
+      <div style="display:flex;flex-direction:column;">
+        <div
+          style="font-size:1.5em;background:#f9f9f9;padding:.75em;padding-top:.35em;display:flex;align-items:center;border-top-right-radius:var(--curvature);border-top-left-radius:var(--curvature)"
+        >
+          <div>
+            <temba-contact-name
+              style="cursor:pointer"
+              name=${this.selectedRun.contact.name}
+              urn=${this.selectedRun.contact.urn}
+              onclick="goto(event, this)"
+              href="/contact/read/${this.selectedRun.contact.uuid}/"
+            ></temba-contact-name>
+            <div
+              style="display:flex;margin-left:-0.2em;margin-top:0.25em;font-size: 0.65em"
+            >
+              ${this.selectedRun.exit_type
+            ? html `
+                    ${this.getIcon(this.selectedRun)}
+                    <div style="margin-left:0.5em;flex-grow:1">
+                      ${capitalize(this.selectedRun.exit_type)}
+                      ${exitType == 'completed'
+                ? html ` in
+                          ${this.store.getShortDuration(this.selectedRun.created_on, this.selectedRun.exited_on, true)}`
+                : null}
+                      ${exitType == 'interrupted' || exitType == 'expired'
+                ? html ` after
+                          ${this.store.getShortDuration(this.selectedRun.created_on, this.selectedRun.exited_on, true)}`
+                : null}
+                    </div>
+                  `
+            : html `${this.getIcon(this.selectedRun)}
+                    <div style="margin-left:0.5em;flex-grow:1">
+                      Active for
+                      ${this.store.getShortDuration(this.selectedRun.created_on, null, true)}
+                    </div>`}
+            </div>
+          </div>
+          <div style="flex-grow:1"></div>
+          <div style="display:flex;flex-direction: column">
+            <div style="font-size:0.75em">
+              ${new Date(this.selectedRun.created_on).toLocaleString()}
+            </div>
+            <div
+              style="font-size:0.6em;align-self:flex-end;color:#888;line-height:0.75em"
+            >
+              Started
+            </div>
+          </div>
+          <temba-icon
+            clickable
+            style="margin-left:0.75em;"
+            name="trash"
+            onclick="deleteRun(${this.selectedRun.id});"
+          ></temba-icon>
+        </div>
+        ${resultKeys.length > 0
+            ? html `
+              <div
+                style="padding:1em;overflow-y:auto;overflow-x:hidden;max-height:15vh;"
+              >
+                <div
+                  style="display:flex;font-size:1.2em;position:relative;right:0px"
+                >
+                  <div style="flex-grow:1"></div>
+                </div>
+                <table width="100%">
+                  <tr>
+                    <th style="text-align:left" width="25%">Result</th>
+                    <th style="text-align:left" width="25%">Category</th>
+                    <th style="text-align:left">Value</th>
+                  </tr>
+                  ${Object.keys(this.selectedRun.values).map((key) => {
+                const result = this.selectedRun.values[key];
+                const meta = this.resultKeys[key];
+                // if our result is no longer represented in the flow, skip it
+                if (meta) {
+                    return html `<tr>
+                        <td>${result.name}</td>
+                        <td>
+                          ${meta.categories.length > 1 ? result.category : '--'}
+                        </td>
+                        <td>${result.value}</td>
+                      </tr>`;
+                }
+                return null;
+            })}
+                </table>
+              </div>
+            `
+            : null}
+      </div>
+    </div>`;
+    }
+}
+__decorate([
+    property({ type: String })
+], RunList.prototype, "flow", void 0);
+__decorate([
+    property({ type: Object, attribute: false })
+], RunList.prototype, "results", void 0);
+__decorate([
+    property({ type: Boolean })
+], RunList.prototype, "responses", void 0);
+__decorate([
+    property({ type: Object })
+], RunList.prototype, "resultPreview", void 0);
+__decorate([
+    property({ type: Object })
+], RunList.prototype, "selectedRun", void 0);
+//# sourceMappingURL=RunList.js.map

package/out-tsc/src/list/RunList.js.map ADDED Viewed

@@ -0,0 +1 @@

+ {"version":3,"file":"RunList.js","sourceRoot":"","sources":["../../../src/list/RunList.ts"],"names":[],"mappings":"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","sourcesContent":["import { html, TemplateResult } from 'lit';\nimport { property } from 'lit/decorators';\nimport { Checkbox } from '../checkbox/Checkbox';\nimport { Select } from '../select/Select';\nimport { capitalize } from '../utils';\nimport { TembaList } from './TembaList';\n\nconst FLOW_COLOR = 'rgb(223, 65, 159)';\n\nexport class RunList extends TembaList {\n @property({ type: String })\n flow: string;\n\n @property({ type: Object, attribute: false })\n results: any[];\n\n @property({ type: Boolean })\n responses = true;\n\n @property({ type: Object })\n resultPreview: any;\n\n @property({ type: Object })\n selectedRun: any;\n\n private resultKeys = {};\n\n public firstUpdated(changedProperties: Map<string, any>) {\n super.firstUpdated(changedProperties);\n }\n\n public updated(changedProperties: Map<string, any>): void {\n super.updated(changedProperties);\n if (changedProperties.has('responses') || changedProperties.has('flow')) {\n if (this.flow) {\n this.endpoint = `/api/v2/runs.json?flow=${this.flow}${\n this.responses ? '&responded=1' : ''\n }`;\n }\n }\n\n if (changedProperties.has('resultPreview')) {\n this.createRenderOption();\n }\n\n if (changedProperties.has('results')) {\n if (this.results) {\n const select = this.shadowRoot.querySelector('temba-select') as Select;\n select.setOptions(this.results);\n this.resultKeys = this.results.reduce(\n (current, result) => ({ ...current, [result.key]: result }),\n {}\n );\n }\n }\n }\n\n public renderResultPreview(run: any) {\n if (this.resultPreview) {\n const runResult = run.values[this.resultPreview.key];\n if (runResult) {\n if (this.resultPreview.categories.length > 1) {\n if (runResult.category) {\n return runResult.category;\n }\n } else {\n return runResult.value;\n }\n }\n }\n return null;\n }\n\n public removeRun(id: number) {\n this.items = this.items.filter(run => run.id !== id);\n this.cursorIndex = Math.min(this.cursorIndex, this.items.length);\n this.requestUpdate('cursorIndex');\n }\n\n public getIcon(run: any): TemplateResult {\n let icon = null;\n if (run.exit_type == 'completed') {\n icon = html`<temba-icon\n name=\"check\"\n style=\"--icon-color:#666;margin-left:0.5em\"\n />`;\n } else if (run.exit_type == 'interrupted') {\n icon = html`<temba-icon\n name=\"x-octagon\"\n style=\"--icon-color:${FLOW_COLOR};margin-left:0.5em\"\n />`;\n } else if (run.exit_type == 'expired') {\n icon = html`<temba-icon\n name=\"clock\"\n style=\"--icon-color:${FLOW_COLOR};margin-left:0.5em\"\n />`;\n } else if (!run.exit_type) {\n if (run.responded) {\n icon = html`<temba-icon\n name=\"activity\"\n style=\"--icon-color:var(--color-primary-dark);margin-left:0.5em\"\n />`;\n } else {\n icon = html`<temba-icon\n name=\"hourglass\"\n style=\"--icon-color:var(--color-primary-dark);margin-left:0.5em\"\n />`;\n }\n }\n return icon;\n }\n\n public createRenderOption() {\n this.renderOption = (run: any): TemplateResult => {\n let statusStyle = '';\n\n if (!run.exited_on) {\n statusStyle = 'font-weight:400;';\n }\n\n if (!run.responded) {\n statusStyle += '';\n }\n\n return html`\n <div class=\"row\" style=\"${statusStyle}display:flex;align-items:center\">\n <div\n style=\"width: 12em;white-space:nowrap;overflow: hidden; text-overflow: ellipsis;\"\n >\n <temba-contact-name\n name=${run.contact.name}\n urn=${run.contact.urn}\n icon-size=\"15\"\n />\n </div>\n\n <div\n style=\"margin: 0em 1em;flex:1;white-space:nowrap; overflow:hidden; text-overflow: ellipsis;\"\n >\n ${this.renderResultPreview(run)}\n </div>\n\n <div style=\"flex-shrink:1\">\n ${this.store.getShortDuration(run.modified_on)}\n </div>\n ${this.getIcon(run)}\n </div>\n `;\n };\n }\n\n public getRefreshEndpoint() {\n if (this.items.length > 0) {\n const modifiedOn = this.items[0].modified_on;\n return this.endpoint + '&after=' + modifiedOn;\n }\n return this.endpoint;\n }\n\n public toggleResponded() {\n this.responses = (\n this.shadowRoot.querySelector('#responded') as Checkbox\n ).checked;\n }\n\n public handleColumnChanged(event: any) {\n if (event.target.values.length > 0) {\n this.resultPreview = event.target.values[0];\n } else {\n this.resultPreview = null;\n }\n }\n\n public handleSelected(selected: any) {\n this.selectedRun = selected;\n }\n\n public getListStyle(): string {\n return '';\n }\n\n public renderHeader(): TemplateResult {\n return html`\n <div style=\"display:flex;width:100%;margin-bottom: 1em;\">\n <div style=\"flex-grow:1\">\n ${this.results\n ? html`\n <temba-select\n clearable\n placeholder=\"Result Preview\"\n @change=${this.handleColumnChanged}\n />\n `\n : null}\n </div>\n <div style=\"margin-left:1em;\">\n <temba-checkbox\n id=\"responded\"\n label=\"Responses Only\"\n checked=\"true\"\n @click=${this.toggleResponded}\n />\n </div>\n </div>\n <div\n style=\"\n font-size:0.8em;\n color:rgba(0,0,0,.4);\n text-align:right;\n background:#f9f9f9;\n border: 1px solid var(--color-widget-border);\n margin-bottom:-0.5em; \n padding-bottom: 0.6em;\n padding-top: 0.3em;\n padding-right: 4.5em;\n border-top-right-radius: var(--curvature);\n border-top-left-radius: var(--curvature)\n \"\n >\n Last Updated\n </div>\n `;\n }\n\n public renderFooter(): TemplateResult {\n if (!this.selectedRun || !this.resultKeys) {\n return null;\n }\n\n const exitType = this.selectedRun.exit_type;\n const resultKeys = Object.keys(this.selectedRun.values);\n\n return html` <div\n style=\"margin-top: 1.5em; margin-bottom:0.5em;flex-grow:1;border-radius:var(--curvature); border: 1px solid var(--color-widget-border);\"\n >\n <div style=\"display:flex;flex-direction:column;\">\n <div\n style=\"font-size:1.5em;background:#f9f9f9;padding:.75em;padding-top:.35em;display:flex;align-items:center;border-top-right-radius:var(--curvature);border-top-left-radius:var(--curvature)\"\n >\n <div>\n <temba-contact-name\n style=\"cursor:pointer\"\n name=${this.selectedRun.contact.name}\n urn=${this.selectedRun.contact.urn}\n onclick=\"goto(event, this)\"\n href=\"/contact/read/${this.selectedRun.contact.uuid}/\"\n ></temba-contact-name>\n <div\n style=\"display:flex;margin-left:-0.2em;margin-top:0.25em;font-size: 0.65em\"\n >\n ${this.selectedRun.exit_type\n ? html`\n ${this.getIcon(this.selectedRun)}\n <div style=\"margin-left:0.5em;flex-grow:1\">\n ${capitalize(this.selectedRun.exit_type)}\n ${exitType == 'completed'\n ? html` in\n ${this.store.getShortDuration(\n this.selectedRun.created_on,\n this.selectedRun.exited_on,\n true\n )}`\n : null}\n ${exitType == 'interrupted' || exitType == 'expired'\n ? html` after\n ${this.store.getShortDuration(\n this.selectedRun.created_on,\n this.selectedRun.exited_on,\n true\n )}`\n : null}\n </div>\n `\n : html`${this.getIcon(this.selectedRun)}\n <div style=\"margin-left:0.5em;flex-grow:1\">\n Active for\n ${this.store.getShortDuration(\n this.selectedRun.created_on,\n null,\n true\n )}\n </div>`}\n </div>\n </div>\n <div style=\"flex-grow:1\"></div>\n <div style=\"display:flex;flex-direction: column\">\n <div style=\"font-size:0.75em\">\n ${new Date(this.selectedRun.created_on).toLocaleString()}\n </div>\n <div\n style=\"font-size:0.6em;align-self:flex-end;color:#888;line-height:0.75em\"\n >\n Started\n </div>\n </div>\n <temba-icon\n clickable\n style=\"margin-left:0.75em;\"\n name=\"trash\"\n onclick=\"deleteRun(${this.selectedRun.id});\"\n ></temba-icon>\n </div>\n\n ${resultKeys.length > 0\n ? html`\n <div\n style=\"padding:1em;overflow-y:auto;overflow-x:hidden;max-height:15vh;\"\n >\n <div\n style=\"display:flex;font-size:1.2em;position:relative;right:0px\"\n >\n <div style=\"flex-grow:1\"></div>\n </div>\n\n <table width=\"100%\">\n <tr>\n <th style=\"text-align:left\" width=\"25%\">Result</th>\n <th style=\"text-align:left\" width=\"25%\">Category</th>\n <th style=\"text-align:left\">Value</th>\n </tr>\n\n ${Object.keys(this.selectedRun.values).map((key: string) => {\n const result = this.selectedRun.values[key];\n const meta = this.resultKeys[key];\n\n // if our result is no longer represented in the flow, skip it\n if (meta) {\n return html`<tr>\n <td>${result.name}</td>\n <td>\n ${meta.categories.length > 1 ? result.category : '--'}\n </td>\n <td>${result.value}</td>\n </tr>`;\n }\n return null;\n })}\n </table>\n </div>\n `\n : null}\n </div>\n </div>`;\n }\n\n constructor() {\n super();\n this.reverseRefresh = false;\n this.valueKey = 'uuid';\n this.hideShadow = true;\n this.createRenderOption();\n }\n}\n"]}

package/out-tsc/src/list/TembaList.js CHANGED Viewed

@@ -15,19 +15,18 @@ export class TembaList extends RapidElement {
         this.loading = false;
         // changes to the refresh key force a refresh
         this.refreshKey = '0';
+        this.reverseRefresh = true;
         // our next page from our endpoint
         this.nextPage = null;
         this.pages = 0;
         this.pending = [];
         this.refreshInterval = null;
+        this.store = document.querySelector('temba-store');
         this.handleSelection.bind(this);
     }
     static get styles() {
         return css `
       :host {
-        display: block;
-        height: 100%;
-        width: 100%;
       }
       temba-options {
@@ -35,13 +34,6 @@ export class TembaList extends RapidElement {
         width: 100%;
         flex-grow: 1;
       }
-      .wrapper {
-        display: flex;
-        flex-direction: column;
-        height: 100%;
-        align-items: center;
-      }
     `;
     }
     reset() {
@@ -75,7 +67,9 @@ export class TembaList extends RapidElement {
             this.refreshTop();
         }
         if (changedProperties.has('mostRecentItem')) {
-            this.fireCustomEvent(CustomEventType.Refreshed);
+            if (this.mostRecentItem) {
+                this.fireCustomEvent(CustomEventType.Refreshed);
+            }
         }
         if (changedProperties.has('cursorIndex')) {
             if (this.cursorIndex > -1) {
@@ -140,6 +134,10 @@ export class TembaList extends RapidElement {
      * Refreshes the first page, updating any found items in our list
      */
     async refreshTop() {
+        const refreshEndpoint = this.getRefreshEndpoint();
+        if (!refreshEndpoint) {
+            return;
+        }
         // cancel any outstanding requests
         while (this.pending.length > 0) {
             const pending = this.pending.pop();
@@ -164,7 +162,16 @@ export class TembaList extends RapidElement {
                     }
                 });
                 // insert our new items at the front
-                const newItems = [...page.results.reverse(), ...items];
+                let results = page.results;
+                if (this.reverseRefresh) {
+                    results = page.results.reverse();
+                }
+                const newItems = [...results, ...items];
+                const topItem = newItems[0];
+                if (!this.mostRecentItem ||
+                    JSON.stringify(this.mostRecentItem) !== JSON.stringify(topItem)) {
+                    this.mostRecentItem = topItem;
+                }
                 if (prevItem) {
                     const newItem = newItems[this.cursorIndex];
                     const prevValue = this.getValue(prevItem);
@@ -220,6 +227,7 @@ export class TembaList extends RapidElement {
             catch (error) {
                 // aborted
                 this.reset();
+                console.log('error, resetting');
                 return;
             }
             this.nextPage = nextPage;
@@ -290,6 +298,15 @@ export class TembaList extends RapidElement {
             });
         }
     }
+    renderHeader() {
+        return null;
+    }
+    renderFooter() {
+        return null;
+    }
+    getListStyle() {
+        return '';
+    }
     handleSelection(event) {
         const { selected, index } = event.detail;
         this.selected = selected;
@@ -298,10 +315,13 @@ export class TembaList extends RapidElement {
         event.preventDefault();
     }
     render() {
-        return html `<div class="wrapper">
+        return html `
+      ${this.renderHeader()}
       <temba-options
+        style="${this.getListStyle()}"
         ?visible=${true}
         ?block=${true}
+        ?hideShadow=${this.hideShadow}
         ?collapsed=${this.collapsed}
         ?loading=${this.loading}
         .renderOption=${this.renderOption}
@@ -313,7 +333,8 @@ export class TembaList extends RapidElement {
       >
         <slot></slot>
       </temba-options>
-    </div>`;
+      ${this.renderFooter()}
+    `;
     }
 }
 __decorate([
@@ -346,6 +367,9 @@ __decorate([
 __decorate([
     property({ type: Boolean })
 ], TembaList.prototype, "collapsed", void 0);
+__decorate([
+    property({ type: Boolean })
+], TembaList.prototype, "hideShadow", void 0);
 __decorate([
     property({ attribute: false })
 ], TembaList.prototype, "getNextRefresh", void 0);

package/out-tsc/src/list/TembaList.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"TembaList.js","sourceRoot":"","sources":["../../../src/list/TembaList.ts"],"names":[],"mappings":"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","sourcesContent":["import { css, html, TemplateResult } from 'lit';\nimport { property } from 'lit/decorators';\nimport { CustomEventType } from '../interfaces';\nimport { RapidElement } from '../RapidElement';\nimport { fetchResultsPage, ResultsPage } from '../utils';\n\nconst DEFAULT_REFRESH = 10000;\n\nexport class TembaList extends RapidElement {\n @property({ type: Array, attribute: false })\n items: any[] = [];\n\n @property({ type: Object, attribute: false })\n selected: any;\n\n @property({ type: Number })\n cursorIndex = -1;\n\n @property({ type: String })\n endpoint: string;\n\n @property({ type: String })\n nextSelection: any;\n\n @property({ type: Number })\n tabIndex = 1;\n\n @property({ type: String })\n valueKey = 'id';\n\n @property({ type: String })\n value: string;\n\n @property({ type: Boolean })\n loading = false;\n\n @property({ type: Boolean })\n collapsed: boolean;\n\n @property({ attribute: false })\n getNextRefresh: (firstOption: any) => any;\n\n @property({ attribute: false })\n sanitizeOption: (option: any) => any;\n\n @property({ attribute: false })\n renderOption: (option: any, selected: boolean) => TemplateResult;\n\n @property({ attribute: false })\n renderOptionDetail: (option: any, selected: boolean) => TemplateResult;\n\n @property({ attribute: false, type: Object })\n mostRecentItem: any;\n\n // changes to the refresh key force a refresh\n @property({ type: String })\n refreshKey = '0';\n\n // our next page from our endpoint\n nextPage: string = null;\n\n pages = 0;\n clearRefreshTimeout: any;\n pending: AbortController[] = [];\n\n // used for testing only\n preserve: boolean;\n\n // http promise to monitor for completeness\n public httpComplete: Promise<void>;\n\n static get styles() {\n return css`\n :host {\n display: block;\n height: 100%;\n width: 100%;\n }\n\n temba-options {\n display: block;\n width: 100%;\n flex-grow: 1;\n }\n\n .wrapper {\n display: flex;\n flex-direction: column;\n height: 100%;\n align-items: center;\n }\n `;\n }\n\n constructor() {\n super();\n this.handleSelection.bind(this);\n }\n\n private reset(): void {\n this.selected = null;\n this.nextPage = null;\n this.cursorIndex = -1;\n this.mostRecentItem = null;\n this.items = [];\n }\n\n refreshInterval = null;\n\n public connectedCallback() {\n super.connectedCallback();\n this.refreshInterval = setInterval(() => {\n this.refreshKey = 'default_' + new Date().getTime();\n }, DEFAULT_REFRESH);\n }\n\n public disconnectedCallback() {\n clearInterval(this.refreshInterval);\n }\n\n public updated(changedProperties: Map<string, any>) {\n super.updated(changedProperties);\n\n if (changedProperties.has('endpoint') && this.endpoint) {\n // if our tests aren't preserving our properties, reset\n if (!this.preserve) {\n this.reset();\n this.loading = true;\n }\n\n this.httpComplete = this.fetchItems();\n }\n\n if (\n changedProperties.has('refreshKey') &&\n !changedProperties.has('endpoint')\n ) {\n this.refreshTop();\n }\n\n if (changedProperties.has('mostRecentItem')) {\n this.fireCustomEvent(CustomEventType.Refreshed);\n }\n\n if (changedProperties.has('cursorIndex')) {\n if (this.cursorIndex > -1) {\n this.selected = this.items[this.cursorIndex];\n this.handleSelected(this.selected);\n }\n }\n }\n\n // eslint-disable-next-line @typescript-eslint/no-unused-vars\n public handleSelected(selected: any) {\n const evt = new Event('change', { bubbles: true });\n this.dispatchEvent(evt);\n }\n\n private getValue(obj: any): any {\n if (!obj) {\n return null;\n }\n\n const path = this.valueKey.split('.');\n let current = obj;\n while (path.length > 0) {\n const key = path.shift();\n current = current[key];\n }\n return current;\n }\n\n public setSelection(value: string) {\n const index = this.items.findIndex(item => {\n return this.getValue(item) === value;\n });\n this.cursorIndex = index;\n this.selected = this.items[index];\n const evt = new Event('change', { bubbles: true });\n this.dispatchEvent(evt);\n }\n\n public getItemIndex(value: string) {\n return this.items.findIndex(option => this.getValue(option) === value);\n }\n\n public removeItem(value: string) {\n const index = this.getItemIndex(value);\n this.items.splice(index, 1);\n this.items = [...this.items];\n\n // if we were at the end, move us down\n this.cursorIndex = Math.max(\n 0,\n Math.min(this.items.length - 1, this.cursorIndex - 1)\n );\n\n // request a change even if it is the same, the item is different\n this.requestUpdate('cursorIndex');\n this.requestUpdate('items');\n }\n\n public getSelection(): any {\n return this.selected;\n }\n\n public refresh(): void {\n this.refreshKey = 'requested_' + new Date().getTime();\n }\n\n public setEndpoint(endpoint: string, nextSelection: any = null) {\n this.endpoint = endpoint;\n this.nextSelection = nextSelection;\n }\n\n public getRefreshEndpoint() {\n return this.endpoint;\n }\n\n /*\n Refreshes the first page, updating any found items in our list\n */\n private async refreshTop(): Promise<void> {\n // cancel any outstanding requests\n while (this.pending.length > 0) {\n const pending = this.pending.pop();\n pending.abort();\n }\n\n const controller = new AbortController();\n this.pending.push(controller);\n\n const prevItem = this.items[this.cursorIndex];\n\n try {\n const page = await fetchResultsPage(\n this.getRefreshEndpoint(),\n controller\n );\n\n const items = [...this.items];\n // remove any dupes already in our list\n if (page.results) {\n page.results.forEach((newOption: any) => {\n if (this.sanitizeOption) {\n this.sanitizeOption(newOption);\n }\n const newValue = this.getValue(newOption);\n const removeIndex = items.findIndex(\n option => this.getValue(option) === newValue\n );\n\n if (removeIndex > -1) {\n items.splice(removeIndex, 1);\n }\n });\n\n // insert our new items at the front\n const newItems = [...page.results.reverse(), ...items];\n\n if (prevItem) {\n const newItem = newItems[this.cursorIndex];\n const prevValue = this.getValue(prevItem);\n if (prevValue !== this.getValue(newItem)) {\n const newIndex = newItems.findIndex(\n option => this.getValue(option) === prevValue\n );\n this.cursorIndex = newIndex;\n\n // make sure our focused item is visible\n window.setTimeout(() => {\n const options = this.shadowRoot.querySelector('temba-options');\n if (options) {\n const option =\n options.shadowRoot.querySelector('.option.focused');\n option.scrollIntoView({ block: 'end', inline: 'nearest' });\n }\n }, 0);\n }\n }\n\n this.items = newItems;\n }\n } catch (error) {\n console.error(error);\n }\n }\n\n private async fetchItems(): Promise<void> {\n // cancel any outstanding requests\n while (this.pending.length > 0) {\n const pending = this.pending.pop();\n pending.abort();\n }\n\n let endpoint = this.endpoint;\n let pagesToFetch = this.pages \|\| 1;\n let pages = 0;\n let nextPage = null;\n\n let fetchedItems: any[] = [];\n\n while (pagesToFetch > 0 && endpoint) {\n const controller = new AbortController();\n this.pending.push(controller);\n\n try {\n const page = await fetchResultsPage(endpoint, controller);\n\n // sanitize our options if necessary\n if (this.sanitizeOption) {\n page.results.forEach(this.sanitizeOption);\n }\n\n if (page.results) {\n fetchedItems = fetchedItems.concat(page.results);\n }\n\n // save our next pages\n nextPage = page.next;\n endpoint = nextPage;\n pagesToFetch--;\n pages++;\n } catch (error) {\n // aborted\n this.reset();\n return;\n }\n\n this.nextPage = nextPage;\n }\n this.pages = pages;\n\n const topItem = fetchedItems[0];\n if (\n !this.mostRecentItem \|\|\n JSON.stringify(this.mostRecentItem) !== JSON.stringify(topItem)\n ) {\n this.mostRecentItem = topItem;\n }\n\n // see if our cursor needs to move to stay on the same item\n const newItem = fetchedItems[this.cursorIndex];\n\n if (\n !this.nextSelection &&\n this.selected &&\n newItem &&\n this.getValue(newItem) !== this.getValue(this.selected)\n ) {\n const index = fetchedItems.findIndex(item => {\n return this.getValue(item) === this.getValue(this.selected);\n });\n\n // old selection is in the new fetch\n if (index > -1) {\n this.cursorIndex = index;\n }\n // old selection is missing from the new fetch\n else {\n // if our index didn't change, our item still did, fire change\n if (this.cursorIndex === 0) {\n this.requestUpdate('cursorIndex');\n }\n // otherwise select the first item\n else {\n this.cursorIndex = 0;\n }\n }\n }\n\n // save our results\n this.items = fetchedItems;\n this.loading = false;\n this.pending = [];\n\n if (this.nextSelection) {\n this.setSelection(this.nextSelection);\n this.nextSelection = false;\n } else {\n if (this.cursorIndex === -1) {\n this.cursorIndex = 0;\n }\n }\n\n // TODO: Not sure why this is needed\n // this.requestUpdate('cursorIndex');\n\n if (this.value) {\n this.setSelection(this.value);\n this.value = null;\n }\n\n return Promise.resolve();\n }\n\n private handleScrollThreshold() {\n if (this.nextPage && !this.loading) {\n this.loading = true;\n fetchResultsPage(this.nextPage).then((page: ResultsPage) => {\n if (this.sanitizeOption) {\n page.results.forEach(this.sanitizeOption);\n }\n\n this.items = [...this.items, ...page.results];\n this.nextPage = page.next;\n this.pages++;\n this.loading = false;\n });\n }\n }\n\n private handleSelection(event: CustomEvent) {\n const { selected, index } = event.detail;\n\n this.selected = selected;\n this.cursorIndex = index;\n\n event.stopPropagation();\n event.preventDefault();\n }\n\n public render(): TemplateResult {\n return html`<div class=\"wrapper\">\n <temba-options\n ?visible=${true}\n ?block=${true}\n ?collapsed=${this.collapsed}\n ?loading=${this.loading}\n .renderOption=${this.renderOption}\n .renderOptionDetail=${this.renderOptionDetail}\n @temba-scroll-threshold=${this.handleScrollThreshold}\n @temba-selection=${this.handleSelection.bind(this)}\n .options=${this.items}\n .cursorIndex=${this.cursorIndex}\n >\n <slot></slot>\n </temba-options>\n </div>`;\n }\n}\n"]}
1	+ {"version":3,"file":"TembaList.js","sourceRoot":"","sources":["../../../src/list/TembaList.ts"],"names":[],"mappings":";AAAA,OAAO,EAAE,GAAG,EAAE,IAAI,EAAkB,MAAM,KAAK,CAAC;AAChD,OAAO,EAAE,QAAQ,EAAE,MAAM,gBAAgB,CAAC;AAC1C,OAAO,EAAE,eAAe,EAAE,MAAM,eAAe,CAAC;AAChD,OAAO,EAAE,YAAY,EAAE,MAAM,iBAAiB,CAAC;AAE/C,OAAO,EAAE,gBAAgB,EAAe,MAAM,UAAU,CAAC;AAEzD,MAAM,eAAe,GAAG,KAAK,CAAC;AAE9B,MAAM,OAAO,SAAU,SAAQ,YAAY;IAmFzC;QACE,KAAK,EAAE,CAAC;QAlFV,UAAK,GAAU,EAAE,CAAC;QAMlB,gBAAW,GAAG,CAAC,CAAC,CAAC;QASjB,aAAQ,GAAG,CAAC,CAAC;QAGb,aAAQ,GAAG,IAAI,CAAC;QAMhB,YAAO,GAAG,KAAK,CAAC;QAuBhB,6CAA6C;QAE7C,eAAU,GAAG,GAAG,CAAC;QAEjB,mBAAc,GAAG,IAAI,CAAC;QAEtB,kCAAkC;QAClC,aAAQ,GAAW,IAAI,CAAC;QAExB,UAAK,GAAG,CAAC,CAAC;QAEV,YAAO,GAAsB,EAAE,CAAC;QAqChC,oBAAe,GAAG,IAAI,CAAC;QAZrB,IAAI,CAAC,KAAK,GAAG,QAAQ,CAAC,aAAa,CAAC,aAAa,CAAU,CAAC;QAC5D,IAAI,CAAC,eAAe,CAAC,IAAI,CAAC,IAAI,CAAC,CAAC;IAClC,CAAC;IAjBD,MAAM,KAAK,MAAM;QACf,OAAO,GAAG,CAAA;;;;;;;;;KAST,CAAC;IACJ,CAAC;IAQO,KAAK;QACX,IAAI,CAAC,QAAQ,GAAG,IAAI,CAAC;QACrB,IAAI,CAAC,QAAQ,GAAG,IAAI,CAAC;QACrB,IAAI,CAAC,WAAW,GAAG,CAAC,CAAC,CAAC;QACtB,IAAI,CAAC,cAAc,GAAG,IAAI,CAAC;QAC3B,IAAI,CAAC,KAAK,GAAG,EAAE,CAAC;IAClB,CAAC;IAIM,iBAAiB;QACtB,KAAK,CAAC,iBAAiB,EAAE,CAAC;QAC1B,IAAI,CAAC,eAAe,GAAG,WAAW,CAAC,GAAG,EAAE;YACtC,IAAI,CAAC,UAAU,GAAG,UAAU,GAAG,IAAI,IAAI,EAAE,CAAC,OAAO,EAAE,CAAC;QACtD,CAAC,EAAE,eAAe,CAAC,CAAC;IACtB,CAAC;IAEM,oBAAoB;QACzB,aAAa,CAAC,IAAI,CAAC,eAAe,CAAC,CAAC;IACtC,CAAC;IAEM,OAAO,CAAC,iBAAmC;QAChD,KAAK,CAAC,OAAO,CAAC,iBAAiB,CAAC,CAAC;QAEjC,IAAI,iBAAiB,CAAC,GAAG,CAAC,UAAU,CAAC,IAAI,IAAI,CAAC,QAAQ,EAAE;YACtD,uDAAuD;YACvD,IAAI,CAAC,IAAI,CAAC,QAAQ,EAAE;gBAClB,IAAI,CAAC,KAAK,EAAE,CAAC;gBACb,IAAI,CAAC,OAAO,GAAG,IAAI,CAAC;aACrB;YAED,IAAI,CAAC,YAAY,GAAG,IAAI,CAAC,UAAU,EAAE,CAAC;SACvC;QAED,IACE,iBAAiB,CAAC,GAAG,CAAC,YAAY,CAAC;YACnC,CAAC,iBAAiB,CAAC,GAAG,CAAC,UAAU,CAAC,EAClC;YACA,IAAI,CAAC,UAAU,EAAE,CAAC;SACnB;QAED,IAAI,iBAAiB,CAAC,GAAG,CAAC,gBAAgB,CAAC,EAAE;YAC3C,IAAI,IAAI,CAAC,cAAc,EAAE;gBACvB,IAAI,CAAC,eAAe,CAAC,eAAe,CAAC,SAAS,CAAC,CAAC;aACjD;SACF;QAED,IAAI,iBAAiB,CAAC,GAAG,CAAC,aAAa,CAAC,EAAE;YACxC,IAAI,IAAI,CAAC,WAAW,GAAG,CAAC,CAAC,EAAE;gBACzB,IAAI,CAAC,QAAQ,GAAG,IAAI,CAAC,KAAK,CAAC,IAAI,CAAC,WAAW,CAAC,CAAC;gBAC7C,IAAI,CAAC,cAAc,CAAC,IAAI,CAAC,QAAQ,CAAC,CAAC;aACpC;SACF;IACH,CAAC;IAED,6DAA6D;IACtD,cAAc,CAAC,QAAa;QACjC,MAAM,GAAG,GAAG,IAAI,KAAK,CAAC,QAAQ,EAAE,EAAE,OAAO,EAAE,IAAI,EAAE,CAAC,CAAC;QACnD,IAAI,CAAC,aAAa,CAAC,GAAG,CAAC,CAAC;IAC1B,CAAC;IAEO,QAAQ,CAAC,GAAQ;QACvB,IAAI,CAAC,GAAG,EAAE;YACR,OAAO,IAAI,CAAC;SACb;QAED,MAAM,IAAI,GAAG,IAAI,CAAC,QAAQ,CAAC,KAAK,CAAC,GAAG,CAAC,CAAC;QACtC,IAAI,OAAO,GAAG,GAAG,CAAC;QAClB,OAAO,IAAI,CAAC,MAAM,GAAG,CAAC,EAAE;YACtB,MAAM,GAAG,GAAG,IAAI,CAAC,KAAK,EAAE,CAAC;YACzB,OAAO,GAAG,OAAO,CAAC,GAAG,CAAC,CAAC;SACxB;QACD,OAAO,OAAO,CAAC;IACjB,CAAC;IAEM,YAAY,CAAC,KAAa;QAC/B,MAAM,KAAK,GAAG,IAAI,CAAC,KAAK,CAAC,SAAS,CAAC,IAAI,CAAC,EAAE;YACxC,OAAO,IAAI,CAAC,QAAQ,CAAC,IAAI,CAAC,KAAK,KAAK,CAAC;QACvC,CAAC,CAAC,CAAC;QACH,IAAI,CAAC,WAAW,GAAG,KAAK,CAAC;QACzB,IAAI,CAAC,QAAQ,GAAG,IAAI,CAAC,KAAK,CAAC,KAAK,CAAC,CAAC;QAClC,MAAM,GAAG,GAAG,IAAI,KAAK,CAAC,QAAQ,EAAE,EAAE,OAAO,EAAE,IAAI,EAAE,CAAC,CAAC;QACnD,IAAI,CAAC,aAAa,CAAC,GAAG,CAAC,CAAC;IAC1B,CAAC;IAEM,YAAY,CAAC,KAAa;QAC/B,OAAO,IAAI,CAAC,KAAK,CAAC,SAAS,CAAC,MAAM,CAAC,EAAE,CAAC,IAAI,CAAC,QAAQ,CAAC,MAAM,CAAC,KAAK,KAAK,CAAC,CAAC;IACzE,CAAC;IAEM,UAAU,CAAC,KAAa;QAC7B,MAAM,KAAK,GAAG,IAAI,CAAC,YAAY,CAAC,KAAK,CAAC,CAAC;QACvC,IAAI,CAAC,KAAK,CAAC,MAAM,CAAC,KAAK,EAAE,CAAC,CAAC,CAAC;QAC5B,IAAI,CAAC,KAAK,GAAG,CAAC,GAAG,IAAI,CAAC,KAAK,CAAC,CAAC;QAE7B,sCAAsC;QACtC,IAAI,CAAC,WAAW,GAAG,IAAI,CAAC,GAAG,CACzB,CAAC,EACD,IAAI,CAAC,GAAG,CAAC,IAAI,CAAC,KAAK,CAAC,MAAM,GAAG,CAAC,EAAE,IAAI,CAAC,WAAW,GAAG,CAAC,CAAC,CACtD,CAAC;QAEF,iEAAiE;QACjE,IAAI,CAAC,aAAa,CAAC,aAAa,CAAC,CAAC;QAClC,IAAI,CAAC,aAAa,CAAC,OAAO,CAAC,CAAC;IAC9B,CAAC;IAEM,YAAY;QACjB,OAAO,IAAI,CAAC,QAAQ,CAAC;IACvB,CAAC;IAEM,OAAO;QACZ,IAAI,CAAC,UAAU,GAAG,YAAY,GAAG,IAAI,IAAI,EAAE,CAAC,OAAO,EAAE,CAAC;IACxD,CAAC;IAEM,WAAW,CAAC,QAAgB,EAAE,gBAAqB,IAAI;QAC5D,IAAI,CAAC,QAAQ,GAAG,QAAQ,CAAC;QACzB,IAAI,CAAC,aAAa,GAAG,aAAa,CAAC;IACrC,CAAC;IAEM,kBAAkB;QACvB,OAAO,IAAI,CAAC,QAAQ,CAAC;IACvB,CAAC;IAED;;OAEG;IACK,KAAK,CAAC,UAAU;QACtB,MAAM,eAAe,GAAG,IAAI,CAAC,kBAAkB,EAAE,CAAC;QAClD,IAAI,CAAC,eAAe,EAAE;YACpB,OAAO;SACR;QAED,kCAAkC;QAClC,OAAO,IAAI,CAAC,OAAO,CAAC,MAAM,GAAG,CAAC,EAAE;YAC9B,MAAM,OAAO,GAAG,IAAI,CAAC,OAAO,CAAC,GAAG,EAAE,CAAC;YACnC,OAAO,CAAC,KAAK,EAAE,CAAC;SACjB;QAED,MAAM,UAAU,GAAG,IAAI,eAAe,EAAE,CAAC;QACzC,IAAI,CAAC,OAAO,CAAC,IAAI,CAAC,UAAU,CAAC,CAAC;QAE9B,MAAM,QAAQ,GAAG,IAAI,CAAC,KAAK,CAAC,IAAI,CAAC,WAAW,CAAC,CAAC;QAE9C,IAAI;YACF,MAAM,IAAI,GAAG,MAAM,gBAAgB,CACjC,IAAI,CAAC,kBAAkB,EAAE,EACzB,UAAU,CACX,CAAC;YAEF,MAAM,KAAK,GAAG,CAAC,GAAG,IAAI,CAAC,KAAK,CAAC,CAAC;YAC9B,uCAAuC;YACvC,IAAI,IAAI,CAAC,OAAO,EAAE;gBAChB,IAAI,CAAC,OAAO,CAAC,OAAO,CAAC,CAAC,SAAc,EAAE,EAAE;oBACtC,IAAI,IAAI,CAAC,cAAc,EAAE;wBACvB,IAAI,CAAC,cAAc,CAAC,SAAS,CAAC,CAAC;qBAChC;oBACD,MAAM,QAAQ,GAAG,IAAI,CAAC,QAAQ,CAAC,SAAS,CAAC,CAAC;oBAC1C,MAAM,WAAW,GAAG,KAAK,CAAC,SAAS,CACjC,MAAM,CAAC,EAAE,CAAC,IAAI,CAAC,QAAQ,CAAC,MAAM,CAAC,KAAK,QAAQ,CAC7C,CAAC;oBAEF,IAAI,WAAW,GAAG,CAAC,CAAC,EAAE;wBACpB,KAAK,CAAC,MAAM,CAAC,WAAW,EAAE,CAAC,CAAC,CAAC;qBAC9B;gBACH,CAAC,CAAC,CAAC;gBAEH,oCAAoC;gBACpC,IAAI,OAAO,GAAG,IAAI,CAAC,OAAO,CAAC;gBAC3B,IAAI,IAAI,CAAC,cAAc,EAAE;oBACvB,OAAO,GAAG,IAAI,CAAC,OAAO,CAAC,OAAO,EAAE,CAAC;iBAClC;gBACD,MAAM,QAAQ,GAAG,CAAC,GAAG,OAAO,EAAE,GAAG,KAAK,CAAC,CAAC;gBAExC,MAAM,OAAO,GAAG,QAAQ,CAAC,CAAC,CAAC,CAAC;gBAC5B,IACE,CAAC,IAAI,CAAC,cAAc;oBACpB,IAAI,CAAC,SAAS,CAAC,IAAI,CAAC,cAAc,CAAC,KAAK,IAAI,CAAC,SAAS,CAAC,OAAO,CAAC,EAC/D;oBACA,IAAI,CAAC,cAAc,GAAG,OAAO,CAAC;iBAC/B;gBAED,IAAI,QAAQ,EAAE;oBACZ,MAAM,OAAO,GAAG,QAAQ,CAAC,IAAI,CAAC,WAAW,CAAC,CAAC;oBAC3C,MAAM,SAAS,GAAG,IAAI,CAAC,QAAQ,CAAC,QAAQ,CAAC,CAAC;oBAC1C,IAAI,SAAS,KAAK,IAAI,CAAC,QAAQ,CAAC,OAAO,CAAC,EAAE;wBACxC,MAAM,QAAQ,GAAG,QAAQ,CAAC,SAAS,CACjC,MAAM,CAAC,EAAE,CAAC,IAAI,CAAC,QAAQ,CAAC,MAAM,CAAC,KAAK,SAAS,CAC9C,CAAC;wBACF,IAAI,CAAC,WAAW,GAAG,QAAQ,CAAC;wBAE5B,wCAAwC;wBACxC,MAAM,CAAC,UAAU,CAAC,GAAG,EAAE;4BACrB,MAAM,OAAO,GAAG,IAAI,CAAC,UAAU,CAAC,aAAa,CAAC,eAAe,CAAC,CAAC;4BAC/D,IAAI,OAAO,EAAE;gCACX,MAAM,MAAM,GACV,OAAO,CAAC,UAAU,CAAC,aAAa,CAAC,iBAAiB,CAAC,CAAC;gCACtD,MAAM,CAAC,cAAc,CAAC,EAAE,KAAK,EAAE,KAAK,EAAE,MAAM,EAAE,SAAS,EAAE,CAAC,CAAC;6BAC5D;wBACH,CAAC,EAAE,CAAC,CAAC,CAAC;qBACP;iBACF;gBAED,IAAI,CAAC,KAAK,GAAG,QAAQ,CAAC;aACvB;SACF;QAAC,OAAO,KAAK,EAAE;YACd,OAAO,CAAC,KAAK,CAAC,KAAK,CAAC,CAAC;SACtB;IACH,CAAC;IAEO,KAAK,CAAC,UAAU;QACtB,kCAAkC;QAClC,OAAO,IAAI,CAAC,OAAO,CAAC,MAAM,GAAG,CAAC,EAAE;YAC9B,MAAM,OAAO,GAAG,IAAI,CAAC,OAAO,CAAC,GAAG,EAAE,CAAC;YACnC,OAAO,CAAC,KAAK,EAAE,CAAC;SACjB;QAED,IAAI,QAAQ,GAAG,IAAI,CAAC,QAAQ,CAAC;QAC7B,IAAI,YAAY,GAAG,IAAI,CAAC,KAAK,IAAI,CAAC,CAAC;QACnC,IAAI,KAAK,GAAG,CAAC,CAAC;QACd,IAAI,QAAQ,GAAG,IAAI,CAAC;QAEpB,IAAI,YAAY,GAAU,EAAE,CAAC;QAE7B,OAAO,YAAY,GAAG,CAAC,IAAI,QAAQ,EAAE;YACnC,MAAM,UAAU,GAAG,IAAI,eAAe,EAAE,CAAC;YACzC,IAAI,CAAC,OAAO,CAAC,IAAI,CAAC,UAAU,CAAC,CAAC;YAE9B,IAAI;gBACF,MAAM,IAAI,GAAG,MAAM,gBAAgB,CAAC,QAAQ,EAAE,UAAU,CAAC,CAAC;gBAE1D,oCAAoC;gBACpC,IAAI,IAAI,CAAC,cAAc,EAAE;oBACvB,IAAI,CAAC,OAAO,CAAC,OAAO,CAAC,IAAI,CAAC,cAAc,CAAC,CAAC;iBAC3C;gBAED,IAAI,IAAI,CAAC,OAAO,EAAE;oBAChB,YAAY,GAAG,YAAY,CAAC,MAAM,CAAC,IAAI,CAAC,OAAO,CAAC,CAAC;iBAClD;gBAED,sBAAsB;gBACtB,QAAQ,GAAG,IAAI,CAAC,IAAI,CAAC;gBACrB,QAAQ,GAAG,QAAQ,CAAC;gBACpB,YAAY,EAAE,CAAC;gBACf,KAAK,EAAE,CAAC;aACT;YAAC,OAAO,KAAK,EAAE;gBACd,UAAU;gBACV,IAAI,CAAC,KAAK,EAAE,CAAC;gBAEb,OAAO,CAAC,GAAG,CAAC,kBAAkB,CAAC,CAAC;gBAChC,OAAO;aACR;YAED,IAAI,CAAC,QAAQ,GAAG,QAAQ,CAAC;SAC1B;QACD,IAAI,CAAC,KAAK,GAAG,KAAK,CAAC;QAEnB,MAAM,OAAO,GAAG,YAAY,CAAC,CAAC,CAAC,CAAC;QAChC,IACE,CAAC,IAAI,CAAC,cAAc;YACpB,IAAI,CAAC,SAAS,CAAC,IAAI,CAAC,cAAc,CAAC,KAAK,IAAI,CAAC,SAAS,CAAC,OAAO,CAAC,EAC/D;YACA,IAAI,CAAC,cAAc,GAAG,OAAO,CAAC;SAC/B;QAED,2DAA2D;QAC3D,MAAM,OAAO,GAAG,YAAY,CAAC,IAAI,CAAC,WAAW,CAAC,CAAC;QAE/C,IACE,CAAC,IAAI,CAAC,aAAa;YACnB,IAAI,CAAC,QAAQ;YACb,OAAO;YACP,IAAI,CAAC,QAAQ,CAAC,OAAO,CAAC,KAAK,IAAI,CAAC,QAAQ,CAAC,IAAI,CAAC,QAAQ,CAAC,EACvD;YACA,MAAM,KAAK,GAAG,YAAY,CAAC,SAAS,CAAC,IAAI,CAAC,EAAE;gBAC1C,OAAO,IAAI,CAAC,QAAQ,CAAC,IAAI,CAAC,KAAK,IAAI,CAAC,QAAQ,CAAC,IAAI,CAAC,QAAQ,CAAC,CAAC;YAC9D,CAAC,CAAC,CAAC;YAEH,oCAAoC;YACpC,IAAI,KAAK,GAAG,CAAC,CAAC,EAAE;gBACd,IAAI,CAAC,WAAW,GAAG,KAAK,CAAC;aAC1B;YACD,8CAA8C;iBACzC;gBACH,8DAA8D;gBAC9D,IAAI,IAAI,CAAC,WAAW,KAAK,CAAC,EAAE;oBAC1B,IAAI,CAAC,aAAa,CAAC,aAAa,CAAC,CAAC;iBACnC;gBACD,kCAAkC;qBAC7B;oBACH,IAAI,CAAC,WAAW,GAAG,CAAC,CAAC;iBACtB;aACF;SACF;QAED,mBAAmB;QACnB,IAAI,CAAC,KAAK,GAAG,YAAY,CAAC;QAC1B,IAAI,CAAC,OAAO,GAAG,KAAK,CAAC;QACrB,IAAI,CAAC,OAAO,GAAG,EAAE,CAAC;QAElB,IAAI,IAAI,CAAC,aAAa,EAAE;YACtB,IAAI,CAAC,YAAY,CAAC,IAAI,CAAC,aAAa,CAAC,CAAC;YACtC,IAAI,CAAC,aAAa,GAAG,KAAK,CAAC;SAC5B;aAAM;YACL,IAAI,IAAI,CAAC,WAAW,KAAK,CAAC,CAAC,EAAE;gBAC3B,IAAI,CAAC,WAAW,GAAG,CAAC,CAAC;aACtB;SACF;QAED,oCAAoC;QACpC,qCAAqC;QAErC,IAAI,IAAI,CAAC,KAAK,EAAE;YACd,IAAI,CAAC,YAAY,CAAC,IAAI,CAAC,KAAK,CAAC,CAAC;YAC9B,IAAI,CAAC,KAAK,GAAG,IAAI,CAAC;SACnB;QAED,OAAO,OAAO,CAAC,OAAO,EAAE,CAAC;IAC3B,CAAC;IAEO,qBAAqB;QAC3B,IAAI,IAAI,CAAC,QAAQ,IAAI,CAAC,IAAI,CAAC,OAAO,EAAE;YAClC,IAAI,CAAC,OAAO,GAAG,IAAI,CAAC;YACpB,gBAAgB,CAAC,IAAI,CAAC,QAAQ,CAAC,CAAC,IAAI,CAAC,CAAC,IAAiB,EAAE,EAAE;gBACzD,IAAI,IAAI,CAAC,cAAc,EAAE;oBACvB,IAAI,CAAC,OAAO,CAAC,OAAO,CAAC,IAAI,CAAC,cAAc,CAAC,CAAC;iBAC3C;gBAED,IAAI,CAAC,KAAK,GAAG,CAAC,GAAG,IAAI,CAAC,KAAK,EAAE,GAAG,IAAI,CAAC,OAAO,CAAC,CAAC;gBAC9C,IAAI,CAAC,QAAQ,GAAG,IAAI,CAAC,IAAI,CAAC;gBAC1B,IAAI,CAAC,KAAK,EAAE,CAAC;gBACb,IAAI,CAAC,OAAO,GAAG,KAAK,CAAC;YACvB,CAAC,CAAC,CAAC;SACJ;IACH,CAAC;IAEM,YAAY;QACjB,OAAO,IAAI,CAAC;IACd,CAAC;IAEM,YAAY;QACjB,OAAO,IAAI,CAAC;IACd,CAAC;IAEM,YAAY;QACjB,OAAO,EAAE,CAAC;IACZ,CAAC;IAEO,eAAe,CAAC,KAAkB;QACxC,MAAM,EAAE,QAAQ,EAAE,KAAK,EAAE,GAAG,KAAK,CAAC,MAAM,CAAC;QAEzC,IAAI,CAAC,QAAQ,GAAG,QAAQ,CAAC;QACzB,IAAI,CAAC,WAAW,GAAG,KAAK,CAAC;QAEzB,KAAK,CAAC,eAAe,EAAE,CAAC;QACxB,KAAK,CAAC,cAAc,EAAE,CAAC;IACzB,CAAC;IAEM,MAAM;QACX,OAAO,IAAI,CAAA;QACP,IAAI,CAAC,YAAY,EAAE;;iBAEV,IAAI,CAAC,YAAY,EAAE;mBACjB,IAAI;iBACN,IAAI;sBACC,IAAI,CAAC,UAAU;qBAChB,IAAI,CAAC,SAAS;mBAChB,IAAI,CAAC,OAAO;wBACP,IAAI,CAAC,YAAY;8BACX,IAAI,CAAC,kBAAkB;kCACnB,IAAI,CAAC,qBAAqB;2BACjC,IAAI,CAAC,eAAe,CAAC,IAAI,CAAC,IAAI,CAAC;mBACvC,IAAI,CAAC,KAAK;uBACN,IAAI,CAAC,WAAW;;;;QAI/B,IAAI,CAAC,YAAY,EAAE;KACtB,CAAC;IACJ,CAAC;CACF;AAjdC;IADC,QAAQ,CAAC,EAAE,IAAI,EAAE,KAAK,EAAE,SAAS,EAAE,KAAK,EAAE,CAAC;wCAC1B;AAGlB;IADC,QAAQ,CAAC,EAAE,IAAI,EAAE,MAAM,EAAE,SAAS,EAAE,KAAK,EAAE,CAAC;2CAC/B;AAGd;IADC,QAAQ,CAAC,EAAE,IAAI,EAAE,MAAM,EAAE,CAAC;8CACV;AAGjB;IADC,QAAQ,CAAC,EAAE,IAAI,EAAE,MAAM,EAAE,CAAC;2CACV;AAGjB;IADC,QAAQ,CAAC,EAAE,IAAI,EAAE,MAAM,EAAE,CAAC;gDACR;AAGnB;IADC,QAAQ,CAAC,EAAE,IAAI,EAAE,MAAM,EAAE,CAAC;2CACd;AAGb;IADC,QAAQ,CAAC,EAAE,IAAI,EAAE,MAAM,EAAE,CAAC;2CACX;AAGhB;IADC,QAAQ,CAAC,EAAE,IAAI,EAAE,MAAM,EAAE,CAAC;wCACb;AAGd;IADC,QAAQ,CAAC,EAAE,IAAI,EAAE,OAAO,EAAE,CAAC;0CACZ;AAGhB;IADC,QAAQ,CAAC,EAAE,IAAI,EAAE,OAAO,EAAE,CAAC;4CACT;AAGnB;IADC,QAAQ,CAAC,EAAE,IAAI,EAAE,OAAO,EAAE,CAAC;6CACR;AAGpB;IADC,QAAQ,CAAC,EAAE,SAAS,EAAE,KAAK,EAAE,CAAC;iDACW;AAG1C;IADC,QAAQ,CAAC,EAAE,SAAS,EAAE,KAAK,EAAE,CAAC;iDACM;AAGrC;IADC,QAAQ,CAAC,EAAE,SAAS,EAAE,KAAK,EAAE,CAAC;+CACkC;AAGjE;IADC,QAAQ,CAAC,EAAE,SAAS,EAAE,KAAK,EAAE,CAAC;qDACwC;AAGvE;IADC,QAAQ,CAAC,EAAE,SAAS,EAAE,KAAK,EAAE,IAAI,EAAE,MAAM,EAAE,CAAC;iDACzB;AAIpB;IADC,QAAQ,CAAC,EAAE,IAAI,EAAE,MAAM,EAAE,CAAC;6CACV","sourcesContent":["import { css, html, TemplateResult } from 'lit';\nimport { property } from 'lit/decorators';\nimport { CustomEventType } from '../interfaces';\nimport { RapidElement } from '../RapidElement';\nimport { Store } from '../store/Store';\nimport { fetchResultsPage, ResultsPage } from '../utils';\n\nconst DEFAULT_REFRESH = 10000;\n\nexport class TembaList extends RapidElement {\n @property({ type: Array, attribute: false })\n items: any[] = [];\n\n @property({ type: Object, attribute: false })\n selected: any;\n\n @property({ type: Number })\n cursorIndex = -1;\n\n @property({ type: String })\n endpoint: string;\n\n @property({ type: String })\n nextSelection: any;\n\n @property({ type: Number })\n tabIndex = 1;\n\n @property({ type: String })\n valueKey = 'id';\n\n @property({ type: String })\n value: string;\n\n @property({ type: Boolean })\n loading = false;\n\n @property({ type: Boolean })\n collapsed: boolean;\n\n @property({ type: Boolean })\n hideShadow: boolean;\n\n @property({ attribute: false })\n getNextRefresh: (firstOption: any) => any;\n\n @property({ attribute: false })\n sanitizeOption: (option: any) => any;\n\n @property({ attribute: false })\n renderOption: (option: any, selected: boolean) => TemplateResult;\n\n @property({ attribute: false })\n renderOptionDetail: (option: any, selected: boolean) => TemplateResult;\n\n @property({ attribute: false, type: Object })\n mostRecentItem: any;\n\n // changes to the refresh key force a refresh\n @property({ type: String })\n refreshKey = '0';\n\n reverseRefresh = true;\n\n // our next page from our endpoint\n nextPage: string = null;\n\n pages = 0;\n clearRefreshTimeout: any;\n pending: AbortController[] = [];\n\n store: Store;\n\n // used for testing only\n preserve: boolean;\n\n // http promise to monitor for completeness\n public httpComplete: Promise<void>;\n\n static get styles() {\n return css`\n :host {\n }\n\n temba-options {\n display: block;\n width: 100%;\n flex-grow: 1;\n }\n `;\n }\n\n constructor() {\n super();\n this.store = document.querySelector('temba-store') as Store;\n this.handleSelection.bind(this);\n }\n\n private reset(): void {\n this.selected = null;\n this.nextPage = null;\n this.cursorIndex = -1;\n this.mostRecentItem = null;\n this.items = [];\n }\n\n refreshInterval = null;\n\n public connectedCallback() {\n super.connectedCallback();\n this.refreshInterval = setInterval(() => {\n this.refreshKey = 'default_' + new Date().getTime();\n }, DEFAULT_REFRESH);\n }\n\n public disconnectedCallback() {\n clearInterval(this.refreshInterval);\n }\n\n public updated(changedProperties: Map<string, any>) {\n super.updated(changedProperties);\n\n if (changedProperties.has('endpoint') && this.endpoint) {\n // if our tests aren't preserving our properties, reset\n if (!this.preserve) {\n this.reset();\n this.loading = true;\n }\n\n this.httpComplete = this.fetchItems();\n }\n\n if (\n changedProperties.has('refreshKey') &&\n !changedProperties.has('endpoint')\n ) {\n this.refreshTop();\n }\n\n if (changedProperties.has('mostRecentItem')) {\n if (this.mostRecentItem) {\n this.fireCustomEvent(CustomEventType.Refreshed);\n }\n }\n\n if (changedProperties.has('cursorIndex')) {\n if (this.cursorIndex > -1) {\n this.selected = this.items[this.cursorIndex];\n this.handleSelected(this.selected);\n }\n }\n }\n\n // eslint-disable-next-line @typescript-eslint/no-unused-vars\n public handleSelected(selected: any) {\n const evt = new Event('change', { bubbles: true });\n this.dispatchEvent(evt);\n }\n\n private getValue(obj: any): any {\n if (!obj) {\n return null;\n }\n\n const path = this.valueKey.split('.');\n let current = obj;\n while (path.length > 0) {\n const key = path.shift();\n current = current[key];\n }\n return current;\n }\n\n public setSelection(value: string) {\n const index = this.items.findIndex(item => {\n return this.getValue(item) === value;\n });\n this.cursorIndex = index;\n this.selected = this.items[index];\n const evt = new Event('change', { bubbles: true });\n this.dispatchEvent(evt);\n }\n\n public getItemIndex(value: string) {\n return this.items.findIndex(option => this.getValue(option) === value);\n }\n\n public removeItem(value: string) {\n const index = this.getItemIndex(value);\n this.items.splice(index, 1);\n this.items = [...this.items];\n\n // if we were at the end, move us down\n this.cursorIndex = Math.max(\n 0,\n Math.min(this.items.length - 1, this.cursorIndex - 1)\n );\n\n // request a change even if it is the same, the item is different\n this.requestUpdate('cursorIndex');\n this.requestUpdate('items');\n }\n\n public getSelection(): any {\n return this.selected;\n }\n\n public refresh(): void {\n this.refreshKey = 'requested_' + new Date().getTime();\n }\n\n public setEndpoint(endpoint: string, nextSelection: any = null) {\n this.endpoint = endpoint;\n this.nextSelection = nextSelection;\n }\n\n public getRefreshEndpoint() {\n return this.endpoint;\n }\n\n /*\n Refreshes the first page, updating any found items in our list\n */\n private async refreshTop(): Promise<void> {\n const refreshEndpoint = this.getRefreshEndpoint();\n if (!refreshEndpoint) {\n return;\n }\n\n // cancel any outstanding requests\n while (this.pending.length > 0) {\n const pending = this.pending.pop();\n pending.abort();\n }\n\n const controller = new AbortController();\n this.pending.push(controller);\n\n const prevItem = this.items[this.cursorIndex];\n\n try {\n const page = await fetchResultsPage(\n this.getRefreshEndpoint(),\n controller\n );\n\n const items = [...this.items];\n // remove any dupes already in our list\n if (page.results) {\n page.results.forEach((newOption: any) => {\n if (this.sanitizeOption) {\n this.sanitizeOption(newOption);\n }\n const newValue = this.getValue(newOption);\n const removeIndex = items.findIndex(\n option => this.getValue(option) === newValue\n );\n\n if (removeIndex > -1) {\n items.splice(removeIndex, 1);\n }\n });\n\n // insert our new items at the front\n let results = page.results;\n if (this.reverseRefresh) {\n results = page.results.reverse();\n }\n const newItems = [...results, ...items];\n\n const topItem = newItems[0];\n if (\n !this.mostRecentItem \|\|\n JSON.stringify(this.mostRecentItem) !== JSON.stringify(topItem)\n ) {\n this.mostRecentItem = topItem;\n }\n\n if (prevItem) {\n const newItem = newItems[this.cursorIndex];\n const prevValue = this.getValue(prevItem);\n if (prevValue !== this.getValue(newItem)) {\n const newIndex = newItems.findIndex(\n option => this.getValue(option) === prevValue\n );\n this.cursorIndex = newIndex;\n\n // make sure our focused item is visible\n window.setTimeout(() => {\n const options = this.shadowRoot.querySelector('temba-options');\n if (options) {\n const option =\n options.shadowRoot.querySelector('.option.focused');\n option.scrollIntoView({ block: 'end', inline: 'nearest' });\n }\n }, 0);\n }\n }\n\n this.items = newItems;\n }\n } catch (error) {\n console.error(error);\n }\n }\n\n private async fetchItems(): Promise<void> {\n // cancel any outstanding requests\n while (this.pending.length > 0) {\n const pending = this.pending.pop();\n pending.abort();\n }\n\n let endpoint = this.endpoint;\n let pagesToFetch = this.pages \|\| 1;\n let pages = 0;\n let nextPage = null;\n\n let fetchedItems: any[] = [];\n\n while (pagesToFetch > 0 && endpoint) {\n const controller = new AbortController();\n this.pending.push(controller);\n\n try {\n const page = await fetchResultsPage(endpoint, controller);\n\n // sanitize our options if necessary\n if (this.sanitizeOption) {\n page.results.forEach(this.sanitizeOption);\n }\n\n if (page.results) {\n fetchedItems = fetchedItems.concat(page.results);\n }\n\n // save our next pages\n nextPage = page.next;\n endpoint = nextPage;\n pagesToFetch--;\n pages++;\n } catch (error) {\n // aborted\n this.reset();\n\n console.log('error, resetting');\n return;\n }\n\n this.nextPage = nextPage;\n }\n this.pages = pages;\n\n const topItem = fetchedItems[0];\n if (\n !this.mostRecentItem \|\|\n JSON.stringify(this.mostRecentItem) !== JSON.stringify(topItem)\n ) {\n this.mostRecentItem = topItem;\n }\n\n // see if our cursor needs to move to stay on the same item\n const newItem = fetchedItems[this.cursorIndex];\n\n if (\n !this.nextSelection &&\n this.selected &&\n newItem &&\n this.getValue(newItem) !== this.getValue(this.selected)\n ) {\n const index = fetchedItems.findIndex(item => {\n return this.getValue(item) === this.getValue(this.selected);\n });\n\n // old selection is in the new fetch\n if (index > -1) {\n this.cursorIndex = index;\n }\n // old selection is missing from the new fetch\n else {\n // if our index didn't change, our item still did, fire change\n if (this.cursorIndex === 0) {\n this.requestUpdate('cursorIndex');\n }\n // otherwise select the first item\n else {\n this.cursorIndex = 0;\n }\n }\n }\n\n // save our results\n this.items = fetchedItems;\n this.loading = false;\n this.pending = [];\n\n if (this.nextSelection) {\n this.setSelection(this.nextSelection);\n this.nextSelection = false;\n } else {\n if (this.cursorIndex === -1) {\n this.cursorIndex = 0;\n }\n }\n\n // TODO: Not sure why this is needed\n // this.requestUpdate('cursorIndex');\n\n if (this.value) {\n this.setSelection(this.value);\n this.value = null;\n }\n\n return Promise.resolve();\n }\n\n private handleScrollThreshold() {\n if (this.nextPage && !this.loading) {\n this.loading = true;\n fetchResultsPage(this.nextPage).then((page: ResultsPage) => {\n if (this.sanitizeOption) {\n page.results.forEach(this.sanitizeOption);\n }\n\n this.items = [...this.items, ...page.results];\n this.nextPage = page.next;\n this.pages++;\n this.loading = false;\n });\n }\n }\n\n public renderHeader(): TemplateResult {\n return null;\n }\n\n public renderFooter(): TemplateResult {\n return null;\n }\n\n public getListStyle() {\n return '';\n }\n\n private handleSelection(event: CustomEvent) {\n const { selected, index } = event.detail;\n\n this.selected = selected;\n this.cursorIndex = index;\n\n event.stopPropagation();\n event.preventDefault();\n }\n\n public render(): TemplateResult {\n return html`\n ${this.renderHeader()}\n <temba-options\n style=\"${this.getListStyle()}\"\n ?visible=${true}\n ?block=${true}\n ?hideShadow=${this.hideShadow}\n ?collapsed=${this.collapsed}\n ?loading=${this.loading}\n .renderOption=${this.renderOption}\n .renderOptionDetail=${this.renderOptionDetail}\n @temba-scroll-threshold=${this.handleScrollThreshold}\n @temba-selection=${this.handleSelection.bind(this)}\n .options=${this.items}\n .cursorIndex=${this.cursorIndex}\n >\n <slot></slot>\n </temba-options>\n ${this.renderFooter()}\n `;\n }\n}\n"]}

package/out-tsc/src/options/Options.js CHANGED Viewed

@@ -14,6 +14,7 @@ export class Options extends RapidElement {
         this.cursorIndex = -1;
         this.nameKey = 'name';
         this.loading = false;
+        this.hideShadow = false;
         this.getName = function (option) {
             return option[this.nameKey || 'name'];
         };
@@ -34,7 +35,6 @@ export class Options extends RapidElement {
       .options-container {
         background: var(--color-widget-bg-focused);
         user-select: none;
-        box-shadow: var(--options-shadow);
         border-radius: var(--curvature-widget);
         overflow: hidden;
         margin-top: var(--options-margin-top);
@@ -50,6 +50,10 @@ export class Options extends RapidElement {
         border: 1px transparent;
       }
+      .shadow {
+        box-shadow: var(--options-shadow);
+      }
       .anchored {
         position: fixed;
       }
@@ -70,12 +74,19 @@ export class Options extends RapidElement {
       }
       :host([block]) {
-        box-shadow: var(--options-block-shadow);
         border-radius: var(--curvature);
         display: block;
         height: 100%;
       }
+      :host([block]) .shadow {
+        box-shadow: var(--options-block-shadow);
+      }
+      .bordered {
+        border: 1px solid var(--color-widget-border) !important;
+      }
       :host([block]) .options {
         margin-bottom: 1.5em;
       }
@@ -452,6 +463,8 @@ export class Options extends RapidElement {
             top: this.poppedTop,
             anchored: !this.block,
             loading: this.loading,
+            shadow: !this.hideShadow,
+            bordered: this.hideShadow,
         });
         const classesInner = getClasses({
             options: true,
@@ -544,6 +557,9 @@ __decorate([
 __decorate([
     property({ type: Boolean })
 ], Options.prototype, "collapsed", void 0);
+__decorate([
+    property({ type: Boolean })
+], Options.prototype, "hideShadow", void 0);
 __decorate([
     property({ attribute: false })
 ], Options.prototype, "getName", void 0);