@nyaruka/temba-components 0.117.1 → 0.118.0
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/CHANGELOG.md +5 -7
- package/demo/index.html +1 -1
- package/dist/temba-components.js +6 -8
- package/dist/temba-components.js.map +1 -1
- package/out-tsc/src/dropdown/Dropdown.js +9 -3
- package/out-tsc/src/dropdown/Dropdown.js.map +1 -1
- package/out-tsc/src/list/TembaMenu.js +5 -6
- package/out-tsc/src/list/TembaMenu.js.map +1 -1
- package/package.json +1 -1
- package/screenshots/truth/menu/menu-focused-with items.png +0 -0
- package/screenshots/truth/menu/menu-refresh-1.png +0 -0
- package/screenshots/truth/menu/menu-refresh-2.png +0 -0
- package/screenshots/truth/menu/menu-root.png +0 -0
- package/screenshots/truth/menu/menu-submenu.png +0 -0
- package/screenshots/truth/menu/menu-tasks-nextup.png +0 -0
- package/screenshots/truth/menu/menu-tasks.png +0 -0
- package/src/dropdown/Dropdown.ts +10 -3
- package/src/list/TembaMenu.ts +5 -6
package/CHANGELOG.md
CHANGED
|
@@ -4,17 +4,15 @@ 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.
|
|
8
|
-
|
|
9
|
-
- Fix button with icon display [`fc31a37`](https://github.com/nyaruka/temba-components/commit/fc31a3748ae9f8c5387846d4b57522007f6e4234)
|
|
10
|
-
|
|
11
|
-
#### [v0.117.0](https://github.com/nyaruka/temba-components/compare/v0.116.0...v0.117.0)
|
|
12
|
-
|
|
13
|
-
> 17 January 2025
|
|
7
|
+
#### [v0.118.0](https://github.com/nyaruka/temba-components/compare/v0.116.0...v0.118.0)
|
|
14
8
|
|
|
9
|
+
- Icon alignment [`#473`](https://github.com/nyaruka/temba-components/pull/473)
|
|
15
10
|
- Add WorkspaceSelect [`#472`](https://github.com/nyaruka/temba-components/pull/472)
|
|
16
11
|
- Bump nanoid from 3.3.7 to 3.3.8 [`#469`](https://github.com/nyaruka/temba-components/pull/469)
|
|
17
12
|
- Render line breaks for messages on contact chat [`#468`](https://github.com/nyaruka/temba-components/pull/468)
|
|
13
|
+
- Fix menu and dropdown icon alignment [`6089fe8`](https://github.com/nyaruka/temba-components/commit/6089fe8f788e5f1f404b76271cddac0a14cc21ed)
|
|
14
|
+
- Fix button with icon display [`fc31a37`](https://github.com/nyaruka/temba-components/commit/fc31a3748ae9f8c5387846d4b57522007f6e4234)
|
|
15
|
+
- Update test screenshots [`0d1b3ef`](https://github.com/nyaruka/temba-components/commit/0d1b3ef633bf52c4c288fa8a085ea33c75f2ae45)
|
|
18
16
|
|
|
19
17
|
#### [v0.116.0](https://github.com/nyaruka/temba-components/compare/v0.114.1...v0.116.0)
|
|
20
18
|
|
package/demo/index.html
CHANGED
|
@@ -127,7 +127,7 @@
|
|
|
127
127
|
</head>
|
|
128
128
|
|
|
129
129
|
<body>
|
|
130
|
-
<temba-webchat channel="
|
|
130
|
+
<temba-webchat channel="5ea6f54b-96b0-4e0f-aa00-c6cccc588a55"></temba-webchat>
|
|
131
131
|
<temba-store completion="/static/api/completion.json" functions="/static/api/functions.json"
|
|
132
132
|
fields="/static/api/fields.json" globals="/static/api/globals.json" groups="/static/api/groups.json"></temba-store>
|
|
133
133
|
|
package/dist/temba-components.js
CHANGED
|
@@ -3486,10 +3486,6 @@ let fr=Ys,vr=!1;const br=["es","fr","pt"],yr="data:image/png;base64,iVBORw0KGgoA
|
|
|
3486
3486
|
align-items: center;
|
|
3487
3487
|
}
|
|
3488
3488
|
|
|
3489
|
-
.level-0 > temba-dropdown .icon-wrapper {
|
|
3490
|
-
padding: 0.2em 0.4em 0.2em 0em;
|
|
3491
|
-
}
|
|
3492
|
-
|
|
3493
3489
|
.level-0 > .item.selected::before,
|
|
3494
3490
|
.level-0 > .item.selected::after {
|
|
3495
3491
|
content: ' ';
|
|
@@ -3979,7 +3975,7 @@ let fr=Ys,vr=!1;const br=["es","fr","pt"],yr="data:image/png;base64,iVBORw0KGgoA
|
|
|
3979
3975
|
}
|
|
3980
3976
|
|
|
3981
3977
|
.level-0 .icon-wrapper {
|
|
3982
|
-
padding: 0.4em 0.
|
|
3978
|
+
padding: 0.4em 0.2em;
|
|
3983
3979
|
}
|
|
3984
3980
|
|
|
3985
3981
|
temba-workspace-select {
|
|
@@ -4051,7 +4047,10 @@ let fr=Ys,vr=!1;const br=["es","fr","pt"],yr="data:image/png;base64,iVBORw0KGgoA
|
|
|
4051
4047
|
@mousedown=${()=>{t.level>0&&(this.pressedItem=t)}}
|
|
4052
4048
|
@mouseleave=${()=>{this.pressedItem=null}}
|
|
4053
4049
|
>
|
|
4054
|
-
${0===t.level?t.avatar?n:V`<temba-tip
|
|
4050
|
+
${0===t.level?t.avatar?n:V`<temba-tip
|
|
4051
|
+
position="right"
|
|
4052
|
+
style="display:flex;"
|
|
4053
|
+
text="${t.name}"
|
|
4055
4054
|
>${n}</temba-tip
|
|
4056
4055
|
>`:V`${n}${s}`}
|
|
4057
4056
|
|
|
@@ -4182,7 +4181,6 @@ let fr=Ys,vr=!1;const br=["es","fr","pt"],yr="data:image/png;base64,iVBORw0KGgoA
|
|
|
4182
4181
|
content: '';
|
|
4183
4182
|
width: 0px;
|
|
4184
4183
|
height: 0;
|
|
4185
|
-
top: -6px;
|
|
4186
4184
|
z-index: 10;
|
|
4187
4185
|
position: absolute;
|
|
4188
4186
|
border-left: 6px solid transparent;
|
|
@@ -4217,7 +4215,7 @@ let fr=Ys,vr=!1;const br=["es","fr","pt"],yr="data:image/png;base64,iVBORw0KGgoA
|
|
|
4217
4215
|
.right {
|
|
4218
4216
|
right: 0;
|
|
4219
4217
|
}
|
|
4220
|
-
`}constructor(){super(),this.open=!1,this.dormant=!0,this.arrowSize=8,this.margin=10,this.mask=!1,this.dropdownStyle={},this.arrowStyle={},this.calculatePosition=this.calculatePosition.bind(this)}firstUpdated(t){super.firstUpdated(t),this.resetBlurHandler()}resetBlurHandler(){const t=this.shadowRoot.querySelector(".dropdown");this.activeFocus&&this.activeFocus.removeEventListener("blur",this.blurHandler),this.activeFocus=t,this.blurHandler=this.handleBlur.bind(this),this.activeFocus.addEventListener("blur",this.blurHandler)}handleBlur(t){const e=t.relatedTarget;this.contains(e)?(e.addEventListener("blur",this.blurHandler),this.activeFocus=e):this.closeDropdown()}openDropdown(){this.open=!0,this.dormant=!1,this.resetBlurHandler();const t=this.shadowRoot.querySelector(".dropdown");t.focus(),t.click(),this.fireCustomEvent($e.Opened)}closeDropdown(){this.activeFocus.removeEventListener("blur",this.blurHandler),this.open=!1,this.resetBlurHandler(),window.setTimeout((()=>{this.dormant=!0}),250),this.blur()}updated(t){super.updated(t),t.has("open")&&(this.dropdownStyle={}),t.has("dropdownStyle")&&0===Object.keys(this.dropdownStyle).length&&this.calculatePosition()}calculatePosition(){const t=this.shadowRoot.querySelector(".dropdown"),e=this.querySelector('
|
|
4218
|
+
`}constructor(){super(),this.open=!1,this.dormant=!0,this.arrowSize=8,this.margin=10,this.mask=!1,this.dropdownStyle={},this.arrowStyle={},this.calculatePosition=this.calculatePosition.bind(this)}firstUpdated(t){super.firstUpdated(t),this.resetBlurHandler()}resetBlurHandler(){const t=this.shadowRoot.querySelector(".dropdown");this.activeFocus&&this.activeFocus.removeEventListener("blur",this.blurHandler),this.activeFocus=t,this.blurHandler=this.handleBlur.bind(this),this.activeFocus.addEventListener("blur",this.blurHandler)}handleBlur(t){const e=t.relatedTarget;this.contains(e)?(e.addEventListener("blur",this.blurHandler),this.activeFocus=e):this.closeDropdown()}openDropdown(){this.open=!0,this.dormant=!1,this.resetBlurHandler();const t=this.shadowRoot.querySelector(".dropdown");t.focus(),t.click(),this.fireCustomEvent($e.Opened)}closeDropdown(){this.activeFocus.removeEventListener("blur",this.blurHandler),this.open=!1,this.resetBlurHandler(),window.setTimeout((()=>{this.dormant=!0}),250),this.blur()}updated(t){super.updated(t),t.has("open")&&(this.dropdownStyle={}),t.has("dropdownStyle")&&0===Object.keys(this.dropdownStyle).length&&this.calculatePosition()}calculatePosition(){const t=this.shadowRoot.querySelector(".dropdown"),e=this.querySelector('*[slot="toggle"]'),i=this.shadowRoot.querySelector(".arrow");let o=!1,n=!1;if(t&&e){const s=t.getBoundingClientRect(),r=e.getBoundingClientRect(),a=i.getBoundingClientRect();if(!e)return;const l={border:"1px solid rgba(0,0,0,0.1)",marginTop:"0.5em"};s.right>window.innerWidth&&(l.left=r.right-s.width+"px",delete l.right,n=!0),s.bottom>window.innerHeight&&(l.top=r.top-s.height+"px",l["margin-top"]="-0.5em",o=!0);let h=r.width/2-a.width/2;h<=0&&(l.marginLeft="-10px",h=10);const c={left:h+"px",borderWidth:this.arrowSize+"px",top:"-"+this.arrowSize+"px"};o&&(c.transform="rotate(180deg)",c.top="auto",c.bottom="-"+this.arrowSize+"px"),n&&(c.right=r.width/2-a.width/2+"px",delete c.left),this.arrowStyle=c,this.dropdownStyle=l}this.requestUpdate()}handleToggleClicked(t){t.preventDefault(),t.stopPropagation(),!this.open&&this.dormant&&this.openDropdown()}render(){return V`
|
|
4221
4219
|
${this.mask?V`<div class="mask ${this.open?"open":""}" />`:null}
|
|
4222
4220
|
|
|
4223
4221
|
<div
|