@boomerang-io/carbon-addons-boomerang-react 4.6.14-beta.0 → 4.6.14-beta.1

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/dist/cjs/components/Header/HeaderTeamSwitcher.js +11 -5
  2. package/dist/esm/components/Header/HeaderTeamSwitcher.js +12 -6
  3. package/package.json +1 -1
  4. package/scss/components/Header/_headerTeamSwitcher.scss +28 -1
package/dist/cjs/components/Header/HeaderTeamSwitcher.js CHANGED
@@ -26,6 +26,9 @@ const headerDropdownMenuContainerClassname = `${settings.prefix}--header-dropdow
26
26
  const headerDropdownMenuLoadingClassname = `${settings.prefix}--header-dropdown-menu-loading`;
27
27
  const headerDropdownMenuSuccessClassname = `${settings.prefix}--header-dropdown-menu-success`;
28
28
  const headerDropdownMenuClassname = `${settings.prefix}--header-dropdown-menu`;
29
+ const headerDropdownMenuContentClassname = `${settings.prefix}--header-dropdown-menu-content`;
30
+ const headerDropdownMenuContentTextClassname = `${settings.prefix}--header-dropdown-menu-content-text`;
31
+ const headerDropdownMenuContentIconClassname = `${settings.prefix}--header-dropdown-menu-content-icon`;
29
32
  const headerDropdownMenuListClassname = `${settings.prefix}--bmrg-header-drop-down`;
30
33
  const headerDropdownMenuItemContainerClassname = `${settings.prefix}--header-dropdown-menu-item-container`;
31
34
  const headerDropdownMenuItemClassname = `${settings.prefix}--header-dropdown-menu-item`;
@@ -230,16 +233,19 @@ function HeaderTeamSwitcher({ analyticsHelpers, baseServicesUrl, createJoinTeamT
230
233
  });
231
234
  sortedStandardTeamsWithNamesToDisplay = sortBy__default.default(newStandardTeams, ["nameToDisplay"]);
232
235
  }
233
- let selectedTeamName = selectedTeam?.displayName ? selectedTeam.displayName : selectedTeam?.name;
234
- if (selectedTeamName && selectedTeamName.length > 65) {
235
- selectedTeamName = selectedTeamName.slice(0, 65) + "...";
236
- }
236
+ let selectedTeamName = selectedTeam?.displayName
237
+ ? selectedTeam.displayName
238
+ : selectedTeam?.name
239
+ ? selectedTeam?.name
240
+ : "No team selected";
237
241
  const isPartnerUser = Boolean(user?.type === UserType.USER_PLATFORM_ROLE.Partner);
238
242
  return (React__default.default.createElement("div", { className: headerDropdownMenuContainerClassname },
239
243
  isLoadingTeamSwitcher ? (React__default.default.createElement("div", { className: headerDropdownMenuLoadingClassname },
240
244
  React__default.default.createElement(react.InlineLoading, null))) : isSuccessTeamSwitcher ? (React__default.default.createElement("div", { className: headerDropdownMenuSuccessClassname },
241
245
  React__default.default.createElement(icons.CheckmarkFilled, null))) : null,
242
- React__default.default.createElement(react.HeaderMenu, { id: "header-team-switcher-menu", "aria-label": menuAriaLabelRecord, className: headerDropdownMenuClassname, menuLinkName: selectedTeamName ? selectedTeamName : "No team selected", onClick: handleHeaderMenuClick, "data-testid": "header-team-switcher-menu" },
246
+ React__default.default.createElement(react.HeaderMenu, { id: "header-team-switcher-menu", "aria-label": menuAriaLabelRecord, className: headerDropdownMenuClassname, renderMenuContent: () => (React__default.default.createElement("div", { className: headerDropdownMenuContentClassname },
247
+ React__default.default.createElement("p", { title: selectedTeamName, className: headerDropdownMenuContentTextClassname }, selectedTeamName),
248
+ React__default.default.createElement(icons.ChevronDown, { className: headerDropdownMenuContentIconClassname }))), onClick: handleHeaderMenuClick, "data-testid": "header-team-switcher-menu" },
243
249
  React__default.default.createElement(HeaderMenu.default, { "aria-labelledby": menuButtonId, className: headerDropdownMenuListClassname, id: menuListId },
244
250
  !isPartnerUser && (React__default.default.createElement(react.HeaderMenuItem, { id: "header-team-switcher-create-join-team-button", className: headerTeamSwitcherCreateTeamButtonContainerClassname, onClick: handleCreateJoinTeamClick,
245
251
  // eslint-disable-next-line no-script-url
package/dist/esm/components/Header/HeaderTeamSwitcher.js CHANGED
@@ -1,7 +1,7 @@
1
1
  import React, { useState, useEffect } from 'react';
2
2
  import { useMutation } from 'react-query';
3
3
  import { InlineLoading, HeaderMenu, HeaderMenuItem } from '@carbon/react';
4
- import { CheckmarkFilled, AddAlt, GroupAccount, ChevronDown } from '@carbon/react/icons';
4
+ import { CheckmarkFilled, ChevronDown, AddAlt, GroupAccount } from '@carbon/react/icons';
5
5
  import sortBy from 'lodash.sortby';
6
6
  import HeaderMenu$1 from './HeaderMenu.js';
7
7
  import { resolver } from '../../config/servicesConfig.js';
@@ -17,6 +17,9 @@ const headerDropdownMenuContainerClassname = `${prefix}--header-dropdown-menu-co
17
17
  const headerDropdownMenuLoadingClassname = `${prefix}--header-dropdown-menu-loading`;
