@salesforcedevs/dx-components 0.55.3-alpha-2 → 0.55.3-alpha-3

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 (4) hide show
  1. package/package.json +1 -1
  2. package/src/modules/dx/avatarButton/avatarButton.css +8 -3
  3. package/src/modules/dx/avatarButton/avatarButton.html +7 -6
  4. package/src/modules/dx/avatarButton/avatarButton.ts +4 -3
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@salesforcedevs/dx-components",
3
- "version": "0.55.3-alpha-2",
3
+ "version": "0.55.3-alpha-3",
4
4
  "description": "DX Lightning web components",
5
5
  "license": "MIT",
6
6
  "engines": {
package/src/modules/dx/avatarButton/avatarButton.css CHANGED
@@ -5,6 +5,11 @@
5
5
  --dx-c-button-custom-color-hover: var(--dx-g-blue-vibrant-50);
6
6
  --dx-c-button-custom-background-hover: var(--dx-g-cloud-blue-vibrant-90);
7
7
  --dx-c-button-custom-border-hover: var(--dx-g-cloud-blue-vibrant-90);
8
+ --dx-c-slot-empty-width: max-content;
9
+ }
10
+
11
+ .avatar-small-container {
12
+ padding: 2px 0;
8
13
  }
9
14
 
10
15
  .avatar {
@@ -13,6 +18,8 @@
13
18
  }
14
19
 
15
20
  .avatar.avatar-small {
21
+ display: block;
22
+ height: var(--dx-g-spacing-lg);
16
23
  width: var(--dx-g-spacing-lg);
17
24
  }
18
25
 
@@ -22,9 +29,7 @@
22
29
  }
23
30
 
24
31
  .login-control {
25
- background: var(--dx-g-cloud-blue-vibrant-90);
26
- border-color: var(--dx-g-cloud-blue-vibrant-90);
27
- border-radius: 50%;
32
+ margin-left: var(--dx-g-spacing-smd);
28
33
  }
29
34
 
30
35
  .login-container {
package/src/modules/dx/avatarButton/avatarButton.html CHANGED
@@ -1,14 +1,15 @@
1
1
  <template>
2
2
  <div if:true={isLoggedIn}>
3
3
  <dx-popover offset="small" width="320px" open-on-hover>
4
- <img
5
- slot="control"
6
- src={userInfo.avatarImgSrc}
7
- class="avatar avatar-small"
8
- />
4
+ <div slot="control" class="avatar-small-container login-control">
5
+ <img src={userInfo.avatarImgSrc} class="avatar avatar-small" />
6
+ </div>
9
7
  <div slot="content">
10
8
  <div class="login-container logged-in">
11
- <img src="/assets/svg/login-widget-bg.png" class="header-img" />
9
+ <img
10
+ src="/assets/svg/login-widget-bg.png"
11
+ class="header-img"
12
+ />
12
13
  <img
13
14
  src={userInfo.avatarImgSrc}
14
15
  class="avatar avatar-medium"
package/src/modules/dx/avatarButton/avatarButton.ts CHANGED
@@ -2,7 +2,8 @@ import { api, LightningElement } from "lwc";
2
2
  import Cookie from "js-cookie";
3
3
 
4
4
  const TBID_BASE_URL = "https://dev1-trailblazer-identity.cs192.force.com";
5
- const TBID_LOGIN_URL = "https://development.developer.salesforce.com/tbid/dologin";
5
+ const TBID_LOGIN_URL =
6
+ "https://development.developer.salesforce.com/tbid/dologin";
6
7
  const TBID_LOGOUT_URL = `${TBID_BASE_URL}/services/auth/idp/oidc/logout`;
7
8
  const TBID_USERINFO_URL = `${TBID_BASE_URL}/services/oauth2/userinfo`;
8
9
 
@@ -79,9 +80,9 @@ export default class AvatarButton extends LightningElement {
79
80
  this._didReceiveUserInfo = true;
80
81
  } else {
81
82
  if (userInfoRes.status === 403) {
82
- const refreshToken = Cookie.get('TBID_REFRESH');
83
+ const refreshToken = Cookie.get("TBID_REFRESH");
83
84
  if (refreshToken) {
84
- console.log('Would use refresh token');
85
+ console.log("Would use refresh token");
85
86
  }
86
87
  }
87
88
  // TODO: Do we want a "something went wrong" state here?