@redocly/theme 0.12.2 → 0.12.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.
@@ -45,13 +45,13 @@ const LanguagePicker = (props) => {
45
45
  return null;
46
46
  }
47
47
  return (react_1.default.createElement(Dropdown, { "data-component-name": "I18n/LanguagePicker", ref: dropdownRef, isOpen: isOpen, onClick: () => setIsOpen(!isOpen), onBlur: () => setIsOpen(false) },
48
- react_1.default.createElement(DropdownValue, null, currentLocale.toUpperCase()),
48
+ react_1.default.createElement(DropdownValue, { role: "link" }, currentLocale.toUpperCase()),
49
49
  react_1.default.createElement(DropdownMenu, null, locales.map((locale) => (react_1.default.createElement(MenuItem, { onClick: () => {
50
50
  const newLangPathname = (0, utils_1.withPathPrefix)((0, utils_1.getPathnameForLocale)(location.pathname, defaultLocale, locale.code, locales));
51
51
  const newUrlWithLanguage = `${newLangPathname}${location.search}${location.hash}`;
52
52
  history.push(newUrlWithLanguage);
53
53
  props.onChangeLanguage(locale.code);
54
- }, key: locale.code }, locale.name || locale.code || ''))))));
54
+ }, key: locale.code, role: "link" }, locale.name || locale.code || ''))))));
55
55
  };
56
56
  exports.LanguagePicker = LanguagePicker;
57
57
  const Dropdown = styled_components_1.default.div `
@@ -194,7 +194,7 @@ function normalizeItems(items, config) {
194
194
  const metadata = item.metadata || {};
195
195
  const link = item.link || ((_a = (0, utils_1.findDeepFirst)(item.items || [], (i) => 'link' in i && !!i.link)) === null || _a === void 0 ? void 0 : _a.link);
196
196
  const firstSidebarItem = (_b = item.sidebar) === null || _b === void 0 ? void 0 : _b[0];
197
- return Object.assign(Object.assign({}, metadata), { title: (0, utils_1.toStringIfDefined)(metadata === null || metadata === void 0 ? void 0 : metadata.title) || item.label || 'Untitled', description: (0, utils_1.toStringIfDefined)(metadata === null || metadata === void 0 ? void 0 : metadata.description), link: (_c = (0, utils_1.withoutHash)(link)) !== null && _c !== void 0 ? _c : '#', docsLink: (0, utils_1.withoutHash)(firstSidebarItem === null || firstSidebarItem === void 0 ? void 0 : firstSidebarItem.link), image: (0, utils_1.toStringIfDefined)(metadata === null || metadata === void 0 ? void 0 : metadata.image) });
197
+ return Object.assign(Object.assign({}, metadata), { publishedAt: metadata.publishedAt || metadata.createdAt, title: (0, utils_1.toStringIfDefined)(metadata === null || metadata === void 0 ? void 0 : metadata.title) || item.label || 'Untitled', description: (0, utils_1.toStringIfDefined)(metadata === null || metadata === void 0 ? void 0 : metadata.description), link: (_c = (0, utils_1.withoutHash)(link)) !== null && _c !== void 0 ? _c : '#', docsLink: (0, utils_1.withoutHash)(firstSidebarItem === null || firstSidebarItem === void 0 ? void 0 : firstSidebarItem.link), image: (0, utils_1.toStringIfDefined)(metadata === null || metadata === void 0 ? void 0 : metadata.image) });
198
198
  });
199
199
  }
200
200
  function collectFilterParents(filtersWithOptions) {
@@ -53,7 +53,7 @@ function ColorModeSwitcher() {
53
53
  document.documentElement.classList.remove('notransition');
54
54
  });
55
55
  };
56
- return (react_1.default.createElement(Wrapper, { "data-component-name": "ColorModeSwitcher/ColorModeSwitcher", onClick: handelChangeColorMode, modes: modes }, modes.map((mode) => (react_1.default.createElement(ColorModeIcon_1.ColorModeIcon, { mode: mode, key: mode })))));
56
+ return (react_1.default.createElement(Wrapper, { "data-component-name": "ColorModeSwitcher/ColorModeSwitcher", onClick: handelChangeColorMode, modes: modes, role: "link" }, modes.map((mode) => (react_1.default.createElement(ColorModeIcon_1.ColorModeIcon, { mode: mode, key: mode })))));
57
57
  }
58
58
  exports.ColorModeSwitcher = ColorModeSwitcher;
59
59
  const Wrapper = styled_components_1.default.div `