18
18
  const headerDropdownMenuSuccessClassname = `${prefix}--header-dropdown-menu-success`;
19
19
  const headerDropdownMenuClassname = `${prefix}--header-dropdown-menu`;
20
+ const headerDropdownMenuContentClassname = `${prefix}--header-dropdown-menu-content`;
21
+ const headerDropdownMenuContentTextClassname = `${prefix}--header-dropdown-menu-content-text`;
22
+ const headerDropdownMenuContentIconClassname = `${prefix}--header-dropdown-menu-content-icon`;
20
23
  const headerDropdownMenuListClassname = `${prefix}--bmrg-header-drop-down`;
21
24
  const headerDropdownMenuItemContainerClassname = `${prefix}--header-dropdown-menu-item-container`;
22
25
  const headerDropdownMenuItemClassname = `${prefix}--header-dropdown-menu-item`;
@@ -221,16 +224,19 @@ function HeaderTeamSwitcher({ analyticsHelpers, baseServicesUrl, createJoinTeamT
221
224
  });
222
225
  sortedStandardTeamsWithNamesToDisplay = sortBy(newStandardTeams, ["nameToDisplay"]);
223
226
  }
224
- let selectedTeamName = selectedTeam?.displayName ? selectedTeam.displayName : selectedTeam?.name;
225
- if (selectedTeamName && selectedTeamName.length > 65) {
226
- selectedTeamName = selectedTeamName.slice(0, 65) + "...";
227
- }
227
+ let selectedTeamName = selectedTeam?.displayName
228
+ ? selectedTeam.displayName
229
+ : selectedTeam?.name
230
+ ? selectedTeam?.name
231
+ : "No team selected";
228
232
  const isPartnerUser = Boolean(user?.type === USER_PLATFORM_ROLE.Partner);
229
233
  return (React.createElement("div", { className: headerDropdownMenuContainerClassname },
230
234
  isLoadingTeamSwitcher ? (React.createElement("div", { className: headerDropdownMenuLoadingClassname },
231
235
  React.createElement(InlineLoading, null))) : isSuccessTeamSwitcher ? (React.createElement("div", { className: headerDropdownMenuSuccessClassname },
232
236
  React.createElement(CheckmarkFilled, null))) : null,
233
- React.createElement(HeaderMenu, { id: "header-team-switcher-menu", "aria-label": menuAriaLabelRecord, className: headerDropdownMenuClassname, menuLinkName: selectedTeamName ? selectedTeamName : "No team selected", onClick: handleHeaderMenuClick, "data-testid": "header-team-switcher-menu" },
237
+ React.createElement(HeaderMenu, { id: "header-team-switcher-menu", "aria-label": menuAriaLabelRecord, className: headerDropdownMenuClassname, renderMenuContent: () => (React.createElement("div", { className: headerDropdownMenuContentClassname },
238
+ React.createElement("p", { title: selectedTeamName, className: headerDropdownMenuContentTextClassname }, selectedTeamName),
239
+ React.createElement(ChevronDown, { className: headerDropdownMenuContentIconClassname }))), onClick: handleHeaderMenuClick, "data-testid": "header-team-switcher-menu" },
234
240
  React.createElement(HeaderMenu$1, { "aria-labelledby": menuButtonId, className: headerDropdownMenuListClassname, id: menuListId },
235
241
  !isPartnerUser && (React.createElement(HeaderMenuItem, { id: "header-team-switcher-create-join-team-button", className: headerTeamSwitcherCreateTeamButtonContainerClassname, onClick: handleCreateJoinTeamClick,
236
242
  // eslint-disable-next-line no-script-url
package/package.json CHANGED
@@ -1,7 +1,7 @@
1
1
  {
2
2
  "name": "@boomerang-io/carbon-addons-boomerang-react",
3
3
  "description": "Carbon Addons for Boomerang apps",
4
- "version": "4.6.14-beta.0",
4
+ "version": "4.6.14-beta.1",
5
5
  "author": {
6
6
  "name": "Tim Bula",
7
7
  "email": "timrbula@gmail.com"
package/scss/components/Header/_headerTeamSwitcher.scss CHANGED
@@ -39,13 +39,40 @@ IBM Confidential
39
39
  overflow: hidden;
40
40
  width: 100%;
41
41
 
42
- .#{$prefix}--header__menu-arrow {
42
+ .#{$prefix}--header-dropdown-menu-content {
43
+ align-items: center;
44
+ display: flex;
45
+ }
46
+
47
+ .#{$prefix}--header-dropdown-menu-content-text {
48
+ font-size: 0.875rem;
49
+ font-weight: 600;
50
+ line-height: 1.125rem;
51
+ letter-spacing: 0.01rem;
52
+ max-width: 14.5625rem;
53
+ overflow: hidden;
54
+ text-overflow: ellipsis;
55
+ white-space: nowrap;
56
+ }
57
+
58
+ .#{$prefix}--header-dropdown-menu-content-icon {
59
+ margin-left: 1rem;
43
60
  min-height: 1rem;
44
61
  min-width: 1rem;
62
+ transition: transform 150ms ease-in-out;
63
+ transform: rotate(0deg);
45
64
  }
46
65
 
47
66
  &[aria-expanded="true"] {
48
67
  background-color: var(--cds-layer-hover-01) !important;
68
+
69
+ .#{$prefix}--header-dropdown-menu-content-text {
70
+ width: 14.5625rem;
71
+ }
72
+
73
+ .#{$prefix}--header-dropdown-menu-content-icon {
74
+ transform: rotate(180deg);
75
+ }
49
76
  }
50
77
  }
51
78