@nyaruka/temba-components 0.31.6 → 0.31.7
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.
- package/CHANGELOG.md +9 -0
- package/dist/{fa23691e.js → 56002f06.js} +85 -7
- package/dist/index.js +85 -7
- package/dist/static/icons/symbol-defs.svg +7 -3
- package/dist/sw.js +1 -1
- package/dist/sw.js.map +1 -1
- package/dist/templates/components-body.html +1 -1
- package/dist/templates/components-head.html +1 -1
- package/out-tsc/src/list/TembaMenu.js +102 -17
- package/out-tsc/src/list/TembaMenu.js.map +1 -1
- package/out-tsc/src/tabpane/TabPane.js +6 -0
- package/out-tsc/src/tabpane/TabPane.js.map +1 -1
- package/out-tsc/src/vectoricon/VectorIcon.js +2 -3
- package/out-tsc/src/vectoricon/VectorIcon.js.map +1 -1
- package/package.json +1 -1
- package/src/list/TembaMenu.ts +106 -17
- package/src/tabpane/TabPane.ts +6 -0
- package/src/vectoricon/VectorIcon.ts +2 -3
- package/static/icons/Read Me.txt +1 -1
- package/static/icons/SVG/menu-collapse.svg +5 -0
- package/static/icons/SVG/zapier.svg +2 -1
- package/static/icons/demo-external-svg.html +144 -139
- package/static/icons/demo-files/demo.css +4 -4
- package/static/icons/demo.html +151 -142
- package/static/icons/selection.json +250 -200
- package/static/icons/symbol-defs.svg +7 -3
package/CHANGELOG.md
CHANGED
|
@@ -4,8 +4,17 @@ 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.31.7](https://github.com/nyaruka/temba-components/compare/v0.31.6...v0.31.7)
|
|
8
|
+
|
|
9
|
+
- Add collapse icon for TembaMenu [`#199`](https://github.com/nyaruka/temba-components/pull/199)
|
|
10
|
+
- Fix menu selecting first item [`#198`](https://github.com/nyaruka/temba-components/pull/198)
|
|
11
|
+
- Add menu collapse [`6b56603`](https://github.com/nyaruka/temba-components/commit/6b566030f3daaa264c1366fe2be489aba6ad3c38)
|
|
12
|
+
- Only add padding to visible collapse icon [`db926e6`](https://github.com/nyaruka/temba-components/commit/db926e6bba65665a5bf1c8b9d616f9e7a62043d8)
|
|
13
|
+
|
|
7
14
|
#### [v0.31.6](https://github.com/nyaruka/temba-components/compare/v0.31.5...v0.31.6)
|
|
8
15
|
|
|
16
|
+
> 25 August 2022
|
|
17
|
+
|
|
9
18
|
- Use anon_display for name if it is there [`#197`](https://github.com/nyaruka/temba-components/pull/197)
|
|
10
19
|
|
|
11
20
|
#### [v0.31.5](https://github.com/nyaruka/temba-components/compare/v0.31.4...v0.31.5)
|
|
@@ -3296,7 +3296,6 @@ function t(t,e,i,n){var o,r=arguments.length,s=r<3?e:null===n?n=Object.getOwnPro
|
|
|
3296
3296
|
`}}t([it({type:Boolean})],za.prototype,"fetching",void 0),t([it({type:Boolean})],za.prototype,"expanded",void 0),t([it({type:String})],za.prototype,"endpoint",void 0),t([it({type:String})],za.prototype,"placeholder",void 0),t([it({type:String})],za.prototype,"name",void 0),t([it({type:String})],za.prototype,"query",void 0),t([it({type:Number})],za.prototype,"inactiveThreshold",void 0),t([it({type:Number})],za.prototype,"inactiveDays",void 0),t([it({type:Object,attribute:!1})],za.prototype,"summary",void 0),t([it({type:Object,attribute:!1})],za.prototype,"flow",void 0);class Na extends X{constructor(){super(),this.size=1,this.animationDuration=200,this.src="",this.steps=2,this.easing="cubic-bezier(0.68, -0.55, 0.265, 1.55)"}static get styles(){return r`
|
|
3297
3297
|
:host {
|
|
3298
3298
|
margin: auto;
|
|
3299
|
-
--color1: var(--icon-color);
|
|
3300
3299
|
}
|
|
3301
3300
|
|
|
3302
3301
|
.sheet {
|
|
@@ -3335,7 +3334,7 @@ function t(t,e,i,n){var o,r=arguments.length,s=r<3?e:null===n?n=Object.getOwnPro
|
|
|
3335
3334
|
|
|
3336
3335
|
.clickable:hover {
|
|
3337
3336
|
cursor: pointer;
|
|
3338
|
-
fill: var(--color-link-primary);
|
|
3337
|
+
fill: var(--color-link-primary) !important;
|
|
3339
3338
|
background: rgb(255, 255, 255);
|
|
3340
3339
|
}
|
|
3341
3340
|
|
|
@@ -3380,7 +3379,7 @@ function t(t,e,i,n){var o,r=arguments.length,s=r<3?e:null===n?n=Object.getOwnPro
|
|
|
3380
3379
|
class="${Gt({sheet:""===this.src,[this.animateChange]:!!this.animateChange,[this.animateChange+"-"+this.animationStep]:this.animationStep>0,[this.animateClick]:!!this.animateClick,[this.animateClick+"-"+this.animationStep]:this.animationStep>0})}"
|
|
3381
3380
|
>
|
|
3382
3381
|
<use
|
|
3383
|
-
href="${this.src?this.src:`${this.prefix||window.static_url||"/static/"}icons/symbol-defs.svg?v=
|
|
3382
|
+
href="${this.src?this.src:`${this.prefix||window.static_url||"/static/"}icons/symbol-defs.svg?v=15#icon-${this.lastName||this.name||this.id}`}"
|
|
3384
3383
|
/>
|
|
3385
3384
|
</svg>
|
|
3386
3385
|
</div>
|
|
@@ -3639,6 +3638,9 @@ function t(t,e,i,n){var o,r=arguments.length,s=r<3?e:null===n?n=Object.getOwnPro
|
|
|
3639
3638
|
.level-0 > .top {
|
|
3640
3639
|
padding-top: var(--menu-padding);
|
|
3641
3640
|
background: var(--color-primary-dark);
|
|
3641
|
+
display: flex;
|
|
3642
|
+
flex-direction: column;
|
|
3643
|
+
align-items: center;
|
|
3642
3644
|
}
|
|
3643
3645
|
|
|
3644
3646
|
.level-0 > .empty {
|
|
@@ -3905,7 +3907,7 @@ function t(t,e,i,n){var o,r=arguments.length,s=r<3?e:null===n?n=Object.getOwnPro
|
|
|
3905
3907
|
}
|
|
3906
3908
|
|
|
3907
3909
|
.fully-collapsed .level-1 {
|
|
3908
|
-
margin-left: -
|
|
3910
|
+
margin-left: -208px;
|
|
3909
3911
|
pointer-events: none;
|
|
3910
3912
|
border: none;
|
|
3911
3913
|
overflow: hidden;
|
|
@@ -3931,13 +3933,69 @@ function t(t,e,i,n){var o,r=arguments.length,s=r<3?e:null===n?n=Object.getOwnPro
|
|
|
3931
3933
|
margin-left: 0.75em;
|
|
3932
3934
|
margin-right: 0.75em;
|
|
3933
3935
|
}
|
|
3934
|
-
|
|
3936
|
+
|
|
3937
|
+
.expand-icon {
|
|
3938
|
+
transform: rotate(180deg);
|
|
3939
|
+
--icon-color: rgba(255, 255, 255, 0.5);
|
|
3940
|
+
cursor: pointer;
|
|
3941
|
+
max-height: 0px;
|
|
3942
|
+
overflow: hidden;
|
|
3943
|
+
opacity: 0;
|
|
3944
|
+
transition: all 400ms ease-in-out 400ms;
|
|
3945
|
+
}
|
|
3946
|
+
|
|
3947
|
+
.expand-icon:hover {
|
|
3948
|
+
--icon-color: #fff;
|
|
3949
|
+
}
|
|
3950
|
+
|
|
3951
|
+
.fully-collapsed .expand-icon {
|
|
3952
|
+
padding-top: 0.5em;
|
|
3953
|
+
max-height: 2em;
|
|
3954
|
+
opacity: 1;
|
|
3955
|
+
}
|
|
3956
|
+
|
|
3957
|
+
.section-header {
|
|
3958
|
+
display: flex;
|
|
3959
|
+
align-items: center;
|
|
3960
|
+
}
|
|
3961
|
+
|
|
3962
|
+
.section-header .section {
|
|
3963
|
+
flex-grow: 1;
|
|
3964
|
+
}
|
|
3965
|
+
|
|
3966
|
+
.section-header temba-icon {
|
|
3967
|
+
--icon-color: #ddd;
|
|
3968
|
+
cursor: pointer;
|
|
3969
|
+
padding-bottom: 0.5em;
|
|
3970
|
+
padding-right: 0.5em;
|
|
3971
|
+
}
|
|
3972
|
+
|
|
3973
|
+
.section-header temba-icon:hover {
|
|
3974
|
+
--icon-color: var(--color-link-primary);
|
|
3975
|
+
}
|
|
3976
|
+
|
|
3977
|
+
slot[name='header'] {
|
|
3978
|
+
display: none;
|
|
3979
|
+
}
|
|
3980
|
+
|
|
3981
|
+
slot[name='header'].show-header {
|
|
3982
|
+
display: block;
|
|
3983
|
+
}
|
|
3984
|
+
`}setBubble(t,e){const i=Ha(this.root.items,t);return!(!i||!i.item)&&(i.item.bubble=e,this.requestUpdate("root"),!0)}getMenuItemState(t){let e={};return t&&(e=this.state[t],e||(e={},this.state[t]=e)),e}updated(t){t.has("value")&&this.setSelection((this.value||"").split("/")),t.has("submenu")&&!t.has("value")&&this.setSelection([this.submenu]),t.has("endpoint")&&(this.root={level:-1,endpoint:this.endpoint},this.wait||this.loadItems(this.root),this.fireCustomEvent(ue.Ready))}refresh(t=null){t||(t=[...this.selection]);const e=this.getMenuItemForSelection(t);e&&(e.endpoint?this.loadItems(e,!1):(t.pop(),this.refresh(t)))}fireNoPath(t){const e=this.getMenuItem();if(e){const i={item:e.id,selection:"/"+this.selection.join("/"),endpoint:e.endpoint,path:t+"/"+this.pending.join("/")+document.location.search},n=this.selection.join("/");n.replace(i.path,""),this.selection=n.split("/"),this.fireCustomEvent(ue.NoPath,i),this.pending=[],this.requestUpdate("root")}}loadItems(t,e=!0){t&&t.endpoint&&(t.loading=!0,this.httpComplete=Kt(t.endpoint).then((i=>{if(i.forEach((e=>{e.level=t.level+1,e.items&&e.items.forEach((e=>{e.level=t.level+2}))})),t.items=i,t.loading=!1,this.requestUpdate("root"),this.scrollSelectedIntoView(),this.pending&&this.pending.length>0){const t=this.pending.shift();if(t&&i.length>0){const e=Ha(i,t);e.item?this.handleItemClicked(null,e.item):this.fireNoPath(t)}}else if(e&&i.length>0&&this.selection.length>=1&&!t.inline)for(const t of i)if(!t.type){this.handleItemClicked(null,t);break}})))}handleItemClicked(t,e,i=null){if(i&&i.inline&&this.handleItemClicked(null,i),this.collapsed&&(this.collapsed=!1),t&&(t.preventDefault(),t.stopPropagation()),"modax-button"!=e.type)if(e.trigger)new Function(e.trigger)();else if(e.level,e.level>=this.selection.length?this.selection.push(e.vanity_id||e.id):this.selection.splice(e.level,this.selection.length-e.level,e.vanity_id||e.id),e.endpoint)this.loadItems(e,!0),this.dispatchEvent(new Event("change"));else{if(this.pending&&this.pending.length>0){const t=this.pending.shift(),e=this.getMenuItem();if(t&&e&&e.items&&e.items.length>0){const i=Ha(e.items,t).item;i?this.handleItemClicked(null,i):this.fireNoPath(t)}else this.fireNoPath(t)}else this.dispatchEvent(new Event("change"));this.requestUpdate("root")}else this.fireCustomEvent(ue.ButtonClicked,{title:e.name,href:e.href,on_submit:e.on_submit})}scrollSelectedIntoView(){window.setTimeout((()=>{this.shadowRoot.querySelectorAll(".selected").forEach((t=>{t.scrollIntoView({block:"end",behavior:"smooth"})}))}),0)}clickItem(t){const e=[...this.selection];e.splice(e.length-1,1,t);const i=this.getMenuItemForSelection(e);return!!i&&(this.handleItemClicked(null,i),this.scrollSelectedIntoView(),!0)}getMenuItem(){return this.getMenuItemForSelection([...this.selection])}getMenuItemForSelection(t){const e=[...t];let i=this.root.items,n=null;for(;e.length>0;){const t=e.splice(0,1)[0];if(!i)break;if(n=Ha(i,t).item,!n)break;i=n.items}return n}getSelection(){return this.selection}setSelection(t){this.pending=[...t],this.selection=[],this.wait&&(this.wait=!1,this.loadItems(this.root))}setSelectionPath(t){const e=t.split("/").filter((t=>!!t));this.clickItem(e[e.length-1])||(this.wait=!0,this.setSelection(e))}handleExpand(){this.collapsed=!1}handleCollapse(){this.collapsed=!0}async setFocusedItem(t){const e=t.split("/").filter((t=>!!t));if(e.length>0){if(!Ha(this.root.items,e[0]).item)return}const i=[];let n=this.root;for(;e.length>0;){const t=e.shift();t&&(n.items||(this.loadItems(n,!1),await this.httpComplete),n=Ha(n.items,t).item,n?i.push(t):e.splice(0,e.length))}this.selection=i,this.requestUpdate("root")}isSelected(t){if(t.level<this.selection.length){return this.selection[t.level]==(t.vanity_id||t.id)}return!1}isExpanded(t){return!!this.selection.find((e=>e===t.vanity_id||t.id))}render(){if(!this.root||!this.root.items)return O`<temba-loading
|
|
3935
3985
|
units="3"
|
|
3936
3986
|
size="10"
|
|
3937
3987
|
direction="column"
|
|
3938
3988
|
style="margin:1em;margin-right:0em"
|
|
3939
3989
|
/>`;let t=this.root.items||[];const e=[];e.push(O`<div class="level level-0 ${this.submenu?"hidden":""}">
|
|
3940
|
-
<div class="top"
|
|
3990
|
+
<div class="top">
|
|
3991
|
+
<div class="expand-icon" @click=${this.handleExpand}>
|
|
3992
|
+
<temba-icon
|
|
3993
|
+
name="menu-collapse"
|
|
3994
|
+
class="expand"
|
|
3995
|
+
size="1.4"
|
|
3996
|
+
></temba-icon>
|
|
3997
|
+
</div>
|
|
3998
|
+
</div>
|
|
3941
3999
|
|
|
3942
4000
|
${t.filter((t=>!t.bottom)).map((t=>this.renderMenuItem(t)))}
|
|
3943
4001
|
|
|
@@ -3947,7 +4005,21 @@ function t(t,e,i,n){var o,r=arguments.length,s=r<3?e:null===n?n=Object.getOwnPro
|
|
|
3947
4005
|
</div>`),this.selection.forEach(((i,n)=>{const o=Ha(t,i).item;let r=!1;if(o){t=o.items;const e=this.getMenuItemState(o.id);e.collapsed?r="collapsed"===e.collapsed:this.selection.length>o.level+2&&(r=!1)}else t=null;t&&t.length>0&&!o.inline&&e.push(O`<div
|
|
3948
4006
|
class="${Gt({level:!0,["level-"+(n+1)]:!0,collapsed:r})}"
|
|
3949
4007
|
>
|
|
3950
|
-
${this.submenu?null:O
|
|
4008
|
+
${this.submenu?null:O`
|
|
4009
|
+
<slot
|
|
4010
|
+
class="${Gt({"show-header":o.show_header})}"
|
|
4011
|
+
name="header"
|
|
4012
|
+
></slot>
|
|
4013
|
+
<div class="section-header">
|
|
4014
|
+
<div class="section">${o.name}</div>
|
|
4015
|
+
|
|
4016
|
+
${0!=n||this.collapsed?null:O`<temba-icon
|
|
4017
|
+
name="menu-collapse"
|
|
4018
|
+
size="1.1"
|
|
4019
|
+
@click=${this.handleCollapse}
|
|
4020
|
+
></temba-icon>`}
|
|
4021
|
+
</div>
|
|
4022
|
+
`}
|
|
3951
4023
|
${t.map((t=>t.inline&&t.items?O`${this.renderMenuItem(t)}
|
|
3952
4024
|
<div class="inline-children">
|
|
3953
4025
|
${(t.items||[]).map((e=>this.renderMenuItem(e,t)))}
|
|
@@ -4022,6 +4094,7 @@ function t(t,e,i,n){var o,r=arguments.length,s=r<3?e:null===n?n=Object.getOwnPro
|
|
|
4022
4094
|
|
|
4023
4095
|
.tabs {
|
|
4024
4096
|
display: flex;
|
|
4097
|
+
padding-left: 0.18em;
|
|
4025
4098
|
}
|
|
4026
4099
|
|
|
4027
4100
|
.tab {
|
|
@@ -4038,6 +4111,7 @@ function t(t,e,i,n){var o,r=arguments.length,s=r<3?e:null===n?n=Object.getOwnPro
|
|
|
4038
4111
|
color: var(--color-text-dark);
|
|
4039
4112
|
--icon-color: var(--color-text-dark);
|
|
4040
4113
|
white-space: nowrap;
|
|
4114
|
+
transition: all 100ms ease-in-out;
|
|
4041
4115
|
}
|
|
4042
4116
|
|
|
4043
4117
|
.tab.hidden {
|
|
@@ -4076,6 +4150,8 @@ function t(t,e,i,n){var o,r=arguments.length,s=r<3?e:null===n?n=Object.getOwnPro
|
|
|
4076
4150
|
cursor: default;
|
|
4077
4151
|
box-shadow: 2px 1px 3px 2px rgba(0, 0, 0, 0.07);
|
|
4078
4152
|
background: #fff;
|
|
4153
|
+
transform: scale(1.05) translateY(-0.05em);
|
|
4154
|
+
z-index: 0;
|
|
4079
4155
|
}
|
|
4080
4156
|
|
|
4081
4157
|
.pane {
|
|
@@ -4087,10 +4163,12 @@ function t(t,e,i,n){var o,r=arguments.length,s=r<3?e:null===n?n=Object.getOwnPro
|
|
|
4087
4163
|
box-shadow: 2px 5px 12px 2px rgba(0, 0, 0, 0.09),
|
|
4088
4164
|
3px 3px 2px 1px rgba(0, 0, 0, 0.05);
|
|
4089
4165
|
min-height: 0;
|
|
4166
|
+
z-index: 1;
|
|
4090
4167
|
}
|
|
4091
4168
|
|
|
4092
4169
|
.pane.first {
|
|
4093
4170
|
border-top-left-radius: 0px;
|
|
4171
|
+
overflow: hidden;
|
|
4094
4172
|
}
|
|
4095
4173
|
|
|
4096
4174
|
.badge {
|
package/dist/index.js
CHANGED
|
@@ -3296,7 +3296,6 @@ function t(t,e,i,n){var o,r=arguments.length,s=r<3?e:null===n?n=Object.getOwnPro
|
|
|
3296
3296
|
`}}t([it({type:Boolean})],za.prototype,"fetching",void 0),t([it({type:Boolean})],za.prototype,"expanded",void 0),t([it({type:String})],za.prototype,"endpoint",void 0),t([it({type:String})],za.prototype,"placeholder",void 0),t([it({type:String})],za.prototype,"name",void 0),t([it({type:String})],za.prototype,"query",void 0),t([it({type:Number})],za.prototype,"inactiveThreshold",void 0),t([it({type:Number})],za.prototype,"inactiveDays",void 0),t([it({type:Object,attribute:!1})],za.prototype,"summary",void 0),t([it({type:Object,attribute:!1})],za.prototype,"flow",void 0);class Na extends X{constructor(){super(),this.size=1,this.animationDuration=200,this.src="",this.steps=2,this.easing="cubic-bezier(0.68, -0.55, 0.265, 1.55)"}static get styles(){return r`
|
|
3297
3297
|
:host {
|
|
3298
3298
|
margin: auto;
|
|
3299
|
-
--color1: var(--icon-color);
|
|
3300
3299
|
}
|
|
3301
3300
|
|
|
3302
3301
|
.sheet {
|
|
@@ -3335,7 +3334,7 @@ function t(t,e,i,n){var o,r=arguments.length,s=r<3?e:null===n?n=Object.getOwnPro
|
|
|
3335
3334
|
|
|
3336
3335
|
.clickable:hover {
|
|
3337
3336
|
cursor: pointer;
|
|
3338
|
-
fill: var(--color-link-primary);
|
|
3337
|
+
fill: var(--color-link-primary) !important;
|
|
3339
3338
|
background: rgb(255, 255, 255);
|
|
3340
3339
|
}
|
|
3341
3340
|
|
|
@@ -3380,7 +3379,7 @@ function t(t,e,i,n){var o,r=arguments.length,s=r<3?e:null===n?n=Object.getOwnPro
|
|
|
3380
3379
|
class="${Gt({sheet:""===this.src,[this.animateChange]:!!this.animateChange,[this.animateChange+"-"+this.animationStep]:this.animationStep>0,[this.animateClick]:!!this.animateClick,[this.animateClick+"-"+this.animationStep]:this.animationStep>0})}"
|
|
3381
3380
|
>
|
|
3382
3381
|
<use
|
|
3383
|
-
href="${this.src?this.src:`${this.prefix||window.static_url||"/static/"}icons/symbol-defs.svg?v=
|
|
3382
|
+
href="${this.src?this.src:`${this.prefix||window.static_url||"/static/"}icons/symbol-defs.svg?v=15#icon-${this.lastName||this.name||this.id}`}"
|
|
3384
3383
|
/>
|
|
3385
3384
|
</svg>
|
|
3386
3385
|
</div>
|
|
@@ -3639,6 +3638,9 @@ function t(t,e,i,n){var o,r=arguments.length,s=r<3?e:null===n?n=Object.getOwnPro
|
|
|
3639
3638
|
.level-0 > .top {
|
|
3640
3639
|
padding-top: var(--menu-padding);
|
|
3641
3640
|
background: var(--color-primary-dark);
|
|
3641
|
+
display: flex;
|
|
3642
|
+
flex-direction: column;
|
|
3643
|
+
align-items: center;
|
|
3642
3644
|
}
|
|
3643
3645
|
|
|
3644
3646
|
.level-0 > .empty {
|
|
@@ -3905,7 +3907,7 @@ function t(t,e,i,n){var o,r=arguments.length,s=r<3?e:null===n?n=Object.getOwnPro
|
|
|
3905
3907
|
}
|
|
3906
3908
|
|
|
3907
3909
|
.fully-collapsed .level-1 {
|
|
3908
|
-
margin-left: -
|
|
3910
|
+
margin-left: -208px;
|
|
3909
3911
|
pointer-events: none;
|
|
3910
3912
|
border: none;
|
|
3911
3913
|
overflow: hidden;
|
|
@@ -3931,13 +3933,69 @@ function t(t,e,i,n){var o,r=arguments.length,s=r<3?e:null===n?n=Object.getOwnPro
|
|
|
3931
3933
|
margin-left: 0.75em;
|
|
3932
3934
|
margin-right: 0.75em;
|
|
3933
3935
|
}
|
|
3934
|
-
|
|
3936
|
+
|
|
3937
|
+
.expand-icon {
|
|
3938
|
+
transform: rotate(180deg);
|
|
3939
|
+
--icon-color: rgba(255, 255, 255, 0.5);
|
|
3940
|
+
cursor: pointer;
|
|
3941
|
+
max-height: 0px;
|
|
3942
|
+
overflow: hidden;
|
|
3943
|
+
opacity: 0;
|
|
3944
|
+
transition: all 400ms ease-in-out 400ms;
|
|
3945
|
+
}
|
|
3946
|
+
|
|
3947
|
+
.expand-icon:hover {
|
|
3948
|
+
--icon-color: #fff;
|
|
3949
|
+
}
|
|
3950
|
+
|
|
3951
|
+
.fully-collapsed .expand-icon {
|
|
3952
|
+
padding-top: 0.5em;
|
|
3953
|
+
max-height: 2em;
|
|
3954
|
+
opacity: 1;
|
|
3955
|
+
}
|
|
3956
|
+
|
|
3957
|
+
.section-header {
|
|
3958
|
+
display: flex;
|
|
3959
|
+
align-items: center;
|
|
3960
|
+
}
|
|
3961
|
+
|
|
3962
|
+
.section-header .section {
|
|
3963
|
+
flex-grow: 1;
|
|
3964
|
+
}
|
|
3965
|
+
|
|
3966
|
+
.section-header temba-icon {
|
|
3967
|
+
--icon-color: #ddd;
|
|
3968
|
+
cursor: pointer;
|
|
3969
|
+
padding-bottom: 0.5em;
|
|
3970
|
+
padding-right: 0.5em;
|
|
3971
|
+
}
|
|
3972
|
+
|
|
3973
|
+
.section-header temba-icon:hover {
|
|
3974
|
+
--icon-color: var(--color-link-primary);
|
|
3975
|
+
}
|
|
3976
|
+
|
|
3977
|
+
slot[name='header'] {
|
|
3978
|
+
display: none;
|
|
3979
|
+
}
|
|
3980
|
+
|
|
3981
|
+
slot[name='header'].show-header {
|
|
3982
|
+
display: block;
|
|
3983
|
+
}
|
|
3984
|
+
`}setBubble(t,e){const i=Ha(this.root.items,t);return!(!i||!i.item)&&(i.item.bubble=e,this.requestUpdate("root"),!0)}getMenuItemState(t){let e={};return t&&(e=this.state[t],e||(e={},this.state[t]=e)),e}updated(t){t.has("value")&&this.setSelection((this.value||"").split("/")),t.has("submenu")&&!t.has("value")&&this.setSelection([this.submenu]),t.has("endpoint")&&(this.root={level:-1,endpoint:this.endpoint},this.wait||this.loadItems(this.root),this.fireCustomEvent(ue.Ready))}refresh(t=null){t||(t=[...this.selection]);const e=this.getMenuItemForSelection(t);e&&(e.endpoint?this.loadItems(e,!1):(t.pop(),this.refresh(t)))}fireNoPath(t){const e=this.getMenuItem();if(e){const i={item:e.id,selection:"/"+this.selection.join("/"),endpoint:e.endpoint,path:t+"/"+this.pending.join("/")+document.location.search},n=this.selection.join("/");n.replace(i.path,""),this.selection=n.split("/"),this.fireCustomEvent(ue.NoPath,i),this.pending=[],this.requestUpdate("root")}}loadItems(t,e=!0){t&&t.endpoint&&(t.loading=!0,this.httpComplete=Kt(t.endpoint).then((i=>{if(i.forEach((e=>{e.level=t.level+1,e.items&&e.items.forEach((e=>{e.level=t.level+2}))})),t.items=i,t.loading=!1,this.requestUpdate("root"),this.scrollSelectedIntoView(),this.pending&&this.pending.length>0){const t=this.pending.shift();if(t&&i.length>0){const e=Ha(i,t);e.item?this.handleItemClicked(null,e.item):this.fireNoPath(t)}}else if(e&&i.length>0&&this.selection.length>=1&&!t.inline)for(const t of i)if(!t.type){this.handleItemClicked(null,t);break}})))}handleItemClicked(t,e,i=null){if(i&&i.inline&&this.handleItemClicked(null,i),this.collapsed&&(this.collapsed=!1),t&&(t.preventDefault(),t.stopPropagation()),"modax-button"!=e.type)if(e.trigger)new Function(e.trigger)();else if(e.level,e.level>=this.selection.length?this.selection.push(e.vanity_id||e.id):this.selection.splice(e.level,this.selection.length-e.level,e.vanity_id||e.id),e.endpoint)this.loadItems(e,!0),this.dispatchEvent(new Event("change"));else{if(this.pending&&this.pending.length>0){const t=this.pending.shift(),e=this.getMenuItem();if(t&&e&&e.items&&e.items.length>0){const i=Ha(e.items,t).item;i?this.handleItemClicked(null,i):this.fireNoPath(t)}else this.fireNoPath(t)}else this.dispatchEvent(new Event("change"));this.requestUpdate("root")}else this.fireCustomEvent(ue.ButtonClicked,{title:e.name,href:e.href,on_submit:e.on_submit})}scrollSelectedIntoView(){window.setTimeout((()=>{this.shadowRoot.querySelectorAll(".selected").forEach((t=>{t.scrollIntoView({block:"end",behavior:"smooth"})}))}),0)}clickItem(t){const e=[...this.selection];e.splice(e.length-1,1,t);const i=this.getMenuItemForSelection(e);return!!i&&(this.handleItemClicked(null,i),this.scrollSelectedIntoView(),!0)}getMenuItem(){return this.getMenuItemForSelection([...this.selection])}getMenuItemForSelection(t){const e=[...t];let i=this.root.items,n=null;for(;e.length>0;){const t=e.splice(0,1)[0];if(!i)break;if(n=Ha(i,t).item,!n)break;i=n.items}return n}getSelection(){return this.selection}setSelection(t){this.pending=[...t],this.selection=[],this.wait&&(this.wait=!1,this.loadItems(this.root))}setSelectionPath(t){const e=t.split("/").filter((t=>!!t));this.clickItem(e[e.length-1])||(this.wait=!0,this.setSelection(e))}handleExpand(){this.collapsed=!1}handleCollapse(){this.collapsed=!0}async setFocusedItem(t){const e=t.split("/").filter((t=>!!t));if(e.length>0){if(!Ha(this.root.items,e[0]).item)return}const i=[];let n=this.root;for(;e.length>0;){const t=e.shift();t&&(n.items||(this.loadItems(n,!1),await this.httpComplete),n=Ha(n.items,t).item,n?i.push(t):e.splice(0,e.length))}this.selection=i,this.requestUpdate("root")}isSelected(t){if(t.level<this.selection.length){return this.selection[t.level]==(t.vanity_id||t.id)}return!1}isExpanded(t){return!!this.selection.find((e=>e===t.vanity_id||t.id))}render(){if(!this.root||!this.root.items)return O`<temba-loading
|
|
3935
3985
|
units="3"
|
|
3936
3986
|
size="10"
|
|
3937
3987
|
direction="column"
|
|
3938
3988
|
style="margin:1em;margin-right:0em"
|
|
3939
3989
|
/>`;let t=this.root.items||[];const e=[];e.push(O`<div class="level level-0 ${this.submenu?"hidden":""}">
|
|
3940
|
-
<div class="top"
|
|
3990
|
+
<div class="top">
|
|
3991
|
+
<div class="expand-icon" @click=${this.handleExpand}>
|
|
3992
|
+
<temba-icon
|
|
3993
|
+
name="menu-collapse"
|
|
3994
|
+
class="expand"
|
|
3995
|
+
size="1.4"
|
|
3996
|
+
></temba-icon>
|
|
3997
|
+
</div>
|
|
3998
|
+
</div>
|
|
3941
3999
|
|
|
3942
4000
|
${t.filter((t=>!t.bottom)).map((t=>this.renderMenuItem(t)))}
|
|
3943
4001
|
|
|
@@ -3947,7 +4005,21 @@ function t(t,e,i,n){var o,r=arguments.length,s=r<3?e:null===n?n=Object.getOwnPro
|
|
|
3947
4005
|
</div>`),this.selection.forEach(((i,n)=>{const o=Ha(t,i).item;let r=!1;if(o){t=o.items;const e=this.getMenuItemState(o.id);e.collapsed?r="collapsed"===e.collapsed:this.selection.length>o.level+2&&(r=!1)}else t=null;t&&t.length>0&&!o.inline&&e.push(O`<div
|
|
3948
4006
|
class="${Gt({level:!0,["level-"+(n+1)]:!0,collapsed:r})}"
|
|
3949
4007
|
>
|
|
3950
|
-
${this.submenu?null:O
|
|
4008
|
+
${this.submenu?null:O`
|
|
4009
|
+
<slot
|
|
4010
|
+
class="${Gt({"show-header":o.show_header})}"
|
|
4011
|
+
name="header"
|
|
4012
|
+
></slot>
|
|
4013
|
+
<div class="section-header">
|
|
4014
|
+
<div class="section">${o.name}</div>
|
|
4015
|
+
|
|
4016
|
+
${0!=n||this.collapsed?null:O`<temba-icon
|
|
4017
|
+
name="menu-collapse"
|
|
4018
|
+
size="1.1"
|
|
4019
|
+
@click=${this.handleCollapse}
|
|
4020
|
+
></temba-icon>`}
|
|
4021
|
+
</div>
|
|
4022
|
+
`}
|
|
3951
4023
|
${t.map((t=>t.inline&&t.items?O`${this.renderMenuItem(t)}
|
|
3952
4024
|
<div class="inline-children">
|
|
3953
4025
|
${(t.items||[]).map((e=>this.renderMenuItem(e,t)))}
|
|
@@ -4022,6 +4094,7 @@ function t(t,e,i,n){var o,r=arguments.length,s=r<3?e:null===n?n=Object.getOwnPro
|
|
|
4022
4094
|
|
|
4023
4095
|
.tabs {
|
|
4024
4096
|
display: flex;
|
|
4097
|
+
padding-left: 0.18em;
|
|
4025
4098
|
}
|
|
4026
4099
|
|
|
4027
4100
|
.tab {
|
|
@@ -4038,6 +4111,7 @@ function t(t,e,i,n){var o,r=arguments.length,s=r<3?e:null===n?n=Object.getOwnPro
|
|
|
4038
4111
|
color: var(--color-text-dark);
|
|
4039
4112
|
--icon-color: var(--color-text-dark);
|
|
4040
4113
|
white-space: nowrap;
|
|
4114
|
+
transition: all 100ms ease-in-out;
|
|
4041
4115
|
}
|
|
4042
4116
|
|
|
4043
4117
|
.tab.hidden {
|
|
@@ -4076,6 +4150,8 @@ function t(t,e,i,n){var o,r=arguments.length,s=r<3?e:null===n?n=Object.getOwnPro
|
|
|
4076
4150
|
cursor: default;
|
|
4077
4151
|
box-shadow: 2px 1px 3px 2px rgba(0, 0, 0, 0.07);
|
|
4078
4152
|
background: #fff;
|
|
4153
|
+
transform: scale(1.05) translateY(-0.05em);
|
|
4154
|
+
z-index: 0;
|
|
4079
4155
|
}
|
|
4080
4156
|
|
|
4081
4157
|
.pane {
|
|
@@ -4087,10 +4163,12 @@ function t(t,e,i,n){var o,r=arguments.length,s=r<3?e:null===n?n=Object.getOwnPro
|
|
|
4087
4163
|
box-shadow: 2px 5px 12px 2px rgba(0, 0, 0, 0.09),
|
|
4088
4164
|
3px 3px 2px 1px rgba(0, 0, 0, 0.05);
|
|
4089
4165
|
min-height: 0;
|
|
4166
|
+
z-index: 1;
|
|
4090
4167
|
}
|
|
4091
4168
|
|
|
4092
4169
|
.pane.first {
|
|
4093
4170
|
border-top-left-radius: 0px;
|
|
4171
|
+
overflow: hidden;
|
|
4094
4172
|
}
|
|
4095
4173
|
|
|
4096
4174
|
.badge {
|
|
@@ -1,8 +1,15 @@
|
|
|
1
1
|
<svg aria-hidden="true" style="position: absolute; width: 0; height: 0; overflow: hidden;" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
|
|
2
2
|
<defs>
|
|
3
|
+
<symbol id="icon-zapier" viewBox="0 0 32 32">
|
|
4
|
+
<path fill="#474747" style="fill: var(--color1, #474747)" d="M4.8 0h22.4c2.651 0 4.8 2.149 4.8 4.8v22.4c0 2.651-2.149 4.8-4.8 4.8h-22.4c-2.651 0-4.8-2.149-4.8-4.8v-22.4c0-2.651 2.149-4.8 4.8-4.8z"></path>
|
|
5
|
+
<path fill="#fff" style="fill: var(--color2, #fff)" d="M4.8 20.8h22.4v6.4h-22.4v-6.4z"></path>
|
|
6
|
+
</symbol>
|
|
3
7
|
<symbol id="icon-hourglass" viewBox="0 0 24 24">
|
|
4
8
|
<path d="M12 11.484l3.984-3.984v-3.516h-7.969v3.516zM15.984 16.5l-3.984-3.984-3.984 3.984v3.516h7.969v-3.516zM6 2.016h12v6l-3.984 3.984 3.984 3.984v6h-12v-6l3.984-3.984-3.984-3.984v-6z"></path>
|
|
5
9
|
</symbol>
|
|
10
|
+
<symbol id="icon-menu-collapse" viewBox="0 0 24 24">
|
|
11
|
+
<path d="M21 15.609l-1.406 1.406-5.016-5.016 5.016-5.016 1.406 1.406-3.563 3.609zM3 6h12.984v2.016h-12.984v-2.016zM3 12.984v-1.969h9.984v1.969h-9.984zM3 18v-2.016h12.984v2.016h-12.984z"></path>
|
|
12
|
+
</symbol>
|
|
6
13
|
<symbol id="icon-bar-chart" viewBox="0 0 24 24">
|
|
7
14
|
<path d="M19 20v-10c0-0.552-0.448-1-1-1s-1 0.448-1 1v10c0 0.552 0.448 1 1 1s1-0.448 1-1zM13 20v-16c0-0.552-0.448-1-1-1s-1 0.448-1 1v16c0 0.552 0.448 1 1 1s1-0.448 1-1zM7 20v-6c0-0.552-0.448-1-1-1s-1 0.448-1 1v6c0 0.552 0.448 1 1 1s1-0.448 1-1z"></path>
|
|
8
15
|
</symbol>
|
|
@@ -394,9 +401,6 @@
|
|
|
394
401
|
<symbol id="icon-language" viewBox="0 0 20 20">
|
|
395
402
|
<path d="M19.753 10.909c-0.624-1.707-2.366-2.726-4.661-2.726-0.090 0-0.176 0.002-0.262 0.006l-0.016-2.063c0 0 3.41-0.588 3.525-0.607s0.133-0.119 0.109-0.231c-0.023-0.111-0.167-0.883-0.188-0.976-0.027-0.131-0.102-0.127-0.207-0.109s-3.25 0.461-3.25 0.461-0.012-1.953-0.013-2.078c-0.001-0.125-0.069-0.158-0.194-0.156s-0.92 0.014-1.025 0.016c-0.105 0.002-0.164 0.049-0.162 0.148s0.033 2.307 0.033 2.307-3.061 0.527-3.144 0.543c-0.084 0.014-0.17 0.053-0.151 0.143s0.19 1.094 0.208 1.172c0.018 0.080 0.072 0.129 0.188 0.107 0.115-0.019 2.924-0.504 2.924-0.504l0.035 2.018c-1.077 0.281-1.801 0.824-2.256 1.303-0.768 0.807-1.207 1.887-1.207 2.963 0 1.586 0.971 2.529 2.328 2.695 3.162 0.387 5.119-3.060 5.769-4.715 1.097 1.506 0.256 4.354-2.094 5.98-0.043 0.029-0.098 0.129-0.033 0.207s0.541 0.662 0.619 0.756c0.080 0.096 0.206 0.059 0.256 0.023 2.51-1.73 3.661-4.515 2.869-6.683zM12.367 14.097c-0.966-0.121-0.944-0.914-0.944-1.453 0-0.773 0.327-1.58 0.876-2.156 0.335-0.354 0.75-0.621 1.229-0.799l0.082 4.277c-0.385 0.131-0.799 0.185-1.243 0.131zM14.794 13.544l0.046-4.109c0.084-0.004 0.166-0.010 0.252-0.010 0.773 0 1.494 0.145 1.885 0.361s-1.023 2.713-2.183 3.758zM5.844 5.876c-0.030-0.094-0.103-0.145-0.196-0.145h-1.95c-0.093 0-0.165 0.051-0.194 0.144-0.412 1.299-3.48 10.99-3.496 11.041s-0.011 0.076 0.062 0.076h1.733c0.075 0 0.099-0.023 0.114-0.072 0.015-0.051 1.008-3.318 1.008-3.318h3.496c0 0 0.992 3.268 1.008 3.318s0.039 0.072 0.113 0.072h1.734c0.072 0 0.078-0.025 0.062-0.076-0.014-0.050-3.083-9.741-3.494-11.040zM3.226 12.194l1.447-5.25 1.447 5.25h-2.894z"></path>
|
|
396
403
|
</symbol>
|
|
397
|
-
<symbol id="icon-zapier" viewBox="0 0 32 32">
|
|
398
|
-
<path fill="#ff4a00" style="fill: var(--color1, #ff4a00)" d="M20 16.005c0 1.191-0.22 2.328-0.615 3.38-1.049 0.396-2.191 0.615-3.38 0.615h-0.012c-1.191 0-2.327-0.22-3.379-0.615-0.396-1.052-0.615-2.191-0.615-3.38v-0.012c0-1.191 0.219-2.327 0.615-3.379 1.052-0.396 2.189-0.615 3.379-0.615h0.012c1.191 0 2.331 0.219 3.38 0.616 0.396 1.051 0.615 2.188 0.615 3.38zM31.78 13.333h-9.34l6.597-6.603c-0.52-0.731-1.093-1.413-1.727-2.044-0.631-0.632-1.313-1.209-2.040-1.728l-6.605 6.599v-9.337c-0.865-0.139-1.751-0.22-2.66-0.22h-0.013c-0.907 0-1.795 0.081-2.66 0.22v9.34l-6.6-6.599c-0.732 0.515-1.413 1.095-2.045 1.725-0.632 0.632-1.211 1.316-1.728 2.044l6.599 6.603h-9.337c0 0-0.22 1.755-0.22 2.66v0.012c0 0.907 0.081 1.797 0.22 2.66h9.34l-6.599 6.603c1.036 1.461 2.311 2.735 3.769 3.773l6.603-6.6v9.339c0.864 0.14 1.751 0.22 2.655 0.22h0.023c0.905 0 1.792-0.080 2.655-0.22v-9.339l6.603 6.6c0.731-0.5 1.413-1.083 2.039-1.72h0.007c0.631-0.62 1.208-1.301 1.728-2.041l-6.6-6.599h9.339c0.14-0.86 0.22-1.739 0.22-2.64v-0.041c0-0.904-0.080-1.791-0.22-2.653z"></path>
|
|
399
|
-
</symbol>
|
|
400
404
|
<symbol id="icon-cord" viewBox="0 0 32 32">
|
|
401
405
|
<path d="M27.59 12.41c-0.464-0.464-1.216-0.464-1.679 0l-4.91 4.91-6.321-6.321 4.91-4.91c0.464-0.464 0.464-1.216 0-1.679s-1.216-0.464-1.679 0l-4.91 4.91-2.91-2.91c-0.464-0.464-1.216-0.464-1.679 0s-0.464 1.216 0 1.679l2.093 2.093-4.16 4.16c-2.636 2.636-3.048 6.653-1.236 9.721l-4.521 4.521c-0.781 0.781-0.781 2.047 0 2.828 0.391 0.391 0.902 0.586 1.414 0.586s1.024-0.195 1.414-0.586l4.521-4.521c3.068 1.812 7.085 1.4 9.721-1.236l4.16-4.16 2.093 2.093c0.232 0.232 0.536 0.348 0.84 0.348s0.608-0.116 0.84-0.348c0.464-0.464 0.464-1.216 0-1.679l-2.91-2.91 4.91-4.91c0.464-0.464 0.464-1.216 0-1.679z"></path>
|
|
402
406
|
</symbol>
|
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:"
|
|
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:"56002f06.js",revision:"1c47dd0de9ccaf506653dad5c3f6ce4b"},{url:"templates/components-body.html",revision:"0827077e2ff07f81bb5faf4e18a00703"},{url:"templates/components-head.html",revision:"00973b8923f5c0e21aba2e360c397502"}],{}),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/
|
|
1
|
+
{"version":3,"file":"sw.js","sources":["../../../../../tmp/fdcff037317296def220f6ffe93607b3/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\": \"56002f06.js\",\n \"revision\": \"1c47dd0de9ccaf506653dad5c3f6ce4b\"\n },\n {\n \"url\": \"templates/components-body.html\",\n \"revision\": \"0827077e2ff07f81bb5faf4e18a00703\"\n },\n {\n \"url\": \"templates/components-head.html\",\n \"revision\": \"00973b8923f5c0e21aba2e360c397502\"\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":["url","revision","workbox_routing_NavigationRoute","workbox_precaching_createHandlerBoundToURL","workbox_strategies_CacheFirst"],"mappings":"k1BAmCoC,CAClC,CACEA,IAAO,cACPC,SAAY,oCAEd,CACED,IAAO,iCACPC,SAAY,oCAEd,CACED,IAAO,iCACPC,SAAY,qCAEb,oBAE2B,IAAIC,kBAAgCC,0BAA2C,iCAG/E,iBAAkB,IAAIC,aAAiC"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
<script type="module" src="{{STATIC_URL}}@nyaruka/temba-components/dist/
|
|
1
|
+
<script type="module" src="{{STATIC_URL}}@nyaruka/temba-components/dist/56002f06.js"></script><script>window.TEMBA_COMPONENTS_VERSION="0.31.7"</script>
|
|
@@ -1 +1 @@
|
|
|
1
|
-
<link rel="modulepreload" href="{{STATIC_URL}}@nyaruka/temba-components/dist/
|
|
1
|
+
<link rel="modulepreload" href="{{STATIC_URL}}@nyaruka/temba-components/dist/56002f06.js" crossorigin="anonymous">
|
|
@@ -205,6 +205,9 @@ export class TembaMenu extends RapidElement {
|
|
|
205
205
|
.level-0 > .top {
|
|
206
206
|
padding-top: var(--menu-padding);
|
|
207
207
|
background: var(--color-primary-dark);
|
|
208
|
+
display: flex;
|
|
209
|
+
flex-direction: column;
|
|
210
|
+
align-items: center;
|
|
208
211
|
}
|
|
209
212
|
|
|
210
213
|
.level-0 > .empty {
|
|
@@ -471,7 +474,7 @@ export class TembaMenu extends RapidElement {
|
|
|
471
474
|
}
|
|
472
475
|
|
|
473
476
|
.fully-collapsed .level-1 {
|
|
474
|
-
margin-left: -
|
|
477
|
+
margin-left: -208px;
|
|
475
478
|
pointer-events: none;
|
|
476
479
|
border: none;
|
|
477
480
|
overflow: hidden;
|
|
@@ -497,6 +500,54 @@ export class TembaMenu extends RapidElement {
|
|
|
497
500
|
margin-left: 0.75em;
|
|
498
501
|
margin-right: 0.75em;
|
|
499
502
|
}
|
|
503
|
+
|
|
504
|
+
.expand-icon {
|
|
505
|
+
transform: rotate(180deg);
|
|
506
|
+
--icon-color: rgba(255, 255, 255, 0.5);
|
|
507
|
+
cursor: pointer;
|
|
508
|
+
max-height: 0px;
|
|
509
|
+
overflow: hidden;
|
|
510
|
+
opacity: 0;
|
|
511
|
+
transition: all 400ms ease-in-out 400ms;
|
|
512
|
+
}
|
|
513
|
+
|
|
514
|
+
.expand-icon:hover {
|
|
515
|
+
--icon-color: #fff;
|
|
516
|
+
}
|
|
517
|
+
|
|
518
|
+
.fully-collapsed .expand-icon {
|
|
519
|
+
padding-top: 0.5em;
|
|
520
|
+
max-height: 2em;
|
|
521
|
+
opacity: 1;
|
|
522
|
+
}
|
|
523
|
+
|
|
524
|
+
.section-header {
|
|
525
|
+
display: flex;
|
|
526
|
+
align-items: center;
|
|
527
|
+
}
|
|
528
|
+
|
|
529
|
+
.section-header .section {
|
|
530
|
+
flex-grow: 1;
|
|
531
|
+
}
|
|
532
|
+
|
|
533
|
+
.section-header temba-icon {
|
|
534
|
+
--icon-color: #ddd;
|
|
535
|
+
cursor: pointer;
|
|
536
|
+
padding-bottom: 0.5em;
|
|
537
|
+
padding-right: 0.5em;
|
|
538
|
+
}
|
|
539
|
+
|
|
540
|
+
.section-header temba-icon:hover {
|
|
541
|
+
--icon-color: var(--color-link-primary);
|
|
542
|
+
}
|
|
543
|
+
|
|
544
|
+
slot[name='header'] {
|
|
545
|
+
display: none;
|
|
546
|
+
}
|
|
547
|
+
|
|
548
|
+
slot[name='header'].show-header {
|
|
549
|
+
display: block;
|
|
550
|
+
}
|
|
500
551
|
`;
|
|
501
552
|
}
|
|
502
553
|
setBubble(id, color) {
|
|
@@ -555,19 +606,21 @@ export class TembaMenu extends RapidElement {
|
|
|
555
606
|
}
|
|
556
607
|
fireNoPath(missingId) {
|
|
557
608
|
const item = this.getMenuItem();
|
|
558
|
-
|
|
559
|
-
|
|
560
|
-
|
|
561
|
-
|
|
562
|
-
|
|
563
|
-
|
|
564
|
-
|
|
565
|
-
|
|
566
|
-
|
|
567
|
-
|
|
568
|
-
|
|
569
|
-
|
|
570
|
-
|
|
609
|
+
if (item) {
|
|
610
|
+
const details = {
|
|
611
|
+
item: item.id,
|
|
612
|
+
selection: '/' + this.selection.join('/'),
|
|
613
|
+
endpoint: item.endpoint,
|
|
614
|
+
path: missingId + '/' + this.pending.join('/') + document.location.search,
|
|
615
|
+
};
|
|
616
|
+
// remove any excess from our selection
|
|
617
|
+
const selection = this.selection.join('/');
|
|
618
|
+
selection.replace(details.path, '');
|
|
619
|
+
this.selection = selection.split('/');
|
|
620
|
+
this.fireCustomEvent(CustomEventType.NoPath, details);
|
|
621
|
+
this.pending = [];
|
|
622
|
+
this.requestUpdate('root');
|
|
623
|
+
}
|
|
571
624
|
}
|
|
572
625
|
// eslint-disable-next-line @typescript-eslint/no-empty-function
|
|
573
626
|
loadItems(item, selectFirst = true) {
|
|
@@ -657,7 +710,7 @@ export class TembaMenu extends RapidElement {
|
|
|
657
710
|
this.selection.splice(menuItem.level, this.selection.length - menuItem.level, menuItem.vanity_id || menuItem.id);
|
|
658
711
|
}
|
|
659
712
|
if (menuItem.endpoint) {
|
|
660
|
-
this.loadItems(menuItem,
|
|
713
|
+
this.loadItems(menuItem, true);
|
|
661
714
|
this.dispatchEvent(new Event('change'));
|
|
662
715
|
}
|
|
663
716
|
else {
|
|
@@ -749,6 +802,12 @@ export class TembaMenu extends RapidElement {
|
|
|
749
802
|
this.setSelection(asPath);
|
|
750
803
|
}
|
|
751
804
|
}
|
|
805
|
+
handleExpand() {
|
|
806
|
+
this.collapsed = false;
|
|
807
|
+
}
|
|
808
|
+
handleCollapse() {
|
|
809
|
+
this.collapsed = true;
|
|
810
|
+
}
|
|
752
811
|
async setFocusedItem(path) {
|
|
753
812
|
const focusedPath = path.split('/').filter(step => !!step);
|
|
754
813
|
// if we don't match at the first level, we are a noop
|
|
@@ -802,7 +861,15 @@ export class TembaMenu extends RapidElement {
|
|
|
802
861
|
let items = this.root.items || [];
|
|
803
862
|
const levels = [];
|
|
804
863
|
levels.push(html `<div class="level level-0 ${this.submenu ? 'hidden' : ''}">
|
|
805
|
-
<div class="top"
|
|
864
|
+
<div class="top">
|
|
865
|
+
<div class="expand-icon" @click=${this.handleExpand}>
|
|
866
|
+
<temba-icon
|
|
867
|
+
name="menu-collapse"
|
|
868
|
+
class="expand"
|
|
869
|
+
size="1.4"
|
|
870
|
+
></temba-icon>
|
|
871
|
+
</div>
|
|
872
|
+
</div>
|
|
806
873
|
|
|
807
874
|
${items
|
|
808
875
|
.filter(item => !item.bottom)
|
|
@@ -847,7 +914,25 @@ export class TembaMenu extends RapidElement {
|
|
|
847
914
|
})}"
|
|
848
915
|
>
|
|
849
916
|
${!this.submenu
|
|
850
|
-
? html
|
|
917
|
+
? html `
|
|
918
|
+
<slot
|
|
919
|
+
class="${getClasses({
|
|
920
|
+
'show-header': selected.show_header,
|
|
921
|
+
})}"
|
|
922
|
+
name="header"
|
|
923
|
+
></slot>
|
|
924
|
+
<div class="section-header">
|
|
925
|
+
<div class="section">${selected.name}</div>
|
|
926
|
+
|
|
927
|
+
${index == 0 && !this.collapsed
|
|
928
|
+
? html `<temba-icon
|
|
929
|
+
name="menu-collapse"
|
|
930
|
+
size="1.1"
|
|
931
|
+
@click=${this.handleCollapse}
|
|
932
|
+
></temba-icon>`
|
|
933
|
+
: null}
|
|
934
|
+
</div>
|
|
935
|
+
`
|
|
851
936
|
: null}
|
|
852
937
|
${items.map((item) => {
|
|
853
938
|
if (item.inline && item.items) {
|