@@ -47,7 +47,7 @@ function Filter({ filter }) {
47
47
  filter.selectOption(Object.assign(Object.assign({}, filter.selectedOptions), { to: formatDateWithNoTimeZone(to) }));
48
48
  } })))) : (filter.filteredOptions.map((value) => {
49
49
  const id = 'filter--' + filter.property + '--' + slug(value.value);
50
- return (react_1.default.createElement(FilterValue, { key: id },
50
+ return (react_1.default.createElement(FilterValue, { key: id, role: "link" },
51
51
  react_1.default.createElement(Checkbox_1.Checkbox, { type: "checkbox", id: id, checked: filter.selectedOptions.has(value.value), onChange: () => filter.toggleOption(value.value) }),
52
52
  react_1.default.createElement("label", { htmlFor: id },
53
53
  translate(value.value),
@@ -54,7 +54,7 @@ function MenuGroup({ item, isExpanded, toggleExpanded, children, }) {
54
54
  }, [isExpanded]);
55
55
  return (react_1.default.createElement(Wrapper, { "data-component-name": "Menu/MenuGroup" },
56
56
  react_1.default.createElement(MenuLinkItem_1.MenuLinkItem, { item: item },
57
- react_1.default.createElement(MenuGroupLabel, { onClick: toggleExpanded, isAlwaysExpanded: item.expanded === 'always', active: item.active },
57
+ react_1.default.createElement(MenuGroupLabel, { onClick: toggleExpanded, isAlwaysExpanded: item.expanded === 'always', active: item.active, role: !item.link ? 'link' : 'none' },
58
58
  react_1.default.createElement(MenuGroupArrow, { visibility: item.items.length ? 'visible' : 'hidden', direction: isExpanded ? 'down' : 'right' }),
59
59
  translate(item.labelTranslationKey, item.label))),
60
60
  react_1.default.createElement(MenuWrapper, { isExpanded: isExpanded }, showChildren ? children : null),
@@ -30,13 +30,13 @@ const utils_1 = require("../../utils");
30
30
  function ProfileComponent({ name = 'User', imageUrl, onClick, color }) {
31
31
  var _a;
32
32
  if (imageUrl) {
33
- return (react_1.default.createElement(ProfileWrapper, { onClick: onClick },
33
+ return (react_1.default.createElement(ProfileWrapper, { onClick: onClick, role: "link" },
34
34
  react_1.default.createElement(StyledUserName, { "data-cy": "user-name", color: color }, name),
35
35
  imageUrl && (react_1.default.createElement(AvatarWrapper, null,
36
36
  react_1.default.createElement("img", { "data-cy": "user-avatar", src: imageUrl, alt: "profile" })))));
37
37
  }
38
38
  const avatarLetters = `${name.charAt(0).toUpperCase()}${((_a = name.split(' ')[1]) === null || _a === void 0 ? void 0 : _a.charAt(0).toUpperCase()) || ''}`;
39
- return (react_1.default.createElement(ProfileWrapper, { onClick: onClick },
39
+ return (react_1.default.createElement(ProfileWrapper, { onClick: onClick, role: "link" },
40
40
  react_1.default.createElement(StyledUserName, { "data-cy": "user-name", color: color }, name),
41
41
  react_1.default.createElement(AvatarWrapper, { background: (0, utils_1.stringToHslColor)(name) },
42
42
  react_1.default.createElement("span", null, avatarLetters))));
@@ -46,7 +46,7 @@ function UserProfileMenu({ hasDeveloperOnboarding, setIsOpened, handleLogout, })
46
46
  react_1.default.createElement(StyledLi, { "data-translation-key": translationKeys.myApps }, translate(translationKeys.myApps, 'My Apps')))) : null, (_a = userProfile === null || userProfile === void 0 ? void 0 : userProfile.menu) === null || _a === void 0 ? void 0 :
47
47
  _a.map((item) => (react_1.default.createElement(Link_1.Link, { external: item.external, key: item.label, to: item.link || '' },
48
48
  react_1.default.createElement(StyledLi, { separatorLine: item === null || item === void 0 ? void 0 : item.separatorLine }, item.label)))),
49
- react_1.default.createElement(StyledLi, { onClick: () => handleLogout(), "data-translation-key": translationKeys.logout }, translate(translationKeys.logout, (userProfile === null || userProfile === void 0 ? void 0 : userProfile.logoutLabel) || 'Log out')))));
49
+ react_1.default.createElement(StyledLi, { onClick: () => handleLogout(), "data-translation-key": translationKeys.logout, role: "link" }, translate(translationKeys.logout, (userProfile === null || userProfile === void 0 ? void 0 : userProfile.logoutLabel) || 'Log out')))));
50
50
  }
51
51
  exports.UserProfileMenu = UserProfileMenu;
52
52
  const StyledUl = styled_components_1.default.ul `
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@redocly/theme",
3
- "version": "0.12.2",
3
+ "version": "0.12.4",
4
4
  "description": "Shared UI components library",
5
5
  "keywords": [],
6
6
  "author": "team@redocly.com",
@@ -31,7 +31,7 @@ export const LanguagePicker = (props: { onChangeLanguage: (newLang: string) => v
31
31
  onClick={() => setIsOpen(!isOpen)}
32
32
  onBlur={() => setIsOpen(false)}
33
33
  >
34
- <DropdownValue>{currentLocale.toUpperCase()}</DropdownValue>
34
+ <DropdownValue role="link">{currentLocale.toUpperCase()}</DropdownValue>
35
35
  <DropdownMenu>
36
36
  {locales.map((locale) => (
37
37
  <MenuItem
@@ -44,6 +44,7 @@ export const LanguagePicker = (props: { onChangeLanguage: (newLang: string) => v
44
44
  props.onChangeLanguage(locale.code);
45
45
  }}
46
46
  key={locale.code}
47
+ role="link"
47
48
  >
48
49
  {locale.name || locale.code || ''}
49
50
  </MenuItem>
@@ -216,6 +216,7 @@ function normalizeItems(items: ResolvedNavItem[], config: CatalogConfig): Catalo
216
216
  const firstSidebarItem = (item as any).sidebar?.[0];
217
217
  return {
218
218
  ...metadata,
219
+ publishedAt: metadata.publishedAt || metadata.createdAt,
219
220
  title: toStringIfDefined(metadata?.title) || item.label || 'Untitled',
220
221
  description: toStringIfDefined(metadata?.description),
221
222
  link: withoutHash(link) ?? '#',
@@ -36,6 +36,7 @@ export function ColorModeSwitcher(): JSX.Element | null {
36
36
  data-component-name="ColorModeSwitcher/ColorModeSwitcher"
37
37
  onClick={handelChangeColorMode}
38
38
  modes={modes}
39
+ role="link"
39
40
  >
40
41
  {modes.map((mode) => (
41
42
  <ColorModeIcon mode={mode} key={mode} />
@@ -89,7 +89,7 @@ export function Filter({ filter }: { filter: ResolvedFilter & { selectedOptions:
89
89
  filter.filteredOptions.map((value: any) => {
90
90
  const id = 'filter--' + filter.property + '--' + slug(value.value);
91
91
  return (
92
- <FilterValue key={id}>
92
+ <FilterValue key={id} role="link">
93
93
  <Checkbox
94
94
  type="checkbox"
95
95
  id={id}
@@ -45,6 +45,7 @@ export function MenuGroup({
45
45
  onClick={toggleExpanded}
46
46
  isAlwaysExpanded={item.expanded === 'always'}
47
47
  active={item.active}
48
+ role={!item.link ? 'link' : 'none'}
48
49
  >
49
50
  <MenuGroupArrow
50
51
  visibility={item.items.length ? 'visible' : 'hidden'}
@@ -13,7 +13,7 @@ export interface ProfileProps {
13
13
  function ProfileComponent({ name = 'User', imageUrl, onClick, color }: ProfileProps): JSX.Element {
14
14
  if (imageUrl) {
15
15
  return (
16
- <ProfileWrapper onClick={onClick}>
16
+ <ProfileWrapper onClick={onClick} role="link">
17
17
  <StyledUserName data-cy="user-name" color={color}>
18
18
  {name}
19
19
  </StyledUserName>
@@ -31,7 +31,7 @@ function ProfileComponent({ name = 'User', imageUrl, onClick, color }: ProfilePr
31
31
  }`;
32
32
 
33
33
  return (
34
- <ProfileWrapper onClick={onClick}>
34
+ <ProfileWrapper onClick={onClick} role="link">
35
35
  <StyledUserName data-cy="user-name" color={color}>
36
36
  {name}
37
37
  </StyledUserName>
@@ -40,7 +40,11 @@ export function UserProfileMenu({
40
40
  </Link>
41
41
  ))}
42
42
 
43
- <StyledLi onClick={() => handleLogout()} data-translation-key={translationKeys.logout}>
43
+ <StyledLi
44
+ onClick={() => handleLogout()}
45
+ data-translation-key={translationKeys.logout}
46
+ role="link"
47
+ >
44
48
  {translate(translationKeys.logout, userProfile?.logoutLabel || 'Log out')}
45
49
  </StyledLi>
46
50
  </StyledUl>