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

@nyaruka/temba-components 0.28.2 → 0.29.1

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 (1473) hide show

package/out-tsc/src/contacts/ContactBadges.js CHANGED Viewed

@@ -16,9 +16,6 @@ export class ContactBadges extends ContactStoreElement {
         display: flex;
         flex-wrap: wrap;
       }
-      .flow {
-      }
     `;
     }
     render() {
@@ -29,12 +26,11 @@ export class ContactBadges extends ContactStoreElement {
           ${status && this.data.status !== 'active'
                 ? html `
                 <temba-label
-                  class="status"
                   icon="${status.icon}"
                   onclick="goto(event)"
                   href="/contact/${status.name.toLowerCase()}"
-                  clickable
                   secondary
+                  clickable
                   shadow
                 >
                   ${status.name}
@@ -44,12 +40,11 @@ export class ContactBadges extends ContactStoreElement {
           ${this.data.flow
                 ? html `
                 <temba-label
-                  class="flow"
                   icon="flow"
                   onclick="goto(event)"
                   href="/contact/?search=flow+%3D+${encodeURIComponent('"' + this.data.flow.name + '"')}"
                   clickable
-                  tertiary
+                  primary
                   shadow
                 >
                   ${this.data.flow.name}
@@ -59,7 +54,6 @@ export class ContactBadges extends ContactStoreElement {
           ${this.data.language
                 ? html `
                 <temba-label
-                  class="language"
                   icon="globe"
                   onclick="goto(event)"
                   href="/contact/?search=language+%3D+${encodeURIComponent('"' + this.data.language + '"')}"
@@ -79,7 +73,6 @@ export class ContactBadges extends ContactStoreElement {
                 href="/contact/filter/${group.uuid}/"
                 icon=${group.is_dynamic ? 'atom' : 'users'}
                 clickable
-                light
                 shadow
               >
                 ${group.name}

package/out-tsc/src/contacts/ContactBadges.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"ContactBadges.js","sourceRoot":"","sources":["../../../src/contacts/ContactBadges.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,GAAG,EAAE,IAAI,EAAkB,MAAM,KAAK,CAAC;AAEhD,OAAO,EAAE,mBAAmB,EAAE,MAAM,uBAAuB,CAAC;AAE5D,MAAM,MAAM,GAAG;IACb,OAAO,EAAE,EAAE,IAAI,EAAE,SAAS,EAAE,IAAI,EAAE,WAAW,EAAE;IAC/C,OAAO,EAAE,EAAE,IAAI,EAAE,SAAS,EAAE,IAAI,EAAE,OAAO,EAAE;IAC3C,QAAQ,EAAE,EAAE,IAAI,EAAE,UAAU,EAAE,IAAI,EAAE,SAAS,EAAE;CAChD,CAAC;AAEF,MAAM,OAAO,aAAc,SAAQ,mBAAmB;IACpD,MAAM,KAAK,MAAM;QACf,OAAO,GAAG,CAAA~~;;;;;;;;;;;;KAYT~~,CAAC;IACJ,CAAC;IAEM,MAAM;QACX,IAAI,IAAI,CAAC,IAAI,EAAE;YACb,MAAM,MAAM,GAAG,MAAM,CAAC,IAAI,CAAC,IAAI,CAAC,MAAM,CAAC,CAAC;YAExC,OAAO,IAAI,CAAA;;YAEL,MAAM,IAAI,IAAI,CAAC,IAAI,CAAC,MAAM,KAAK,QAAQ;gBACvC,CAAC,CAAC,IAAI,CAAA~~;;;0BAGQ~~,MAAM,CAAC,IAAI;;mCAEF,MAAM,CAAC,IAAI,CAAC,WAAW,EAAE;;;;;oBAKxC,MAAM,CAAC,IAAI;;eAEhB;gBACH,CAAC,CAAC,IAAI;YACN,IAAI,CAAC,IAAI,CAAC,IAAI;gBACd,CAAC,CAAC,IAAI,CAAA~~;;;;;oDAKkC~~,kBAAkB,CAClD,GAAG,GAAG,IAAI,CAAC,IAAI,CAAC,IAAI,CAAC,IAAI,GAAG,GAAG,CAChC;;;;;oBAKC,IAAI,CAAC,IAAI,CAAC,IAAI,CAAC,IAAI;;eAExB;gBACH,CAAC,CAAC,IAAI;YACN,IAAI,CAAC,IAAI,CAAC,QAAQ;gBAClB,CAAC,CAAC,IAAI,CAAA~~;;;;;wDAKsC~~,kBAAkB,CACtD,GAAG,GAAG,IAAI,CAAC,IAAI,CAAC,QAAQ,GAAG,GAAG,CAC/B;;;;;oBAKC,IAAI,CAAC,KAAK,CAAC,eAAe,CAAC,IAAI,CAAC,IAAI,CAAC,QAAQ,CAAC;;eAEnD;gBACH,CAAC,CAAC,IAAI;YACN,IAAI,CAAC,IAAI,CAAC,MAAM,CAAC,GAAG,CAAC,CAAC,KAAY,EAAE,EAAE;gBACtC,OAAO,IAAI,CAAA;;;;wCAIiB,KAAK,CAAC,IAAI;uBAC3B,KAAK,CAAC,UAAU,CAAC,CAAC,CAAC,MAAM,CAAC,CAAC,CAAC,OAAO~~;;;;;kBAKxC~~,KAAK,CAAC,IAAI;;aAEf,CAAC;YACJ,CAAC,CAAC;;OAEL,CAAC;SACH;aAAM;YACL,OAAO,IAAI,CAAC;SACb;IACH,CAAC;CACF","sourcesContent":["import { css, html, TemplateResult } from 'lit';\nimport { Group } from '../interfaces';\nimport { ContactStoreElement } from './ContactStoreElement';\n\nconst STATUS = {\n stopped: { name: 'Stopped', icon: 'x-octagon' },\n blocked: { name: 'Blocked', icon: 'slash' },\n archived: { name: 'Archived', icon: 'archive' },\n};\n\nexport class ContactBadges extends ContactStoreElement {\n static get styles() {\n return css`\n temba-label {\n margin: 0.3em;\n }\n\n .badges {\n display: flex;\n flex-wrap: wrap;\n }\n~~\n .flow {\n }\n~~ `;\n }\n\n public render(): TemplateResult {\n if (this.data) {\n const status = STATUS[this.data.status];\n\n return html`\n <div class=\"badges\">\n ${status && this.data.status !== 'active'\n ? html`\n <temba-label\n ~~class=\"status\"\n~~ icon=\"${status.icon}\"\n onclick=\"goto(event)\"\n href=\"/contact/${status.name.toLowerCase()}\"\n ~~clickable~~\n ~~secondary~~\n shadow\n >\n ${status.name}\n </temba-label>\n `\n : null}\n ${this.data.flow\n ? html`\n <temba-label\n ~~class=\"flow\"\n~~ icon=\"flow\"\n onclick=\"goto(event)\"\n href=\"/contact/?search=flow+%3D+${encodeURIComponent(\n '\"' + this.data.flow.name + '\"'\n )}\"\n clickable\n ~~tertiary~~\n shadow\n >\n ${this.data.flow.name}\n </temba-label>\n `\n : null}\n ${this.data.language\n ? html`\n <temba-label\n ~~class=\"language\"\n~~ icon=\"globe\"\n onclick=\"goto(event)\"\n href=\"/contact/?search=language+%3D+${encodeURIComponent(\n '\"' + this.data.language + '\"'\n )}\"\n clickable\n primary\n shadow\n >\n ${this.store.getLanguageName(this.data.language)}\n </temba-label>\n `\n : null}\n ${this.data.groups.map((group: Group) => {\n return html`\n <temba-label\n class=\"group\"\n onclick=\"goto(event)\"\n href=\"/contact/filter/${group.uuid}/\"\n icon=${group.is_dynamic ? 'atom' : 'users'}\n clickable\n ~~light\n~~ shadow\n >\n ${group.name}\n </temba-label>\n `;\n })}\n </div>\n `;\n } else {\n return null;\n }\n }\n}\n"]}
1	+ {"version":3,"file":"ContactBadges.js","sourceRoot":"","sources":["../../../src/contacts/ContactBadges.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,GAAG,EAAE,IAAI,EAAkB,MAAM,KAAK,CAAC;AAEhD,OAAO,EAAE,mBAAmB,EAAE,MAAM,uBAAuB,CAAC;AAE5D,MAAM,MAAM,GAAG;IACb,OAAO,EAAE,EAAE,IAAI,EAAE,SAAS,EAAE,IAAI,EAAE,WAAW,EAAE;IAC/C,OAAO,EAAE,EAAE,IAAI,EAAE,SAAS,EAAE,IAAI,EAAE,OAAO,EAAE;IAC3C,QAAQ,EAAE,EAAE,IAAI,EAAE,UAAU,EAAE,IAAI,EAAE,SAAS,EAAE;CAChD,CAAC;AAEF,MAAM,OAAO,aAAc,SAAQ,mBAAmB;IACpD,MAAM,KAAK,MAAM;QACf,OAAO,GAAG,CAAA;;;;;;;;;KAST,CAAC;IACJ,CAAC;IAEM,MAAM;QACX,IAAI,IAAI,CAAC,IAAI,EAAE;YACb,MAAM,MAAM,GAAG,MAAM,CAAC,IAAI,CAAC,IAAI,CAAC,MAAM,CAAC,CAAC;YAExC,OAAO,IAAI,CAAA;;YAEL,MAAM,IAAI,IAAI,CAAC,IAAI,CAAC,MAAM,KAAK,QAAQ;gBACvC,CAAC,CAAC,IAAI,CAAA;;0BAEQ,MAAM,CAAC,IAAI;;mCAEF,MAAM,CAAC,IAAI,CAAC,WAAW,EAAE;;;;;oBAKxC,MAAM,CAAC,IAAI;;eAEhB;gBACH,CAAC,CAAC,IAAI;YACN,IAAI,CAAC,IAAI,CAAC,IAAI;gBACd,CAAC,CAAC,IAAI,CAAA;;;;oDAIkC,kBAAkB,CAClD,GAAG,GAAG,IAAI,CAAC,IAAI,CAAC,IAAI,CAAC,IAAI,GAAG,GAAG,CAChC;;;;;oBAKC,IAAI,CAAC,IAAI,CAAC,IAAI,CAAC,IAAI;;eAExB;gBACH,CAAC,CAAC,IAAI;YACN,IAAI,CAAC,IAAI,CAAC,QAAQ;gBAClB,CAAC,CAAC,IAAI,CAAA;;;;wDAIsC,kBAAkB,CACtD,GAAG,GAAG,IAAI,CAAC,IAAI,CAAC,QAAQ,GAAG,GAAG,CAC/B;;;;;oBAKC,IAAI,CAAC,KAAK,CAAC,eAAe,CAAC,IAAI,CAAC,IAAI,CAAC,QAAQ,CAAC;;eAEnD;gBACH,CAAC,CAAC,IAAI;YACN,IAAI,CAAC,IAAI,CAAC,MAAM,CAAC,GAAG,CAAC,CAAC,KAAY,EAAE,EAAE;gBACtC,OAAO,IAAI,CAAA;;;;wCAIiB,KAAK,CAAC,IAAI;uBAC3B,KAAK,CAAC,UAAU,CAAC,CAAC,CAAC,MAAM,CAAC,CAAC,CAAC,OAAO;;;;kBAIxC,KAAK,CAAC,IAAI;;aAEf,CAAC;YACJ,CAAC,CAAC;;OAEL,CAAC;SACH;aAAM;YACL,OAAO,IAAI,CAAC;SACb;IACH,CAAC;CACF","sourcesContent":["import { css, html, TemplateResult } from 'lit';\nimport { Group } from '../interfaces';\nimport { ContactStoreElement } from './ContactStoreElement';\n\nconst STATUS = {\n stopped: { name: 'Stopped', icon: 'x-octagon' },\n blocked: { name: 'Blocked', icon: 'slash' },\n archived: { name: 'Archived', icon: 'archive' },\n};\n\nexport class ContactBadges extends ContactStoreElement {\n static get styles() {\n return css`\n temba-label {\n margin: 0.3em;\n }\n\n .badges {\n display: flex;\n flex-wrap: wrap;\n }\n `;\n }\n\n public render(): TemplateResult {\n if (this.data) {\n const status = STATUS[this.data.status];\n\n return html`\n <div class=\"badges\">\n ${status && this.data.status !== 'active'\n ? html`\n <temba-label\n icon=\"${status.icon}\"\n onclick=\"goto(event)\"\n href=\"/contact/${status.name.toLowerCase()}\"\n secondary\n clickable\n shadow\n >\n ${status.name}\n </temba-label>\n `\n : null}\n ${this.data.flow\n ? html`\n <temba-label\n icon=\"flow\"\n onclick=\"goto(event)\"\n href=\"/contact/?search=flow+%3D+${encodeURIComponent(\n '\"' + this.data.flow.name + '\"'\n )}\"\n clickable\n primary\n shadow\n >\n ${this.data.flow.name}\n </temba-label>\n `\n : null}\n ${this.data.language\n ? html`\n <temba-label\n icon=\"globe\"\n onclick=\"goto(event)\"\n href=\"/contact/?search=language+%3D+${encodeURIComponent(\n '\"' + this.data.language + '\"'\n )}\"\n clickable\n primary\n shadow\n >\n ${this.store.getLanguageName(this.data.language)}\n </temba-label>\n `\n : null}\n ${this.data.groups.map((group: Group) => {\n return html`\n <temba-label\n class=\"group\"\n onclick=\"goto(event)\"\n href=\"/contact/filter/${group.uuid}/\"\n icon=${group.is_dynamic ? 'atom' : 'users'}\n clickable\n shadow\n >\n ${group.name}\n </temba-label>\n `;\n })}\n </div>\n `;\n } else {\n return null;\n }\n }\n}\n"]}

package/out-tsc/src/contacts/ContactStoreElement.js CHANGED Viewed

@@ -2,6 +2,10 @@ import { __decorate } from "tslib";
 import { property } from 'lit/decorators';
 import { StoreElement } from '../store/StoreElement';
 export class ContactStoreElement extends StoreElement {
+    constructor() {
+        super(...arguments);
+        this.endpoint = '/api/v2/contacts.json?uuid=';
+    }
     prepareData(data) {
         if (data && data.length > 0) {
             data = data[0];
@@ -24,13 +28,13 @@ export class ContactStoreElement extends StoreElement {
         return null;
     }
     updateStoreContact(value) {
-        this.store.updateCache(`/api/v2/contacts.json?uuid=${this.contact}`, value);
+        this.store.updateCache(`${this.endpoint}${this.contact}`, value);
     }
     updated(changes) {
         super.updated(changes);
         if (changes.has('contact')) {
             if (this.contact) {
-                this.url = `/api/v2/contacts.json?uuid=${this.contact}`;
+                this.url = `${this.endpoint}${this.contact}`;
             }
             else {
                 this.url = null;
@@ -44,4 +48,7 @@ __decorate([
 __decorate([
     property({ type: Object, attribute: false })
 ], ContactStoreElement.prototype, "data", void 0);
+__decorate([
+    property({ type: String })
+], ContactStoreElement.prototype, "endpoint", void 0);
 //# sourceMappingURL=ContactStoreElement.js.map

package/out-tsc/src/contacts/ContactStoreElement.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"ContactStoreElement.js","sourceRoot":"","sources":["../../../src/contacts/ContactStoreElement.ts"],"names":[],"mappings":";AACA,OAAO,EAAE,QAAQ,EAAE,MAAM,gBAAgB,CAAC;AAE1C,OAAO,EAAE,YAAY,EAAE,MAAM,uBAAuB,CAAC;AAErD,MAAM,OAAO,mBAAoB,SAAQ,YAAY;~~IAOnD~~,WAAW,CAAC,IAAS;QACnB,IAAI,IAAI,IAAI,IAAI,CAAC,MAAM,GAAG,CAAC,EAAE;YAC3B,IAAI,GAAG,IAAI,CAAC,CAAC,CAAC,CAAC;YACf,IAAI,CAAC,MAAM,CAAC,OAAO,CAAC,CAAC,KAAY,EAAE,EAAE;gBACnC,KAAK,CAAC,UAAU,GAAG,IAAI,CAAC,KAAK,CAAC,cAAc,CAAC,KAAK,CAAC,IAAI,CAAC,CAAC;YAC3D,CAAC,CAAC,CAAC;YAEH,IAAI,CAAC,MAAM,CAAC,IAAI,CAAC,CAAC,CAAQ,EAAE,CAAQ,EAAE,EAAE;gBACtC,IAAI,CAAC,CAAC,CAAC,UAAU,IAAI,CAAC,CAAC,CAAC,UAAU,EAAE;oBAClC,IAAI,CAAC,CAAC,UAAU,EAAE;wBAChB,OAAO,CAAC,CAAC,CAAC;qBACX;oBAED,IAAI,CAAC,CAAC,UAAU,EAAE;wBAChB,OAAO,CAAC,CAAC;qBACV;iBACF;gBAED,OAAO,CAAC,CAAC,IAAI,CAAC,aAAa,CAAC,CAAC,CAAC,IAAI,CAAC,CAAC;YACtC,CAAC,CAAC,CAAC;YAEH,OAAO,IAAI,CAAC;SACb;QACD,OAAO,IAAI,CAAC;IACd,CAAC;IAEM,kBAAkB,CAAC,KAAU;QAClC,IAAI,CAAC,KAAK,CAAC,WAAW,CAAC,~~8BAA8B~~,IAAI,CAAC,OAAO,EAAE,EAAE,KAAK,CAAC,CAAC;~~IAC9E~~,CAAC;IAES,OAAO,CACf,OAA0D;QAE1D,KAAK,CAAC,OAAO,CAAC,OAAO,CAAC,CAAC;QACvB,IAAI,OAAO,CAAC,GAAG,CAAC,SAAS,CAAC,EAAE;YAC1B,IAAI,IAAI,CAAC,OAAO,EAAE;gBAChB,IAAI,CAAC,GAAG,GAAG,~~8BAA8B~~,IAAI,CAAC,OAAO,EAAE,CAAC;~~aACzD~~;iBAAM;gBACL,IAAI,CAAC,GAAG,GAAG,IAAI,CAAC;aACjB;SACF;IACH,CAAC;CACF;~~AA/CC~~;IADC,QAAQ,CAAC,EAAE,IAAI,EAAE,MAAM,EAAE,CAAC;oDACX;AAGhB;IADC,QAAQ,CAAC,EAAE,IAAI,EAAE,MAAM,EAAE,SAAS,EAAE,KAAK,EAAE,CAAC;iDAC/B","sourcesContent":["import { PropertyValueMap } from 'lit';\nimport { property } from 'lit/decorators';\nimport { Contact, Group } from '../interfaces';\nimport { StoreElement } from '../store/StoreElement';\n\nexport class ContactStoreElement extends StoreElement {\n @property({ type: String })\n contact: string;\n\n @property({ type: Object, attribute: false })\n data: Contact;\n\n prepareData(data: any) {\n if (data && data.length > 0) {\n data = data[0];\n data.groups.forEach((group: Group) => {\n group.is_dynamic = this.store.isDynamicGroup(group.uuid);\n });\n\n data.groups.sort((a: Group, b: Group) => {\n if (!a.is_dynamic \|\| !b.is_dynamic) {\n if (a.is_dynamic) {\n return -1;\n }\n\n if (b.is_dynamic) {\n return 1;\n }\n }\n\n return a.name.localeCompare(b.name);\n });\n\n return data;\n }\n return null;\n }\n\n public updateStoreContact(value: any) {\n this.store.updateCache(~~`/api/v2/contacts~~.~~json?uuid=$~~{this.contact}`, value);\n }\n\n protected updated(\n changes: PropertyValueMap<any> \| Map<PropertyKey, unknown>\n ): void {\n super.updated(changes);\n if (changes.has('contact')) {\n if (this.contact) {\n this.url = ~~`/api/v2/contacts~~.~~json?uuid=$~~{this.contact}`;\n } else {\n this.url = null;\n }\n }\n }\n}\n"]}
1	+ {"version":3,"file":"ContactStoreElement.js","sourceRoot":"","sources":["../../../src/contacts/ContactStoreElement.ts"],"names":[],"mappings":";AACA,OAAO,EAAE,QAAQ,EAAE,MAAM,gBAAgB,CAAC;AAE1C,OAAO,EAAE,YAAY,EAAE,MAAM,uBAAuB,CAAC;AAErD,MAAM,OAAO,mBAAoB,SAAQ,YAAY;IAArD;;QAQE,aAAQ,GAAG,6BAA6B,CAAC;IA4C3C,CAAC;IA1CC,WAAW,CAAC,IAAS;QACnB,IAAI,IAAI,IAAI,IAAI,CAAC,MAAM,GAAG,CAAC,EAAE;YAC3B,IAAI,GAAG,IAAI,CAAC,CAAC,CAAC,CAAC;YACf,IAAI,CAAC,MAAM,CAAC,OAAO,CAAC,CAAC,KAAY,EAAE,EAAE;gBACnC,KAAK,CAAC,UAAU,GAAG,IAAI,CAAC,KAAK,CAAC,cAAc,CAAC,KAAK,CAAC,IAAI,CAAC,CAAC;YAC3D,CAAC,CAAC,CAAC;YAEH,IAAI,CAAC,MAAM,CAAC,IAAI,CAAC,CAAC,CAAQ,EAAE,CAAQ,EAAE,EAAE;gBACtC,IAAI,CAAC,CAAC,CAAC,UAAU,IAAI,CAAC,CAAC,CAAC,UAAU,EAAE;oBAClC,IAAI,CAAC,CAAC,UAAU,EAAE;wBAChB,OAAO,CAAC,CAAC,CAAC;qBACX;oBAED,IAAI,CAAC,CAAC,UAAU,EAAE;wBAChB,OAAO,CAAC,CAAC;qBACV;iBACF;gBAED,OAAO,CAAC,CAAC,IAAI,CAAC,aAAa,CAAC,CAAC,CAAC,IAAI,CAAC,CAAC;YACtC,CAAC,CAAC,CAAC;YAEH,OAAO,IAAI,CAAC;SACb;QACD,OAAO,IAAI,CAAC;IACd,CAAC;IAEM,kBAAkB,CAAC,KAAU;QAClC,IAAI,CAAC,KAAK,CAAC,WAAW,CAAC,GAAG,IAAI,CAAC,QAAQ,GAAG,IAAI,CAAC,OAAO,EAAE,EAAE,KAAK,CAAC,CAAC;IACnE,CAAC;IAES,OAAO,CACf,OAA0D;QAE1D,KAAK,CAAC,OAAO,CAAC,OAAO,CAAC,CAAC;QACvB,IAAI,OAAO,CAAC,GAAG,CAAC,SAAS,CAAC,EAAE;YAC1B,IAAI,IAAI,CAAC,OAAO,EAAE;gBAChB,IAAI,CAAC,GAAG,GAAG,GAAG,IAAI,CAAC,QAAQ,GAAG,IAAI,CAAC,OAAO,EAAE,CAAC;aAC9C;iBAAM;gBACL,IAAI,CAAC,GAAG,GAAG,IAAI,CAAC;aACjB;SACF;IACH,CAAC;CACF;AAlDC;IADC,QAAQ,CAAC,EAAE,IAAI,EAAE,MAAM,EAAE,CAAC;oDACX;AAGhB;IADC,QAAQ,CAAC,EAAE,IAAI,EAAE,MAAM,EAAE,SAAS,EAAE,KAAK,EAAE,CAAC;iDAC/B;AAGd;IADC,QAAQ,CAAC,EAAE,IAAI,EAAE,MAAM,EAAE,CAAC;qDACc","sourcesContent":["import { PropertyValueMap } from 'lit';\nimport { property } from 'lit/decorators';\nimport { Contact, Group } from '../interfaces';\nimport { StoreElement } from '../store/StoreElement';\n\nexport class ContactStoreElement extends StoreElement {\n @property({ type: String })\n contact: string;\n\n @property({ type: Object, attribute: false })\n data: Contact;\n\n @property({ type: String })\n endpoint = '/api/v2/contacts.json?uuid=';\n\n prepareData(data: any) {\n if (data && data.length > 0) {\n data = data[0];\n data.groups.forEach((group: Group) => {\n group.is_dynamic = this.store.isDynamicGroup(group.uuid);\n });\n\n data.groups.sort((a: Group, b: Group) => {\n if (!a.is_dynamic \|\| !b.is_dynamic) {\n if (a.is_dynamic) {\n return -1;\n }\n\n if (b.is_dynamic) {\n return 1;\n }\n }\n\n return a.name.localeCompare(b.name);\n });\n\n return data;\n }\n return null;\n }\n\n public updateStoreContact(value: any) {\n this.store.updateCache(`${this.endpoint}${this.contact}`, value);\n }\n\n protected updated(\n changes: PropertyValueMap<any> \| Map<PropertyKey, unknown>\n ): void {\n super.updated(changes);\n if (changes.has('contact')) {\n if (this.contact) {\n this.url = `${this.endpoint}${this.contact}`;\n } else {\n this.url = null;\n }\n }\n }\n}\n"]}

package/out-tsc/src/contacts/events.js CHANGED Viewed

@@ -60,7 +60,6 @@ export const getEventStyles = () => {
     }
     .grouping.verbose temba-icon {
-      margin-top: 3px;
     }
     .grouping.verbose > .event,
@@ -295,7 +294,6 @@ export const getEventStyles = () => {
     .flow_exited temba-icon,
     .flow_entered temba-icon {
-      margin-top: 5px;
     }
     .event {
@@ -375,7 +373,6 @@ export const getEventStyles = () => {
     }
     temba-icon[name='check'] {
-      margin-top: 3px;
     }
     .attn {

package/out-tsc/src/contacts/events.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"events.js","sourceRoot":"","sources":["../../../src/contacts/events.ts"],"names":[],"mappings":"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","sourcesContent":["import { css, html, TemplateResult } from 'lit';\nimport { Msg, ObjectReference, User } from '../interfaces';\nimport { getClasses, oxford, oxfordFn, oxfordNamed, timeSince } from '../utils';\nimport { getDisplayName } from './helpers';\n\nexport const getEventStyles = () => {\n return css`\n .grouping {\n margin-top: 1em;\n }\n\n .grouping.verbose {\n background: #f9f9f9;\n color: var(--color-dark);\n --color-link-primary: rgba(38, 166, 230, 1);\n pointer-events: none;\n background: #fefefe;\n box-shadow: -8px 0px 8px 1px rgba(0, 0, 0, 0.05) inset;\n margin-right: -16px;\n padding-right: 16px;\n margin-bottom: 1.3em;\n }\n\n .grouping .items {\n display: block;\n }\n\n .grouping.verbose .items {\n opacity: 0;\n max-height: 0;\n display: flex;\n flex-direction: column;\n user-select: none;\n }\n\n .grouping.flows .items {\n padding: 0;\n }\n\n .grouping.messages .items {\n display: flex;\n flex-direction: column;\n margin: 0em 0.75em;\n }\n\n .grouping.verbose.expanded .items {\n transition: max-height var(--transition-speed) ease-in-out,\n opacity var(--transition-speed) ease-in-out;\n opacity: 1;\n max-height: 1000px;\n padding: 1em 1em;\n }\n\n .grouping.verbose.expanded {\n border-top: 1px solid #f3f3f3;\n border-bottom: 1px solid #f3f3f3;\n }\n\n .grouping.verbose.expanded,\n .grouping.verbose .event-count {\n pointer-events: auto;\n }\n\n .grouping.verbose temba-icon {\n margin-top: 3px;\n }\n\n .grouping.verbose > .event,\n .grouping.verbose > pre {\n max-height: 0px;\n padding-top: 0;\n padding-bottom: 0;\n margin-top: 0;\n margin-bottom: 0;\n opacity: 0;\n }\n\n .grouping.verbose .attn {\n color: #666;\n }\n\n .event-count {\n position: relative;\n font-size: 0.8em;\n text-align: center;\n margin: 0 auto;\n display: table;\n padding: 3px 10px;\n font-weight: 400;\n color: #999;\n cursor: pointer;\n width: 100%;\n opacity: 1;\n z-index: 1;\n }\n\n .event-count temba-icon {\n display: inline-block;\n position: absolute;\n right: 5px;\n top: 5px;\n }\n\n .event-count:hover {\n color: var(--color-link-primary-hover);\n }\n\n .expanded .event-count {\n padding: 0;\n pointer-events: none;\n }\n\n .grouping.flows {\n margin-left: 1em;\n margin-right: 1em;\n margin-bottom: 1.5em;\n\n border: 1px solid #f2f2f2;\n border-radius: var(--curvature);\n padding: 0.5em 1em;\n }\n\n .grouping.flows .event {\n margin: 0;\n padding: 0;\n }\n\n .grouping.tickets {\n margin-bottom: 2em;\n }\n\n pre {\n white-space: pre-wrap;\n word-wrap: break-word;\n }\n\n .grouping.verbose.expanded .event,\n .grouping.verbose.expanded pre {\n max-height: 500px;\n opacity: 1;\n }\n\n .grouping-close-button {\n position: relative;\n display: inline-block;\n opacity: 0;\n float: right;\n --icon-color: #666;\n }\n\n .grouping.verbose.expanded:hover .grouping-close-button {\n opacity: 1;\n }\n\n .grouping.messages,\n .grouping.tickets {\n display: flex;\n flex-direction: column;\n }\n\n .event {\n margin: 0.25em 0.5em;\n border-radius: var(--curvature);\n flex-grow: 1;\n }\n\n .msg {\n padding: var(--event-padding);\n border-radius: 8px;\n border: 2px solid rgba(100, 100, 100, 0.1);\n max-width: 300px;\n }\n\n .event.msg_received .msg {\n background: rgba(200, 200, 200, 0.1);\n }\n\n .event.msg_created,\n .event.broadcast_created,\n .event.ivr_created,\n .tickets .event.ticket_note_added {\n align-self: flex-end;\n }\n\n .event.msg_created .msg,\n .event.broadcast_created .msg,\n .event.ivr_created .msg {\n background: rgb(231, 243, 255);\n }\n\n .webhook_called {\n fill: #e68628;\n word-break: break-all;\n }\n\n .webhook_called .failed {\n fill: var(--color-error);\n color: var(--color-error);\n }\n\n .input_labels_added,\n .contact_name_changed,\n .contact_field_changed,\n .contact_urns_changed,\n .contact_language_changed,\n .run_result_changed {\n fill: rgba(1, 193, 175, 1);\n }\n\n .email_sent {\n fill: #8e5ea7;\n }\n\n .contact_groups_changed .added {\n fill: #309c42;\n }\n .contact_groups_changed .removed {\n fill: var(--color-error);\n }\n\n .event.error .description,\n .event.failure .description {\n color: var(--color-error);\n }\n\n .description.error {\n color: var(--color-error);\n }\n\n .info {\n border: 1px solid rgba(100, 100, 100, 0.2);\n background: rgba(10, 10, 10, 0.02);\n }\n\n .tickets .ticket_note_added {\n max-width: 300px;\n }\n\n .tickets .note-summary {\n display: flex;\n flex-direction: row;\n line-height: 0.5;\n font-size: 80%;\n color: rgba(0, 0, 0, 0.6);\n padding: 8px 3px;\n }\n\n .tickets .ticket_note_added .description {\n border: 2px solid rgba(100, 100, 100, 0.1);\n background: rgb(255, 249, 194);\n padding: var(--event-padding);\n border-radius: 8px;\n }\n\n .channel_event {\n fill: rgb(230, 230, 230);\n }\n\n .airtime_transferred,\n .flow_exited,\n .flow_entered,\n .ticket_opened,\n .ticket_reopened,\n .ticket_closed,\n .call_started,\n .campaign_fired {\n fill: rgba(223, 65, 159, 1);\n }\n\n .active-ticket.ticket_opened {\n padding: 0em 1em;\n }\n\n .ticket_opened temba-icon.clickable[name='check'] {\n fill: rgba(100, 100, 100, 1);\n }\n\n .ticket_opened .active {\n color: var(--color-text);\n }\n\n .ticket_closed .inactive .subtext {\n display: none;\n }\n\n .attn {\n color: var(--color-text);\n }\n\n .flow_exited,\n .flow_entered {\n align-self: center;\n max-width: 80%;\n display: flex;\n flex-direction: row;\n }\n\n .flow_exited temba-icon,\n .flow_entered temba-icon {\n margin-top: 5px;\n }\n\n .event {\n display: flex;\n align-items: center;\n }\n\n .event .description {\n flex-grow: 1;\n }\n\n .msg-summary {\n display: flex;\n line-height: 0.5;\n\n font-size: 80%;\n color: rgba(0, 0, 0, 0.6);\n padding: 6px 3px;\n margin-bottom: 0.5em;\n }\n\n .msg-summary temba-icon[name='log'] {\n --icon-color: rgba(0, 0, 0, 0.2);\n }\n\n .msg-summary temba-icon[name='log']:hover {\n --icon-color: var(--color-link-primary-hover);\n cursor: pointer;\n }\n\n .msg-summary temba-icon.error[name='log'] {\n --icon-color: rgba(var(--error-rgb), 0.75);\n }\n\n .msg-summary temba-icon.error[name='log']:hover {\n --icon-color: var(--color-error);\n cursor: pointer;\n }\n\n .msg-summary temba-icon[name='megaphone'] {\n --icon-color: rgba(90, 90, 90, 0.5);\n }\n\n .msg-summary * {\n display: flex;\n margin-right: 1px;\n margin-left: 1px;\n }\n\n .unsupported {\n border: 1px solid #f2f2f2;\n color: #999;\n padding: 0.5em 1em;\n border-radius: var(--curvature);\n }\n\n .time {\n padding: 0.3em 1px;\n }\n\n .status {\n padding: 0.3em 3px;\n }\n\n .separator {\n padding: 0.3em 0px;\n }\n\n .recipients {\n padding: 0.3em 3px;\n }\n\n .verbose temba-icon,\n .flows temba-icon,\n .tickets temba-icon {\n margin-right: 0.75em;\n }\n\n temba-icon[name='check'] {\n margin-top: 3px;\n }\n\n .attn {\n display: inline-block;\n font-weight: 500;\n margin: 0px 2px;\n }\n\n .subtext {\n font-size: 80%;\n }\n\n .body-pre {\n white-space: pre-wrap;\n word-wrap: break-word;\n font-size: 90%;\n }\n\n a,\n .linked {\n color: var(--color-link-primary);\n cursor: pointer;\n }\n\n a:hover,\n .linked:hover {\n text-decoration: underline;\n color: var(--color-link-primary-hover);\n }\n\n temba-icon[name='alert-triangle'] {\n --icon-color: var(--color-error);\n }\n\n .flow {\n fill: #ddd;\n background: #fff;\n width: 18px;\n height: 18px;\n padding-top: 4px;\n padding-left: 9px;\n border: 0px solid #f3f3f3;\n }\n\n .assigned {\n color: #777;\n max-width: 300px;\n margin-left: auto;\n margin-right: auto;\n display: flex;\n flex-direction: column;\n align-items: center;\n margin-bottom: 10px;\n }\n\n .assigned .attn {\n color: #777;\n }\n\n .attachments {\n margin-top: 1em;\n }\n `;\n};\n\nconst FLOW_USER_ID = 'flow';\n\nexport interface EventGroup {\n type: string;\n events: ContactEvent[];\n open: boolean;\n}\n\nexport enum Events {\n MESSAGE_CREATED = 'msg_created',\n MESSAGE_RECEIVED = 'msg_received',\n BROADCAST_CREATED = 'broadcast_created',\n IVR_CREATED = 'ivr_created',\n FLOW_ENTERED = 'flow_entered',\n FLOW_EXITED = 'flow_exited',\n RUN_RESULT_CHANGED = 'run_result_changed',\n CONTACT_FIELD_CHANGED = 'contact_field_changed',\n CONTACT_GROUPS_CHANGED = 'contact_groups_changed',\n CONTACT_NAME_CHANGED = 'contact_name_changed',\n CONTACT_URNS_CHANGED = 'contact_urns_changed',\n CAMPAIGN_FIRED = 'campaign_fired',\n CHANNEL_EVENT = 'channel_event',\n CONTACT_LANGUAGE_CHANGED = 'contact_language_changed',\n WEBHOOK_CALLED = 'webhook_called',\n AIRTIME_TRANSFERRED = 'airtime_transferred',\n CALL_STARTED = 'call_started',\n EMAIL_SENT = 'email_sent',\n INPUT_LABELS_ADDED = 'input_labels_added',\n NOTE_CREATED = 'note_created',\n TICKET_ASSIGNED = 'ticket_assigned',\n TICKET_NOTE_ADDED = 'ticket_note_added',\n TICKET_CLOSED = 'ticket_closed',\n TICKET_OPENED = 'ticket_opened',\n TICKET_REOPENED = 'ticket_reopened',\n ERROR = 'error',\n FAILURE = 'failure',\n}\n\nexport interface ContactEvent {\n type: string;\n created_on: string;\n}\n\nexport interface ChannelEvent extends ContactEvent {\n channel_event_type: string;\n duration: number;\n}\n\nexport interface ContactLanguageChangedEvent extends ContactEvent {\n language: string;\n step_uuid: string;\n session_uuid: string;\n}\n\nexport interface MsgEvent extends ContactEvent {\n msg: Msg;\n status: string;\n failed_reason?: string;\n failed_reason_display?: string;\n logs_url: string;\n msg_type: string;\n recipient_count?: number;\n created_by?: User;\n}\n\nexport interface FlowEvent extends ContactEvent {\n flow: ObjectReference;\n status: string;\n}\n\nexport interface EmailSentEvent extends ContactEvent {\n to: string[];\n subject: string;\n body: string;\n}\n\nexport interface URNsChangedEvent extends ContactEvent {\n urns: string[];\n}\n\nexport interface TicketEvent extends ContactEvent {\n note?: string;\n assignee?: User;\n ticket: {\n uuid: string;\n ticketer: ObjectReference;\n body: string;\n topic?: ObjectReference;\n external_id?: string;\n closed_on?: string;\n opened_on?: string;\n };\n created_by?: User;\n}\n\nexport interface LabelsAddedEvent extends ContactEvent {\n labels: ObjectReference[];\n}\n\nexport interface NameChangedEvent extends ContactEvent {\n name: string;\n}\n\nexport interface UpdateFieldEvent extends ContactEvent {\n field: { key: string; name: string };\n value: { text: string };\n}\n\nexport interface ErrorMessageEvent extends ContactEvent {\n text: string;\n}\n\nexport interface UpdateResultEvent extends ContactEvent {\n name: string;\n value: string;\n category: string;\n input: string;\n}\n\nexport interface ContactGroupsEvent extends ContactEvent {\n groups_added: ObjectReference[];\n groups_removed: ObjectReference[];\n}\n\nexport interface WebhookEvent extends ContactEvent {\n status: string;\n status_code: number;\n elapsed_ms: number;\n logs_url: string;\n url: string;\n}\n\nexport interface AirtimeTransferredEvent extends ContactEvent {\n sender: string;\n recipient: string;\n currency: string;\n desired_amount: string;\n actual_amount: string;\n logs_url: string;\n}\n\nexport type CallStartedEvent = ContactEvent;\nexport interface CampaignFiredEvent extends ContactEvent {\n campaign: { uuid: string; id: number; name: string };\n campaign_event: {\n id: number;\n offset_display: string;\n relative_to: { key: string; name: string };\n };\n fired_result: string;\n}\n\nexport interface ContactHistoryPage {\n has_older: boolean;\n recent_only: boolean;\n next_before: number;\n next_after: number;\n start_date: Date;\n events: ContactEvent[];\n}\n\nexport const getEventGroupType = (event: ContactEvent, ticket: string) => {\n if (!event) {\n return 'messages';\n }\n switch (event.type) {\n case Events.TICKET_ASSIGNED:\n case Events.TICKET_NOTE_ADDED:\n case Events.TICKET_OPENED:\n case Events.TICKET_CLOSED:\n case Events.TICKET_REOPENED:\n if (!ticket) {\n return 'verbose';\n }\n\n if ((event as TicketEvent).ticket.uuid === ticket) {\n return 'tickets';\n }\n\n break;\n case Events.FLOW_ENTERED:\n case Events.FLOW_EXITED:\n return 'flows';\n case Events.BROADCAST_CREATED:\n case Events.MESSAGE_CREATED:\n case Events.MESSAGE_RECEIVED:\n case Events.IVR_CREATED:\n return 'messages';\n }\n return 'verbose';\n};\n\nexport const renderAvatar = (user: User, agent = '') => {\n const current = user && user.email === agent;\n if (user.email === FLOW_USER_ID \|\| !user \|\| !user.first_name) {\n return html`<temba-tip text=\"Automated message\" position=\"top\"\n ><div class=\"avatar flow\" style=\"margin-top:0.5em\">\n <temba-icon size=\"1\" name=\"activity\" /></div\n ></temba-tip>`;\n } else {\n return html`<temba-tip\n text=\"${user.first_name + ' ' + user.last_name}\"\n position=\"top\"\n >\n <div\n class=\"avatar\"\n style=\"\n border-radius: 9999px; \n display:flex;\n align-items:center;\n border: 2px solid rgba(0,0,0,.05);\n background: ${current ? 'var(--color-primary-dark)' : '#eee'};\n color: ${current ? '#fff' : '#999'} ;\n font-weight: 400;\n padding: 0.5em;\n line-height:1.2em;\n \"\n >\n ${user.first_name[0] + user.last_name[0]}\n </div>\n </temba-tip>`;\n }\n};\n\nexport const renderAttachment = (attachment: string): TemplateResult => {\n const idx = attachment.indexOf(':');\n const attType = attachment.substr(0, idx);\n const url = attachment.substr(idx + 1);\n const [mediaType, ext] = attType.split('/', 2);\n\n let inner = null;\n if (mediaType === 'image') {\n inner = html`<div class=\"linked\" onclick=\"goto(event)\" href=\"${url}\"><img src=\"${url}\" style=\"width:100%;height:auto;display:block\"></img></a>`;\n } else if (ext === 'pdf') {\n return html`<div\n style=\"width:100%;height:300px;border-radius:var(--curvature);box-shadow:0px 0px 12px 0px rgba(0,0,0,.1), 0px 0px 2px 0px rgba(0,0,0,.15);overflow:hidden\"\n ><embed src=\"${url}#view=Fit\" type=\"application/pdf\" frameBorder=\"0\" scrolling=\"auto\" height=\"100%\" width=\"100%\"></embed></div>`;\n } else if (mediaType === 'video') {\n return html`<video\n style=\"border-radius:var(--curvature);box-shadow:0px 0px 12px 0px rgba(0,0,0,.1), 0px 0px 2px 0px rgba(0,0,0,.15);\"\n max-width=\"400px\"\n height=\"auto\"\n controls\n >\n <source src=\"${url}\" type=\"video/mp4\" />\n </video> `;\n } else if (mediaType === 'audio') {\n return html`<audio\n style=\"border-radius: 99px; box-shadow:0px 0px 12px 0px rgba(0,0,0,.1), 0px 0px 2px 0px rgba(0,0,0,.15);\"\n src=\"${url}\"\n type=\"${attType}\"\n controls\n >\n <a target=\"_\" href=\"${url}\">${url}</a>\n </audio>`;\n } else if (attType === 'geo') {\n const [lat, long] = url.split(',');\n const latFloat = parseFloat(lat);\n const longFloat = parseFloat(long);\n const geo = `${lat}000000%2C${long}000000`;\n\n return html` <iframe\n style=\"border-radius: var(--curvature);box-shadow:0px 0px 12px 0px rgba(0,0,0,.1), 0px 0px 2px 0px rgba(0,0,0,.15);\"\n width=\"300\"\n height=\"300\"\n frameborder=\"0\"\n scrolling=\"no\"\n marginheight=\"0\"\n marginwidth=\"0\"\n src=\"https://www.openstreetmap.org/export/embed.html?bbox=${longFloat -\n 0.005}000000%2C${latFloat - 0.005}%2C${longFloat +\n 0.005}000000%2C${latFloat +\n 0.005}000000&layer=mapnik&marker=${geo}\"\n ></iframe>`;\n } else {\n return html`<div style=\"display:flex\">\n <temba-icon name=\"download\"></temba-icon>\n <div>Attachment ${ext}</div>\n </div>`;\n }\n\n return html`<div\n style=\"width:100%;max-width:300px;border-radius:var(--curvature); box-shadow:0px 0px 6px 0px rgba(0,0,0,.15);overflow:hidden\"\n >\n ${inner}\n </div>`;\n};\n\nexport const renderMsgEvent = (\n event: MsgEvent,\n agent: string\n): TemplateResult => {\n const isInbound = event.type === Events.MESSAGE_RECEIVED;\n const isError = event.status === 'E';\n const isFailure = event.status === 'F';\n\n // summary items which appear under the message bubble\n const summary: TemplateResult[] = [];\n if (event.logs_url) {\n summary.push(html` <div class=\"icon-link\">\n <temba-icon\n onclick=\"goto(event)\"\n href=\"${event.logs_url}\"\n name=\"log\"\n class=\"${isError \|\| isFailure ? 'error' : ''}\"\n ></temba-icon>\n </div>`);\n } else if (isError) {\n summary.push(\n html`<temba-icon\n title=\"Message delivery error\"\n name=\"alert-triangle\"\n ></temba-icon>`\n );\n } else if (isFailure) {\n summary.push(\n html`<temba-icon\n title=\"Message delivery failure: ${event.failed_reason_display}\"\n name=\"alert-triangle\"\n ></temba-icon>`\n );\n }\n if (event.recipient_count > 1) {\n summary.push(html`<temba-icon size=\"1\" name=\"megaphone\"></temba-icon>\n <div class=\"recipients\">${event.recipient_count} contacts</div>\n <div class=\"separator\">•</div>`);\n }\n summary.push(\n html`<div class=\"time\">${timeSince(new Date(event.created_on))}</div>`\n );\n\n return html`<div style=\"display:flex;align-items:flex-start\">\n <div style=\"display:flex;flex-direction:column\">\n ${event.msg.text ? html`<div class=\"msg\">${event.msg.text}</div>` : null}\n ${event.msg.attachments\n ? html`<div class=\"attachments\">\n ${event.msg.attachments.map(attachment =>\n renderAttachment(attachment)\n )}\n </div> `\n : null}\n ${!event.msg.text && !event.msg.attachments\n ? html`<div class=\"unsupported\">Unsupported Message</div>`\n : null}\n <div\n class=\"msg-summary\"\n style=\"flex-direction:row${isInbound ? '-reverse' : ''}\"\n >\n <div style=\"flex-grow:1\"></div>\n ${summary}\n </div>\n </div>\n\n ${!isInbound\n ? html`<div style=\"margin-left:0.8em;margin-top:0.3em\">\n ${event.msg.created_by\n ? html`<div style=\"font-size:0.8em\">\n ${renderAvatar(event.msg.created_by, agent)}\n </div>`\n : renderAvatar({ email: FLOW_USER_ID })}\n </div>`\n : null}\n </div>`;\n};\n\nexport const renderFlowEvent = (event: FlowEvent): TemplateResult => {\n let verb = 'Interrupted';\n let icon = 'x-octagon';\n\n if (event.status !== 'I') {\n if (event.type === Events.FLOW_ENTERED) {\n verb = 'Started';\n icon = 'flow';\n } else {\n verb = 'Completed';\n icon = 'flow';\n }\n }\n\n return html`\n <temba-icon name=\"${icon}\"></temba-icon>\n <div class=\"description\">\n ${verb}\n <span\n class=\"linked\"\n href=\"/flow/editor/${event.flow.uuid}/\"\n onclick=\"goto(event)\"\n >\n ${event.flow.name}\n </span>\n </div>\n `;\n};\n\nexport const renderResultEvent = (event: UpdateResultEvent): TemplateResult => {\n if (event.name.startsWith('_')) {\n return null;\n }\n return html`\n <temba-icon name=\"flow\"></temba-icon>\n <div class=\"description\">\n Updated\n <div class=\"attn\">${event.name}</div>\n to\n <div class=\"attn\">${event.value}</div>\n ${event.category\n ? html`with category\n <div class=\"attn\">${event.category}</div>`\n : null}\n </div>\n `;\n};\n\nexport const renderUpdateEvent = (event: UpdateFieldEvent): TemplateResult => {\n return html`\n <temba-icon name=\"contact\"></temba-icon>\n <div class=\"description\">\n ${event.value\n ? html`Updated\n <div class=\"attn\">${event.field.name}</div>\n to\n <div class=\"attn\">${event.value.text}</div>`\n : html`Cleared\n <div class=\"attn\">${event.field.name}</div>`}\n </div>\n `;\n};\n\nexport const renderNameChanged = (event: NameChangedEvent): TemplateResult => {\n return html`\n <temba-icon name=\"contact\"></temba-icon>\n <div class=\"description\">\n Updated\n <div class=\"attn\">Name</div>\n to\n <div class=\"attn\">${event.name}</div>\n </div>\n `;\n};\n\nexport const renderContactURNsChanged = (\n event: URNsChangedEvent\n): TemplateResult => {\n return html`\n <temba-icon name=\"contact\"></temba-icon>\n <div class=\"description\">\n Updated\n <div class=\"attn\">URNs</div>\n to\n ${oxfordFn(\n event.urns,\n (urn: string) =>\n html`<div class=\"attn\">${urn.split(':')[1].split('?')[0]}</div>`\n )}\n </div>\n </div>\n `;\n};\n\nexport const renderEmailSent = (event: EmailSentEvent): TemplateResult => {\n return html`\n <temba-icon name=\"mail\"></temba-icon>\n <div class=\"description\">\n Email sent to\n <div class=\"attn\">${oxford(event.to, 'and')}</div>\n with subject\n <div class=\"attn\">${event.subject}</div>\n </div>\n `;\n};\n\nexport const renderLabelsAdded = (event: LabelsAddedEvent): TemplateResult => {\n return html`\n <temba-icon name=\"tag\"></temba-icon>\n <div class=\"description\">\n Message labeled with\n <div class=\"attn\">${oxfordNamed(event.labels, 'and')}</div>\n </div>\n `;\n};\n\nexport const renderNoteCreated = (\n event: TicketEvent,\n agent: string\n): TemplateResult => {\n return html`<div style=\"display:flex;align-items:flex-start\">\n <div style=\"display:flex;flex-direction:column\">\n <div class=\"description\">${event.note}</div>\n <div class=\"note-summary\">\n <div style=\"flex-grow:1\"></div>\n <div class=\"time\">${timeSince(new Date(event.created_on))}</div>\n </div>\n </div>\n <div style=\"margin-left:0.8em;margin-top:0.3em;font-size:0.8em\">\n ${renderAvatar(event.created_by, agent)}\n </div>\n </div>`;\n};\n\nconst getTicketIcon = (event: TicketEvent) => {\n let icon = 'inbox';\n if (event.ticket.ticketer.name.indexOf('Email') > -1) {\n icon = 'mail';\n } else if (event.ticket.ticketer.name.indexOf('Zendesk') > -1) {\n icon = 'zendesk';\n }\n return icon;\n};\n\nexport const renderTicketAction = (\n event: TicketEvent,\n action: string,\n grouped: boolean\n): TemplateResult => {\n const reopened = new Date(event.created_on);\n const icon = getTicketIcon(event);\n if (grouped) {\n return html`<div class=\"\" style=\"display: flex\">\n <temba-icon name=\"${icon}\"></temba-icon>\n <div class=\"description\">\n ${getDisplayName(event.created_by)} ${action} a\n <span\n onclick=\"goto(event)\"\n class=\"linked\"\n href=\"/ticket/all/open/${event.ticket.uuid}\"\n >\n ticket\n </span>\n </div>\n </div>`;\n }\n\n return html`\n <div class=\"assigned active\">\n <div style=\"text-align:center\">\n ${getDisplayName(event.created_by)} ${action} this ticket\n </div>\n <div class=\"subtext\" style=\"justify-content:center\">\n ${timeSince(reopened, { hideRecentText: true, suffix: ' ago' })}\n </div>\n </div>\n `;\n};\n\nexport const renderTicketAssigned = (event: TicketEvent): TemplateResult => {\n const created = new Date(event.created_on);\n return html`\n <div class=\"assigned active\">\n <div style=\"text-align:center\">\n ${event.assignee\n ? event.assignee.id === event.created_by.id\n ? html`${getDisplayName(event.created_by)} took this ticket`\n : html`${getDisplayName(event.created_by)} assigned this ticket to\n <div class=\"attn\">${getDisplayName(event.assignee)}</div>`\n : html`${getDisplayName(event.created_by)} unassigned this ticket`}\n </div>\n <div class=\"subtext\" style=\"justify-content:center\">\n ${timeSince(created, { hideRecentText: true, suffix: ' ago' })}\n </div>\n </div>\n `;\n};\n\nexport const renderTicketOpened = (\n event: TicketEvent,\n handleClose: (uuid: string) => void,\n grouped: boolean\n): TemplateResult => {\n const icon = getTicketIcon(event);\n\n if (grouped) {\n return html`<div class=\"\" style=\"display: flex\">\n <temba-icon name=\"${icon}\"></temba-icon>\n <div class=\"description\">\n ${event.ticket.topic.name}\n <span\n class=\"linked\"\n onclick=\"goto(event)\"\n href=\"/tickets/all/open/${event.ticket.uuid}\"\n >ticket</span\n >\n was opened\n </div>\n </div>`;\n } else {\n return html`\n <temba-icon size=\"1.5\" name=\"${icon}\"></temba-icon>\n\n <div class=\"active\" style=\"flex-grow:1;\">\n Opened\n <div class=\"attn\">\n ${event.ticket.topic ? event.ticket.topic.name : 'General'}\n </div>\n <div class=\"subtext\">${timeSince(new Date(event.created_on))}</div>\n </div>\n ${handleClose\n ? html`\n <temba-tip text=\"Resolve\" position=\"left\" style=\"width:1.5em\">\n <temba-icon\n class=\"clickable\"\n size=\"1.5\"\n name=\"check\"\n @click=${() => {\n handleClose(event.ticket.uuid);\n }}\n ?clickable=${open}\n />\n </temba-tip>\n `\n : null}\n `;\n }\n};\n\nexport const renderErrorMessage = (\n event: ErrorMessageEvent\n): TemplateResult => {\n return html`\n <temba-icon\n name=\"alert-triangle\"\n style=\"fill:var(--color-error)\"\n ></temba-icon>\n <div class=\"description\">\n ${event.text}\n ${event.type === Events.FAILURE\n ? html`<div>Run ended prematurely, check the flow design.</div>`\n : null}\n </div>\n `;\n};\n\nexport const renderWebhookEvent = (event: WebhookEvent): TemplateResult => {\n return html`\n <div\n class=\"${event.status === 'success' ? '' : 'failed'}\"\n style=\"display: flex\"\n >\n <temba-icon name=\"external-link\"></temba-icon>\n <div class=\"description\">\n ${event.status === 'success'\n ? html`Successfully called ${event.url}`\n : html`Failed to call ${event.url}`}\n </div>\n </div>\n `;\n};\n\nexport const renderAirtimeTransferredEvent = (\n event: AirtimeTransferredEvent\n): TemplateResult => {\n if (parseFloat(event.actual_amount) === 0) {\n return html`<temba-icon\n name=\"alert-triangle\"\n style=\"fill:var(--color-error)\"\n ></temba-icon>\n <div class=\"description error\">Airtime transfer failed</div>`;\n }\n\n return html`<temba-icon name=\"dollar-sign\"></temba-icon>\n <div class=\"description\">\n Transferred\n <div class=\"attn\">${event.actual_amount} ${event.currency}</div>\n of airtime\n </div>`;\n};\n\nexport const renderCallStartedEvent = (): TemplateResult => {\n return html`<temba-icon name=\"phone\"></temba-icon>\n <div class=\"description\">Call Started</div>`;\n};\n\nexport const renderContactLanguageChangedEvent = (\n event: ContactLanguageChangedEvent\n): TemplateResult => {\n return html`<temba-icon name=\"contact\"></temba-icon>\n <div class=\"description\">\n Language updated to <span class=\"attn\">${event.language}</span>\n </div>`;\n};\n\nexport const renderChannelEvent = (event: ChannelEvent): TemplateResult => {\n let eventMessage = '';\n let icon = 'phone';\n\n if (event.channel_event_type === 'mt_miss') {\n eventMessage = 'Missed outgoing call';\n icon = 'phone-missed';\n } else if (event.channel_event_type === 'mo_miss') {\n eventMessage = 'Missed incoming call';\n icon = 'phone-missed';\n } else if (event.channel_event_type === 'new_conversation') {\n eventMessage = 'Started Conversation';\n icon = 'zap';\n } else if (event.channel_event_type === 'welcome_message') {\n eventMessage = 'Welcome Message Sent';\n icon = 'zap';\n } else if (event.channel_event_type === 'referral') {\n eventMessage = 'Referred';\n icon = 'zap';\n } else if (event.channel_event_type === 'follow') {\n eventMessage = 'Followed';\n icon = 'zap';\n } else if (event.channel_event_type === 'stop_contact') {\n eventMessage = 'Stopped';\n icon = 'x-octagon';\n } else if (event.channel_event_type === 'mt_call') {\n eventMessage = 'Outgoing Phone Call';\n } else if (event.channel_event_type == 'mo_call') {\n eventMessage = 'Incoming Phone call';\n }\n\n return html`<temba-icon name=\"${icon}\"></temba-icon>\n <div class=\"description\">${eventMessage}</div>`;\n};\n\nexport const renderCampaignFiredEvent = (\n event: CampaignFiredEvent\n): TemplateResult => {\n return html`<temba-icon name=\"campaign\"></temba-icon>\n <div class=\"description\">\n Campaign\n <span\n class=\"linked\"\n onclick=\"goto(event)\"\n href=\"/campaign/read/${event.campaign.uuid}\"\n >${event.campaign.name}</span\n >\n ${event.fired_result === 'S' ? 'skipped' : 'triggered'}\n <span\n class=\"linked\"\n onclick=\"goto(event)\"\n href=\"/campaignevent/read/${event.campaign.uuid}/${event.campaign_event\n .id}\"\n >\n ${event.campaign_event.offset_display}\n ${event.campaign_event.relative_to.name}</span\n >\n </div>`;\n};\n\nexport const renderContactGroupsEvent = (\n event: ContactGroupsEvent\n): TemplateResult => {\n const groups = event.groups_added \|\| event.groups_removed;\n const added = !!event.groups_added;\n return html`\n <temba-icon\n name=\"users\"\n class=\"${getClasses({ added: added, removed: !added })}\"\n ></temba-icon>\n <div class=\"description\">\n ${added ? 'Added to' : 'Removed from'}\n ${oxfordFn(\n groups,\n (group: ObjectReference) =>\n html`<span\n class=\"linked\"\n onclick=\"goto(event)\"\n href=\"/contact/filter/${group.uuid}\"\n >${group.name}</span\n >`\n )}\n ${event.type === Events.FAILURE\n ? html`<div>Run ended prematurely, check the flow design.</div>`\n : null}\n </div>\n `;\n};\n"]}
1	+ {"version":3,"file":"events.js","sourceRoot":"","sources":["../../../src/contacts/events.ts"],"names":[],"mappings":"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","sourcesContent":["import { css, html, TemplateResult } from 'lit';\nimport { Msg, ObjectReference, User } from '../interfaces';\nimport { getClasses, oxford, oxfordFn, oxfordNamed, timeSince } from '../utils';\nimport { getDisplayName } from './helpers';\n\nexport const getEventStyles = () => {\n return css`\n .grouping {\n margin-top: 1em;\n }\n\n .grouping.verbose {\n background: #f9f9f9;\n color: var(--color-dark);\n --color-link-primary: rgba(38, 166, 230, 1);\n pointer-events: none;\n background: #fefefe;\n box-shadow: -8px 0px 8px 1px rgba(0, 0, 0, 0.05) inset;\n margin-right: -16px;\n padding-right: 16px;\n margin-bottom: 1.3em;\n }\n\n .grouping .items {\n display: block;\n }\n\n .grouping.verbose .items {\n opacity: 0;\n max-height: 0;\n display: flex;\n flex-direction: column;\n user-select: none;\n }\n\n .grouping.flows .items {\n padding: 0;\n }\n\n .grouping.messages .items {\n display: flex;\n flex-direction: column;\n margin: 0em 0.75em;\n }\n\n .grouping.verbose.expanded .items {\n transition: max-height var(--transition-speed) ease-in-out,\n opacity var(--transition-speed) ease-in-out;\n opacity: 1;\n max-height: 1000px;\n padding: 1em 1em;\n }\n\n .grouping.verbose.expanded {\n border-top: 1px solid #f3f3f3;\n border-bottom: 1px solid #f3f3f3;\n }\n\n .grouping.verbose.expanded,\n .grouping.verbose .event-count {\n pointer-events: auto;\n }\n\n .grouping.verbose temba-icon {\n }\n\n .grouping.verbose > .event,\n .grouping.verbose > pre {\n max-height: 0px;\n padding-top: 0;\n padding-bottom: 0;\n margin-top: 0;\n margin-bottom: 0;\n opacity: 0;\n }\n\n .grouping.verbose .attn {\n color: #666;\n }\n\n .event-count {\n position: relative;\n font-size: 0.8em;\n text-align: center;\n margin: 0 auto;\n display: table;\n padding: 3px 10px;\n font-weight: 400;\n color: #999;\n cursor: pointer;\n width: 100%;\n opacity: 1;\n z-index: 1;\n }\n\n .event-count temba-icon {\n display: inline-block;\n position: absolute;\n right: 5px;\n top: 5px;\n }\n\n .event-count:hover {\n color: var(--color-link-primary-hover);\n }\n\n .expanded .event-count {\n padding: 0;\n pointer-events: none;\n }\n\n .grouping.flows {\n margin-left: 1em;\n margin-right: 1em;\n margin-bottom: 1.5em;\n\n border: 1px solid #f2f2f2;\n border-radius: var(--curvature);\n padding: 0.5em 1em;\n }\n\n .grouping.flows .event {\n margin: 0;\n padding: 0;\n }\n\n .grouping.tickets {\n margin-bottom: 2em;\n }\n\n pre {\n white-space: pre-wrap;\n word-wrap: break-word;\n }\n\n .grouping.verbose.expanded .event,\n .grouping.verbose.expanded pre {\n max-height: 500px;\n opacity: 1;\n }\n\n .grouping-close-button {\n position: relative;\n display: inline-block;\n opacity: 0;\n float: right;\n --icon-color: #666;\n }\n\n .grouping.verbose.expanded:hover .grouping-close-button {\n opacity: 1;\n }\n\n .grouping.messages,\n .grouping.tickets {\n display: flex;\n flex-direction: column;\n }\n\n .event {\n margin: 0.25em 0.5em;\n border-radius: var(--curvature);\n flex-grow: 1;\n }\n\n .msg {\n padding: var(--event-padding);\n border-radius: 8px;\n border: 2px solid rgba(100, 100, 100, 0.1);\n max-width: 300px;\n }\n\n .event.msg_received .msg {\n background: rgba(200, 200, 200, 0.1);\n }\n\n .event.msg_created,\n .event.broadcast_created,\n .event.ivr_created,\n .tickets .event.ticket_note_added {\n align-self: flex-end;\n }\n\n .event.msg_created .msg,\n .event.broadcast_created .msg,\n .event.ivr_created .msg {\n background: rgb(231, 243, 255);\n }\n\n .webhook_called {\n fill: #e68628;\n word-break: break-all;\n }\n\n .webhook_called .failed {\n fill: var(--color-error);\n color: var(--color-error);\n }\n\n .input_labels_added,\n .contact_name_changed,\n .contact_field_changed,\n .contact_urns_changed,\n .contact_language_changed,\n .run_result_changed {\n fill: rgba(1, 193, 175, 1);\n }\n\n .email_sent {\n fill: #8e5ea7;\n }\n\n .contact_groups_changed .added {\n fill: #309c42;\n }\n .contact_groups_changed .removed {\n fill: var(--color-error);\n }\n\n .event.error .description,\n .event.failure .description {\n color: var(--color-error);\n }\n\n .description.error {\n color: var(--color-error);\n }\n\n .info {\n border: 1px solid rgba(100, 100, 100, 0.2);\n background: rgba(10, 10, 10, 0.02);\n }\n\n .tickets .ticket_note_added {\n max-width: 300px;\n }\n\n .tickets .note-summary {\n display: flex;\n flex-direction: row;\n line-height: 0.5;\n font-size: 80%;\n color: rgba(0, 0, 0, 0.6);\n padding: 8px 3px;\n }\n\n .tickets .ticket_note_added .description {\n border: 2px solid rgba(100, 100, 100, 0.1);\n background: rgb(255, 249, 194);\n padding: var(--event-padding);\n border-radius: 8px;\n }\n\n .channel_event {\n fill: rgb(230, 230, 230);\n }\n\n .airtime_transferred,\n .flow_exited,\n .flow_entered,\n .ticket_opened,\n .ticket_reopened,\n .ticket_closed,\n .call_started,\n .campaign_fired {\n fill: rgba(223, 65, 159, 1);\n }\n\n .active-ticket.ticket_opened {\n padding: 0em 1em;\n }\n\n .ticket_opened temba-icon.clickable[name='check'] {\n fill: rgba(100, 100, 100, 1);\n }\n\n .ticket_opened .active {\n color: var(--color-text);\n }\n\n .ticket_closed .inactive .subtext {\n display: none;\n }\n\n .attn {\n color: var(--color-text);\n }\n\n .flow_exited,\n .flow_entered {\n align-self: center;\n max-width: 80%;\n display: flex;\n flex-direction: row;\n }\n\n .flow_exited temba-icon,\n .flow_entered temba-icon {\n }\n\n .event {\n display: flex;\n align-items: center;\n }\n\n .event .description {\n flex-grow: 1;\n }\n\n .msg-summary {\n display: flex;\n line-height: 0.5;\n\n font-size: 80%;\n color: rgba(0, 0, 0, 0.6);\n padding: 6px 3px;\n margin-bottom: 0.5em;\n }\n\n .msg-summary temba-icon[name='log'] {\n --icon-color: rgba(0, 0, 0, 0.2);\n }\n\n .msg-summary temba-icon[name='log']:hover {\n --icon-color: var(--color-link-primary-hover);\n cursor: pointer;\n }\n\n .msg-summary temba-icon.error[name='log'] {\n --icon-color: rgba(var(--error-rgb), 0.75);\n }\n\n .msg-summary temba-icon.error[name='log']:hover {\n --icon-color: var(--color-error);\n cursor: pointer;\n }\n\n .msg-summary temba-icon[name='megaphone'] {\n --icon-color: rgba(90, 90, 90, 0.5);\n }\n\n .msg-summary * {\n display: flex;\n margin-right: 1px;\n margin-left: 1px;\n }\n\n .unsupported {\n border: 1px solid #f2f2f2;\n color: #999;\n padding: 0.5em 1em;\n border-radius: var(--curvature);\n }\n\n .time {\n padding: 0.3em 1px;\n }\n\n .status {\n padding: 0.3em 3px;\n }\n\n .separator {\n padding: 0.3em 0px;\n }\n\n .recipients {\n padding: 0.3em 3px;\n }\n\n .verbose temba-icon,\n .flows temba-icon,\n .tickets temba-icon {\n margin-right: 0.75em;\n }\n\n temba-icon[name='check'] {\n }\n\n .attn {\n display: inline-block;\n font-weight: 500;\n margin: 0px 2px;\n }\n\n .subtext {\n font-size: 80%;\n }\n\n .body-pre {\n white-space: pre-wrap;\n word-wrap: break-word;\n font-size: 90%;\n }\n\n a,\n .linked {\n color: var(--color-link-primary);\n cursor: pointer;\n }\n\n a:hover,\n .linked:hover {\n text-decoration: underline;\n color: var(--color-link-primary-hover);\n }\n\n temba-icon[name='alert-triangle'] {\n --icon-color: var(--color-error);\n }\n\n .flow {\n fill: #ddd;\n background: #fff;\n width: 18px;\n height: 18px;\n padding-top: 4px;\n padding-left: 9px;\n border: 0px solid #f3f3f3;\n }\n\n .assigned {\n color: #777;\n max-width: 300px;\n margin-left: auto;\n margin-right: auto;\n display: flex;\n flex-direction: column;\n align-items: center;\n margin-bottom: 10px;\n }\n\n .assigned .attn {\n color: #777;\n }\n\n .attachments {\n margin-top: 1em;\n }\n `;\n};\n\nconst FLOW_USER_ID = 'flow';\n\nexport interface EventGroup {\n type: string;\n events: ContactEvent[];\n open: boolean;\n}\n\nexport enum Events {\n MESSAGE_CREATED = 'msg_created',\n MESSAGE_RECEIVED = 'msg_received',\n BROADCAST_CREATED = 'broadcast_created',\n IVR_CREATED = 'ivr_created',\n FLOW_ENTERED = 'flow_entered',\n FLOW_EXITED = 'flow_exited',\n RUN_RESULT_CHANGED = 'run_result_changed',\n CONTACT_FIELD_CHANGED = 'contact_field_changed',\n CONTACT_GROUPS_CHANGED = 'contact_groups_changed',\n CONTACT_NAME_CHANGED = 'contact_name_changed',\n CONTACT_URNS_CHANGED = 'contact_urns_changed',\n CAMPAIGN_FIRED = 'campaign_fired',\n CHANNEL_EVENT = 'channel_event',\n CONTACT_LANGUAGE_CHANGED = 'contact_language_changed',\n WEBHOOK_CALLED = 'webhook_called',\n AIRTIME_TRANSFERRED = 'airtime_transferred',\n CALL_STARTED = 'call_started',\n EMAIL_SENT = 'email_sent',\n INPUT_LABELS_ADDED = 'input_labels_added',\n NOTE_CREATED = 'note_created',\n TICKET_ASSIGNED = 'ticket_assigned',\n TICKET_NOTE_ADDED = 'ticket_note_added',\n TICKET_CLOSED = 'ticket_closed',\n TICKET_OPENED = 'ticket_opened',\n TICKET_REOPENED = 'ticket_reopened',\n ERROR = 'error',\n FAILURE = 'failure',\n}\n\nexport interface ContactEvent {\n type: string;\n created_on: string;\n}\n\nexport interface ChannelEvent extends ContactEvent {\n channel_event_type: string;\n duration: number;\n}\n\nexport interface ContactLanguageChangedEvent extends ContactEvent {\n language: string;\n step_uuid: string;\n session_uuid: string;\n}\n\nexport interface MsgEvent extends ContactEvent {\n msg: Msg;\n status: string;\n failed_reason?: string;\n failed_reason_display?: string;\n logs_url: string;\n msg_type: string;\n recipient_count?: number;\n created_by?: User;\n}\n\nexport interface FlowEvent extends ContactEvent {\n flow: ObjectReference;\n status: string;\n}\n\nexport interface EmailSentEvent extends ContactEvent {\n to: string[];\n subject: string;\n body: string;\n}\n\nexport interface URNsChangedEvent extends ContactEvent {\n urns: string[];\n}\n\nexport interface TicketEvent extends ContactEvent {\n note?: string;\n assignee?: User;\n ticket: {\n uuid: string;\n ticketer: ObjectReference;\n body: string;\n topic?: ObjectReference;\n external_id?: string;\n closed_on?: string;\n opened_on?: string;\n };\n created_by?: User;\n}\n\nexport interface LabelsAddedEvent extends ContactEvent {\n labels: ObjectReference[];\n}\n\nexport interface NameChangedEvent extends ContactEvent {\n name: string;\n}\n\nexport interface UpdateFieldEvent extends ContactEvent {\n field: { key: string; name: string };\n value: { text: string };\n}\n\nexport interface ErrorMessageEvent extends ContactEvent {\n text: string;\n}\n\nexport interface UpdateResultEvent extends ContactEvent {\n name: string;\n value: string;\n category: string;\n input: string;\n}\n\nexport interface ContactGroupsEvent extends ContactEvent {\n groups_added: ObjectReference[];\n groups_removed: ObjectReference[];\n}\n\nexport interface WebhookEvent extends ContactEvent {\n status: string;\n status_code: number;\n elapsed_ms: number;\n logs_url: string;\n url: string;\n}\n\nexport interface AirtimeTransferredEvent extends ContactEvent {\n sender: string;\n recipient: string;\n currency: string;\n desired_amount: string;\n actual_amount: string;\n logs_url: string;\n}\n\nexport type CallStartedEvent = ContactEvent;\nexport interface CampaignFiredEvent extends ContactEvent {\n campaign: { uuid: string; id: number; name: string };\n campaign_event: {\n id: number;\n offset_display: string;\n relative_to: { key: string; name: string };\n };\n fired_result: string;\n}\n\nexport interface ContactHistoryPage {\n has_older: boolean;\n recent_only: boolean;\n next_before: number;\n next_after: number;\n start_date: Date;\n events: ContactEvent[];\n}\n\nexport const getEventGroupType = (event: ContactEvent, ticket: string) => {\n if (!event) {\n return 'messages';\n }\n switch (event.type) {\n case Events.TICKET_ASSIGNED:\n case Events.TICKET_NOTE_ADDED:\n case Events.TICKET_OPENED:\n case Events.TICKET_CLOSED:\n case Events.TICKET_REOPENED:\n if (!ticket) {\n return 'verbose';\n }\n\n if ((event as TicketEvent).ticket.uuid === ticket) {\n return 'tickets';\n }\n\n break;\n case Events.FLOW_ENTERED:\n case Events.FLOW_EXITED:\n return 'flows';\n case Events.BROADCAST_CREATED:\n case Events.MESSAGE_CREATED:\n case Events.MESSAGE_RECEIVED:\n case Events.IVR_CREATED:\n return 'messages';\n }\n return 'verbose';\n};\n\nexport const renderAvatar = (user: User, agent = '') => {\n const current = user && user.email === agent;\n if (user.email === FLOW_USER_ID \|\| !user \|\| !user.first_name) {\n return html`<temba-tip text=\"Automated message\" position=\"top\"\n ><div class=\"avatar flow\" style=\"margin-top:0.5em\">\n <temba-icon size=\"1\" name=\"activity\" /></div\n ></temba-tip>`;\n } else {\n return html`<temba-tip\n text=\"${user.first_name + ' ' + user.last_name}\"\n position=\"top\"\n >\n <div\n class=\"avatar\"\n style=\"\n border-radius: 9999px; \n display:flex;\n align-items:center;\n border: 2px solid rgba(0,0,0,.05);\n background: ${current ? 'var(--color-primary-dark)' : '#eee'};\n color: ${current ? '#fff' : '#999'} ;\n font-weight: 400;\n padding: 0.5em;\n line-height:1.2em;\n \"\n >\n ${user.first_name[0] + user.last_name[0]}\n </div>\n </temba-tip>`;\n }\n};\n\nexport const renderAttachment = (attachment: string): TemplateResult => {\n const idx = attachment.indexOf(':');\n const attType = attachment.substr(0, idx);\n const url = attachment.substr(idx + 1);\n const [mediaType, ext] = attType.split('/', 2);\n\n let inner = null;\n if (mediaType === 'image') {\n inner = html`<div class=\"linked\" onclick=\"goto(event)\" href=\"${url}\"><img src=\"${url}\" style=\"width:100%;height:auto;display:block\"></img></a>`;\n } else if (ext === 'pdf') {\n return html`<div\n style=\"width:100%;height:300px;border-radius:var(--curvature);box-shadow:0px 0px 12px 0px rgba(0,0,0,.1), 0px 0px 2px 0px rgba(0,0,0,.15);overflow:hidden\"\n ><embed src=\"${url}#view=Fit\" type=\"application/pdf\" frameBorder=\"0\" scrolling=\"auto\" height=\"100%\" width=\"100%\"></embed></div>`;\n } else if (mediaType === 'video') {\n return html`<video\n style=\"border-radius:var(--curvature);box-shadow:0px 0px 12px 0px rgba(0,0,0,.1), 0px 0px 2px 0px rgba(0,0,0,.15);\"\n max-width=\"400px\"\n height=\"auto\"\n controls\n >\n <source src=\"${url}\" type=\"video/mp4\" />\n </video> `;\n } else if (mediaType === 'audio') {\n return html`<audio\n style=\"border-radius: 99px; box-shadow:0px 0px 12px 0px rgba(0,0,0,.1), 0px 0px 2px 0px rgba(0,0,0,.15);\"\n src=\"${url}\"\n type=\"${attType}\"\n controls\n >\n <a target=\"_\" href=\"${url}\">${url}</a>\n </audio>`;\n } else if (attType === 'geo') {\n const [lat, long] = url.split(',');\n const latFloat = parseFloat(lat);\n const longFloat = parseFloat(long);\n const geo = `${lat}000000%2C${long}000000`;\n\n return html` <iframe\n style=\"border-radius: var(--curvature);box-shadow:0px 0px 12px 0px rgba(0,0,0,.1), 0px 0px 2px 0px rgba(0,0,0,.15);\"\n width=\"300\"\n height=\"300\"\n frameborder=\"0\"\n scrolling=\"no\"\n marginheight=\"0\"\n marginwidth=\"0\"\n src=\"https://www.openstreetmap.org/export/embed.html?bbox=${longFloat -\n 0.005}000000%2C${latFloat - 0.005}%2C${longFloat +\n 0.005}000000%2C${latFloat +\n 0.005}000000&layer=mapnik&marker=${geo}\"\n ></iframe>`;\n } else {\n return html`<div style=\"display:flex\">\n <temba-icon name=\"download\"></temba-icon>\n <div>Attachment ${ext}</div>\n </div>`;\n }\n\n return html`<div\n style=\"width:100%;max-width:300px;border-radius:var(--curvature); box-shadow:0px 0px 6px 0px rgba(0,0,0,.15);overflow:hidden\"\n >\n ${inner}\n </div>`;\n};\n\nexport const renderMsgEvent = (\n event: MsgEvent,\n agent: string\n): TemplateResult => {\n const isInbound = event.type === Events.MESSAGE_RECEIVED;\n const isError = event.status === 'E';\n const isFailure = event.status === 'F';\n\n // summary items which appear under the message bubble\n const summary: TemplateResult[] = [];\n if (event.logs_url) {\n summary.push(html` <div class=\"icon-link\">\n <temba-icon\n onclick=\"goto(event)\"\n href=\"${event.logs_url}\"\n name=\"log\"\n class=\"${isError \|\| isFailure ? 'error' : ''}\"\n ></temba-icon>\n </div>`);\n } else if (isError) {\n summary.push(\n html`<temba-icon\n title=\"Message delivery error\"\n name=\"alert-triangle\"\n ></temba-icon>`\n );\n } else if (isFailure) {\n summary.push(\n html`<temba-icon\n title=\"Message delivery failure: ${event.failed_reason_display}\"\n name=\"alert-triangle\"\n ></temba-icon>`\n );\n }\n if (event.recipient_count > 1) {\n summary.push(html`<temba-icon size=\"1\" name=\"megaphone\"></temba-icon>\n <div class=\"recipients\">${event.recipient_count} contacts</div>\n <div class=\"separator\">•</div>`);\n }\n summary.push(\n html`<div class=\"time\">${timeSince(new Date(event.created_on))}</div>`\n );\n\n return html`<div style=\"display:flex;align-items:flex-start\">\n <div style=\"display:flex;flex-direction:column\">\n ${event.msg.text ? html`<div class=\"msg\">${event.msg.text}</div>` : null}\n ${event.msg.attachments\n ? html`<div class=\"attachments\">\n ${event.msg.attachments.map(attachment =>\n renderAttachment(attachment)\n )}\n </div> `\n : null}\n ${!event.msg.text && !event.msg.attachments\n ? html`<div class=\"unsupported\">Unsupported Message</div>`\n : null}\n <div\n class=\"msg-summary\"\n style=\"flex-direction:row${isInbound ? '-reverse' : ''}\"\n >\n <div style=\"flex-grow:1\"></div>\n ${summary}\n </div>\n </div>\n\n ${!isInbound\n ? html`<div style=\"margin-left:0.8em;margin-top:0.3em\">\n ${event.msg.created_by\n ? html`<div style=\"font-size:0.8em\">\n ${renderAvatar(event.msg.created_by, agent)}\n </div>`\n : renderAvatar({ email: FLOW_USER_ID })}\n </div>`\n : null}\n </div>`;\n};\n\nexport const renderFlowEvent = (event: FlowEvent): TemplateResult => {\n let verb = 'Interrupted';\n let icon = 'x-octagon';\n\n if (event.status !== 'I') {\n if (event.type === Events.FLOW_ENTERED) {\n verb = 'Started';\n icon = 'flow';\n } else {\n verb = 'Completed';\n icon = 'flow';\n }\n }\n\n return html`\n <temba-icon name=\"${icon}\"></temba-icon>\n <div class=\"description\">\n ${verb}\n <span\n class=\"linked\"\n href=\"/flow/editor/${event.flow.uuid}/\"\n onclick=\"goto(event)\"\n >\n ${event.flow.name}\n </span>\n </div>\n `;\n};\n\nexport const renderResultEvent = (event: UpdateResultEvent): TemplateResult => {\n if (event.name.startsWith('_')) {\n return null;\n }\n return html`\n <temba-icon name=\"flow\"></temba-icon>\n <div class=\"description\">\n Updated\n <div class=\"attn\">${event.name}</div>\n to\n <div class=\"attn\">${event.value}</div>\n ${event.category\n ? html`with category\n <div class=\"attn\">${event.category}</div>`\n : null}\n </div>\n `;\n};\n\nexport const renderUpdateEvent = (event: UpdateFieldEvent): TemplateResult => {\n return html`\n <temba-icon name=\"contact\"></temba-icon>\n <div class=\"description\">\n ${event.value\n ? html`Updated\n <div class=\"attn\">${event.field.name}</div>\n to\n <div class=\"attn\">${event.value.text}</div>`\n : html`Cleared\n <div class=\"attn\">${event.field.name}</div>`}\n </div>\n `;\n};\n\nexport const renderNameChanged = (event: NameChangedEvent): TemplateResult => {\n return html`\n <temba-icon name=\"contact\"></temba-icon>\n <div class=\"description\">\n Updated\n <div class=\"attn\">Name</div>\n to\n <div class=\"attn\">${event.name}</div>\n </div>\n `;\n};\n\nexport const renderContactURNsChanged = (\n event: URNsChangedEvent\n): TemplateResult => {\n return html`\n <temba-icon name=\"contact\"></temba-icon>\n <div class=\"description\">\n Updated\n <div class=\"attn\">URNs</div>\n to\n ${oxfordFn(\n event.urns,\n (urn: string) =>\n html`<div class=\"attn\">${urn.split(':')[1].split('?')[0]}</div>`\n )}\n </div>\n </div>\n `;\n};\n\nexport const renderEmailSent = (event: EmailSentEvent): TemplateResult => {\n return html`\n <temba-icon name=\"mail\"></temba-icon>\n <div class=\"description\">\n Email sent to\n <div class=\"attn\">${oxford(event.to, 'and')}</div>\n with subject\n <div class=\"attn\">${event.subject}</div>\n </div>\n `;\n};\n\nexport const renderLabelsAdded = (event: LabelsAddedEvent): TemplateResult => {\n return html`\n <temba-icon name=\"tag\"></temba-icon>\n <div class=\"description\">\n Message labeled with\n <div class=\"attn\">${oxfordNamed(event.labels, 'and')}</div>\n </div>\n `;\n};\n\nexport const renderNoteCreated = (\n event: TicketEvent,\n agent: string\n): TemplateResult => {\n return html`<div style=\"display:flex;align-items:flex-start\">\n <div style=\"display:flex;flex-direction:column\">\n <div class=\"description\">${event.note}</div>\n <div class=\"note-summary\">\n <div style=\"flex-grow:1\"></div>\n <div class=\"time\">${timeSince(new Date(event.created_on))}</div>\n </div>\n </div>\n <div style=\"margin-left:0.8em;margin-top:0.3em;font-size:0.8em\">\n ${renderAvatar(event.created_by, agent)}\n </div>\n </div>`;\n};\n\nconst getTicketIcon = (event: TicketEvent) => {\n let icon = 'inbox';\n if (event.ticket.ticketer.name.indexOf('Email') > -1) {\n icon = 'mail';\n } else if (event.ticket.ticketer.name.indexOf('Zendesk') > -1) {\n icon = 'zendesk';\n }\n return icon;\n};\n\nexport const renderTicketAction = (\n event: TicketEvent,\n action: string,\n grouped: boolean\n): TemplateResult => {\n const reopened = new Date(event.created_on);\n const icon = getTicketIcon(event);\n if (grouped) {\n return html`<div class=\"\" style=\"display: flex\">\n <temba-icon name=\"${icon}\"></temba-icon>\n <div class=\"description\">\n ${getDisplayName(event.created_by)} ${action} a\n <span\n onclick=\"goto(event)\"\n class=\"linked\"\n href=\"/ticket/all/open/${event.ticket.uuid}\"\n >\n ticket\n </span>\n </div>\n </div>`;\n }\n\n return html`\n <div class=\"assigned active\">\n <div style=\"text-align:center\">\n ${getDisplayName(event.created_by)} ${action} this ticket\n </div>\n <div class=\"subtext\" style=\"justify-content:center\">\n ${timeSince(reopened, { hideRecentText: true, suffix: ' ago' })}\n </div>\n </div>\n `;\n};\n\nexport const renderTicketAssigned = (event: TicketEvent): TemplateResult => {\n const created = new Date(event.created_on);\n return html`\n <div class=\"assigned active\">\n <div style=\"text-align:center\">\n ${event.assignee\n ? event.assignee.id === event.created_by.id\n ? html`${getDisplayName(event.created_by)} took this ticket`\n : html`${getDisplayName(event.created_by)} assigned this ticket to\n <div class=\"attn\">${getDisplayName(event.assignee)}</div>`\n : html`${getDisplayName(event.created_by)} unassigned this ticket`}\n </div>\n <div class=\"subtext\" style=\"justify-content:center\">\n ${timeSince(created, { hideRecentText: true, suffix: ' ago' })}\n </div>\n </div>\n `;\n};\n\nexport const renderTicketOpened = (\n event: TicketEvent,\n handleClose: (uuid: string) => void,\n grouped: boolean\n): TemplateResult => {\n const icon = getTicketIcon(event);\n\n if (grouped) {\n return html`<div class=\"\" style=\"display: flex\">\n <temba-icon name=\"${icon}\"></temba-icon>\n <div class=\"description\">\n ${event.ticket.topic.name}\n <span\n class=\"linked\"\n onclick=\"goto(event)\"\n href=\"/tickets/all/open/${event.ticket.uuid}\"\n >ticket</span\n >\n was opened\n </div>\n </div>`;\n } else {\n return html`\n <temba-icon size=\"1.5\" name=\"${icon}\"></temba-icon>\n\n <div class=\"active\" style=\"flex-grow:1;\">\n Opened\n <div class=\"attn\">\n ${event.ticket.topic ? event.ticket.topic.name : 'General'}\n </div>\n <div class=\"subtext\">${timeSince(new Date(event.created_on))}</div>\n </div>\n ${handleClose\n ? html`\n <temba-tip text=\"Resolve\" position=\"left\" style=\"width:1.5em\">\n <temba-icon\n class=\"clickable\"\n size=\"1.5\"\n name=\"check\"\n @click=${() => {\n handleClose(event.ticket.uuid);\n }}\n ?clickable=${open}\n />\n </temba-tip>\n `\n : null}\n `;\n }\n};\n\nexport const renderErrorMessage = (\n event: ErrorMessageEvent\n): TemplateResult => {\n return html`\n <temba-icon\n name=\"alert-triangle\"\n style=\"fill:var(--color-error)\"\n ></temba-icon>\n <div class=\"description\">\n ${event.text}\n ${event.type === Events.FAILURE\n ? html`<div>Run ended prematurely, check the flow design.</div>`\n : null}\n </div>\n `;\n};\n\nexport const renderWebhookEvent = (event: WebhookEvent): TemplateResult => {\n return html`\n <div\n class=\"${event.status === 'success' ? '' : 'failed'}\"\n style=\"display: flex\"\n >\n <temba-icon name=\"external-link\"></temba-icon>\n <div class=\"description\">\n ${event.status === 'success'\n ? html`Successfully called ${event.url}`\n : html`Failed to call ${event.url}`}\n </div>\n </div>\n `;\n};\n\nexport const renderAirtimeTransferredEvent = (\n event: AirtimeTransferredEvent\n): TemplateResult => {\n if (parseFloat(event.actual_amount) === 0) {\n return html`<temba-icon\n name=\"alert-triangle\"\n style=\"fill:var(--color-error)\"\n ></temba-icon>\n <div class=\"description error\">Airtime transfer failed</div>`;\n }\n\n return html`<temba-icon name=\"dollar-sign\"></temba-icon>\n <div class=\"description\">\n Transferred\n <div class=\"attn\">${event.actual_amount} ${event.currency}</div>\n of airtime\n </div>`;\n};\n\nexport const renderCallStartedEvent = (): TemplateResult => {\n return html`<temba-icon name=\"phone\"></temba-icon>\n <div class=\"description\">Call Started</div>`;\n};\n\nexport const renderContactLanguageChangedEvent = (\n event: ContactLanguageChangedEvent\n): TemplateResult => {\n return html`<temba-icon name=\"contact\"></temba-icon>\n <div class=\"description\">\n Language updated to <span class=\"attn\">${event.language}</span>\n </div>`;\n};\n\nexport const renderChannelEvent = (event: ChannelEvent): TemplateResult => {\n let eventMessage = '';\n let icon = 'phone';\n\n if (event.channel_event_type === 'mt_miss') {\n eventMessage = 'Missed outgoing call';\n icon = 'phone-missed';\n } else if (event.channel_event_type === 'mo_miss') {\n eventMessage = 'Missed incoming call';\n icon = 'phone-missed';\n } else if (event.channel_event_type === 'new_conversation') {\n eventMessage = 'Started Conversation';\n icon = 'zap';\n } else if (event.channel_event_type === 'welcome_message') {\n eventMessage = 'Welcome Message Sent';\n icon = 'zap';\n } else if (event.channel_event_type === 'referral') {\n eventMessage = 'Referred';\n icon = 'zap';\n } else if (event.channel_event_type === 'follow') {\n eventMessage = 'Followed';\n icon = 'zap';\n } else if (event.channel_event_type === 'stop_contact') {\n eventMessage = 'Stopped';\n icon = 'x-octagon';\n } else if (event.channel_event_type === 'mt_call') {\n eventMessage = 'Outgoing Phone Call';\n } else if (event.channel_event_type == 'mo_call') {\n eventMessage = 'Incoming Phone call';\n }\n\n return html`<temba-icon name=\"${icon}\"></temba-icon>\n <div class=\"description\">${eventMessage}</div>`;\n};\n\nexport const renderCampaignFiredEvent = (\n event: CampaignFiredEvent\n): TemplateResult => {\n return html`<temba-icon name=\"campaign\"></temba-icon>\n <div class=\"description\">\n Campaign\n <span\n class=\"linked\"\n onclick=\"goto(event)\"\n href=\"/campaign/read/${event.campaign.uuid}\"\n >${event.campaign.name}</span\n >\n ${event.fired_result === 'S' ? 'skipped' : 'triggered'}\n <span\n class=\"linked\"\n onclick=\"goto(event)\"\n href=\"/campaignevent/read/${event.campaign.uuid}/${event.campaign_event\n .id}\"\n >\n ${event.campaign_event.offset_display}\n ${event.campaign_event.relative_to.name}</span\n >\n </div>`;\n};\n\nexport const renderContactGroupsEvent = (\n event: ContactGroupsEvent\n): TemplateResult => {\n const groups = event.groups_added \|\| event.groups_removed;\n const added = !!event.groups_added;\n return html`\n <temba-icon\n name=\"users\"\n class=\"${getClasses({ added: added, removed: !added })}\"\n ></temba-icon>\n <div class=\"description\">\n ${added ? 'Added to' : 'Removed from'}\n ${oxfordFn(\n groups,\n (group: ObjectReference) =>\n html`<span\n class=\"linked\"\n onclick=\"goto(event)\"\n href=\"/contact/filter/${group.uuid}\"\n >${group.name}</span\n >`\n )}\n ${event.type === Events.FAILURE\n ? html`<div>Run ended prematurely, check the flow design.</div>`\n : null}\n </div>\n `;\n};\n"]}

package/out-tsc/src/label/Label.js CHANGED Viewed

@@ -22,6 +22,7 @@ export default class Label extends LitElement {
       temba-icon {
         margin-right: 0.3em;
+        padding-bottom: 0.1em;
       }
       .label.clickable .mask:hover {
@@ -32,50 +33,35 @@ export default class Label extends LitElement {
         font-size: 0.8em;
         font-weight: 400;
         border-radius: 12px;
+        box-shadow: 0 0.04em 0.08em rgba(0, 0, 0, 0.15);
+        background: var(--color-overlay-light);
+        color: var(--color-overlay-light-text);
+        --icon-color: var(--color-overlay-light-text);
+        text-shadow: none;
+      }
+      .danger {
         background: tomato;
         color: #fff;
-        text-shadow: 0 0.04em 0.04em rgba(0, 0, 0, 0.35);
+        --icon-color: #fff;
       }
       .primary {
-        background: var(--color-label-primary);
-        color: var(--color-label-primary-text);
-        --icon-color: var(--color-label-primary-text);
+        background: var(--color-primary-dark);
+        color: var(--color-text-light);
+        --icon-color: var(--color-text-light);
       }
       .secondary {
-        background: var(--color-label-secondary);
-        color: var(--color-label-secondary-text);
-        --icon-color: var(--color-label-secondary-text);
-        text-shadow: none;
-      }
-      .tertiary {
-        background: var(--color-label-tertiary);
-        color: var(--color-label-tertiary-text);
-        --icon-color: var(--color-label-tertiary-text);
-        text-shadow: none;
+        background: var(--color-secondary-dark);
+        color: var(--color-text-light);
+        --icon-color: var(--color-text-light);
       }
       .tertiary {
-        background: var(--color-label-tertiary);
-        color: var(--color-label-tertiary-text);
-        --icon-color: var(--color-label-tertiary-text);
-        text-shadow: none;
-      }
-      .tertiary {
-        background: var(--color-label-tertiary);
-        color: var(--color-label-tertiary-text);
-        --icon-color: var(--color-label-tertiary-text);
-        text-shadow: none;
-      }
-      .light {
-        background: var(--color-overlay-light);
-        color: var(--color-overlay-light-text);
-        --icon-color: var(--color-overlay-light-text);
-        text-shadow: none;
+        background: var(--color-tertiary);
+        color: var(--color-text-light);
+        --icon-color: var(--color-text-light);
       }
       .dark {
@@ -95,12 +81,14 @@ export default class Label extends LitElement {
     `;
     }
     render() {
-        const labelStyle = this.backgroundColor && this.textColor
-            ? {
-                background: `${this.backgroundColor}`,
-                color: `${this.textColor}`,
-            }
-            : {};
+        const labelStyle = {};
+        if (this.backgroundColor) {
+            labelStyle['background'] = this.backgroundColor;
+        }
+        if (this.textColor) {
+            labelStyle['color'] = this.textColor;
+            labelStyle['--icon-color'] = this.textColor;
+        }
         return html `
       <div
         class="label ${getClasses({
@@ -108,9 +96,8 @@ export default class Label extends LitElement {
             primary: this.primary,
             secondary: this.secondary,
             tertiary: this.tertiary,
-            light: this.light,
-            dark: this.dark,
             shadow: this.shadow,
+            danger: this.danger,
         })}"
         style=${styleMap(labelStyle)}
       >
@@ -136,7 +123,7 @@ __decorate([
 ], Label.prototype, "tertiary", void 0);
 __decorate([
     property({ type: Boolean })
-], Label.prototype, "light", void 0);
+], Label.prototype, "danger", void 0);
 __decorate([
     property({ type: Boolean })
 ], Label.prototype, "dark", void 0);

package/out-tsc/src/label/Label.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"Label.js","sourceRoot":"","sources":["../../../src/label/Label.ts"],"names":[],"mappings":";AAAA,OAAO,EAAE,UAAU,EAAkB,IAAI,EAAE,GAAG,EAAE,MAAM,KAAK,CAAC;AAC5D,OAAO,EAAE,QAAQ,EAAE,MAAM,gBAAgB,CAAC;AAC1C,OAAO,EAAE,UAAU,EAAE,MAAM,UAAU,CAAC;AACtC,OAAO,EAAE,QAAQ,EAAE,MAAM,+BAA+B,CAAC;AAEzD,MAAM,CAAC,OAAO,OAAO,KAAM,SAAQ,UAAU;IAC3C,MAAM,KAAK,MAAM;QACf,OAAO,GAAG,CAAA~~;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;KAuFT~~,CAAC;IACJ,CAAC;IAgCM,MAAM;QACX,MAAM,UAAU,~~GACd~~,~~IAAI~~,CAAC,~~eAAe,~~IAAI,IAAI,CAAC,~~SAAS~~;~~YACpC~~,~~CAAC~~,CAAC~~;gBACE~~,~~UAAU~~,~~EAAE~~,GAAG,IAAI,CAAC,eAAe,~~EAAE~~;~~gBACrC~~,~~KAAK~~,EAAE,GAAG,IAAI,CAAC,SAAS,~~EAAE~~;~~aAC3B;YACH~~,CAAC,CAAC,~~EAAE~~,CAAC;~~QAET~~,OAAO,IAAI,CAAA;;uBAEQ,UAAU,CAAC;YACxB,SAAS,EAAE,IAAI,CAAC,SAAS;YACzB,OAAO,EAAE,IAAI,CAAC,OAAO;YACrB,SAAS,EAAE,IAAI,CAAC,SAAS;YACzB,QAAQ,EAAE,IAAI,CAAC,QAAQ;YACvB,~~KAAK~~,EAAE,IAAI,CAAC,~~KAAK~~;~~YACjB~~,~~IAAI,EAAE,IAAI,CAAC,IAAI;YACf,~~MAAM,EAAE,IAAI,CAAC,MAAM;SACpB,CAAC;gBACM,QAAQ,CAAC,UAAU,CAAC;;;YAGxB,IAAI,CAAC,IAAI,CAAC,CAAC,CAAC,IAAI,CAAA,oBAAoB,IAAI,CAAC,IAAI,KAAK,CAAC,CAAC,CAAC,IAAI;;;;KAIhE,CAAC;IACJ,CAAC;CACF;~~AA1DC~~;IADC,QAAQ,CAAC,EAAE,IAAI,EAAE,OAAO,EAAE,CAAC;wCACT;AAGnB;IADC,QAAQ,CAAC,EAAE,IAAI,EAAE,OAAO,EAAE,CAAC;sCACX;AAGjB;IADC,QAAQ,CAAC,EAAE,IAAI,EAAE,OAAO,EAAE,CAAC;wCACT;AAGnB;IADC,QAAQ,CAAC,EAAE,IAAI,EAAE,OAAO,EAAE,CAAC;uCACV;AAGlB;IADC,QAAQ,CAAC,EAAE,IAAI,EAAE,OAAO,EAAE,CAAC;~~oCACb~~;~~AAGf~~;IADC,QAAQ,CAAC,EAAE,IAAI,EAAE,OAAO,EAAE,CAAC;mCACd;AAGd;IADC,QAAQ,CAAC,EAAE,IAAI,EAAE,OAAO,EAAE,CAAC;qCACZ;AAGhB;IADC,QAAQ,CAAC,EAAE,IAAI,EAAE,MAAM,EAAE,CAAC;mCACd;AAGb;IADC,QAAQ,EAAE;8CACa;AAGxB;IADC,QAAQ,EAAE;wCACO","sourcesContent":["import { LitElement, TemplateResult, html, css } from 'lit';\nimport { property } from 'lit/decorators';\nimport { getClasses } from '../utils';\nimport { styleMap } from 'lit-html/directives/style-map';\n\nexport default class Label extends LitElement {\n static get styles() {\n return css`\n :host {\n display: inline-block;\n }\n\n slot {\n white-space: nowrap;\n }\n\n .mask {\n padding: 3px 8px;\n border-radius: 12px;\n display: flex;\n }\n\n temba-icon {\n margin-right: 0.3em;\n }\n\n .label.clickable .mask:hover {\n background: rgb(0, 0, 0, 0.05);\n }\n\n .label {\n font-size: 0.8em;\n font-weight: 400;\n border-radius: 12px;\n ~~background: tomato;\n color: #fff;\n text~~-shadow: 0 0.04em 0.~~04em~~ rgba(0, 0, 0, 0.35);\n ~~}\n\n .primary {\n~~ background: var(--color-~~label~~-~~primary~~);\n color: var(--color-~~label~~-~~primary~~-text);\n --icon-color: var(--color-~~label~~-~~primary~~-text);\n ~~}\n\n .secondary {\n~~ ~~background: var(--color-label-secondary);\n color: var(--color-label-secondary-~~text~~);\n --icon~~-~~color: var(--color-label-secondary-text);\n text-~~shadow: none;\n }\n\n .~~tertiary~~ {\n background: ~~var(--color-label-tertiary)~~;\n color: ~~var(--color-label-tertiary-text)~~;\n --icon-color: ~~var(--color-label-tertiary-text)~~;\n ~~text-shadow: none;\n~~ }\n\n .~~tertiary~~ {\n background: var(--color-~~label~~-~~tertiary~~);\n color: var(--color-~~label~~-~~tertiary-text~~);\n --icon-color: var(--color-~~label~~-~~tertiary-text~~);\n ~~text-shadow: none;\n~~ }\n\n .~~tertiary~~ {\n background: var(--color-~~label~~-~~tertiary~~);\n color: var(--color-~~label~~-~~tertiary-text~~);\n --icon-color: var(--color-~~label~~-~~tertiary-text~~);\n ~~text-shadow: none;\n~~ }\n\n .~~light~~ {\n background: var(--color-~~overlay-light~~);\n color: var(--color-~~overlay~~-light~~-text~~);\n --icon-color: var(--color-~~overlay~~-light~~-text~~);\n ~~text-shadow: none;\n~~ }\n\n .dark {\n background: var(--color-overlay-dark);\n color: var(--color-overlay-dark-text);\n --icon-color: var(--color-overlay-dark-text);\n text-shadow: none;\n }\n\n .clickable {\n cursor: pointer;\n }\n\n .shadow {\n box-shadow: 1px 1px 2px 1px rgba(0, 0, 0, 0.1);\n }\n `;\n }\n\n @property({ type: Boolean })\n clickable: boolean;\n\n @property({ type: Boolean })\n primary: boolean;\n\n @property({ type: Boolean })\n secondary: boolean;\n\n @property({ type: Boolean })\n tertiary: boolean;\n\n @property({ type: Boolean })\n ~~light~~: boolean;\n\n @property({ type: Boolean })\n dark: boolean;\n\n @property({ type: Boolean })\n shadow: boolean;\n\n @property({ type: String })\n icon: string;\n\n @property()\n backgroundColor: string;\n\n @property()\n textColor: string;\n\n public render(): TemplateResult {\n const labelStyle =\n this.backgroundColor && this.~~textColor~~\n ? {\n ~~background:~~ ~~`${~~this.~~backgroundColor}`,\~~n color: ~~`${~~this.textColor~~}`,\~~n }\n ~~: {};\n~~\n return html`\n <div\n class=\"label ${getClasses({\n clickable: this.clickable,\n primary: this.primary,\n secondary: this.secondary,\n tertiary: this.tertiary,\n ~~light~~: this.~~light~~,\n ~~dark~~: this.~~dark~~,\n ~~shadow: this.shadow,\n~~ })}\"\n style=${styleMap(labelStyle)}\n >\n <div class=\"mask\">\n ${this.icon ? html`<temba-icon name=${this.icon} />` : null}\n <slot></slot>\n </div>\n </div>\n `;\n }\n}\n"]}
1	+ {"version":3,"file":"Label.js","sourceRoot":"","sources":["../../../src/label/Label.ts"],"names":[],"mappings":";AAAA,OAAO,EAAE,UAAU,EAAkB,IAAI,EAAE,GAAG,EAAE,MAAM,KAAK,CAAC;AAC5D,OAAO,EAAE,QAAQ,EAAE,MAAM,gBAAgB,CAAC;AAC1C,OAAO,EAAE,UAAU,EAAE,MAAM,UAAU,CAAC;AACtC,OAAO,EAAE,QAAQ,EAAE,MAAM,+BAA+B,CAAC;AAEzD,MAAM,CAAC,OAAO,OAAO,KAAM,SAAQ,UAAU;IAC3C,MAAM,KAAK,MAAM;QACf,OAAO,GAAG,CAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;KAyET,CAAC;IACJ,CAAC;IAgCM,MAAM;QACX,MAAM,UAAU,GAAG,EAAE,CAAC;QAEtB,IAAI,IAAI,CAAC,eAAe,EAAE;YACxB,UAAU,CAAC,YAAY,CAAC,GAAG,IAAI,CAAC,eAAe,CAAC;SACjD;QAED,IAAI,IAAI,CAAC,SAAS,EAAE;YAClB,UAAU,CAAC,OAAO,CAAC,GAAG,IAAI,CAAC,SAAS,CAAC;YACrC,UAAU,CAAC,cAAc,CAAC,GAAG,IAAI,CAAC,SAAS,CAAC;SAC7C;QAED,OAAO,IAAI,CAAA;;uBAEQ,UAAU,CAAC;YACxB,SAAS,EAAE,IAAI,CAAC,SAAS;YACzB,OAAO,EAAE,IAAI,CAAC,OAAO;YACrB,SAAS,EAAE,IAAI,CAAC,SAAS;YACzB,QAAQ,EAAE,IAAI,CAAC,QAAQ;YACvB,MAAM,EAAE,IAAI,CAAC,MAAM;YACnB,MAAM,EAAE,IAAI,CAAC,MAAM;SACpB,CAAC;gBACM,QAAQ,CAAC,UAAU,CAAC;;;YAGxB,IAAI,CAAC,IAAI,CAAC,CAAC,CAAC,IAAI,CAAA,oBAAoB,IAAI,CAAC,IAAI,KAAK,CAAC,CAAC,CAAC,IAAI;;;;KAIhE,CAAC;IACJ,CAAC;CACF;AA5DC;IADC,QAAQ,CAAC,EAAE,IAAI,EAAE,OAAO,EAAE,CAAC;wCACT;AAGnB;IADC,QAAQ,CAAC,EAAE,IAAI,EAAE,OAAO,EAAE,CAAC;sCACX;AAGjB;IADC,QAAQ,CAAC,EAAE,IAAI,EAAE,OAAO,EAAE,CAAC;wCACT;AAGnB;IADC,QAAQ,CAAC,EAAE,IAAI,EAAE,OAAO,EAAE,CAAC;uCACV;AAGlB;IADC,QAAQ,CAAC,EAAE,IAAI,EAAE,OAAO,EAAE,CAAC;qCACZ;AAGhB;IADC,QAAQ,CAAC,EAAE,IAAI,EAAE,OAAO,EAAE,CAAC;mCACd;AAGd;IADC,QAAQ,CAAC,EAAE,IAAI,EAAE,OAAO,EAAE,CAAC;qCACZ;AAGhB;IADC,QAAQ,CAAC,EAAE,IAAI,EAAE,MAAM,EAAE,CAAC;mCACd;AAGb;IADC,QAAQ,EAAE;8CACa;AAGxB;IADC,QAAQ,EAAE;wCACO","sourcesContent":["import { LitElement, TemplateResult, html, css } from 'lit';\nimport { property } from 'lit/decorators';\nimport { getClasses } from '../utils';\nimport { styleMap } from 'lit-html/directives/style-map';\n\nexport default class Label extends LitElement {\n static get styles() {\n return css`\n :host {\n display: inline-block;\n }\n\n slot {\n white-space: nowrap;\n }\n\n .mask {\n padding: 3px 8px;\n border-radius: 12px;\n display: flex;\n }\n\n temba-icon {\n margin-right: 0.3em;\n padding-bottom: 0.1em;\n }\n\n .label.clickable .mask:hover {\n background: rgb(0, 0, 0, 0.05);\n }\n\n .label {\n font-size: 0.8em;\n font-weight: 400;\n border-radius: 12px;\n box-shadow: 0 0.04em 0.08em rgba(0, 0, 0, 0.15);\n background: var(--color-overlay-light);\n color: var(--color-overlay-light-text);\n --icon-color: var(--color-overlay-light-text);\n text-shadow: none;\n }\n\n .danger {\n background: tomato;\n color: #fff;\n --icon-color: #fff;\n }\n\n .primary {\n background: var(--color-primary-dark);\n color: var(--color-text-light);\n --icon-color: var(--color-text-light);\n }\n\n .secondary {\n background: var(--color-secondary-dark);\n color: var(--color-text-light);\n --icon-color: var(--color-text-light);\n }\n\n .tertiary {\n background: var(--color-tertiary);\n color: var(--color-text-light);\n --icon-color: var(--color-text-light);\n }\n\n .dark {\n background: var(--color-overlay-dark);\n color: var(--color-overlay-dark-text);\n --icon-color: var(--color-overlay-dark-text);\n text-shadow: none;\n }\n\n .clickable {\n cursor: pointer;\n }\n\n .shadow {\n box-shadow: 1px 1px 2px 1px rgba(0, 0, 0, 0.1);\n }\n `;\n }\n\n @property({ type: Boolean })\n clickable: boolean;\n\n @property({ type: Boolean })\n primary: boolean;\n\n @property({ type: Boolean })\n secondary: boolean;\n\n @property({ type: Boolean })\n tertiary: boolean;\n\n @property({ type: Boolean })\n danger: boolean;\n\n @property({ type: Boolean })\n dark: boolean;\n\n @property({ type: Boolean })\n shadow: boolean;\n\n @property({ type: String })\n icon: string;\n\n @property()\n backgroundColor: string;\n\n @property()\n textColor: string;\n\n public render(): TemplateResult {\n const labelStyle = {};\n\n if (this.backgroundColor) {\n labelStyle['background'] = this.backgroundColor;\n }\n\n if (this.textColor) {\n labelStyle['color'] = this.textColor;\n labelStyle['--icon-color'] = this.textColor;\n }\n\n return html`\n <div\n class=\"label ${getClasses({\n clickable: this.clickable,\n primary: this.primary,\n secondary: this.secondary,\n tertiary: this.tertiary,\n shadow: this.shadow,\n danger: this.danger,\n })}\"\n style=${styleMap(labelStyle)}\n >\n <div class=\"mask\">\n ${this.icon ? html`<temba-icon name=${this.icon} />` : null}\n <slot></slot>\n </div>\n </div>\n `;\n }\n}\n"]}

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

@@ -538,7 +538,6 @@ export class TembaMenu extends RapidElement {
         }
     }
     refresh(path = null) {
-        console.log('refresh!');
         if (!path) {
             path = [...this.selection];
         }