@nyaruka/temba-components 0.26.3 → 0.26.4

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (70) hide show
  1. package/CHANGELOG.md +7 -0
  2. package/dist/{51fa8c26.js → 3f6be8fc.js} +8 -4
  3. package/dist/index.js +8 -4
  4. package/dist/sw.js +1 -1
  5. package/dist/sw.js.map +1 -1
  6. package/dist/templates/components-body.html +1 -1
  7. package/dist/templates/components-head.html +1 -1
  8. package/out-tsc/src/list/TembaMenu.js +10 -3
  9. package/out-tsc/src/list/TembaMenu.js.map +1 -1
  10. package/out-tsc/test/temba-contact-history.test.js +2 -2
  11. package/out-tsc/test/temba-contact-history.test.js.map +1 -1
  12. package/package.json +1 -1
  13. package/screenshots/truth/alert/error.png +0 -0
  14. package/screenshots/truth/alert/info.png +0 -0
  15. package/screenshots/truth/alert/warning.png +0 -0
  16. package/screenshots/truth/checkbox/checked.png +0 -0
  17. package/screenshots/truth/checkbox/default.png +0 -0
  18. package/screenshots/truth/contacts/history-expanded.png +0 -0
  19. package/screenshots/truth/contacts/history.png +0 -0
  20. package/screenshots/truth/counter/summary.png +0 -0
  21. package/screenshots/truth/counter/text.png +0 -0
  22. package/screenshots/truth/counter/unicode-variables.png +0 -0
  23. package/screenshots/truth/counter/unicode.png +0 -0
  24. package/screenshots/truth/counter/variable.png +0 -0
  25. package/screenshots/truth/dialog/focused.png +0 -0
  26. package/screenshots/truth/list/items-selected.png +0 -0
  27. package/screenshots/truth/list/items-updated.png +0 -0
  28. package/screenshots/truth/list/items.png +0 -0
  29. package/screenshots/truth/list/menu-submenu.png +0 -0
  30. package/screenshots/truth/modax/form.png +0 -0
  31. package/screenshots/truth/modax/simple.png +0 -0
  32. package/screenshots/truth/options/block.png +0 -0
  33. package/screenshots/truth/select/disabled-multi-selection.png +0 -0
  34. package/screenshots/truth/select/disabled-selection.png +0 -0
  35. package/screenshots/truth/select/disabled.png +0 -0
  36. package/screenshots/truth/select/embedded.png +0 -0
  37. package/screenshots/truth/select/expression-selected.png +0 -0
  38. package/screenshots/truth/select/expressions.png +0 -0
  39. package/screenshots/truth/select/functions.png +0 -0
  40. package/screenshots/truth/select/local-options.png +0 -0
  41. package/screenshots/truth/select/remote-options.png +0 -0
  42. package/screenshots/truth/select/search-enabled.png +0 -0
  43. package/screenshots/truth/select/search-multi-no-matches.png +0 -0
  44. package/screenshots/truth/select/search-selected-focus.png +0 -0
  45. package/screenshots/truth/select/search-selected.png +0 -0
  46. package/screenshots/truth/select/search-with-selected.png +0 -0
  47. package/screenshots/truth/select/searching.png +0 -0
  48. package/screenshots/truth/select/selected-multi.png +0 -0
  49. package/screenshots/truth/select/selected-single.png +0 -0
  50. package/screenshots/truth/select/selection-clearable.png +0 -0
  51. package/screenshots/truth/select/with-placeholder.png +0 -0
  52. package/screenshots/truth/select/without-placeholder.png +0 -0
  53. package/screenshots/truth/textinput/date-form.png +0 -0
  54. package/screenshots/truth/textinput/date-initialized.png +0 -0
  55. package/screenshots/truth/textinput/input-disabled.png +0 -0
  56. package/screenshots/truth/textinput/input-focused.png +0 -0
  57. package/screenshots/truth/textinput/input-form.png +0 -0
  58. package/screenshots/truth/textinput/input-inserted.png +0 -0
  59. package/screenshots/truth/textinput/input-placeholder.png +0 -0
  60. package/screenshots/truth/textinput/input-updated.png +0 -0
  61. package/screenshots/truth/textinput/input.png +0 -0
  62. package/screenshots/truth/textinput/textarea-focused.png +0 -0
  63. package/screenshots/truth/textinput/textarea.png +0 -0
  64. package/screenshots/truth/tip/bottom.png +0 -0
  65. package/screenshots/truth/tip/left.png +0 -0
  66. package/screenshots/truth/tip/right.png +0 -0
  67. package/screenshots/truth/tip/top.png +0 -0
  68. package/src/list/TembaMenu.ts +11 -3
  69. package/test/temba-contact-history.test.ts +2 -2
  70. package/test-assets/style.css +1 -1
