@nyaruka/temba-components 0.26.3 → 0.26.6

package/CHANGELOG.md

@@ -4,6 +4,25 @@ All notable changes to this project will be documented in this file. Dates are d
 
 Generated by [`auto-changelog`](https://github.com/CookPete/auto-changelog).
 
+#### [v0.26.6](https://github.com/nyaruka/temba-components/compare/v0.26.5...v0.26.6)
+
+> 28 April 2022
+
+- Fix user select on history [`8d2d5a3`](https://github.com/nyaruka/temba-components/commit/8d2d5a30c2ec3e4f7402f17f378c03768cb58238)
+
+#### [v0.26.5](https://github.com/nyaruka/temba-components/compare/v0.26.4...v0.26.5)
+
+> 28 April 2022
+
+- Update version of flatpickr [`4560eb8`](https://github.com/nyaruka/temba-components/commit/4560eb85894c0a0c2f5722d550ff44b7bdd835d5)
+
+#### [v0.26.4](https://github.com/nyaruka/temba-components/compare/v0.26.3...v0.26.4)
+
+> 26 April 2022
+
+- Fix inline menus with no items [`#165`](https://github.com/nyaruka/temba-components/pull/165)
+- Switch test font [`9fe1ffd`](https://github.com/nyaruka/temba-components/commit/9fe1ffd67be69c42e931e87e3e06e1c402e992fa)
+
 #### [v0.26.3](https://github.com/nyaruka/temba-components/compare/v0.26.2...v0.26.3)
 
 > 22 April 2022

package/dist/{51fa8c26.js → 29fc0c7c.js}

@@ -1952,7 +1952,6 @@ function __decorate(l,n,e,t){var i,o=arguments.length,u=o<3?n:null===t?t=Object.
 
     .grouping .items {
       display: block;
-      user-select: none;
     }
 
     .grouping.verbose .items {
@@ -1960,6 +1959,7 @@ function __decorate(l,n,e,t){var i,o=arguments.length,u=o<3?n:null===t?t=Object.
       max-height: 0;
       display: flex;
       flex-direction: column;
+      user-select: none;
     }
 
     .grouping.flows .items {
@@ -3464,7 +3464,7 @@ function __decorate(l,n,e,t){var i,o=arguments.length,u=o<3?n:null===t?t=Object.
           ${this.arrow}
         </div>
       </div>
-    `}}__decorate([e$2({type:String})],Tip.prototype,"text",void 0),__decorate([e$2({type:Boolean})],Tip.prototype,"visible",void 0),__decorate([e$2({type:String})],Tip.prototype,"position",void 0),__decorate([e$2({type:Boolean})],Tip.prototype,"hideOnChange",void 0),__decorate([e$2({type:Number,attribute:!1})],Tip.prototype,"top",void 0),__decorate([e$2({type:Number,attribute:!1})],Tip.prototype,"left",void 0),__decorate([e$2({type:Number,attribute:!1})],Tip.prototype,"width",void 0),__decorate([e$2({type:Boolean,attribute:!1})],Tip.prototype,"poppedTop",void 0);const findItem=(l,n)=>{const e=l||[],t=e.findIndex((l=>l.id==n||l.vanity_id==n));if(t>-1){return{item:e[t],index:t}}return{item:null,index:-1}};class TembaMenu extends RapidElement{constructor(){super(),this.wraps=!1,this.selection=[],this.pending=[],this.state={},this.renderMenuItem=(l,n=null)=>{if("divider"===l.type)return $`<div class="divider"></div>`;if("section"===l.type||l.inline)return $`<div class="sub-section">${l.name}</div>`;if("modax-button"===l.type)return $`<temba-button
+    `}}__decorate([e$2({type:String})],Tip.prototype,"text",void 0),__decorate([e$2({type:Boolean})],Tip.prototype,"visible",void 0),__decorate([e$2({type:String})],Tip.prototype,"position",void 0),__decorate([e$2({type:Boolean})],Tip.prototype,"hideOnChange",void 0),__decorate([e$2({type:Number,attribute:!1})],Tip.prototype,"top",void 0),__decorate([e$2({type:Number,attribute:!1})],Tip.prototype,"left",void 0),__decorate([e$2({type:Number,attribute:!1})],Tip.prototype,"width",void 0),__decorate([e$2({type:Boolean,attribute:!1})],Tip.prototype,"poppedTop",void 0);const findItem=(l,n)=>{const e=l||[],t=e.findIndex((l=>l.id==n||l.vanity_id==n));if(t>-1){return{item:e[t],index:t}}return{item:null,index:-1}};class TembaMenu extends RapidElement{constructor(){super(),this.wraps=!1,this.selection=[],this.pending=[],this.state={},this.renderMenuItem=(l,n=null)=>{if("divider"===l.type)return $`<div class="divider"></div>`;if("space"===l.type)return $`<div class="space"></div>`;if("section"===l.type||l.inline)return $`<div class="sub-section">${l.name}</div>`;if("modax-button"===l.type)return $`<temba-button
         name=${l.name}
         @click=${n=>{this.handleItemClicked(n,l)}}
       />`;const e=this.isSelected(l),t=e&&this.selection.length>l.level+1,i=l.icon?$`<temba-icon
@@ -3724,7 +3724,7 @@ function __decorate(l,n,e,t){var i,o=arguments.length,u=o<3?n:null===t?t=Object.
 
       .level-1 {
         transition: opacity 100ms linear, margin 200ms linear;
-        overflow-y: auto;
+        overflow-y: scroll;
         z-index: 1500;
       }
 
@@ -3835,6 +3835,10 @@ function __decorate(l,n,e,t){var i,o=arguments.length,u=o<3?n:null===t?t=Object.
         min-height: 1px;
       }
 
+      .space {
+        margin: 0.5em;
+      }
+
       .collapsed .divider {
         height: 0;
         margin: 0;
@@ -3892,9 +3896,9 @@ function __decorate(l,n,e,t){var i,o=arguments.length,u=o<3?n:null===t?t=Object.
             class="${getClasses({level:!0,["level-"+(t+1)]:!0,collapsed:o})}"
           >
             ${this.submenu?null:$`<div class="section">${i.name}</div>`}
-            ${l.map((l=>l.inline?$`${this.renderMenuItem(l)}
+            ${l.map((l=>l.inline&&l.items?$`${this.renderMenuItem(l)}
                   <div class="inline-children">
-                    ${l.items.map((n=>this.renderMenuItem(n,l)))}
+                    ${(l.items||[]).map((n=>this.renderMenuItem(n,l)))}
                   </div>`:this.renderMenuItem(l)))}
           </div>`)}));const e=$`<div
       class="${getClasses({root:!0,"fully-collapsed":this.collapsed})}"

package/dist/index.js

@@ -1952,7 +1952,6 @@ function __decorate(l,n,e,t){var i,o=arguments.length,u=o<3?n:null===t?t=Object.
 
     .grouping .items {
       display: block;
-      user-select: none;
     }
 
     .grouping.verbose .items {
@@ -1960,6 +1959,7 @@ function __decorate(l,n,e,t){var i,o=arguments.length,u=o<3?n:null===t?t=Object.
       max-height: 0;
       display: flex;
       flex-direction: column;
+      user-select: none;
     }
 
     .grouping.flows .items {
@@ -3464,7 +3464,7 @@ function __decorate(l,n,e,t){var i,o=arguments.length,u=o<3?n:null===t?t=Object.
           ${this.arrow}
         </div>
       </div>
-    `}}__decorate([e$2({type:String})],Tip.prototype,"text",void 0),__decorate([e$2({type:Boolean})],Tip.prototype,"visible",void 0),__decorate([e$2({type:String})],Tip.prototype,"position",void 0),__decorate([e$2({type:Boolean})],Tip.prototype,"hideOnChange",void 0),__decorate([e$2({type:Number,attribute:!1})],Tip.prototype,"top",void 0),__decorate([e$2({type:Number,attribute:!1})],Tip.prototype,"left",void 0),__decorate([e$2({type:Number,attribute:!1})],Tip.prototype,"width",void 0),__decorate([e$2({type:Boolean,attribute:!1})],Tip.prototype,"poppedTop",void 0);const findItem=(l,n)=>{const e=l||[],t=e.findIndex((l=>l.id==n||l.vanity_id==n));if(t>-1){return{item:e[t],index:t}}return{item:null,index:-1}};class TembaMenu extends RapidElement{constructor(){super(),this.wraps=!1,this.selection=[],this.pending=[],this.state={},this.renderMenuItem=(l,n=null)=>{if("divider"===l.type)return $`<div class="divider"></div>`;if("section"===l.type||l.inline)return $`<div class="sub-section">${l.name}</div>`;if("modax-button"===l.type)return $`<temba-button
+    `}}__decorate([e$2({type:String})],Tip.prototype,"text",void 0),__decorate([e$2({type:Boolean})],Tip.prototype,"visible",void 0),__decorate([e$2({type:String})],Tip.prototype,"position",void 0),__decorate([e$2({type:Boolean})],Tip.prototype,"hideOnChange",void 0),__decorate([e$2({type:Number,attribute:!1})],Tip.prototype,"top",void 0),__decorate([e$2({type:Number,attribute:!1})],Tip.prototype,"left",void 0),__decorate([e$2({type:Number,attribute:!1})],Tip.prototype,"width",void 0),__decorate([e$2({type:Boolean,attribute:!1})],Tip.prototype,"poppedTop",void 0);const findItem=(l,n)=>{const e=l||[],t=e.findIndex((l=>l.id==n||l.vanity_id==n));if(t>-1){return{item:e[t],index:t}}return{item:null,index:-1}};class TembaMenu extends RapidElement{constructor(){super(),this.wraps=!1,this.selection=[],this.pending=[],this.state={},this.renderMenuItem=(l,n=null)=>{if("divider"===l.type)return $`<div class="divider"></div>`;if("space"===l.type)return $`<div class="space"></div>`;if("section"===l.type||l.inline)return $`<div class="sub-section">${l.name}</div>`;if("modax-button"===l.type)return $`<temba-button
         name=${l.name}
         @click=${n=>{this.handleItemClicked(n,l)}}
       />`;const e=this.isSelected(l),t=e&&this.selection.length>l.level+1,i=l.icon?$`<temba-icon
@@ -3724,7 +3724,7 @@ function __decorate(l,n,e,t){var i,o=arguments.length,u=o<3?n:null===t?t=Object.
 
       .level-1 {
         transition: opacity 100ms linear, margin 200ms linear;
-        overflow-y: auto;
+        overflow-y: scroll;
         z-index: 1500;
       }
 
@@ -3835,6 +3835,10 @@ function __decorate(l,n,e,t){var i,o=arguments.length,u=o<3?n:null===t?t=Object.
         min-height: 1px;
       }
 
+      .space {
+        margin: 0.5em;
+      }
+
       .collapsed .divider {
         height: 0;
         margin: 0;
@@ -3892,9 +3896,9 @@ function __decorate(l,n,e,t){var i,o=arguments.length,u=o<3?n:null===t?t=Object.
             class="${getClasses({level:!0,["level-"+(t+1)]:!0,collapsed:o})}"
           >
             ${this.submenu?null:$`<div class="section">${i.name}</div>`}
-            ${l.map((l=>l.inline?$`${this.renderMenuItem(l)}
+            ${l.map((l=>l.inline&&l.items?$`${this.renderMenuItem(l)}
                   <div class="inline-children">
-                    ${l.items.map((n=>this.renderMenuItem(n,l)))}
+                    ${(l.items||[]).map((n=>this.renderMenuItem(n,l)))}
                   </div>`:this.renderMenuItem(l)))}
           </div>`)}));const e=$`<div
       class="${getClasses({root:!0,"fully-collapsed":this.collapsed})}"

package/dist/sw.js

@@ -1,2 +1,2 @@
-if(!self.define){const e=e=>{"require"!==e&&(e+=".js");let r=Promise.resolve();return t[e]||(r=new Promise(async r=>{if("document"in self){const t=document.createElement("script");t.src=e,document.head.appendChild(t),t.onload=r}else importScripts(e),r()})),r.then(()=>{if(!t[e])throw new Error(`Module ${e} didn’t register its module`);return t[e]})},r=(r,t)=>{Promise.all(r.map(e)).then(e=>t(1===e.length?e[0]:e))},t={require:Promise.resolve(r)};self.define=(r,s,o)=>{t[r]||(t[r]=Promise.resolve().then(()=>{let t={};const n={uri:location.origin+r.slice(1)};return Promise.all(s.map(r=>{switch(r){case"exports":return t;case"module":return n;default:return e(r)}})).then(e=>{const r=o(...e);return t.default||(t.default=r),t})}))}}define("./sw.js",["./workbox-80efdfd1"],(function(e){"use strict";e.skipWaiting(),e.clientsClaim(),e.precacheAndRoute([{url:"51fa8c26.js",revision:"def625019fd71a7ee5e9af3066e23d4f"},{url:"templates/components-body.html",revision:"e86ef2583413ead9aa0fa20eb68ba906"},{url:"templates/components-head.html",revision:"006b96d6f503e2e2b46570b5ff64063a"}],{}),e.registerRoute(new e.NavigationRoute(e.createHandlerBoundToURL("/index.html"))),e.registerRoute("polyfills/*.js",new e.CacheFirst,"GET")}));
+if(!self.define){const e=e=>{"require"!==e&&(e+=".js");let r=Promise.resolve();return t[e]||(r=new Promise(async r=>{if("document"in self){const t=document.createElement("script");t.src=e,document.head.appendChild(t),t.onload=r}else importScripts(e),r()})),r.then(()=>{if(!t[e])throw new Error(`Module ${e} didn’t register its module`);return t[e]})},r=(r,t)=>{Promise.all(r.map(e)).then(e=>t(1===e.length?e[0]:e))},t={require:Promise.resolve(r)};self.define=(r,s,o)=>{t[r]||(t[r]=Promise.resolve().then(()=>{let t={};const n={uri:location.origin+r.slice(1)};return Promise.all(s.map(r=>{switch(r){case"exports":return t;case"module":return n;default:return e(r)}})).then(e=>{const r=o(...e);return t.default||(t.default=r),t})}))}}define("./sw.js",["./workbox-80efdfd1"],(function(e){"use strict";e.skipWaiting(),e.clientsClaim(),e.precacheAndRoute([{url:"29fc0c7c.js",revision:"26bd1643253d085d61da05148806ae0e"},{url:"templates/components-body.html",revision:"cbff3c3d6e29df71d5b35c2e77a6850b"},{url:"templates/components-head.html",revision:"210b5497385957392d6e5af7ef704a33"}],{}),e.registerRoute(new e.NavigationRoute(e.createHandlerBoundToURL("/index.html"))),e.registerRoute("polyfills/*.js",new e.CacheFirst,"GET")}));
 //# sourceMappingURL=sw.js.map

package/dist/sw.js.map

@@ -1 +1 @@
-{"version":3,"file":"sw.js","sources":["../../../../../tmp/701966d67fce247eb82e332275047c7d/sw.js"],"sourcesContent":["import {registerRoute as workbox_routing_registerRoute} from '/home/runner/work/temba-components/temba-components/node_modules/workbox-routing/registerRoute.mjs';\nimport {CacheFirst as workbox_strategies_CacheFirst} from '/home/runner/work/temba-components/temba-components/node_modules/workbox-strategies/CacheFirst.mjs';\nimport {skipWaiting as workbox_core_skipWaiting} from '/home/runner/work/temba-components/temba-components/node_modules/workbox-core/skipWaiting.mjs';\nimport {clientsClaim as workbox_core_clientsClaim} from '/home/runner/work/temba-components/temba-components/node_modules/workbox-core/clientsClaim.mjs';\nimport {precacheAndRoute as workbox_precaching_precacheAndRoute} from '/home/runner/work/temba-components/temba-components/node_modules/workbox-precaching/precacheAndRoute.mjs';\nimport {NavigationRoute as workbox_routing_NavigationRoute} from '/home/runner/work/temba-components/temba-components/node_modules/workbox-routing/NavigationRoute.mjs';\nimport {createHandlerBoundToURL as workbox_precaching_createHandlerBoundToURL} from '/home/runner/work/temba-components/temba-components/node_modules/workbox-precaching/createHandlerBoundToURL.mjs';/**\n * Welcome to your Workbox-powered service worker!\n *\n * You'll need to register this file in your web app.\n * See https://goo.gl/nhQhGp\n *\n * The rest of the code is auto-generated. Please don't update this file\n * directly; instead, make changes to your Workbox build configuration\n * and re-run your build process.\n * See https://goo.gl/2aRDsh\n */\n\n\n\n\n\n\n\n\nworkbox_core_skipWaiting();\n\nworkbox_core_clientsClaim();\n\n\n/**\n * The precacheAndRoute() method efficiently caches and responds to\n * requests for URLs in the manifest.\n * See https://goo.gl/S9QRab\n */\nworkbox_precaching_precacheAndRoute([\n  {\n    \"url\": \"51fa8c26.js\",\n    \"revision\": \"def625019fd71a7ee5e9af3066e23d4f\"\n  },\n  {\n    \"url\": \"templates/components-body.html\",\n    \"revision\": \"e86ef2583413ead9aa0fa20eb68ba906\"\n  },\n  {\n    \"url\": \"templates/components-head.html\",\n    \"revision\": \"006b96d6f503e2e2b46570b5ff64063a\"\n  }\n], {});\n\nworkbox_routing_registerRoute(new workbox_routing_NavigationRoute(workbox_precaching_createHandlerBoundToURL(\"/index.html\")));\n\n\nworkbox_routing_registerRoute(\"polyfills/*.js\", new workbox_strategies_CacheFirst(), 'GET');\n\n\n\n\n"],"names":["workbox_routing_NavigationRoute","workbox_precaching_createHandlerBoundToURL","workbox_strategies_CacheFirst"],"mappings":"k1BAmCoC,CAClC,KACS,uBACK,oCAEd,KACS,0CACK,oCAEd,KACS,0CACK,qCAEb,oBAE2B,IAAIA,kBAAgCC,0BAA2C,iCAG/E,iBAAkB,IAAIC,aAAiC"}
+{"version":3,"file":"sw.js","sources":["../../../../../tmp/b30126a5353b4b4d3682e1729b4da03e/sw.js"],"sourcesContent":["import {registerRoute as workbox_routing_registerRoute} from '/home/runner/work/temba-components/temba-components/node_modules/workbox-routing/registerRoute.mjs';\nimport {CacheFirst as workbox_strategies_CacheFirst} from '/home/runner/work/temba-components/temba-components/node_modules/workbox-strategies/CacheFirst.mjs';\nimport {skipWaiting as workbox_core_skipWaiting} from '/home/runner/work/temba-components/temba-components/node_modules/workbox-core/skipWaiting.mjs';\nimport {clientsClaim as workbox_core_clientsClaim} from '/home/runner/work/temba-components/temba-components/node_modules/workbox-core/clientsClaim.mjs';\nimport {precacheAndRoute as workbox_precaching_precacheAndRoute} from '/home/runner/work/temba-components/temba-components/node_modules/workbox-precaching/precacheAndRoute.mjs';\nimport {NavigationRoute as workbox_routing_NavigationRoute} from '/home/runner/work/temba-components/temba-components/node_modules/workbox-routing/NavigationRoute.mjs';\nimport {createHandlerBoundToURL as workbox_precaching_createHandlerBoundToURL} from '/home/runner/work/temba-components/temba-components/node_modules/workbox-precaching/createHandlerBoundToURL.mjs';/**\n * Welcome to your Workbox-powered service worker!\n *\n * You'll need to register this file in your web app.\n * See https://goo.gl/nhQhGp\n *\n * The rest of the code is auto-generated. Please don't update this file\n * directly; instead, make changes to your Workbox build configuration\n * and re-run your build process.\n * See https://goo.gl/2aRDsh\n */\n\n\n\n\n\n\n\n\nworkbox_core_skipWaiting();\n\nworkbox_core_clientsClaim();\n\n\n/**\n * The precacheAndRoute() method efficiently caches and responds to\n * requests for URLs in the manifest.\n * See https://goo.gl/S9QRab\n */\nworkbox_precaching_precacheAndRoute([\n  {\n    \"url\": \"29fc0c7c.js\",\n    \"revision\": \"26bd1643253d085d61da05148806ae0e\"\n  },\n  {\n    \"url\": \"templates/components-body.html\",\n    \"revision\": \"cbff3c3d6e29df71d5b35c2e77a6850b\"\n  },\n  {\n    \"url\": \"templates/components-head.html\",\n    \"revision\": \"210b5497385957392d6e5af7ef704a33\"\n  }\n], {});\n\nworkbox_routing_registerRoute(new workbox_routing_NavigationRoute(workbox_precaching_createHandlerBoundToURL(\"/index.html\")));\n\n\nworkbox_routing_registerRoute(\"polyfills/*.js\", new workbox_strategies_CacheFirst(), 'GET');\n\n\n\n\n"],"names":["workbox_routing_NavigationRoute","workbox_precaching_createHandlerBoundToURL","workbox_strategies_CacheFirst"],"mappings":"k1BAmCoC,CAClC,KACS,uBACK,oCAEd,KACS,0CACK,oCAEd,KACS,0CACK,qCAEb,oBAE2B,IAAIA,kBAAgCC,0BAA2C,iCAG/E,iBAAkB,IAAIC,aAAiC"}

package/dist/templates/components-body.html

@@ -1 +1 @@
-<script type="module" src="{{STATIC_URL}}@nyaruka/temba-components/dist/51fa8c26.js"></script><script>window.TEMBA_COMPONENTS_VERSION="0.26.3"</script>
+<script type="module" src="{{STATIC_URL}}@nyaruka/temba-components/dist/29fc0c7c.js"></script><script>window.TEMBA_COMPONENTS_VERSION="0.26.6"</script>

package/dist/templates/components-head.html

@@ -1 +1 @@
-<link rel="modulepreload" href="{{STATIC_URL}}@nyaruka/temba-components/dist/51fa8c26.js" crossorigin="anonymous">
+<link rel="modulepreload" href="{{STATIC_URL}}@nyaruka/temba-components/dist/29fc0c7c.js" crossorigin="anonymous">

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

@@ -21,7 +21,6 @@ export const getEventStyles = () => {
 
     .grouping .items {
       display: block;
-      user-select: none;
     }
 
     .grouping.verbose .items {
@@ -29,6 +28,7 @@ export const getEventStyles = () => {
       max-height: 0;
       display: flex;
       flex-direction: column;
+      user-select: none;
     }
 
     .grouping.flows .items {

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

@@ -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      user-select: none;\n    }\n\n    .grouping.verbose .items {\n      opacity: 0;\n      max-height: 0;\n      display: flex;\n      flex-direction: column;\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};\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  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: { 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 10px -1px rgb(160 160 160);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 max-width=\"400px\" height=\"auto\" controls=\"controls\">\n      <source src=\"${url}\" type=\"video/mp4\" />\n    </video> `;\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 10px -1px rgb(160 160 160);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' || event.status === 'F';\n  const msg = 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        ${event.logs_url\n          ? html`\n              <div class=\"icon-link\">\n                <temba-icon\n                  onclick=\"goto(event)\"\n                  href=\"${event.logs_url}\"\n                  name=\"log\"\n                  class=\"${isError ? 'error' : ''}\"\n                ></temba-icon>\n              </div>\n            `\n          : isError\n          ? html`<temba-icon\n              title=\"Message delivery error\"\n              name=\"alert-triangle\"\n            ></temba-icon>`\n          : null}\n        ${event.recipient_count > 1\n          ? html`<temba-icon size=\"1\" name=\"megaphone\"></temba-icon>\n              <div class=\"recipients\">${event.recipient_count} contacts</div>\n              <div class=\"separator\">•</div>`\n          : null}\n        <div class=\"time\">${timeSince(new Date(event.created_on))}</div>\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  return msg;\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.id}\"\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_event.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"]}
+{"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};\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  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: { 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 10px -1px rgb(160 160 160);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 max-width=\"400px\" height=\"auto\" controls=\"controls\">\n      <source src=\"${url}\" type=\"video/mp4\" />\n    </video> `;\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 10px -1px rgb(160 160 160);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' || event.status === 'F';\n  const msg = 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        ${event.logs_url\n          ? html`\n              <div class=\"icon-link\">\n                <temba-icon\n                  onclick=\"goto(event)\"\n                  href=\"${event.logs_url}\"\n                  name=\"log\"\n                  class=\"${isError ? 'error' : ''}\"\n                ></temba-icon>\n              </div>\n            `\n          : isError\n          ? html`<temba-icon\n              title=\"Message delivery error\"\n              name=\"alert-triangle\"\n            ></temba-icon>`\n          : null}\n        ${event.recipient_count > 1\n          ? html`<temba-icon size=\"1\" name=\"megaphone\"></temba-icon>\n              <div class=\"recipients\">${event.recipient_count} contacts</div>\n              <div class=\"separator\">•</div>`\n          : null}\n        <div class=\"time\">${timeSince(new Date(event.created_on))}</div>\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  return msg;\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.id}\"\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_event.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/list/TembaMenu.js

@@ -26,6 +26,9 @@ export class TembaMenu extends RapidElement {
             if (menuItem.type === 'divider') {
                 return html `<div class="divider"></div>`;
             }
+            if (menuItem.type === 'space') {
+                return html `<div class="space"></div>`;
+            }
             if (menuItem.type === 'section' || menuItem.inline) {
                 return html `<div class="sub-section">${menuItem.name}</div>`;
             }
@@ -333,7 +336,7 @@ export class TembaMenu extends RapidElement {
 
       .level-1 {
         transition: opacity 100ms linear, margin 200ms linear;
-        overflow-y: auto;
+        overflow-y: scroll;
         z-index: 1500;
       }
 
@@ -444,6 +447,10 @@ export class TembaMenu extends RapidElement {
         min-height: 1px;
       }
 
+      .space {
+        margin: 0.5em;
+      }
+
       .collapsed .divider {
         height: 0;
         margin: 0;
@@ -834,10 +841,10 @@ export class TembaMenu extends RapidElement {
                     ? html `<div class="section">${selected.name}</div>`
                     : null}
             ${items.map((item) => {
-                    if (item.inline) {
+                    if (item.inline && item.items) {
                         return html `${this.renderMenuItem(item)}
                   <div class="inline-children">
-                    ${item.items.map((child) => {
+                    ${(item.items || []).map((child) => {
                             return this.renderMenuItem(child, item);
                         })}
                   </div>`;

package/out-tsc/src/list/TembaMenu.js.map

@@ -1 +1 @@
-{"version":3,"file":"TembaMenu.js","sourceRoot":"","sources":["../../../src/list/TembaMenu.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 { fetchResults, getClasses } from '../utils';\n\nexport interface MenuItem {\n  id?: string;\n  vanity_id?: string;\n  name?: string;\n  count?: number;\n  icon?: string;\n  collapsed_icon?: string;\n  endpoint?: string;\n  loading?: boolean;\n  bottom?: boolean;\n  level?: number;\n  trigger?: string;\n  href?: string;\n  items?: MenuItem[];\n  inline?: boolean;\n  type?: string;\n  on_submit?: string;\n  bubble?: string;\n}\n\ninterface MenuItemState {\n  collapsed?: string;\n}\n\nconst findItem = (\n  items: MenuItem[],\n  id: string\n): { item: MenuItem; index: number } => {\n  const search = items || [];\n\n  const index = search.findIndex((item: MenuItem) => {\n    return item.id == id || item.vanity_id == id;\n  });\n\n  if (index > -1) {\n    const item = search[index];\n    return { item, index };\n  }\n\n  return { item: null, index: -1 };\n};\n\nexport class TembaMenu extends RapidElement {\n  static get styles() {\n    return css`\n      :host {\n        width: 100%;\n        display: block;\n        --color-widget-bg-focused: transparent;\n        --options-block-shadow: none;\n      }\n\n      .bubble {\n        width: 8px;\n        height: 8px;\n        left: 14px;\n        bottom: -1px;\n        z-index: 10000;\n        border-radius: 99px;\n        border: 1px solid rgb(255, 255, 255);\n        position: relative;\n        margin-top: -10px;\n      }\n\n      .section {\n        font-size: 1.5em;\n        margin-bottom: 0.2em;\n        color: var(--color-text-dark);\n      }\n\n      .collapse-toggle {\n        width: 0.5em;\n        cursor: pointer;\n        display: block;\n        margin-right: 5px;\n        margin-top: 3px;\n        margin-bottom: 3px;\n      }\n\n      .collapse-toggle:hover {\n        background: rgb(100, 100, 100, 0.05);\n      }\n\n      .item {\n        cursor: pointer;\n        user-select: none;\n        -webkit-user-select: none;\n        display: flex;\n        font-size: 1em;\n        --icon-color: var(--color-text-dark);\n      }\n\n      .item.selected {\n        background: var(--color-selection);\n        color: var(--color-primary-dark);\n        --icon-color: var(--color-primary-dark);\n      }\n\n      .root {\n        display: flex;\n        flex-direction: row;\n        height: 100%;\n      }\n\n      .level {\n        display: flex;\n        flex-direction: column;\n      }\n\n      .level.hidden {\n        display: none;\n      }\n\n      .submenu {\n      }\n\n      .level-0 > .item {\n        background: var(--color-primary-dark);\n        --icon-color: #fff;\n        font-size: 1em;\n      }\n\n      .level-0 > .top {\n        padding-top: var(--menu-padding);\n        background: var(--color-primary-dark);\n      }\n\n      .level-0 > .empty {\n        background: var(--color-primary-dark);\n        align-self: stretch;\n        flex-grow: 1;\n      }\n\n      .level-0 > .bottom {\n        height: 1em;\n        background: var(--color-primary-dark);\n      }\n\n      .level-0 > .item > .details {\n        display: none !important;\n      }\n\n      .level-0.expanding {\n      }\n\n      .level-0.expanded {\n        background: inherit;\n      }\n\n      .level-0 > .item.selected {\n        background: inherit;\n        --icon-color: var(--color-primary-dark);\n      }\n\n      .level {\n        padding: var(--menu-padding);\n      }\n\n      .level-0 {\n        padding: 0px;\n      }\n\n      .item {\n        padding: 0.2em 0.75em;\n        margin-top: 0.1em;\n        border-radius: var(--curvature);\n        display: flex;\n        min-width: 12em;\n        max-width: 12em;\n      }\n\n      .item > temba-icon {\n        margin-right: 0.5em;\n      }\n\n      .item.inline > temba-icon {\n      }\n\n      .item > .details > .name {\n        flex-grow: 1;\n        white-space: nowrap;\n        overflow: hidden;\n        text-overflow: ellipsis;\n        width: 0;\n      }\n\n      .level-0 > .item {\n        padding: 1em 1em;\n        margin-top: 0em;\n        border-radius: 0px;\n        min-width: inherit;\n        max-width: inherit;\n      }\n\n      .level-0 > .item > temba-icon {\n        margin-right: 0px;\n      }\n\n      .level-0 > .item > .name {\n        min-width: 0px;\n      }\n\n      .count {\n        align-self: center;\n        margin-left: 1em;\n        font-size: 0.8em;\n        font-weight: 400;\n      }\n\n      .level-0 > .item-top {\n        background: var(--color-primary-dark);\n        min-height: var(--curvature);\n      }\n\n      .level-0 > .item-bottom {\n        background: var(--color-primary-dark);\n        min-height: var(--curvature);\n      }\n\n      .level-0 > .item-bottom.selected {\n        border-top-right-radius: var(--curvature);\n      }\n\n      .level-0 > .item-top.selected {\n        border-bottom-right-radius: var(--curvature);\n      }\n\n      .level-0 > .selected-top {\n      }\n\n      .level-0 > .item:hover {\n        background: rgba(var(--primary-rgb), 0.85);\n      }\n\n      .level-0 > .item.selected:hover {\n        background: inherit;\n      }\n\n      .inline-children {\n      }\n\n      .inline-children .item {\n      }\n\n      .item.inline {\n        border: 0px solid transparent;\n      }\n\n      .level-1,\n      .level-2 {\n        border-right: 1px solid rgba(0 0 0 / 8%);\n        box-shadow: rgb(0 0 0 / 6%) 4px 0px 6px 1px;\n      }\n\n      .level-1 {\n        transition: opacity 100ms linear, margin 200ms linear;\n        overflow-y: auto;\n        z-index: 1500;\n      }\n\n      .level-2 {\n        background: #fbfbfb;\n        overflow-y: auto;\n        z-index: 1000;\n      }\n\n      .level-2 .item .details {\n        overflow: hidden;\n      }\n\n      .level-2 .item {\n        min-width: 12em;\n        max-width: 12em;\n      }\n\n      .level-1 .item {\n        overflow: hidden;\n        max-width: 12em;\n        min-width: 12em;\n        min-height: 1.5em;\n        max-height: 1.5em;\n        transition: min-width var(--transition-speed) !important;\n      }\n\n      .level-1 .item .details {\n      }\n\n      .collapsed .item {\n        overflow: hidden;\n        min-width: 0;\n        margin: 0;\n      }\n\n      .item .details {\n        opacity: 1;\n        min-height: 1.5em;\n        max-height: 1.5em;\n        align-items: center;\n      }\n\n      .item .details .name {\n      }\n\n      .item temba-icon {\n      }\n\n      .collapsed .item {\n        margin-bottom: 0.5em;\n      }\n\n      .collapsed .item .details {\n        overflow: hidden;\n        max-height: 0em;\n        max-width: 0em;\n      }\n\n      .collapsed .item .details {\n        max-height: 0em;\n      }\n\n      .collapsed .item temba-icon {\n        margin-right: 0;\n      }\n\n      .section {\n        max-width: 12em;\n      }\n\n      .collapsed .section {\n        opacity: 0;\n        max-width: 0em;\n        max-height: 0.6em;\n      }\n\n      .collapsed.level-1 {\n        overflow: hidden;\n        padding: 0.5em;\n        --icon-color: #999;\n      }\n\n      .collapsed .item .right {\n        flex-grow: 1;\n      }\n\n      .collapse-icon {\n        display: none;\n      }\n\n      .collapsed .collapse-icon {\n        --icon-color: #ccc;\n        display: block;\n      }\n\n      .collapsed .item.iconless {\n        max-height: 0em;\n        padding: 0em;\n        min-height: 0em;\n        margin-bottom: 0em;\n      }\n\n      .divider {\n        height: 1px;\n        background: #f3f3f3;\n        margin: 0.5em 0.75em;\n        min-height: 1px;\n      }\n\n      .collapsed .divider {\n        height: 0;\n        margin: 0;\n        padding: 0;\n        min-height: 0px;\n      }\n\n      .sub-section {\n        font-size: 1rem;\n        color: #888;\n        margin-top: 1rem;\n        margin-left: 0.3rem;\n      }\n\n      .fully-collapsed .level-0 {\n        z-index: 1;\n      }\n\n      .fully-collapsed .level-1 {\n        margin-left: -245px;\n        z-index: 0;\n        border: none;\n      }\n\n      .fully-collapsed .level-1 .item,\n      .fully-collapsed .level-1 .divider {\n        opacity: 0;\n      }\n\n      .fully-collapsed .level-2,\n      .fully-collapsed .level-3 {\n        display: none;\n      }\n\n      temba-button {\n        margin-top: 0.2em;\n        margin-bottom: 0.2em;\n        margin-left: 0.75em;\n        margin-right: 0.75em;\n      }\n    `;\n  }\n\n  @property({ type: Boolean })\n  wraps = false;\n\n  @property({ type: Boolean })\n  wait: boolean;\n\n  @property({ type: String })\n  endpoint: string;\n\n  @property({ type: String })\n  expanding: string;\n\n  @property({ type: String })\n  value: string;\n\n  // submenu to constrain to\n  @property({ type: String })\n  submenu: string;\n\n  @property({ type: Boolean })\n  collapsed: boolean;\n\n  // http promise to monitor for completeness\n  public httpComplete: Promise<void>;\n\n  root: MenuItem;\n  selection: string[] = [];\n  pending: string[] = [];\n  state: { [id: string]: MenuItemState } = {};\n\n  constructor() {\n    super();\n  }\n\n  public setBubble(id: string, color: string) {\n    const found = findItem(this.root.items, id);\n    if (found && found.item) {\n      found.item.bubble = color;\n      this.requestUpdate('root');\n      return true;\n    }\n    return false;\n  }\n\n  private getMenuItemState(id: string): MenuItemState {\n    let itemState = {};\n    if (id) {\n      itemState = this.state[id];\n      if (!itemState) {\n        itemState = {};\n        this.state[id] = itemState;\n      }\n    }\n    return itemState;\n  }\n\n  public updated(changes: Map<string, any>) {\n    if (changes.has('value')) {\n      this.setSelection((this.value || '').split('/'));\n    }\n\n    if (changes.has('submenu') && !changes.has('value')) {\n      this.setSelection([this.submenu]);\n    }\n\n    if (changes.has('endpoint')) {\n      this.root = {\n        level: -1,\n        endpoint: this.endpoint,\n      };\n\n      if (!this.wait) {\n        this.loadItems(this.root);\n      }\n    }\n  }\n\n  public refresh(path: string[] = null) {\n    if (!path) {\n      path = [...this.selection];\n    }\n\n    // go up the tree until we find an endpoint\n    const item = this.getMenuItemForSelection(path);\n\n    if (item.endpoint) {\n      this.loadItems(item, false);\n    } else {\n      path.pop();\n      this.refresh(path);\n    }\n  }\n\n  private fireNoPath(missingId: string) {\n    const item = this.getMenuItem();\n\n    const details = {\n      item: item.id,\n      selection: '/' + this.selection.join('/'),\n      endpoint: item.endpoint,\n      path: missingId + '/' + this.pending.join('/') + document.location.search,\n    };\n\n    // remove any excess from our selection\n    const selection = this.selection.join('/');\n    selection.replace(details.path, '');\n    this.selection = selection.split('/');\n\n    this.fireCustomEvent(CustomEventType.NoPath, details);\n    this.pending = [];\n    this.requestUpdate('root');\n  }\n\n  // eslint-disable-next-line @typescript-eslint/no-empty-function\n  private loadItems(item: MenuItem, selectFirst = true) {\n    if (item && item.endpoint) {\n      item.loading = true;\n      this.httpComplete = fetchResults(item.endpoint).then(\n        (items: MenuItem[]) => {\n          // update our item level\n          items.forEach(subItem => {\n            subItem.level = item.level + 1;\n            // if we came with preset items, set the level for them accordingly\n            if (subItem.items) {\n              subItem.items.forEach(inlineItem => {\n                inlineItem.level = item.level + 2;\n                // inlineItem.parent = subItem;\n              });\n            }\n          });\n\n          item.items = items;\n          item.loading = false;\n          this.requestUpdate('root');\n          this.scrollSelectedIntoView();\n          if (this.pending && this.pending.length > 0) {\n            // auto select the next pending click\n            const nextId = this.pending.shift();\n            if (nextId && items.length > 0) {\n              const nextItem = findItem(items, nextId);\n              if (nextItem.item) {\n                this.handleItemClicked(null, nextItem.item);\n              } else {\n                this.fireNoPath(nextId);\n              }\n            }\n          } else {\n            // auto select the first item\n            if (\n              selectFirst &&\n              items.length > 0 &&\n              this.selection.length >= 1 &&\n              !item.inline\n            ) {\n              for (const item of items) {\n                if (!item.type) {\n                  this.handleItemClicked(null, item);\n                  break;\n                }\n              }\n            }\n          }\n        }\n      );\n    }\n  }\n\n  private handleItemClicked(\n    event: MouseEvent,\n    menuItem: MenuItem,\n    parent: MenuItem = null\n  ) {\n    if (parent && parent.inline) {\n      this.handleItemClicked(null, parent);\n    }\n\n    if (this.collapsed) {\n      this.collapsed = false;\n    }\n\n    if (event) {\n      event.preventDefault();\n      event.stopPropagation();\n    }\n\n    if (menuItem.type == 'modax-button') {\n      this.fireCustomEvent(CustomEventType.ButtonClicked, {\n        title: menuItem.name,\n        href: menuItem.href,\n        on_submit: menuItem.on_submit,\n      });\n      return;\n    }\n\n    if (menuItem.trigger) {\n      new Function(menuItem.trigger)();\n    } else {\n      if (menuItem.level === 0) {\n        /* this.expanding = menuItem.id;\n        window.setTimeout(() => {\n          this.expanding = null;\n        }, 60);\n        */\n      }\n\n      // update our selection\n      if (menuItem.level >= this.selection.length) {\n        this.selection.push(menuItem.vanity_id || menuItem.id);\n      } else {\n        this.selection.splice(\n          menuItem.level,\n          this.selection.length - menuItem.level,\n          menuItem.vanity_id || menuItem.id\n        );\n      }\n\n      if (menuItem.endpoint) {\n        this.loadItems(menuItem, !menuItem.href);\n        this.dispatchEvent(new Event('change'));\n      } else {\n        if (this.pending && this.pending.length > 0) {\n          // auto select the next pending click\n          const nextId = this.pending.shift();\n          const item = this.getMenuItem();\n          if (nextId && item && item.items && item.items.length > 0) {\n            const nextItem = findItem(item.items, nextId).item;\n            if (nextItem) {\n              this.handleItemClicked(null, nextItem);\n            } else {\n              this.fireNoPath(nextId);\n            }\n          } else {\n            this.fireNoPath(nextId);\n          }\n        } else {\n          this.dispatchEvent(new Event('change'));\n        }\n        this.requestUpdate('root');\n      }\n    }\n  }\n\n  public scrollSelectedIntoView() {\n    // makes sure we are scrolled into view\n    window.setTimeout(() => {\n      const eles = this.shadowRoot.querySelectorAll('.selected');\n      eles.forEach(ele => {\n        ele.scrollIntoView({ block: 'end', behavior: 'smooth' });\n      });\n    }, 0);\n  }\n\n  public clickItem(id: string): boolean {\n    const path = [...this.selection];\n    path.splice(path.length - 1, 1, id);\n    const item = this.getMenuItemForSelection(path);\n\n    if (item) {\n      this.handleItemClicked(null, item);\n      this.scrollSelectedIntoView();\n      return true;\n    }\n    return false;\n  }\n\n  public getMenuItem(): MenuItem {\n    return this.getMenuItemForSelection([...this.selection]);\n  }\n\n  public getMenuItemForSelection(selection: string[]) {\n    const path = [...selection];\n    let items = this.root.items;\n    let item = null;\n    while (path.length > 0) {\n      const step = path.splice(0, 1)[0];\n      if (items) {\n        item = findItem(items, step).item;\n        if (item) {\n          items = item.items;\n        } else {\n          break;\n        }\n      } else {\n        break;\n      }\n    }\n\n    return item;\n  }\n\n  public getSelection() {\n    return this.selection;\n  }\n\n  public setSelection(path: string[]) {\n    this.pending = [...path];\n    this.selection = [];\n\n    if (this.wait) {\n      this.wait = false;\n      this.loadItems(this.root);\n    }\n  }\n\n  public setSelectionPath(path: string) {\n    const asPath = path.split('/').filter(step => !!step);\n\n    // first try to click in the current space\n    const clicked = this.clickItem(asPath[asPath.length - 1]);\n\n    if (!clicked) {\n      this.wait = true;\n      this.setSelection(asPath);\n    }\n  }\n\n  public async setFocusedItem(path: string) {\n    const focusedPath = path.split('/').filter(step => !!step);\n\n    // if we don't match at the first level, we are a noop\n    if (focusedPath.length > 0) {\n      const rootItem = findItem(this.root.items, focusedPath[0]).item;\n      if (!rootItem) {\n        return;\n      }\n    }\n\n    const newPath = [];\n    let level = this.root;\n    while (focusedPath.length > 0) {\n      const nextId = focusedPath.shift();\n      if (nextId) {\n        if (!level.items) {\n          this.loadItems(level, false);\n          await this.httpComplete;\n        }\n\n        level = findItem(level.items, nextId).item;\n        if (!level) {\n          focusedPath.splice(0, focusedPath.length);\n        } else {\n          newPath.push(nextId);\n        }\n      }\n    }\n\n    this.selection = newPath;\n    this.requestUpdate('root');\n  }\n\n  private isSelected(menuItem: MenuItem) {\n    if (menuItem.level < this.selection.length) {\n      const selected =\n        this.selection[menuItem.level] == (menuItem.vanity_id || menuItem.id);\n      return selected;\n    }\n    return false;\n  }\n\n  private isExpanded(menuItem: MenuItem) {\n    const expanded = !!this.selection.find(\n      id => id === menuItem.vanity_id || menuItem.id\n    );\n    return expanded;\n  }\n\n  private renderMenuItem = (\n    menuItem: MenuItem,\n    parent: MenuItem = null\n  ): TemplateResult => {\n    if (menuItem.type === 'divider') {\n      return html`<div class=\"divider\"></div>`;\n    }\n\n    if (menuItem.type === 'section' || menuItem.inline) {\n      return html`<div class=\"sub-section\">${menuItem.name}</div>`;\n    }\n\n    if (menuItem.type === 'modax-button') {\n      return html`<temba-button\n        name=${menuItem.name}\n        @click=${event => {\n          this.handleItemClicked(event, menuItem);\n        }}\n      />`;\n    }\n\n    const isSelected = this.isSelected(menuItem);\n    const isChildSelected =\n      isSelected && this.selection.length > menuItem.level + 1;\n\n    const icon = menuItem.icon\n      ? html`<temba-icon\n            size=\"${menuItem.level === 0 ? '1.5' : '1'}\"\n            name=\"${menuItem.icon}\"\n          ></temba-icon\n          >${menuItem.bubble\n            ? html`<div\n                style=\"background-color: ${menuItem.bubble}\"\n                class=\"bubble\"\n              ></div>`\n            : null}`\n      : null;\n\n    const collapsedIcon = menuItem.collapsed_icon\n      ? html`<temba-icon\n          size=\"${menuItem.level === 0 ? '1.5' : '1'}\"\n          name=\"${menuItem.collapsed_icon}\"\n          class=\"collapse-icon\"\n        ></temba-icon>`\n      : null;\n\n    const itemClasses = getClasses({\n      ['menu-' + menuItem.id]: true,\n      'child-selected': isChildSelected,\n      selected: isSelected,\n      item: true,\n      inline: menuItem.inline,\n      expanding: this.expanding && this.expanding === menuItem.id,\n      expanded: this.isExpanded(menuItem),\n      iconless: !icon && !collapsedIcon,\n    });\n\n    const item = html` <div\n        class=\"item-top ${isSelected ? 'selected' : null} \"\n      ></div>\n\n      <div\n        id=\"menu-${menuItem.id}\"\n        class=\"${itemClasses}\"\n        @click=${event => {\n          this.handleItemClicked(event, menuItem, parent);\n        }}\n      >\n        ${menuItem.level === 0\n          ? html`<temba-tip\n              style=\"display:flex;\"\n              text=\"${menuItem.name}\"\n              position=\"right\"\n              >${icon}</temba-tip\n            >`\n          : html`${icon}${collapsedIcon}`}\n\n        <div class=\"details\" style=\"flex-grow:1;display:flex\">\n          <div\n            class=\"name\"\n            style=\"flex-grow:1; flex-shrink:0; white-space: ${this.wraps\n              ? 'normal'\n              : 'nowrap'};\"\n          >\n            ${menuItem.name}\n          </div>\n          ${menuItem.level > 0\n            ? menuItem.inline\n              ? html`<temba-icon\n                  name=\"chevron-${isSelected || isChildSelected\n                    ? 'up'\n                    : 'down'}\"\n                ></temba-icon>`\n              : html`${menuItem.count || menuItem.count == 0\n                  ? html`\n                      <div class=\"count\">\n                        ${menuItem.count.toLocaleString()}\n                      </div>\n                    `\n                  : html`<div class=\"count\"></div>`}`\n            : null}\n        </div>\n        <div class=\"right\"></div>\n      </div>\n\n      <div class=\"item-bottom ${isSelected ? 'selected' : null}\"></div>`;\n\n    return item;\n  };\n\n  public render(): TemplateResult {\n    if (!this.root || !this.root.items) {\n      return html`<temba-loading\n        units=\"3\"\n        size=\"10\"\n        direction=\"column\"\n        style=\"margin:1em;margin-right:0em\"\n      />`;\n    }\n\n    let items = this.root.items || [];\n    const levels = [];\n\n    levels.push(\n      html`<div class=\"level level-0 ${this.submenu ? 'hidden' : ''}\">\n        <div class=\"top\"></div>\n\n        ${items\n          .filter(item => !item.bottom)\n          .map((item: MenuItem) => {\n            return this.renderMenuItem(item);\n          })}\n\n        <div class=\"empty\"></div>\n        ${items\n          .filter(item => !!item.bottom)\n          .map((item: MenuItem) => {\n            return this.renderMenuItem(item);\n          })}\n        <div class=\"bottom\"></div>\n      </div>`\n    );\n\n    this.selection.forEach((id, index) => {\n      const selected = findItem(items, id).item;\n\n      let collapsed = false;\n      if (selected) {\n        items = selected.items;\n        const itemState = this.getMenuItemState(selected.id);\n        // users set an explicit collapse state\n        if (itemState.collapsed) {\n          collapsed = itemState.collapsed === 'collapsed';\n        }\n        // otherwise pick a default collapse state\n        else {\n          if (this.selection.length > selected.level + 2) {\n            collapsed = false;\n          }\n        }\n      } else {\n        items = null;\n      }\n\n      if (items && items.length > 0 && !selected.inline) {\n        levels.push(\n          html`<div\n            class=\"${getClasses({\n              level: true,\n              ['level-' + (index + 1)]: true,\n              collapsed,\n            })}\"\n          >\n            ${!this.submenu\n              ? html`<div class=\"section\">${selected.name}</div>`\n              : null}\n            ${items.map((item: MenuItem) => {\n              if (item.inline) {\n                return html`${this.renderMenuItem(item)}\n                  <div class=\"inline-children\">\n                    ${item.items.map((child: MenuItem) => {\n                      return this.renderMenuItem(child, item);\n                    })}\n                  </div>`;\n              }\n              return this.renderMenuItem(item);\n            })}\n          </div>`\n        );\n      }\n    });\n\n    const menu = html`<div\n      class=\"${getClasses({\n        root: true,\n        'fully-collapsed': this.collapsed,\n      })}\"\n    >\n      ${levels}\n    </div>`;\n    return html`${menu}`;\n  }\n}\n"]}
+{"version":3,"file":"TembaMenu.js","sourceRoot":"","sources":["../../../src/list/TembaMenu.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 { fetchResults, getClasses } from '../utils';\n\nexport interface MenuItem {\n  id?: string;\n  vanity_id?: string;\n  name?: string;\n  count?: number;\n  icon?: string;\n  collapsed_icon?: string;\n  endpoint?: string;\n  loading?: boolean;\n  bottom?: boolean;\n  level?: number;\n  trigger?: string;\n  href?: string;\n  items?: MenuItem[];\n  inline?: boolean;\n  type?: string;\n  on_submit?: string;\n  bubble?: string;\n}\n\ninterface MenuItemState {\n  collapsed?: string;\n}\n\nconst findItem = (\n  items: MenuItem[],\n  id: string\n): { item: MenuItem; index: number } => {\n  const search = items || [];\n\n  const index = search.findIndex((item: MenuItem) => {\n    return item.id == id || item.vanity_id == id;\n  });\n\n  if (index > -1) {\n    const item = search[index];\n    return { item, index };\n  }\n\n  return { item: null, index: -1 };\n};\n\nexport class TembaMenu extends RapidElement {\n  static get styles() {\n    return css`\n      :host {\n        width: 100%;\n        display: block;\n        --color-widget-bg-focused: transparent;\n        --options-block-shadow: none;\n      }\n\n      .bubble {\n        width: 8px;\n        height: 8px;\n        left: 14px;\n        bottom: -1px;\n        z-index: 10000;\n        border-radius: 99px;\n        border: 1px solid rgb(255, 255, 255);\n        position: relative;\n        margin-top: -10px;\n      }\n\n      .section {\n        font-size: 1.5em;\n        margin-bottom: 0.2em;\n        color: var(--color-text-dark);\n      }\n\n      .collapse-toggle {\n        width: 0.5em;\n        cursor: pointer;\n        display: block;\n        margin-right: 5px;\n        margin-top: 3px;\n        margin-bottom: 3px;\n      }\n\n      .collapse-toggle:hover {\n        background: rgb(100, 100, 100, 0.05);\n      }\n\n      .item {\n        cursor: pointer;\n        user-select: none;\n        -webkit-user-select: none;\n        display: flex;\n        font-size: 1em;\n        --icon-color: var(--color-text-dark);\n      }\n\n      .item.selected {\n        background: var(--color-selection);\n        color: var(--color-primary-dark);\n        --icon-color: var(--color-primary-dark);\n      }\n\n      .root {\n        display: flex;\n        flex-direction: row;\n        height: 100%;\n      }\n\n      .level {\n        display: flex;\n        flex-direction: column;\n      }\n\n      .level.hidden {\n        display: none;\n      }\n\n      .submenu {\n      }\n\n      .level-0 > .item {\n        background: var(--color-primary-dark);\n        --icon-color: #fff;\n        font-size: 1em;\n      }\n\n      .level-0 > .top {\n        padding-top: var(--menu-padding);\n        background: var(--color-primary-dark);\n      }\n\n      .level-0 > .empty {\n        background: var(--color-primary-dark);\n        align-self: stretch;\n        flex-grow: 1;\n      }\n\n      .level-0 > .bottom {\n        height: 1em;\n        background: var(--color-primary-dark);\n      }\n\n      .level-0 > .item > .details {\n        display: none !important;\n      }\n\n      .level-0.expanding {\n      }\n\n      .level-0.expanded {\n        background: inherit;\n      }\n\n      .level-0 > .item.selected {\n        background: inherit;\n        --icon-color: var(--color-primary-dark);\n      }\n\n      .level {\n        padding: var(--menu-padding);\n      }\n\n      .level-0 {\n        padding: 0px;\n      }\n\n      .item {\n        padding: 0.2em 0.75em;\n        margin-top: 0.1em;\n        border-radius: var(--curvature);\n        display: flex;\n        min-width: 12em;\n        max-width: 12em;\n      }\n\n      .item > temba-icon {\n        margin-right: 0.5em;\n      }\n\n      .item.inline > temba-icon {\n      }\n\n      .item > .details > .name {\n        flex-grow: 1;\n        white-space: nowrap;\n        overflow: hidden;\n        text-overflow: ellipsis;\n        width: 0;\n      }\n\n      .level-0 > .item {\n        padding: 1em 1em;\n        margin-top: 0em;\n        border-radius: 0px;\n        min-width: inherit;\n        max-width: inherit;\n      }\n\n      .level-0 > .item > temba-icon {\n        margin-right: 0px;\n      }\n\n      .level-0 > .item > .name {\n        min-width: 0px;\n      }\n\n      .count {\n        align-self: center;\n        margin-left: 1em;\n        font-size: 0.8em;\n        font-weight: 400;\n      }\n\n      .level-0 > .item-top {\n        background: var(--color-primary-dark);\n        min-height: var(--curvature);\n      }\n\n      .level-0 > .item-bottom {\n        background: var(--color-primary-dark);\n        min-height: var(--curvature);\n      }\n\n      .level-0 > .item-bottom.selected {\n        border-top-right-radius: var(--curvature);\n      }\n\n      .level-0 > .item-top.selected {\n        border-bottom-right-radius: var(--curvature);\n      }\n\n      .level-0 > .selected-top {\n      }\n\n      .level-0 > .item:hover {\n        background: rgba(var(--primary-rgb), 0.85);\n      }\n\n      .level-0 > .item.selected:hover {\n        background: inherit;\n      }\n\n      .inline-children {\n      }\n\n      .inline-children .item {\n      }\n\n      .item.inline {\n        border: 0px solid transparent;\n      }\n\n      .level-1,\n      .level-2 {\n        border-right: 1px solid rgba(0 0 0 / 8%);\n        box-shadow: rgb(0 0 0 / 6%) 4px 0px 6px 1px;\n      }\n\n      .level-1 {\n        transition: opacity 100ms linear, margin 200ms linear;\n        overflow-y: scroll;\n        z-index: 1500;\n      }\n\n      .level-2 {\n        background: #fbfbfb;\n        overflow-y: auto;\n        z-index: 1000;\n      }\n\n      .level-2 .item .details {\n        overflow: hidden;\n      }\n\n      .level-2 .item {\n        min-width: 12em;\n        max-width: 12em;\n      }\n\n      .level-1 .item {\n        overflow: hidden;\n        max-width: 12em;\n        min-width: 12em;\n        min-height: 1.5em;\n        max-height: 1.5em;\n        transition: min-width var(--transition-speed) !important;\n      }\n\n      .level-1 .item .details {\n      }\n\n      .collapsed .item {\n        overflow: hidden;\n        min-width: 0;\n        margin: 0;\n      }\n\n      .item .details {\n        opacity: 1;\n        min-height: 1.5em;\n        max-height: 1.5em;\n        align-items: center;\n      }\n\n      .item .details .name {\n      }\n\n      .item temba-icon {\n      }\n\n      .collapsed .item {\n        margin-bottom: 0.5em;\n      }\n\n      .collapsed .item .details {\n        overflow: hidden;\n        max-height: 0em;\n        max-width: 0em;\n      }\n\n      .collapsed .item .details {\n        max-height: 0em;\n      }\n\n      .collapsed .item temba-icon {\n        margin-right: 0;\n      }\n\n      .section {\n        max-width: 12em;\n      }\n\n      .collapsed .section {\n        opacity: 0;\n        max-width: 0em;\n        max-height: 0.6em;\n      }\n\n      .collapsed.level-1 {\n        overflow: hidden;\n        padding: 0.5em;\n        --icon-color: #999;\n      }\n\n      .collapsed .item .right {\n        flex-grow: 1;\n      }\n\n      .collapse-icon {\n        display: none;\n      }\n\n      .collapsed .collapse-icon {\n        --icon-color: #ccc;\n        display: block;\n      }\n\n      .collapsed .item.iconless {\n        max-height: 0em;\n        padding: 0em;\n        min-height: 0em;\n        margin-bottom: 0em;\n      }\n\n      .divider {\n        height: 1px;\n        background: #f3f3f3;\n        margin: 0.5em 0.75em;\n        min-height: 1px;\n      }\n\n      .space {\n        margin: 0.5em;\n      }\n\n      .collapsed .divider {\n        height: 0;\n        margin: 0;\n        padding: 0;\n        min-height: 0px;\n      }\n\n      .sub-section {\n        font-size: 1rem;\n        color: #888;\n        margin-top: 1rem;\n        margin-left: 0.3rem;\n      }\n\n      .fully-collapsed .level-0 {\n        z-index: 1;\n      }\n\n      .fully-collapsed .level-1 {\n        margin-left: -245px;\n        z-index: 0;\n        border: none;\n      }\n\n      .fully-collapsed .level-1 .item,\n      .fully-collapsed .level-1 .divider {\n        opacity: 0;\n      }\n\n      .fully-collapsed .level-2,\n      .fully-collapsed .level-3 {\n        display: none;\n      }\n\n      temba-button {\n        margin-top: 0.2em;\n        margin-bottom: 0.2em;\n        margin-left: 0.75em;\n        margin-right: 0.75em;\n      }\n    `;\n  }\n\n  @property({ type: Boolean })\n  wraps = false;\n\n  @property({ type: Boolean })\n  wait: boolean;\n\n  @property({ type: String })\n  endpoint: string;\n\n  @property({ type: String })\n  expanding: string;\n\n  @property({ type: String })\n  value: string;\n\n  // submenu to constrain to\n  @property({ type: String })\n  submenu: string;\n\n  @property({ type: Boolean })\n  collapsed: boolean;\n\n  // http promise to monitor for completeness\n  public httpComplete: Promise<void>;\n\n  root: MenuItem;\n  selection: string[] = [];\n  pending: string[] = [];\n  state: { [id: string]: MenuItemState } = {};\n\n  constructor() {\n    super();\n  }\n\n  public setBubble(id: string, color: string) {\n    const found = findItem(this.root.items, id);\n    if (found && found.item) {\n      found.item.bubble = color;\n      this.requestUpdate('root');\n      return true;\n    }\n    return false;\n  }\n\n  private getMenuItemState(id: string): MenuItemState {\n    let itemState = {};\n    if (id) {\n      itemState = this.state[id];\n      if (!itemState) {\n        itemState = {};\n        this.state[id] = itemState;\n      }\n    }\n    return itemState;\n  }\n\n  public updated(changes: Map<string, any>) {\n    if (changes.has('value')) {\n      this.setSelection((this.value || '').split('/'));\n    }\n\n    if (changes.has('submenu') && !changes.has('value')) {\n      this.setSelection([this.submenu]);\n    }\n\n    if (changes.has('endpoint')) {\n      this.root = {\n        level: -1,\n        endpoint: this.endpoint,\n      };\n\n      if (!this.wait) {\n        this.loadItems(this.root);\n      }\n    }\n  }\n\n  public refresh(path: string[] = null) {\n    if (!path) {\n      path = [...this.selection];\n    }\n\n    // go up the tree until we find an endpoint\n    const item = this.getMenuItemForSelection(path);\n\n    if (item.endpoint) {\n      this.loadItems(item, false);\n    } else {\n      path.pop();\n      this.refresh(path);\n    }\n  }\n\n  private fireNoPath(missingId: string) {\n    const item = this.getMenuItem();\n\n    const details = {\n      item: item.id,\n      selection: '/' + this.selection.join('/'),\n      endpoint: item.endpoint,\n      path: missingId + '/' + this.pending.join('/') + document.location.search,\n    };\n\n    // remove any excess from our selection\n    const selection = this.selection.join('/');\n    selection.replace(details.path, '');\n    this.selection = selection.split('/');\n\n    this.fireCustomEvent(CustomEventType.NoPath, details);\n    this.pending = [];\n    this.requestUpdate('root');\n  }\n\n  // eslint-disable-next-line @typescript-eslint/no-empty-function\n  private loadItems(item: MenuItem, selectFirst = true) {\n    if (item && item.endpoint) {\n      item.loading = true;\n      this.httpComplete = fetchResults(item.endpoint).then(\n        (items: MenuItem[]) => {\n          // update our item level\n          items.forEach(subItem => {\n            subItem.level = item.level + 1;\n            // if we came with preset items, set the level for them accordingly\n            if (subItem.items) {\n              subItem.items.forEach(inlineItem => {\n                inlineItem.level = item.level + 2;\n                // inlineItem.parent = subItem;\n              });\n            }\n          });\n\n          item.items = items;\n          item.loading = false;\n          this.requestUpdate('root');\n          this.scrollSelectedIntoView();\n          if (this.pending && this.pending.length > 0) {\n            // auto select the next pending click\n            const nextId = this.pending.shift();\n            if (nextId && items.length > 0) {\n              const nextItem = findItem(items, nextId);\n              if (nextItem.item) {\n                this.handleItemClicked(null, nextItem.item);\n              } else {\n                this.fireNoPath(nextId);\n              }\n            }\n          } else {\n            // auto select the first item\n            if (\n              selectFirst &&\n              items.length > 0 &&\n              this.selection.length >= 1 &&\n              !item.inline\n            ) {\n              for (const item of items) {\n                if (!item.type) {\n                  this.handleItemClicked(null, item);\n                  break;\n                }\n              }\n            }\n          }\n        }\n      );\n    }\n  }\n\n  private handleItemClicked(\n    event: MouseEvent,\n    menuItem: MenuItem,\n    parent: MenuItem = null\n  ) {\n    if (parent && parent.inline) {\n      this.handleItemClicked(null, parent);\n    }\n\n    if (this.collapsed) {\n      this.collapsed = false;\n    }\n\n    if (event) {\n      event.preventDefault();\n      event.stopPropagation();\n    }\n\n    if (menuItem.type == 'modax-button') {\n      this.fireCustomEvent(CustomEventType.ButtonClicked, {\n        title: menuItem.name,\n        href: menuItem.href,\n        on_submit: menuItem.on_submit,\n      });\n      return;\n    }\n\n    if (menuItem.trigger) {\n      new Function(menuItem.trigger)();\n    } else {\n      if (menuItem.level === 0) {\n        /* this.expanding = menuItem.id;\n        window.setTimeout(() => {\n          this.expanding = null;\n        }, 60);\n        */\n      }\n\n      // update our selection\n      if (menuItem.level >= this.selection.length) {\n        this.selection.push(menuItem.vanity_id || menuItem.id);\n      } else {\n        this.selection.splice(\n          menuItem.level,\n          this.selection.length - menuItem.level,\n          menuItem.vanity_id || menuItem.id\n        );\n      }\n\n      if (menuItem.endpoint) {\n        this.loadItems(menuItem, !menuItem.href);\n        this.dispatchEvent(new Event('change'));\n      } else {\n        if (this.pending && this.pending.length > 0) {\n          // auto select the next pending click\n          const nextId = this.pending.shift();\n          const item = this.getMenuItem();\n          if (nextId && item && item.items && item.items.length > 0) {\n            const nextItem = findItem(item.items, nextId).item;\n            if (nextItem) {\n              this.handleItemClicked(null, nextItem);\n            } else {\n              this.fireNoPath(nextId);\n            }\n          } else {\n            this.fireNoPath(nextId);\n          }\n        } else {\n          this.dispatchEvent(new Event('change'));\n        }\n        this.requestUpdate('root');\n      }\n    }\n  }\n\n  public scrollSelectedIntoView() {\n    // makes sure we are scrolled into view\n    window.setTimeout(() => {\n      const eles = this.shadowRoot.querySelectorAll('.selected');\n      eles.forEach(ele => {\n        ele.scrollIntoView({ block: 'end', behavior: 'smooth' });\n      });\n    }, 0);\n  }\n\n  public clickItem(id: string): boolean {\n    const path = [...this.selection];\n    path.splice(path.length - 1, 1, id);\n    const item = this.getMenuItemForSelection(path);\n\n    if (item) {\n      this.handleItemClicked(null, item);\n      this.scrollSelectedIntoView();\n      return true;\n    }\n    return false;\n  }\n\n  public getMenuItem(): MenuItem {\n    return this.getMenuItemForSelection([...this.selection]);\n  }\n\n  public getMenuItemForSelection(selection: string[]) {\n    const path = [...selection];\n    let items = this.root.items;\n    let item = null;\n    while (path.length > 0) {\n      const step = path.splice(0, 1)[0];\n      if (items) {\n        item = findItem(items, step).item;\n        if (item) {\n          items = item.items;\n        } else {\n          break;\n        }\n      } else {\n        break;\n      }\n    }\n\n    return item;\n  }\n\n  public getSelection() {\n    return this.selection;\n  }\n\n  public setSelection(path: string[]) {\n    this.pending = [...path];\n    this.selection = [];\n\n    if (this.wait) {\n      this.wait = false;\n      this.loadItems(this.root);\n    }\n  }\n\n  public setSelectionPath(path: string) {\n    const asPath = path.split('/').filter(step => !!step);\n\n    // first try to click in the current space\n    const clicked = this.clickItem(asPath[asPath.length - 1]);\n\n    if (!clicked) {\n      this.wait = true;\n      this.setSelection(asPath);\n    }\n  }\n\n  public async setFocusedItem(path: string) {\n    const focusedPath = path.split('/').filter(step => !!step);\n\n    // if we don't match at the first level, we are a noop\n    if (focusedPath.length > 0) {\n      const rootItem = findItem(this.root.items, focusedPath[0]).item;\n      if (!rootItem) {\n        return;\n      }\n    }\n\n    const newPath = [];\n    let level = this.root;\n    while (focusedPath.length > 0) {\n      const nextId = focusedPath.shift();\n      if (nextId) {\n        if (!level.items) {\n          this.loadItems(level, false);\n          await this.httpComplete;\n        }\n\n        level = findItem(level.items, nextId).item;\n        if (!level) {\n          focusedPath.splice(0, focusedPath.length);\n        } else {\n          newPath.push(nextId);\n        }\n      }\n    }\n\n    this.selection = newPath;\n    this.requestUpdate('root');\n  }\n\n  private isSelected(menuItem: MenuItem) {\n    if (menuItem.level < this.selection.length) {\n      const selected =\n        this.selection[menuItem.level] == (menuItem.vanity_id || menuItem.id);\n      return selected;\n    }\n    return false;\n  }\n\n  private isExpanded(menuItem: MenuItem) {\n    const expanded = !!this.selection.find(\n      id => id === menuItem.vanity_id || menuItem.id\n    );\n    return expanded;\n  }\n\n  private renderMenuItem = (\n    menuItem: MenuItem,\n    parent: MenuItem = null\n  ): TemplateResult => {\n    if (menuItem.type === 'divider') {\n      return html`<div class=\"divider\"></div>`;\n    }\n\n    if (menuItem.type === 'space') {\n      return html`<div class=\"space\"></div>`;\n    }\n\n    if (menuItem.type === 'section' || menuItem.inline) {\n      return html`<div class=\"sub-section\">${menuItem.name}</div>`;\n    }\n\n    if (menuItem.type === 'modax-button') {\n      return html`<temba-button\n        name=${menuItem.name}\n        @click=${event => {\n          this.handleItemClicked(event, menuItem);\n        }}\n      />`;\n    }\n\n    const isSelected = this.isSelected(menuItem);\n    const isChildSelected =\n      isSelected && this.selection.length > menuItem.level + 1;\n\n    const icon = menuItem.icon\n      ? html`<temba-icon\n            size=\"${menuItem.level === 0 ? '1.5' : '1'}\"\n            name=\"${menuItem.icon}\"\n          ></temba-icon\n          >${menuItem.bubble\n            ? html`<div\n                style=\"background-color: ${menuItem.bubble}\"\n                class=\"bubble\"\n              ></div>`\n            : null}`\n      : null;\n\n    const collapsedIcon = menuItem.collapsed_icon\n      ? html`<temba-icon\n          size=\"${menuItem.level === 0 ? '1.5' : '1'}\"\n          name=\"${menuItem.collapsed_icon}\"\n          class=\"collapse-icon\"\n        ></temba-icon>`\n      : null;\n\n    const itemClasses = getClasses({\n      ['menu-' + menuItem.id]: true,\n      'child-selected': isChildSelected,\n      selected: isSelected,\n      item: true,\n      inline: menuItem.inline,\n      expanding: this.expanding && this.expanding === menuItem.id,\n      expanded: this.isExpanded(menuItem),\n      iconless: !icon && !collapsedIcon,\n    });\n\n    const item = html` <div\n        class=\"item-top ${isSelected ? 'selected' : null} \"\n      ></div>\n\n      <div\n        id=\"menu-${menuItem.id}\"\n        class=\"${itemClasses}\"\n        @click=${event => {\n          this.handleItemClicked(event, menuItem, parent);\n        }}\n      >\n        ${menuItem.level === 0\n          ? html`<temba-tip\n              style=\"display:flex;\"\n              text=\"${menuItem.name}\"\n              position=\"right\"\n              >${icon}</temba-tip\n            >`\n          : html`${icon}${collapsedIcon}`}\n\n        <div class=\"details\" style=\"flex-grow:1;display:flex\">\n          <div\n            class=\"name\"\n            style=\"flex-grow:1; flex-shrink:0; white-space: ${this.wraps\n              ? 'normal'\n              : 'nowrap'};\"\n          >\n            ${menuItem.name}\n          </div>\n          ${menuItem.level > 0\n            ? menuItem.inline\n              ? html`<temba-icon\n                  name=\"chevron-${isSelected || isChildSelected\n                    ? 'up'\n                    : 'down'}\"\n                ></temba-icon>`\n              : html`${menuItem.count || menuItem.count == 0\n                  ? html`\n                      <div class=\"count\">\n                        ${menuItem.count.toLocaleString()}\n                      </div>\n                    `\n                  : html`<div class=\"count\"></div>`}`\n            : null}\n        </div>\n        <div class=\"right\"></div>\n      </div>\n\n      <div class=\"item-bottom ${isSelected ? 'selected' : null}\"></div>`;\n\n    return item;\n  };\n\n  public render(): TemplateResult {\n    if (!this.root || !this.root.items) {\n      return html`<temba-loading\n        units=\"3\"\n        size=\"10\"\n        direction=\"column\"\n        style=\"margin:1em;margin-right:0em\"\n      />`;\n    }\n\n    let items = this.root.items || [];\n    const levels = [];\n\n    levels.push(\n      html`<div class=\"level level-0 ${this.submenu ? 'hidden' : ''}\">\n        <div class=\"top\"></div>\n\n        ${items\n          .filter(item => !item.bottom)\n          .map((item: MenuItem) => {\n            return this.renderMenuItem(item);\n          })}\n\n        <div class=\"empty\"></div>\n        ${items\n          .filter(item => !!item.bottom)\n          .map((item: MenuItem) => {\n            return this.renderMenuItem(item);\n          })}\n        <div class=\"bottom\"></div>\n      </div>`\n    );\n\n    this.selection.forEach((id, index) => {\n      const selected = findItem(items, id).item;\n\n      let collapsed = false;\n      if (selected) {\n        items = selected.items;\n        const itemState = this.getMenuItemState(selected.id);\n        // users set an explicit collapse state\n        if (itemState.collapsed) {\n          collapsed = itemState.collapsed === 'collapsed';\n        }\n        // otherwise pick a default collapse state\n        else {\n          if (this.selection.length > selected.level + 2) {\n            collapsed = false;\n          }\n        }\n      } else {\n        items = null;\n      }\n\n      if (items && items.length > 0 && !selected.inline) {\n        levels.push(\n          html`<div\n            class=\"${getClasses({\n              level: true,\n              ['level-' + (index + 1)]: true,\n              collapsed,\n            })}\"\n          >\n            ${!this.submenu\n              ? html`<div class=\"section\">${selected.name}</div>`\n              : null}\n            ${items.map((item: MenuItem) => {\n              if (item.inline && item.items) {\n                return html`${this.renderMenuItem(item)}\n                  <div class=\"inline-children\">\n                    ${(item.items || []).map((child: MenuItem) => {\n                      return this.renderMenuItem(child, item);\n                    })}\n                  </div>`;\n              }\n              return this.renderMenuItem(item);\n            })}\n          </div>`\n        );\n      }\n    });\n\n    const menu = html`<div\n      class=\"${getClasses({\n        root: true,\n        'fully-collapsed': this.collapsed,\n      })}\"\n    >\n      ${levels}\n    </div>`;\n    return html`${menu}`;\n  }\n}\n"]}

package/out-tsc/test/temba-contact-history.test.js

@@ -46,9 +46,9 @@ describe('temba-contact-history', () => {
         // we should have scrolled to the bottom
         const events = history.shadowRoot.querySelector('.events');
         const top = events.scrollHeight - events.getBoundingClientRect().height;
-        expect(top).to.equal(539);
+        expect(top).to.equal(533);
         // make sure we actually scrolled to there
-        expect(events.scrollTop).to.equal(top - 4);
+        expect(events.scrollTop).to.equal(top);
         await assertScreenshot('contacts/history', getHistoryClip(history));
     });
     it('expands event groups', async () => {

package/out-tsc/test/temba-contact-history.test.js.map

@@ -1 +1 @@
-{"version":3,"file":"temba-contact-history.test.js","sourceRoot":"","sources":["../../test/temba-contact-history.test.ts"],"names":[],"mappings":"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","sourcesContent":["import { fixture, assert, expect } from '@open-wc/testing';\nimport sinon from 'sinon';\nimport { ContactHistory } from '../src/contacts/ContactHistory';\nimport { stubbable } from '../src/utils';\nimport {\n  assertScreenshot,\n  getClip,\n  getHTML,\n  mockGET,\n} from '../test/utils.test';\nimport './utils.test';\n\nexport const createHistory = async (def: string) => {\n  const parentNode = document.createElement('div');\n  parentNode.setAttribute(\n    'style',\n    'width: 500px;height:750px;display:flex;flex-direction:column;flex-grow:1;min-height:0;'\n  );\n  const history = (await fixture(def, { parentNode })) as ContactHistory;\n\n  // let history fetch start and wait for it\n  await waitFor(0);\n  await history.httpComplete;\n\n  // wait for scroll update\n  await waitFor(0);\n  await history.httpComplete;\n\n  return history;\n};\n\nconst getHistoryHTML = (attrs: any = {} as any) =>\n  // attrs = \"min-height:0;display:flex;flex-grow:1;flex-direction:column\";\n  getHTML('temba-contact-history', attrs);\n\nconst getHistoryClip = (ele: ContactHistory) => {\n  const clip = getClip(ele);\n  clip.height = Math.min(clip.height, 750);\n  clip.bottom = clip.top + clip.height;\n  return clip;\n};\n\n// stub our current date for consistent screenshots\nsinon.stub(stubbable, 'getCurrentDate').callsFake(() => {\n  return new Date('2021-03-31T00:00:00.000-00:00');\n});\n\ndescribe('temba-contact-history', () => {\n  beforeEach(() => {\n    mockGET(\n      /\\/contact\\/history\\/1234\\/.*/,\n      '/test-assets/contacts/history.json'\n    );\n\n    mockGET(\n      /\\/api\\/v2\\/tickets\\.json\\?contact=1234/,\n      '/test-assets/api/tickets.json'\n    );\n  });\n\n  it('can be created', async () => {\n    const history = await createHistory(getHistoryHTML());\n    assert.instanceOf(history, ContactHistory);\n  });\n\n  it('renders history', async () => {\n    const history = await createHistory(\n      getHistoryHTML({\n        uuid: '1234',\n      })\n    );\n\n    await waitFor(500);\n\n    // we should have scrolled to the bottom\n    const events = history.shadowRoot.querySelector('.events');\n    const top = events.scrollHeight - events.getBoundingClientRect().height;\n\n    expect(top).to.equal(539);\n\n    // make sure we actually scrolled to there\n    expect(events.scrollTop).to.equal(top - 4);\n\n    await assertScreenshot('contacts/history', getHistoryClip(history));\n  });\n\n  it('expands event groups', async () => {\n    const history = await createHistory(\n      getHistoryHTML({\n        uuid: '1234',\n      })\n    );\n\n    // our groups with collapsed events\n    const groups = [3, 5, 7];\n    for (const idx of groups) {\n      const group = history.shadowRoot.querySelector(\n        `.event-count[data-group-index='${idx}']`\n      ) as HTMLDivElement;\n      group.click();\n    }\n\n    await waitFor(500);\n\n    await assertScreenshot(\n      'contacts/history-expanded',\n      getHistoryClip(history)\n    );\n  });\n});\n"]}
+{"version":3,"file":"temba-contact-history.test.js","sourceRoot":"","sources":["../../test/temba-contact-history.test.ts"],"names":[],"mappings":"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","sourcesContent":["import { fixture, assert, expect } from '@open-wc/testing';\nimport sinon from 'sinon';\nimport { ContactHistory } from '../src/contacts/ContactHistory';\nimport { stubbable } from '../src/utils';\nimport {\n  assertScreenshot,\n  getClip,\n  getHTML,\n  mockGET,\n} from '../test/utils.test';\nimport './utils.test';\n\nexport const createHistory = async (def: string) => {\n  const parentNode = document.createElement('div');\n  parentNode.setAttribute(\n    'style',\n    'width: 500px;height:750px;display:flex;flex-direction:column;flex-grow:1;min-height:0;'\n  );\n  const history = (await fixture(def, { parentNode })) as ContactHistory;\n\n  // let history fetch start and wait for it\n  await waitFor(0);\n  await history.httpComplete;\n\n  // wait for scroll update\n  await waitFor(0);\n  await history.httpComplete;\n\n  return history;\n};\n\nconst getHistoryHTML = (attrs: any = {} as any) =>\n  // attrs = \"min-height:0;display:flex;flex-grow:1;flex-direction:column\";\n  getHTML('temba-contact-history', attrs);\n\nconst getHistoryClip = (ele: ContactHistory) => {\n  const clip = getClip(ele);\n  clip.height = Math.min(clip.height, 750);\n  clip.bottom = clip.top + clip.height;\n  return clip;\n};\n\n// stub our current date for consistent screenshots\nsinon.stub(stubbable, 'getCurrentDate').callsFake(() => {\n  return new Date('2021-03-31T00:00:00.000-00:00');\n});\n\ndescribe('temba-contact-history', () => {\n  beforeEach(() => {\n    mockGET(\n      /\\/contact\\/history\\/1234\\/.*/,\n      '/test-assets/contacts/history.json'\n    );\n\n    mockGET(\n      /\\/api\\/v2\\/tickets\\.json\\?contact=1234/,\n      '/test-assets/api/tickets.json'\n    );\n  });\n\n  it('can be created', async () => {\n    const history = await createHistory(getHistoryHTML());\n    assert.instanceOf(history, ContactHistory);\n  });\n\n  it('renders history', async () => {\n    const history = await createHistory(\n      getHistoryHTML({\n        uuid: '1234',\n      })\n    );\n\n    await waitFor(500);\n\n    // we should have scrolled to the bottom\n    const events = history.shadowRoot.querySelector('.events');\n    const top = events.scrollHeight - events.getBoundingClientRect().height;\n\n    expect(top).to.equal(533);\n\n    // make sure we actually scrolled to there\n    expect(events.scrollTop).to.equal(top);\n\n    await assertScreenshot('contacts/history', getHistoryClip(history));\n  });\n\n  it('expands event groups', async () => {\n    const history = await createHistory(\n      getHistoryHTML({\n        uuid: '1234',\n      })\n    );\n\n    // our groups with collapsed events\n    const groups = [3, 5, 7];\n    for (const idx of groups) {\n      const group = history.shadowRoot.querySelector(\n        `.event-count[data-group-index='${idx}']`\n      ) as HTMLDivElement;\n      group.click();\n    }\n\n    await waitFor(500);\n\n    await assertScreenshot(\n      'contacts/history-expanded',\n      getHistoryClip(history)\n    );\n  });\n});\n"]}

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@nyaruka/temba-components",
-  "version": "0.26.3",
+  "version": "0.26.6",
   "description": "Web components to support rapidpro and related projects",
   "author": "Nyaruka <code@nyaruka.coim>",
   "main": "dist/index.js",
@@ -29,6 +29,7 @@
     "version": "yarn run build && auto-changelog -p && git add CHANGELOG.md"
   },
   "dependencies": {
+    "flatpickr": "4.6.13",
     "flru": "^1.0.2",
     "geojson": "^0.5.0",
     "highlight.js": "^10.7.1",

package/src/contacts/events.ts

@@ -23,7 +23,6 @@ export const getEventStyles = () => {
 
     .grouping .items {
       display: block;
-      user-select: none;
     }
 
     .grouping.verbose .items {
@@ -31,6 +30,7 @@ export const getEventStyles = () => {
       max-height: 0;
       display: flex;
       flex-direction: column;
+      user-select: none;
     }
 
     .grouping.flows .items {

package/src/list/TembaMenu.ts

@@ -260,7 +260,7 @@ export class TembaMenu extends RapidElement {
 
       .level-1 {
         transition: opacity 100ms linear, margin 200ms linear;
-        overflow-y: auto;
+        overflow-y: scroll;
         z-index: 1500;
       }
 
@@ -371,6 +371,10 @@ export class TembaMenu extends RapidElement {
         min-height: 1px;
       }
 
+      .space {
+        margin: 0.5em;
+      }
+
       .collapsed .divider {
         height: 0;
         margin: 0;
@@ -788,6 +792,10 @@ export class TembaMenu extends RapidElement {
       return html`<div class="divider"></div>`;
     }
 
+    if (menuItem.type === 'space') {
+      return html`<div class="space"></div>`;
+    }
+
     if (menuItem.type === 'section' || menuItem.inline) {
       return html`<div class="sub-section">${menuItem.name}</div>`;
     }
@@ -957,10 +965,10 @@ export class TembaMenu extends RapidElement {
               ? html`<div class="section">${selected.name}</div>`
               : null}
             ${items.map((item: MenuItem) => {
-              if (item.inline) {
+              if (item.inline && item.items) {
                 return html`${this.renderMenuItem(item)}
                   <div class="inline-children">
-                    ${item.items.map((child: MenuItem) => {
+                    ${(item.items || []).map((child: MenuItem) => {
                       return this.renderMenuItem(child, item);
                     })}
                   </div>`;

package/test/temba-contact-history.test.ts

@@ -76,10 +76,10 @@ describe('temba-contact-history', () => {
     const events = history.shadowRoot.querySelector('.events');
     const top = events.scrollHeight - events.getBoundingClientRect().height;
 
-    expect(top).to.equal(539);
+    expect(top).to.equal(533);
 
     // make sure we actually scrolled to there
-    expect(events.scrollTop).to.equal(top - 4);
+    expect(events.scrollTop).to.equal(top);
 
     await assertScreenshot('contacts/history', getHistoryClip(history));
   });

package/test-assets/style.css

@@ -17,7 +17,7 @@ html input {
 html {
   --transition-speed: 0ms !important;
   --input-caret: transparent !important;
-  --font-family: 'Roboto';
+  --font-family: 'Arial';
   --primary-rgb: 35, 135, 202;
   --secondary-rgb: 140, 51, 140;
   --tertiary-rgb: 135, 202, 35;