package/CHANGELOG.md CHANGED
@@ -4,6 +4,13 @@ All notable changes to this project will be documented in this file. Dates are d
4
4
 
5
5
  Generated by [`auto-changelog`](https://github.com/CookPete/auto-changelog).
6
6
 
7
+ #### [v0.26.4](https://github.com/nyaruka/temba-components/compare/v0.26.3...v0.26.4)
8
+
9
+ > 26 April 2022
10
+
11
+ - Fix inline menus with no items [`#165`](https://github.com/nyaruka/temba-components/pull/165)
12
+ - Switch test font [`9fe1ffd`](https://github.com/nyaruka/temba-components/commit/9fe1ffd67be69c42e931e87e3e06e1c402e992fa)
13
+
7
14
  #### [v0.26.3](https://github.com/nyaruka/temba-components/compare/v0.26.2...v0.26.3)
8
15
 
9
16
  > 22 April 2022
@@ -3464,7 +3464,7 @@ function __decorate(l,n,e,t){var i,o=arguments.length,u=o<3?n:null===t?t=Object.
3464
3464
  ${this.arrow}
3465
3465
  </div>
3466
3466
  </div>
3467
- `}}__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
3467
+ `}}__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
3468
3468
  name=${l.name}
3469
3469
  @click=${n=>{this.handleItemClicked(n,l)}}
3470
3470
  />`;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.
3724
3724
 
3725
3725
  .level-1 {
3726
3726
  transition: opacity 100ms linear, margin 200ms linear;
3727
- overflow-y: auto;
3727
+ overflow-y: scroll;
3728
3728
  z-index: 1500;
3729
3729
  }
3730
3730
 
@@ -3835,6 +3835,10 @@ function __decorate(l,n,e,t){var i,o=arguments.length,u=o<3?n:null===t?t=Object.
3835
3835
  min-height: 1px;
3836
3836
  }
3837
3837
 
3838
+ .space {
3839
+ margin: 0.5em;
3840
+ }
3841
+
3838
3842
  .collapsed .divider {
3839
3843
  height: 0;
3840
3844
  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.
3892
3896
  class="${getClasses({level:!0,["level-"+(t+1)]:!0,collapsed:o})}"
3893
3897
  >
3894
3898
  ${this.submenu?null:$`<div class="section">${i.name}</div>`}
3895
- ${l.map((l=>l.inline?$`${this.renderMenuItem(l)}
3899
+ ${l.map((l=>l.inline&&l.items?$`${this.renderMenuItem(l)}
3896
3900
  <div class="inline-children">
3897
- ${l.items.map((n=>this.renderMenuItem(n,l)))}
3901
+ ${(l.items||[]).map((n=>this.renderMenuItem(n,l)))}
3898
3902
  </div>`:this.renderMenuItem(l)))}
3899
3903
  </div>`)}));const e=$`<div
3900
3904
  class="${getClasses({root:!0,"fully-collapsed":this.collapsed})}"
package/dist/index.js CHANGED
@@ -3464,7 +3464,7 @@ function __decorate(l,n,e,t){var i,o=arguments.length,u=o<3?n:null===t?t=Object.
3464
3464
  ${this.arrow}
3465
3465
  </div>
3466
3466
  </div>
3467
- `}}__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
3467
+ `}}__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
3468
3468
  name=${l.name}
3469
3469
  @click=${n=>{this.handleItemClicked(n,l)}}
3470
3470
  />`;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.
3724
3724
 
3725
3725
  .level-1 {
3726
3726
  transition: opacity 100ms linear, margin 200ms linear;
3727
- overflow-y: auto;
3727
+ overflow-y: scroll;
3728
3728
  z-index: 1500;
3729
3729
  }
3730
3730
 
@@ -3835,6 +3835,10 @@ function __decorate(l,n,e,t){var i,o=arguments.length,u=o<3?n:null===t?t=Object.
3835
3835
  min-height: 1px;
3836
3836
  }
3837
3837
 
3838
+ .space {
3839
+ margin: 0.5em;
3840
+ }
3841
+
3838
3842
  .collapsed .divider {
3839
3843
  height: 0;
3840
3844
  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.
3892
3896
  class="${getClasses({level:!0,["level-"+(t+1)]:!0,collapsed:o})}"
3893
3897
  >
3894
3898
  ${this.submenu?null:$`<div class="section">${i.name}</div>`}
3895
- ${l.map((l=>l.inline?$`${this.renderMenuItem(l)}
3899
+ ${l.map((l=>l.inline&&l.items?$`${this.renderMenuItem(l)}
3896
3900
  <div class="inline-children">
3897
- ${l.items.map((n=>this.renderMenuItem(n,l)))}
3901
+ ${(l.items||[]).map((n=>this.renderMenuItem(n,l)))}
3898
3902
  </div>`:this.renderMenuItem(l)))}
3899
3903
  </div>`)}));const e=$`<div
3900
3904
  class="${getClasses({root:!0,"fully-collapsed":this.collapsed})}"
package/dist/sw.js CHANGED
@@ -1,2 +1,2 @@
1
- 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")}));
1
+ 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:"3f6be8fc.js",revision:"1e5c694507e298f157f4f7fd37a2af52"},{url:"templates/components-body.html",revision:"b0c365c9492bd0d7a36ebbff0d751e95"},{url:"templates/components-head.html",revision:"072244c2aaf590013cd892b40a5ffcd1"}],{}),e.registerRoute(new e.NavigationRoute(e.createHandlerBoundToURL("/index.html"))),e.registerRoute("polyfills/*.js",new e.CacheFirst,"GET")}));
2
2
  //# sourceMappingURL=sw.js.map
package/dist/sw.js.map CHANGED
@@ -1 +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"}
1
+ {"version":3,"file":"sw.js","sources":["../../../../../tmp/981287e3fe0f4089fbdffb3fc110c82c/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\": \"3f6be8fc.js\",\n \"revision\": \"1e5c694507e298f157f4f7fd37a2af52\"\n },\n {\n \"url\": \"templates/components-body.html\",\n \"revision\": \"b0c365c9492bd0d7a36ebbff0d751e95\"\n },\n {\n \"url\": \"templates/components-head.html\",\n \"revision\": \"072244c2aaf590013cd892b40a5ffcd1\"\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"}
@@ -1 +1 @@
1
- <script type="module" src="{{STATIC_URL}}@nyaruka/temba-components/dist/51fa8c26.js"></script><script>window.TEMBA_COMPONENTS_VERSION="0.26.3"</script>
1
+ <script type="module" src="{{STATIC_URL}}@nyaruka/temba-components/dist/3f6be8fc.js"></script><script>window.TEMBA_COMPONENTS_VERSION="0.26.4"</script>
@@ -1 +1 @@
1
- <link rel="modulepreload" href="{{STATIC_URL}}@nyaruka/temba-components/dist/51fa8c26.js" crossorigin="anonymous">
1
+ <link rel="modulepreload" href="{{STATIC_URL}}@nyaruka/temba-components/dist/3f6be8fc.js" crossorigin="anonymous">
@@ -26,6 +26,9 @@ export class TembaMenu extends RapidElement {
26
26
  if (menuItem.type === 'divider') {
27
27
  return html `<div class="divider"></div>`;
28
28
  }
29
+ if (menuItem.type === 'space') {
30
+ return html `<div class="space"></div>`;
31
+ }
29
32
  if (menuItem.type === 'section' || menuItem.inline) {
30
33
  return html `<div class="sub-section">${menuItem.name}</div>`;
31
34
  }
@@ -333,7 +336,7 @@ export class TembaMenu extends RapidElement {
333
336
 
334
337
  .level-1 {
335
338
  transition: opacity 100ms linear, margin 200ms linear;
336
- overflow-y: auto;
339
+ overflow-y: scroll;
337
340
  z-index: 1500;
338
341
  }
339
342
 
@@ -444,6 +447,10 @@ export class TembaMenu extends RapidElement {
444
447
  min-height: 1px;
445
448
  }
446
449
 
450
+ .space {
451
+ margin: 0.5em;
452
+ }
453
+
447
454
  .collapsed .divider {
448
455
  height: 0;
449
456
  margin: 0;
@@ -834,10 +841,10 @@ export class TembaMenu extends RapidElement {
834
841
  ? html `<div class="section">${selected.name}</div>`
835
842
  : null}
836
843
  ${items.map((item) => {
837
- if (item.inline) {
844
+ if (item.inline && item.items) {
838
845
  return html `${this.renderMenuItem(item)}
839
846
  <div class="inline-children">
840
- ${item.items.map((child) => {
847
+ ${(item.items || []).map((child) => {
841
848
  return this.renderMenuItem(child, item);
842
849
  })}
843
850
  </div>`;
@@ -1 +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"]}
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: 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"]}
@@ -46,9 +46,9 @@ describe('temba-contact-history', () => {
46
46
  // we should have scrolled to the bottom
47
47
  const events = history.shadowRoot.querySelector('.events');
48
48
  const top = events.scrollHeight - events.getBoundingClientRect().height;
49
- expect(top).to.equal(539);
49
+ expect(top).to.equal(533);
50
50
  // make sure we actually scrolled to there
51
- expect(events.scrollTop).to.equal(top - 4);
51
+ expect(events.scrollTop).to.equal(top);
52
52
  await assertScreenshot('contacts/history', getHistoryClip(history));
53
53
  });
54
54
  it('expands event groups', async () => {
@@ -1 +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"]}
1
+ {"version":3,"file":"temba-contact-history.test.js","sourceRoot":"","sources":["../../test/temba-contact-history.test.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,OAAO,EAAE,MAAM,EAAE,MAAM,EAAE,MAAM,kBAAkB,CAAC;AAC3D,OAAO,KAAK,MAAM,OAAO,CAAC;AAC1B,OAAO,EAAE,cAAc,EAAE,MAAM,gCAAgC,CAAC;AAChE,OAAO,EAAE,SAAS,EAAE,MAAM,cAAc,CAAC;AACzC,OAAO,EACL,gBAAgB,EAChB,OAAO,EACP,OAAO,EACP,OAAO,GACR,MAAM,oBAAoB,CAAC;AAC5B,OAAO,cAAc,CAAC;AAEtB,MAAM,CAAC,MAAM,aAAa,GAAG,KAAK,EAAE,GAAW,EAAE,EAAE;IACjD,MAAM,UAAU,GAAG,QAAQ,CAAC,aAAa,CAAC,KAAK,CAAC,CAAC;IACjD,UAAU,CAAC,YAAY,CACrB,OAAO,EACP,wFAAwF,CACzF,CAAC;IACF,MAAM,OAAO,GAAG,CAAC,MAAM,OAAO,CAAC,GAAG,EAAE,EAAE,UAAU,EAAE,CAAC,CAAmB,CAAC;IAEvE,0CAA0C;IAC1C,MAAM,OAAO,CAAC,CAAC,CAAC,CAAC;IACjB,MAAM,OAAO,CAAC,YAAY,CAAC;IAE3B,yBAAyB;IACzB,MAAM,OAAO,CAAC,CAAC,CAAC,CAAC;IACjB,MAAM,OAAO,CAAC,YAAY,CAAC;IAE3B,OAAO,OAAO,CAAC;AACjB,CAAC,CAAC;AAEF,MAAM,cAAc,GAAG,CAAC,QAAa,EAAS,EAAE,EAAE;AAChD,yEAAyE;AACzE,OAAO,CAAC,uBAAuB,EAAE,KAAK,CAAC,CAAC;AAE1C,MAAM,cAAc,GAAG,CAAC,GAAmB,EAAE,EAAE;IAC7C,MAAM,IAAI,GAAG,OAAO,CAAC,GAAG,CAAC,CAAC;IAC1B,IAAI,CAAC,MAAM,GAAG,IAAI,CAAC,GAAG,CAAC,IAAI,CAAC,MAAM,EAAE,GAAG,CAAC,CAAC;IACzC,IAAI,CAAC,MAAM,GAAG,IAAI,CAAC,GAAG,GAAG,IAAI,CAAC,MAAM,CAAC;IACrC,OAAO,IAAI,CAAC;AACd,CAAC,CAAC;AAEF,mDAAmD;AACnD,KAAK,CAAC,IAAI,CAAC,SAAS,EAAE,gBAAgB,CAAC,CAAC,SAAS,CAAC,GAAG,EAAE;IACrD,OAAO,IAAI,IAAI,CAAC,+BAA+B,CAAC,CAAC;AACnD,CAAC,CAAC,CAAC;AAEH,QAAQ,CAAC,uBAAuB,EAAE,GAAG,EAAE;IACrC,UAAU,CAAC,GAAG,EAAE;QACd,OAAO,CACL,8BAA8B,EAC9B,oCAAoC,CACrC,CAAC;QAEF,OAAO,CACL,wCAAwC,EACxC,+BAA+B,CAChC,CAAC;IACJ,CAAC,CAAC,CAAC;IAEH,EAAE,CAAC,gBAAgB,EAAE,KAAK,IAAI,EAAE;QAC9B,MAAM,OAAO,GAAG,MAAM,aAAa,CAAC,cAAc,EAAE,CAAC,CAAC;QACtD,MAAM,CAAC,UAAU,CAAC,OAAO,EAAE,cAAc,CAAC,CAAC;IAC7C,CAAC,CAAC,CAAC;IAEH,EAAE,CAAC,iBAAiB,EAAE,KAAK,IAAI,EAAE;QAC/B,MAAM,OAAO,GAAG,MAAM,aAAa,CACjC,cAAc,CAAC;YACb,IAAI,EAAE,MAAM;SACb,CAAC,CACH,CAAC;QAEF,MAAM,OAAO,CAAC,GAAG,CAAC,CAAC;QAEnB,wCAAwC;QACxC,MAAM,MAAM,GAAG,OAAO,CAAC,UAAU,CAAC,aAAa,CAAC,SAAS,CAAC,CAAC;QAC3D,MAAM,GAAG,GAAG,MAAM,CAAC,YAAY,GAAG,MAAM,CAAC,qBAAqB,EAAE,CAAC,MAAM,CAAC;QAExE,MAAM,CAAC,GAAG,CAAC,CAAC,EAAE,CAAC,KAAK,CAAC,GAAG,CAAC,CAAC;QAE1B,0CAA0C;QAC1C,MAAM,CAAC,MAAM,CAAC,SAAS,CAAC,CAAC,EAAE,CAAC,KAAK,CAAC,GAAG,CAAC,CAAC;QAEvC,MAAM,gBAAgB,CAAC,kBAAkB,EAAE,cAAc,CAAC,OAAO,CAAC,CAAC,CAAC;IACtE,CAAC,CAAC,CAAC;IAEH,EAAE,CAAC,sBAAsB,EAAE,KAAK,IAAI,EAAE;QACpC,MAAM,OAAO,GAAG,MAAM,aAAa,CACjC,cAAc,CAAC;YACb,IAAI,EAAE,MAAM;SACb,CAAC,CACH,CAAC;QAEF,mCAAmC;QACnC,MAAM,MAAM,GAAG,CAAC,CAAC,EAAE,CAAC,EAAE,CAAC,CAAC,CAAC;QACzB,KAAK,MAAM,GAAG,IAAI,MAAM,EAAE;YACxB,MAAM,KAAK,GAAG,OAAO,CAAC,UAAU,CAAC,aAAa,CAC5C,kCAAkC,GAAG,IAAI,CACxB,CAAC;YACpB,KAAK,CAAC,KAAK,EAAE,CAAC;SACf;QAED,MAAM,OAAO,CAAC,GAAG,CAAC,CAAC;QAEnB,MAAM,gBAAgB,CACpB,2BAA2B,EAC3B,cAAc,CAAC,OAAO,CAAC,CACxB,CAAC;IACJ,CAAC,CAAC,CAAC;AACL,CAAC,CAAC,CAAC","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 CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@nyaruka/temba-components",
3
- "version": "0.26.3",
3
+ "version": "0.26.4",
4
4
  "description": "Web components to support rapidpro and related projects",
5
5
  "author": "Nyaruka <code@nyaruka.coim>",
6
6
  "main": "dist/index.js",
Binary file
Binary file
Binary file
Binary file
Binary file
Binary file
Binary file
Binary file
Binary file
Binary file
Binary file
Binary file
@@ -260,7 +260,7 @@ export class TembaMenu extends RapidElement {
260
260
 
261
261
  .level-1 {
262
262
  transition: opacity 100ms linear, margin 200ms linear;
263
- overflow-y: auto;
263
+ overflow-y: scroll;
264
264
  z-index: 1500;
265
265
  }
266
266
 
@@ -371,6 +371,10 @@ export class TembaMenu extends RapidElement {
371
371
  min-height: 1px;
372
372
  }
373
373
 
374
+ .space {
375
+ margin: 0.5em;
376
+ }
377
+
374
378
  .collapsed .divider {
375
379
  height: 0;
376
380
  margin: 0;
@@ -788,6 +792,10 @@ export class TembaMenu extends RapidElement {
788
792
  return html`<div class="divider"></div>`;
789
793
  }
790
794
 
795
+ if (menuItem.type === 'space') {
796
+ return html`<div class="space"></div>`;
797
+ }
798
+
791
799
  if (menuItem.type === 'section' || menuItem.inline) {
792
800
  return html`<div class="sub-section">${menuItem.name}</div>`;
793
801
  }
@@ -957,10 +965,10 @@ export class TembaMenu extends RapidElement {
957
965
  ? html`<div class="section">${selected.name}</div>`
958
966
  : null}
959
967
  ${items.map((item: MenuItem) => {
960
- if (item.inline) {
968
+ if (item.inline && item.items) {
961
969
  return html`${this.renderMenuItem(item)}
962
970
  <div class="inline-children">
963
- ${item.items.map((child: MenuItem) => {
971
+ ${(item.items || []).map((child: MenuItem) => {
964
972
  return this.renderMenuItem(child, item);
965
973
  })}
966
974
  </div>`;
@@ -76,10 +76,10 @@ describe('temba-contact-history', () => {
76
76
  const events = history.shadowRoot.querySelector('.events');
77
77
  const top = events.scrollHeight - events.getBoundingClientRect().height;
78
78
 
79
- expect(top).to.equal(539);
79
+ expect(top).to.equal(533);
80
80
 
81
81
  // make sure we actually scrolled to there
82
- expect(events.scrollTop).to.equal(top - 4);
82
+ expect(events.scrollTop).to.equal(top);
83
83
 
84
84
  await assertScreenshot('contacts/history', getHistoryClip(history));
85
85
  });
@@ -17,7 +17,7 @@ html input {
17
17
  html {
18
18
  --transition-speed: 0ms !important;
19
19
  --input-caret: transparent !important;
20
- --font-family: 'Roboto';
20
+ --font-family: 'Arial';
21
21
  --primary-rgb: 35, 135, 202;
22
22
  --secondary-rgb: 140, 51, 140;
23
23
  --tertiary-rgb: 135, 202, 35;