@codecademy/brand 3.25.2 → 3.26.0-alpha.18e8b1387b.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/dist/AppHeader/AppHeaderElements/AppHeaderCatalogDropdown/index.js +6 -28
- package/dist/AppHeader/AppHeaderElements/AppHeaderDropdown/index.d.ts +0 -1
- package/dist/AppHeader/AppHeaderElements/AppHeaderDropdown/index.js +10 -67
- package/dist/AppHeader/AppHeaderElements/{AppHeaderDropdownLinks/elements/StyledAppHeaderLink.d.ts → AppHeaderLinkSections/elements.d.ts} +6 -6
- package/dist/AppHeader/AppHeaderElements/AppHeaderLinkSections/elements.js +36 -0
- package/dist/AppHeader/AppHeaderElements/AppHeaderLinkSections/index.d.ts +1 -8
- package/dist/AppHeader/AppHeaderElements/AppHeaderLinkSections/index.js +32 -25
- package/dist/AppHeader/AppHeaderElements/AppHeaderNavButton/index.d.ts +5 -2
- package/dist/AppHeader/AppHeaderElements/AppHeaderNavButton/index.js +91 -24
- package/dist/AppHeader/AppHeaderElements/AppHeaderResourcesDropdown/index.js +5 -27
- package/dist/AppHeader/AppHeaderElements/AppHeaderSection/NavSection.d.ts +2 -2
- package/dist/AppHeader/AppHeaderElements/AppHeaderSection/NavSection.js +38 -20
- package/dist/AppHeader/AppHeaderElements/AppHeaderSection/elements.js +8 -8
- package/dist/AppHeader/AppHeaderElements/AppHeaderSection/index.js +5 -13
- package/dist/AppHeader/shared/elements.d.ts +9 -3
- package/dist/AppHeader/shared/elements.js +126 -26
- package/dist/AppHeader/shared/types.d.ts +1 -1
- package/dist/AppHeader/shared/utils.d.ts +1 -2
- package/dist/AppHeader/shared/utils.js +0 -2
- package/dist/AppHeaderMobile/index.js +2 -3
- package/package.json +1 -1
- package/dist/AppHeader/AppHeaderElements/AppHeaderDropdownLinks/elements/AppHeaderDropdownLink.d.ts +0 -3
- package/dist/AppHeader/AppHeaderElements/AppHeaderDropdownLinks/elements/AppHeaderDropdownLink.js +0 -25
- package/dist/AppHeader/AppHeaderElements/AppHeaderDropdownLinks/elements/AppHeaderMenuItem.d.ts +0 -3
- package/dist/AppHeader/AppHeaderElements/AppHeaderDropdownLinks/elements/AppHeaderMenuItem.js +0 -26
- package/dist/AppHeader/AppHeaderElements/AppHeaderDropdownLinks/elements/StyledAppHeaderLink.js +0 -36
- package/dist/AppHeader/AppHeaderElements/AppHeaderDropdownLinks/elements/types.d.ts +0 -4
- package/dist/AppHeader/AppHeaderElements/AppHeaderDropdownLinks/elements/types.js +0 -1
- package/dist/AppHeader/AppHeaderElements/AppHeaderDropdownLinks/index.d.ts +0 -2
- package/dist/AppHeader/AppHeaderElements/AppHeaderDropdownLinks/index.js +0 -2
- package/dist/AppHeader/AppHeaderElements/AppHeaderNavButton/AppHeaderDropdownNavButton.d.ts +0 -18
- package/dist/AppHeader/AppHeaderElements/AppHeaderNavButton/AppHeaderDropdownNavButton.js +0 -50
- package/dist/AppHeader/AppHeaderElements/AppHeaderNavButton/AppHeaderMenuNavButton.d.ts +0 -9
- package/dist/AppHeader/AppHeaderElements/AppHeaderNavButton/AppHeaderMenuNavButton.js +0 -38
|
@@ -5,7 +5,7 @@ import * as React from 'react';
|
|
|
5
5
|
import { DropdownPositions, useHeaderDisplayContext } from '../../../GlobalHeader/context';
|
|
6
6
|
import { AnimatedMegaMenuDropdown } from '../../shared';
|
|
7
7
|
import { AppHeaderDropdownProvider } from '../AppHeaderDropdownProvider';
|
|
8
|
-
import { AppHeaderDropdownNavButton } from '../AppHeaderNavButton
|
|
8
|
+
import { AppHeaderDropdownNavButton } from '../AppHeaderNavButton';
|
|
9
9
|
import { useAppHeaderContext } from '../AppHeaderProvider';
|
|
10
10
|
import { AppHeaderSection } from '../AppHeaderSection';
|
|
11
11
|
import { CATALOG_NAV_SECTIONS } from './consts';
|
|
@@ -16,7 +16,7 @@ const StyledAnimatedMegaMenuDropdown = /*#__PURE__*/_styled(AnimatedMegaMenuDrop
|
|
|
16
16
|
shouldForwardProp: prop => prop !== 'narrowCatalogDropdownPosition' && prop !== 'wideCatalogDropdownPosition',
|
|
17
17
|
target: "eaa3s9f0",
|
|
18
18
|
label: "StyledAnimatedMegaMenuDropdown"
|
|
19
|
-
})("left:", ({
|
|
19
|
+
})("top:3.5rem;left:", ({
|
|
20
20
|
narrowCatalogDropdownPosition
|
|
21
21
|
}) => {
|
|
22
22
|
return narrowCatalogDropdownPosition;
|
|
@@ -24,7 +24,7 @@ const StyledAnimatedMegaMenuDropdown = /*#__PURE__*/_styled(AnimatedMegaMenuDrop
|
|
|
24
24
|
wideCatalogDropdownPosition
|
|
25
25
|
}) => {
|
|
26
26
|
return wideCatalogDropdownPosition;
|
|
27
|
-
}, ";}" + (process.env.NODE_ENV === "production" ? "" : "/*# sourceMappingURL=data:application/json;charset=utf-8;base64,
|
|
27
|
+
}, ";}" + (process.env.NODE_ENV === "production" ? "" : "/*# sourceMappingURL=data:application/json;charset=utf-8;base64,eyJ2ZXJzaW9uIjozLCJzb3VyY2VzIjpbIi4uLy4uLy4uLy4uL3NyYy9BcHBIZWFkZXIvQXBwSGVhZGVyRWxlbWVudHMvQXBwSGVhZGVyQ2F0YWxvZ0Ryb3Bkb3duL2luZGV4LnRzeCJdLCJuYW1lcyI6W10sIm1hcHBpbmdzIjoiQUFpQ0UiLCJmaWxlIjoiLi4vLi4vLi4vLi4vc3JjL0FwcEhlYWRlci9BcHBIZWFkZXJFbGVtZW50cy9BcHBIZWFkZXJDYXRhbG9nRHJvcGRvd24vaW5kZXgudHN4Iiwic291cmNlc0NvbnRlbnQiOlsiaW1wb3J0IHsgQ29sb3JNb2RlIH0gZnJvbSAnQGNvZGVjYWRlbXkvZ2FtdXQtc3R5bGVzJztcbmltcG9ydCBzdHlsZWQgZnJvbSAnQGVtb3Rpb24vc3R5bGVkJztcbmltcG9ydCB7IHVzZUNhbGxiYWNrLCB1c2VFZmZlY3QsIHVzZVJlZiwgdXNlU3RhdGUgfSBmcm9tICdyZWFjdCc7XG5pbXBvcnQgKiBhcyBSZWFjdCBmcm9tICdyZWFjdCc7XG5cbmltcG9ydCB7XG4gIERyb3Bkb3duUG9zaXRpb25zLFxuICB1c2VIZWFkZXJEaXNwbGF5Q29udGV4dCxcbn0gZnJvbSAnLi4vLi4vLi4vR2xvYmFsSGVhZGVyL2NvbnRleHQnO1xuaW1wb3J0IHtcbiAgQW5pbWF0ZWRNZWdhTWVudURyb3Bkb3duLFxuICBBcHBIZWFkZXJBY3Rpb24sXG4gIEFwcEhlYWRlckNhdGFsb2dEcm9wZG93bkl0ZW0sXG59IGZyb20gJy4uLy4uL3NoYXJlZCc7XG5pbXBvcnQgeyBBcHBIZWFkZXJEcm9wZG93blByb3ZpZGVyIH0gZnJvbSAnLi4vQXBwSGVhZGVyRHJvcGRvd25Qcm92aWRlcic7XG5pbXBvcnQgeyBBcHBIZWFkZXJEcm9wZG93bk5hdkJ1dHRvbiB9IGZyb20gJy4uL0FwcEhlYWRlck5hdkJ1dHRvbic7XG5pbXBvcnQgeyB1c2VBcHBIZWFkZXJDb250ZXh0IH0gZnJvbSAnLi4vQXBwSGVhZGVyUHJvdmlkZXInO1xuaW1wb3J0IHsgQXBwSGVhZGVyU2VjdGlvbiB9IGZyb20gJy4uL0FwcEhlYWRlclNlY3Rpb24nO1xuaW1wb3J0IHsgQ0FUQUxPR19OQVZfU0VDVElPTlMgfSBmcm9tICcuL2NvbnN0cyc7XG5pbXBvcnQgeyBNYXJrZXRpbmdCYW5uZXIgfSBmcm9tICcuL01hcmtldGluZ0Jhbm5lcic7XG5cbmV4cG9ydCB0eXBlIEFwcEhlYWRlckNhdGFsb2dEcm9wZG93blByb3BzID0gQXBwSGVhZGVyQWN0aW9uICYge1xuICBpdGVtOiBBcHBIZWFkZXJDYXRhbG9nRHJvcGRvd25JdGVtO1xufTtcblxuY29uc3QgU3R5bGVkQW5pbWF0ZWRNZWdhTWVudURyb3Bkb3duID0gc3R5bGVkKEFuaW1hdGVkTWVnYU1lbnVEcm9wZG93biwge1xuICAvLyBwcmV2ZW50IHRoZSBwcm9wcyBmcm9tIGJlaW5nIHBhc3NlZCB0byB0aGUgRE9NIGVsZW1lbnQsIHdoaWNoIHdvdWxkIGNhdXNlIGEgUmVhY3Qgd2FybmluZy5cbiAgc2hvdWxkRm9yd2FyZFByb3A6IChwcm9wKSA9PlxuICAgIHByb3AgIT09ICduYXJyb3dDYXRhbG9nRHJvcGRvd25Qb3NpdGlvbicgJiZcbiAgICBwcm9wICE9PSAnd2lkZUNhdGFsb2dEcm9wZG93blBvc2l0aW9uJyxcbn0pPHtcbiAgbmFycm93Q2F0YWxvZ0Ryb3Bkb3duUG9zaXRpb246IHN0cmluZztcbiAgd2lkZUNhdGFsb2dEcm9wZG93blBvc2l0aW9uOiBzdHJpbmc7XG59PmBcbiAgdG9wOiAzLjVyZW07XG4gIGxlZnQ6ICR7KHsgbmFycm93Q2F0YWxvZ0Ryb3Bkb3duUG9zaXRpb24gfSkgPT4ge1xuICAgIHJldHVybiBuYXJyb3dDYXRhbG9nRHJvcGRvd25Qb3NpdGlvbjtcbiAgfX07XG5cbiAgQG1lZGlhIChtaW4td2lkdGg6IDEyNjFweCkge1xuICAgIGxlZnQ6ICR7KHsgd2lkZUNhdGFsb2dEcm9wZG93blBvc2l0aW9uIH0pID0+IHtcbiAgICAgIHJldHVybiB3aWRlQ2F0YWxvZ0Ryb3Bkb3duUG9zaXRpb247XG4gICAgfX07XG4gIH1cbmA7XG5cbmV4cG9ydCBjb25zdCBBcHBIZWFkZXJDYXRhbG9nRHJvcGRvd246IFJlYWN0LkZDPFxuICBBcHBIZWFkZXJDYXRhbG9nRHJvcGRvd25Qcm9wc1xuPiA9ICh7IGFjdGlvbiwgaXRlbSB9KSA9PiB7XG4gIGNvbnN0IHsgdGV4dCB9ID0gaXRlbTtcbiAgY29uc3QgY29udGFpbmVyUmVmID0gdXNlUmVmPEhUTUxEaXZFbGVtZW50IHwgbnVsbD4obnVsbCk7XG4gIGNvbnN0IGJ1dHRvblJlZiA9IHVzZVJlZjxIVE1MQnV0dG9uRWxlbWVudD4obnVsbCk7XG4gIGNvbnN0IGRyb3Bkb3duUmVmID0gdXNlUmVmPEhUTUxEaXZFbGVtZW50IHwgbnVsbD4obnVsbCk7XG4gIGNvbnN0IFtpc09wZW4sIHNldElzT3Blbl0gPSB1c2VTdGF0ZShmYWxzZSk7XG4gIGNvbnN0IHsgbGFzdE9wZW5lZERyb3Bkb3duLCBzZXRMYXN0T3BlbmVkRHJvcGRvd24gfSA9IHVzZUFwcEhlYWRlckNvbnRleHQoKTtcbiAgY29uc3QgeyBoZWFkZXJUeXBlIH0gPSB1c2VIZWFkZXJEaXNwbGF5Q29udGV4dCgpO1xuICBjb25zdCB7IGNhdGFsb2dEcm9wZG93biB9ID0gRHJvcGRvd25Qb3NpdGlvbnNbaGVhZGVyVHlwZV07XG4gIGNvbnN0IG5hcnJvd0NhdGFsb2dEcm9wZG93blBvc2l0aW9uID0gY2F0YWxvZ0Ryb3Bkb3duLm5hcnJvdztcbiAgY29uc3Qgd2lkZUNhdGFsb2dEcm9wZG93blBvc2l0aW9uID0gY2F0YWxvZ0Ryb3Bkb3duLndpZGU7XG5cbiAgY29uc3QgYW5pbWF0aW9uRmluaXNoZWQgPSAoKSA9PiB7XG4gICAgaWYgKGlzT3BlbiAmJiBkcm9wZG93blJlZi5jdXJyZW50KSB7XG4gICAgICBkcm9wZG93blJlZi5jdXJyZW50LnNjcm9sbFRvcCA9IDA7XG4gICAgfVxuICB9O1xuXG4gIGNvbnN0IGZvY3VzQnV0dG9uID0gKCkgPT4ge1xuICAgIGJ1dHRvblJlZj8uY3VycmVudD8uZm9jdXMoKTtcbiAgfTtcblxuICBjb25zdCBoYW5kbGVPbkNsaWNrID0gKGV2ZW50OiBSZWFjdC5Nb3VzZUV2ZW50KSA9PiB7XG4gICAgaWYgKCFpc09wZW4pIHtcbiAgICAgIGFjdGlvbihldmVudCwgaXRlbSk7XG4gICAgICBpZiAoc2V0TGFzdE9wZW5lZERyb3Bkb3duKSB7XG4gICAgICAgIHNldExhc3RPcGVuZWREcm9wZG93bih0ZXh0KTtcbiAgICAgIH1cbiAgICB9XG4gICAgc2V0SXNPcGVuKChwcmV2KSA9PiAhcHJldik7XG4gIH07XG5cbiAgY29uc3QgaGFuZGxlQ2xvc2UgPSB1c2VDYWxsYmFjaygoKSA9PiB7XG4gICAgc2V0SXNPcGVuKGZhbHNlKTtcbiAgICBmb2N1c0J1dHRvbigpO1xuICB9LCBbXSk7XG5cbiAgdXNlRWZmZWN0KCgpID0+IHtcbiAgICBpZiAobGFzdE9wZW5lZERyb3Bkb3duICE9PSB0ZXh0ICYmIGlzT3Blbikge1xuICAgICAgc2V0SXNPcGVuKGZhbHNlKTtcbiAgICB9XG4gICAgLy8gZXNsaW50LWRpc2FibGUtbmV4dC1saW5lIHJlYWN0LWhvb2tzL2V4aGF1c3RpdmUtZGVwc1xuICB9LCBbbGFzdE9wZW5lZERyb3Bkb3duXSk7XG5cbiAgdXNlRWZmZWN0KCgpID0+IHtcbiAgICBmdW5jdGlvbiBoYW5kbGVDbGlja091dHNpZGUoZXZlbnQ6IE1vdXNlRXZlbnQgfCBFdmVudCkge1xuICAgICAgY29uc3QgY29udGFpbmVyID0gY29udGFpbmVyUmVmPy5jdXJyZW50O1xuICAgICAgY29uc3QgYnV0dG9uID0gYnV0dG9uUmVmPy5jdXJyZW50O1xuICAgICAgaWYgKFxuICAgICAgICBpc09wZW4gJiZcbiAgICAgICAgY29udGFpbmVyICYmXG4gICAgICAgICFjb250YWluZXIuY29udGFpbnMoZXZlbnQudGFyZ2V0IGFzIE5vZGUpICYmXG4gICAgICAgIGJ1dHRvbiAmJlxuICAgICAgICAhYnV0dG9uLmNvbnRhaW5zKGV2ZW50LnRhcmdldCBhcyBOb2RlKVxuICAgICAgKSB7XG4gICAgICAgIGhhbmRsZUNsb3NlKCk7XG4gICAgICB9XG4gICAgfVxuXG4gICAgZG9jdW1lbnQuYWRkRXZlbnRMaXN0ZW5lcignbW91c2Vkb3duJywgaGFuZGxlQ2xpY2tPdXRzaWRlKTtcbiAgICBkb2N1bWVudC5hZGRFdmVudExpc3RlbmVyKCdibHVyJywgaGFuZGxlQ2xpY2tPdXRzaWRlKTtcbiAgICByZXR1cm4gKCkgPT4ge1xuICAgICAgZG9jdW1lbnQucmVtb3ZlRXZlbnRMaXN0ZW5lcignbW91c2Vkb3duJywgaGFuZGxlQ2xpY2tPdXRzaWRlKTtcbiAgICAgIGRvY3VtZW50LnJlbW92ZUV2ZW50TGlzdGVuZXIoJ2JsdXInLCBoYW5kbGVDbGlja091dHNpZGUpO1xuICAgIH07XG4gIH0sIFtjb250YWluZXJSZWYsIGhhbmRsZUNsb3NlLCBpc09wZW5dKTtcblxuICByZXR1cm4gKFxuICAgIDxBcHBIZWFkZXJEcm9wZG93blByb3ZpZGVyIGhhbmRsZUNsb3NlPXtoYW5kbGVDbG9zZX0+XG4gICAgICA8QXBwSGVhZGVyRHJvcGRvd25OYXZCdXR0b25cbiAgICAgICAgYnV0dG9uUmVmPXtidXR0b25SZWZ9XG4gICAgICAgIGhhbmRsZU9uQ2xpY2s9e2hhbmRsZU9uQ2xpY2t9XG4gICAgICAgIGlzT3Blbj17aXNPcGVufVxuICAgICAgICB0ZXh0PXt0ZXh0fVxuICAgICAgLz5cbiAgICAgIDxTdHlsZWRBbmltYXRlZE1lZ2FNZW51RHJvcGRvd25cbiAgICAgICAgaXNPcGVuPXtpc09wZW59XG4gICAgICAgIG5hcnJvd0NhdGFsb2dEcm9wZG93blBvc2l0aW9uPXtuYXJyb3dDYXRhbG9nRHJvcGRvd25Qb3NpdGlvbn1cbiAgICAgICAgd2lkZUNhdGFsb2dEcm9wZG93blBvc2l0aW9uPXt3aWRlQ2F0YWxvZ0Ryb3Bkb3duUG9zaXRpb259XG4gICAgICAgIHRhYkluZGV4PXstMX0gLy8gcHJldmVudCBmcm9tIGludGVyZmVyaW5nIHdpdGggQXBwSGVhZGVyIGZvY3VzIGxvZ2ljXG4gICAgICAgIGRhdGEtdGVzdGlkPVwiY2F0YWxvZy1tZW51LWRyb3Bkb3duXCJcbiAgICAgICAgb25BbmltYXRpb25Db21wbGV0ZT17YW5pbWF0aW9uRmluaXNoZWR9XG4gICAgICAgIHJlZj17ZHJvcGRvd25SZWZ9XG4gICAgICA+XG4gICAgICAgIDxDb2xvck1vZGUgbW9kZT1cImxpZ2h0XCI+XG4gICAgICAgICAgPEFwcEhlYWRlclNlY3Rpb25cbiAgICAgICAgICAgIGlzT3Blbj17aXNPcGVufVxuICAgICAgICAgICAgcmVmPXtjb250YWluZXJSZWZ9XG4gICAgICAgICAgICBuYXZTZWN0aW9ucz17Q0FUQUxPR19OQVZfU0VDVElPTlN9XG4gICAgICAgICAgICBNYXJrZXRpbmdCYW5uZXI9e01hcmtldGluZ0Jhbm5lcn1cbiAgICAgICAgICAgIGhhbmRsZUNsb3NlPXsoKSA9PiBzZXRJc09wZW4oZmFsc2UpfVxuICAgICAgICAgICAgdHlwZT1cImNhdGFsb2ctZHJvcGRvd25cIlxuICAgICAgICAgIC8+XG4gICAgICAgIDwvQ29sb3JNb2RlPlxuICAgICAgPC9TdHlsZWRBbmltYXRlZE1lZ2FNZW51RHJvcGRvd24+XG4gICAgPC9BcHBIZWFkZXJEcm9wZG93blByb3ZpZGVyPlxuICApO1xufTtcbiJdfQ== */"));
|
|
28
28
|
export const AppHeaderCatalogDropdown = ({
|
|
29
29
|
action,
|
|
30
30
|
item
|
|
@@ -48,11 +48,7 @@ export const AppHeaderCatalogDropdown = ({
|
|
|
48
48
|
} = DropdownPositions[headerType];
|
|
49
49
|
const narrowCatalogDropdownPosition = catalogDropdown.narrow;
|
|
50
50
|
const wideCatalogDropdownPosition = catalogDropdown.wide;
|
|
51
|
-
|
|
52
|
-
// Add scrollbar for short screens after transition (otherwise scrollbar appears and dissapears for adequate heights during transition)
|
|
53
|
-
const [animationCompleteStyles, setAnimationCompleteStyles] = useState(false);
|
|
54
51
|
const animationFinished = () => {
|
|
55
|
-
setAnimationCompleteStyles(isOpen);
|
|
56
52
|
if (isOpen && dropdownRef.current) {
|
|
57
53
|
dropdownRef.current.scrollTop = 0;
|
|
58
54
|
}
|
|
@@ -60,15 +56,14 @@ export const AppHeaderCatalogDropdown = ({
|
|
|
60
56
|
const focusButton = () => {
|
|
61
57
|
buttonRef?.current?.focus();
|
|
62
58
|
};
|
|
63
|
-
const toggleIsOpen = () => setIsOpen(prev => !prev);
|
|
64
59
|
const handleOnClick = event => {
|
|
65
|
-
toggleIsOpen();
|
|
66
60
|
if (!isOpen) {
|
|
67
61
|
action(event, item);
|
|
68
62
|
if (setLastOpenedDropdown) {
|
|
69
63
|
setLastOpenedDropdown(text);
|
|
70
64
|
}
|
|
71
65
|
}
|
|
66
|
+
setIsOpen(prev => !prev);
|
|
72
67
|
};
|
|
73
68
|
const handleClose = useCallback(() => {
|
|
74
69
|
setIsOpen(false);
|
|
@@ -101,30 +96,13 @@ export const AppHeaderCatalogDropdown = ({
|
|
|
101
96
|
buttonRef: buttonRef,
|
|
102
97
|
handleOnClick: handleOnClick,
|
|
103
98
|
isOpen: isOpen,
|
|
104
|
-
|
|
99
|
+
text: text
|
|
105
100
|
}), /*#__PURE__*/_jsx(StyledAnimatedMegaMenuDropdown, {
|
|
101
|
+
isOpen: isOpen,
|
|
106
102
|
narrowCatalogDropdownPosition: narrowCatalogDropdownPosition,
|
|
107
103
|
wideCatalogDropdownPosition: wideCatalogDropdownPosition,
|
|
108
104
|
tabIndex: -1 // prevent from interfering with AppHeader focus logic
|
|
109
105
|
,
|
|
110
|
-
style: {
|
|
111
|
-
top: '3.5rem',
|
|
112
|
-
minWidth: '64rem',
|
|
113
|
-
overflowY: 'auto',
|
|
114
|
-
maxHeight: animationCompleteStyles ? '85vh' : 0,
|
|
115
|
-
backgroundColor: 'transparent'
|
|
116
|
-
},
|
|
117
|
-
initial: {
|
|
118
|
-
borderWidth: 0,
|
|
119
|
-
height: 0
|
|
120
|
-
},
|
|
121
|
-
animate: {
|
|
122
|
-
height: isOpen ? 'fit-content' : 0
|
|
123
|
-
},
|
|
124
|
-
transition: {
|
|
125
|
-
duration: 0.175
|
|
126
|
-
},
|
|
127
|
-
"aria-hidden": !isOpen,
|
|
128
106
|
"data-testid": "catalog-menu-dropdown",
|
|
129
107
|
onAnimationComplete: animationFinished,
|
|
130
108
|
ref: dropdownRef,
|
|
@@ -3,7 +3,6 @@ import * as React from 'react';
|
|
|
3
3
|
import { AppHeaderAction, AppHeaderDropdownItem } from '../../shared';
|
|
4
4
|
export type AppHeaderDropdownProps = AppHeaderAction & Pick<React.ComponentProps<typeof Menu>, 'spacing'> & {
|
|
5
5
|
item: AppHeaderDropdownItem;
|
|
6
|
-
onKeyDown?: (event: React.KeyboardEvent) => void;
|
|
7
6
|
/**
|
|
8
7
|
* If true, the dropdown is being rendered as a standalone component, rather than
|
|
9
8
|
* part of the global header.
|
|
@@ -1,38 +1,21 @@
|
|
|
1
1
|
import _styled from "@emotion/styled/base";
|
|
2
2
|
import { Menu } from '@codecademy/gamut';
|
|
3
3
|
import { ColorMode, css } from '@codecademy/gamut-styles';
|
|
4
|
-
import { useCallback, useEffect,
|
|
4
|
+
import { useCallback, useEffect, useRef, useState } from 'react';
|
|
5
5
|
import * as React from 'react';
|
|
6
|
-
import { useIsomorphicLayoutEffect } from 'react-use';
|
|
7
6
|
import { AnimatedSimpleDropdown } from '../../shared';
|
|
8
|
-
import { AppHeaderDropdownProvider } from '../AppHeaderDropdownProvider';
|
|
9
7
|
import { AppHeaderLinkSections } from '../AppHeaderLinkSections';
|
|
10
8
|
import { AppHeaderMenuProvider } from '../AppHeaderMenuProvider';
|
|
11
|
-
import {
|
|
9
|
+
import { AppHeaderMenuNavButton } from '../AppHeaderNavButton';
|
|
12
10
|
import { useAppHeaderContext } from '../AppHeaderProvider';
|
|
13
11
|
import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
|
|
14
|
-
const topSpacing = {
|
|
15
|
-
lg: '3.2rem',
|
|
16
|
-
md: '2.75rem',
|
|
17
|
-
sm: '2.25rem'
|
|
18
|
-
};
|
|
19
|
-
const getSpacing = ({
|
|
20
|
-
isProfileDropdown,
|
|
21
|
-
isGenericDropdown,
|
|
22
|
-
isIconDropdown,
|
|
23
|
-
isStandalone
|
|
24
|
-
}) => {
|
|
25
|
-
if (isProfileDropdown || isIconDropdown) return topSpacing.lg;
|
|
26
|
-
if (isGenericDropdown && isStandalone) return topSpacing.md;
|
|
27
|
-
return topSpacing.sm;
|
|
28
|
-
};
|
|
29
12
|
const StyledLinkSection = /*#__PURE__*/_styled(AppHeaderLinkSections, {
|
|
30
13
|
target: "efmcgmc1",
|
|
31
14
|
label: "StyledLinkSection"
|
|
32
15
|
})(css({
|
|
33
16
|
padding: `0.75rem 0`,
|
|
34
17
|
position: `absolute`
|
|
35
|
-
}), process.env.NODE_ENV === "production" ? "" : "/*# sourceMappingURL=data:application/json;charset=utf-8;base64,
|
|
18
|
+
}), process.env.NODE_ENV === "production" ? "" : "/*# sourceMappingURL=data:application/json;charset=utf-8;base64,eyJ2ZXJzaW9uIjozLCJzb3VyY2VzIjpbIi4uLy4uLy4uLy4uL3NyYy9BcHBIZWFkZXIvQXBwSGVhZGVyRWxlbWVudHMvQXBwSGVhZGVyRHJvcGRvd24vaW5kZXgudHN4Il0sIm5hbWVzIjpbXSwibWFwcGluZ3MiOiJBQWdCMEIiLCJmaWxlIjoiLi4vLi4vLi4vLi4vc3JjL0FwcEhlYWRlci9BcHBIZWFkZXJFbGVtZW50cy9BcHBIZWFkZXJEcm9wZG93bi9pbmRleC50c3giLCJzb3VyY2VzQ29udGVudCI6WyJpbXBvcnQgeyBNZW51IH0gZnJvbSAnQGNvZGVjYWRlbXkvZ2FtdXQnO1xuaW1wb3J0IHsgQ29sb3JNb2RlLCBjc3MgfSBmcm9tICdAY29kZWNhZGVteS9nYW11dC1zdHlsZXMnO1xuaW1wb3J0IHN0eWxlZCBmcm9tICdAZW1vdGlvbi9zdHlsZWQnO1xuaW1wb3J0IHsgdXNlQ2FsbGJhY2ssIHVzZUVmZmVjdCwgdXNlUmVmLCB1c2VTdGF0ZSB9IGZyb20gJ3JlYWN0JztcbmltcG9ydCAqIGFzIFJlYWN0IGZyb20gJ3JlYWN0JztcblxuaW1wb3J0IHtcbiAgQW5pbWF0ZWRTaW1wbGVEcm9wZG93bixcbiAgQXBwSGVhZGVyQWN0aW9uLFxuICBBcHBIZWFkZXJEcm9wZG93bkl0ZW0sXG59IGZyb20gJy4uLy4uL3NoYXJlZCc7XG5pbXBvcnQgeyBBcHBIZWFkZXJMaW5rU2VjdGlvbnMgfSBmcm9tICcuLi9BcHBIZWFkZXJMaW5rU2VjdGlvbnMnO1xuaW1wb3J0IHsgQXBwSGVhZGVyTWVudVByb3ZpZGVyIH0gZnJvbSAnLi4vQXBwSGVhZGVyTWVudVByb3ZpZGVyJztcbmltcG9ydCB7IEFwcEhlYWRlck1lbnVOYXZCdXR0b24gfSBmcm9tICcuLi9BcHBIZWFkZXJOYXZCdXR0b24nO1xuaW1wb3J0IHsgdXNlQXBwSGVhZGVyQ29udGV4dCB9IGZyb20gJy4uL0FwcEhlYWRlclByb3ZpZGVyJztcblxuY29uc3QgU3R5bGVkTGlua1NlY3Rpb24gPSBzdHlsZWQoQXBwSGVhZGVyTGlua1NlY3Rpb25zKShcbiAgY3NzKHtcbiAgICBwYWRkaW5nOiBgMC43NXJlbSAwYCxcbiAgICBwb3NpdGlvbjogYGFic29sdXRlYCxcbiAgfSlcbik7XG5cbmNvbnN0IFN0eWxlZERyb3Bkb3duTWVudSA9IHN0eWxlZChNZW51KShcbiAgY3NzKHtcbiAgICBib3JkZXI6IDEsXG4gICAgYm9yZGVyQ29sb3I6ICdib3JkZXItdGVydGlhcnknLFxuICAgIGJvcmRlclJhZGl1czogJ2xnJyxcbiAgfSlcbik7XG5cbmV4cG9ydCB0eXBlIEFwcEhlYWRlckRyb3Bkb3duUHJvcHMgPSBBcHBIZWFkZXJBY3Rpb24gJlxuICBQaWNrPFJlYWN0LkNvbXBvbmVudFByb3BzPHR5cGVvZiBNZW51PiwgJ3NwYWNpbmcnPiAmIHtcbiAgICBpdGVtOiBBcHBIZWFkZXJEcm9wZG93bkl0ZW07XG4gICAgLyoqXG4gICAgICogSWYgdHJ1ZSwgdGhlIGRyb3Bkb3duIGlzIGJlaW5nIHJlbmRlcmVkIGFzIGEgc3RhbmRhbG9uZSBjb21wb25lbnQsIHJhdGhlciB0aGFuXG4gICAgICogcGFydCBvZiB0aGUgZ2xvYmFsIGhlYWRlci5cbiAgICAgKi9cbiAgICBzdGFuZGFsb25lPzogYm9vbGVhbjtcbiAgfTtcblxuZXhwb3J0IGNvbnN0IEFwcEhlYWRlckRyb3Bkb3duOiBSZWFjdC5GQzxBcHBIZWFkZXJEcm9wZG93blByb3BzPiA9ICh7XG4gIGFjdGlvbixcbiAgaXRlbSxcbiAgc3BhY2luZyA9ICdub3JtYWwnLFxuICBzdGFuZGFsb25lLFxufSkgPT4ge1xuICBjb25zdCBsaXN0UmVmID0gdXNlUmVmPEhUTUxVTGlzdEVsZW1lbnQ+KG51bGwpO1xuICBjb25zdCBidXR0b25SZWYgPSB1c2VSZWY8SFRNTEJ1dHRvbkVsZW1lbnQ+KG51bGwpO1xuXG4gIGNvbnN0IFtpc09wZW4sIHNldElzT3Blbl0gPSB1c2VTdGF0ZShmYWxzZSk7XG4gIGNvbnN0IHsgbGFzdE9wZW5lZERyb3Bkb3duLCBzZXRMYXN0T3BlbmVkRHJvcGRvd24gfSA9IHVzZUFwcEhlYWRlckNvbnRleHQoKTtcblxuICBjb25zdCBkcm9wZG93bklkID0gaXRlbT8udGV4dCA/PyBpdGVtPy50eXBlO1xuXG4gIGNvbnN0IHRvZ2dsZUlzT3BlbiA9ICgpID0+IHNldElzT3BlbigocHJldikgPT4gIXByZXYpO1xuXG4gIGNvbnN0IGhhbmRsZU9uQ2xpY2sgPSAoZXZlbnQ6IFJlYWN0Lk1vdXNlRXZlbnQpID0+IHtcbiAgICB0b2dnbGVJc09wZW4oKTtcbiAgICBpZiAoIWlzT3Blbikge1xuICAgICAgaWYgKGFjdGlvbikgYWN0aW9uKGV2ZW50LCBpdGVtKTtcbiAgICAgIGlmIChzZXRMYXN0T3BlbmVkRHJvcGRvd24pIHtcbiAgICAgICAgc2V0TGFzdE9wZW5lZERyb3Bkb3duKGRyb3Bkb3duSWQpO1xuICAgICAgfVxuICAgIH1cbiAgfTtcblxuICBjb25zdCBoYW5kbGVLZXlib2FyZENsb3NlID0gdXNlQ2FsbGJhY2soKCkgPT4ge1xuICAgIHNldElzT3BlbihmYWxzZSk7XG4gICAgYnV0dG9uUmVmLmN1cnJlbnQ/LmZvY3VzKCk7XG4gIH0sIFtdKTtcblxuICB1c2VFZmZlY3QoKCkgPT4ge1xuICAgIGlmIChsYXN0T3BlbmVkRHJvcGRvd24gIT09IGRyb3Bkb3duSWQgJiYgaXNPcGVuKSB7XG4gICAgICBzZXRJc09wZW4oZmFsc2UpO1xuICAgIH1cbiAgICAvLyBlc2xpbnQtZGlzYWJsZS1uZXh0LWxpbmUgcmVhY3QtaG9va3MvZXhoYXVzdGl2ZS1kZXBzXG4gIH0sIFtsYXN0T3BlbmVkRHJvcGRvd25dKTtcblxuICB1c2VFZmZlY3QoKCkgPT4ge1xuICAgIGZ1bmN0aW9uIGhhbmRsZUNsaWNrT3V0c2lkZShldmVudDogTW91c2VFdmVudCB8IEV2ZW50KSB7XG4gICAgICBjb25zdCBsaXN0ID0gbGlzdFJlZj8uY3VycmVudDtcbiAgICAgIGNvbnN0IGJ1dHRvbiA9IGJ1dHRvblJlZj8uY3VycmVudDtcbiAgICAgIGlmIChcbiAgICAgICAgaXNPcGVuICYmXG4gICAgICAgIGxpc3QgJiZcbiAgICAgICAgIWxpc3QuY29udGFpbnMoZXZlbnQudGFyZ2V0IGFzIE5vZGUpICYmXG4gICAgICAgIGJ1dHRvbiAmJlxuICAgICAgICAhYnV0dG9uLmNvbnRhaW5zKGV2ZW50LnRhcmdldCBhcyBOb2RlKVxuICAgICAgKSB7XG4gICAgICAgIHNldElzT3BlbihmYWxzZSk7XG4gICAgICB9XG4gICAgfVxuXG4gICAgZG9jdW1lbnQuYWRkRXZlbnRMaXN0ZW5lcignbW91c2Vkb3duJywgaGFuZGxlQ2xpY2tPdXRzaWRlKTtcbiAgICBkb2N1bWVudC5hZGRFdmVudExpc3RlbmVyKCdibHVyJywgaGFuZGxlQ2xpY2tPdXRzaWRlKTtcbiAgICByZXR1cm4gKCkgPT4ge1xuICAgICAgZG9jdW1lbnQucmVtb3ZlRXZlbnRMaXN0ZW5lcignbW91c2Vkb3duJywgaGFuZGxlQ2xpY2tPdXRzaWRlKTtcbiAgICAgIGRvY3VtZW50LnJlbW92ZUV2ZW50TGlzdGVuZXIoJ2JsdXInLCBoYW5kbGVDbGlja091dHNpZGUpO1xuICAgIH07XG4gIH0sIFtsaXN0UmVmLCBpc09wZW5dKTtcblxuICBjb25zdCBpc1Byb2ZpbGVEcm9wZG93biA9IGl0ZW0udHlwZSA9PT0gJ3Byb2ZpbGUtZHJvcGRvd24nO1xuICBjb25zdCBpc0dlbmVyaWNEcm9wZG93biA9IFsnZHJvcGRvd24nLCAncmVzb3VyY2VzLXNpbXBsZS1kcm9wZG93biddLmluY2x1ZGVzKFxuICAgIGl0ZW0udHlwZVxuICApO1xuXG4gIHJldHVybiAoXG4gICAgPEFwcEhlYWRlck1lbnVQcm92aWRlciBoYW5kbGVDbG9zZT17aGFuZGxlS2V5Ym9hcmRDbG9zZX0+XG4gICAgICA8QXBwSGVhZGVyTWVudU5hdkJ1dHRvblxuICAgICAgICBidXR0b25SZWY9e2J1dHRvblJlZn1cbiAgICAgICAgaGFuZGxlT25DbGljaz17aGFuZGxlT25DbGlja31cbiAgICAgICAgaXNPcGVuPXtpc09wZW59XG4gICAgICAgIGl0ZW09e2l0ZW19XG4gICAgICAvPlxuICAgICAgPEFuaW1hdGVkU2ltcGxlRHJvcGRvd25cbiAgICAgICAgaXNPcGVuPXtpc09wZW59XG4gICAgICAgIHN0eWxlPXt7XG4gICAgICAgICAgcmlnaHQ6IGlzUHJvZmlsZURyb3Bkb3duID8gJzAuNXJlbScgOiAnJyxcbiAgICAgICAgICB0b3A6IGlzR2VuZXJpY0Ryb3Bkb3duICYmIHN0YW5kYWxvbmUgPyAnMi43NXJlbScgOiAnMy41cmVtJyxcbiAgICAgICAgfX1cbiAgICAgID5cbiAgICAgICAgPENvbG9yTW9kZSBtb2RlPVwibGlnaHRcIj5cbiAgICAgICAgICA8U3R5bGVkRHJvcGRvd25NZW51XG4gICAgICAgICAgICBtaW5XaWR0aD1cIjIwMnB4XCJcbiAgICAgICAgICAgIHJlZj17bGlzdFJlZn1cbiAgICAgICAgICAgIHJvbGU9e2lzUHJvZmlsZURyb3Bkb3duID8gJ21lbnUnIDogdW5kZWZpbmVkfVxuICAgICAgICAgICAgc3BhY2luZz17c3BhY2luZ31cbiAgICAgICAgICAgIHZhcmlhbnQ9XCJwb3BvdmVyXCJcbiAgICAgICAgICAgIHdpZHRoPVwiZml0LWNvbnRlbnRcIlxuICAgICAgICAgICAgekluZGV4PXsxfVxuICAgICAgICAgICAgcHk9e3NwYWNpbmcgPT09ICdub3JtYWwnID8gMTIgOiAwfVxuICAgICAgICAgID5cbiAgICAgICAgICAgIDxTdHlsZWRMaW5rU2VjdGlvbiBhY3Rpb249e2FjdGlvbn0gaXRlbT17aXRlbX0gaXNPcGVuPXtpc09wZW59IC8+XG4gICAgICAgICAgPC9TdHlsZWREcm9wZG93bk1lbnU+XG4gICAgICAgIDwvQ29sb3JNb2RlPlxuICAgICAgPC9BbmltYXRlZFNpbXBsZURyb3Bkb3duPlxuICAgIDwvQXBwSGVhZGVyTWVudVByb3ZpZGVyPlxuICApO1xufTtcbiJdfQ== */");
|
|
36
19
|
const StyledDropdownMenu = /*#__PURE__*/_styled(Menu, {
|
|
37
20
|
target: "efmcgmc0",
|
|
38
21
|
label: "StyledDropdownMenu"
|
|
@@ -40,7 +23,7 @@ const StyledDropdownMenu = /*#__PURE__*/_styled(Menu, {
|
|
|
40
23
|
border: 1,
|
|
41
24
|
borderColor: 'border-tertiary',
|
|
42
25
|
borderRadius: 'lg'
|
|
43
|
-
}), process.env.NODE_ENV === "production" ? "" : "/*# sourceMappingURL=data:application/json;charset=utf-8;base64,
|
|
26
|
+
}), process.env.NODE_ENV === "production" ? "" : "/*# sourceMappingURL=data:application/json;charset=utf-8;base64,eyJ2ZXJzaW9uIjozLCJzb3VyY2VzIjpbIi4uLy4uLy4uLy4uL3NyYy9BcHBIZWFkZXIvQXBwSGVhZGVyRWxlbWVudHMvQXBwSGVhZGVyRHJvcGRvd24vaW5kZXgudHN4Il0sIm5hbWVzIjpbXSwibWFwcGluZ3MiOiJBQXVCMkIiLCJmaWxlIjoiLi4vLi4vLi4vLi4vc3JjL0FwcEhlYWRlci9BcHBIZWFkZXJFbGVtZW50cy9BcHBIZWFkZXJEcm9wZG93bi9pbmRleC50c3giLCJzb3VyY2VzQ29udGVudCI6WyJpbXBvcnQgeyBNZW51IH0gZnJvbSAnQGNvZGVjYWRlbXkvZ2FtdXQnO1xuaW1wb3J0IHsgQ29sb3JNb2RlLCBjc3MgfSBmcm9tICdAY29kZWNhZGVteS9nYW11dC1zdHlsZXMnO1xuaW1wb3J0IHN0eWxlZCBmcm9tICdAZW1vdGlvbi9zdHlsZWQnO1xuaW1wb3J0IHsgdXNlQ2FsbGJhY2ssIHVzZUVmZmVjdCwgdXNlUmVmLCB1c2VTdGF0ZSB9IGZyb20gJ3JlYWN0JztcbmltcG9ydCAqIGFzIFJlYWN0IGZyb20gJ3JlYWN0JztcblxuaW1wb3J0IHtcbiAgQW5pbWF0ZWRTaW1wbGVEcm9wZG93bixcbiAgQXBwSGVhZGVyQWN0aW9uLFxuICBBcHBIZWFkZXJEcm9wZG93bkl0ZW0sXG59IGZyb20gJy4uLy4uL3NoYXJlZCc7XG5pbXBvcnQgeyBBcHBIZWFkZXJMaW5rU2VjdGlvbnMgfSBmcm9tICcuLi9BcHBIZWFkZXJMaW5rU2VjdGlvbnMnO1xuaW1wb3J0IHsgQXBwSGVhZGVyTWVudVByb3ZpZGVyIH0gZnJvbSAnLi4vQXBwSGVhZGVyTWVudVByb3ZpZGVyJztcbmltcG9ydCB7IEFwcEhlYWRlck1lbnVOYXZCdXR0b24gfSBmcm9tICcuLi9BcHBIZWFkZXJOYXZCdXR0b24nO1xuaW1wb3J0IHsgdXNlQXBwSGVhZGVyQ29udGV4dCB9IGZyb20gJy4uL0FwcEhlYWRlclByb3ZpZGVyJztcblxuY29uc3QgU3R5bGVkTGlua1NlY3Rpb24gPSBzdHlsZWQoQXBwSGVhZGVyTGlua1NlY3Rpb25zKShcbiAgY3NzKHtcbiAgICBwYWRkaW5nOiBgMC43NXJlbSAwYCxcbiAgICBwb3NpdGlvbjogYGFic29sdXRlYCxcbiAgfSlcbik7XG5cbmNvbnN0IFN0eWxlZERyb3Bkb3duTWVudSA9IHN0eWxlZChNZW51KShcbiAgY3NzKHtcbiAgICBib3JkZXI6IDEsXG4gICAgYm9yZGVyQ29sb3I6ICdib3JkZXItdGVydGlhcnknLFxuICAgIGJvcmRlclJhZGl1czogJ2xnJyxcbiAgfSlcbik7XG5cbmV4cG9ydCB0eXBlIEFwcEhlYWRlckRyb3Bkb3duUHJvcHMgPSBBcHBIZWFkZXJBY3Rpb24gJlxuICBQaWNrPFJlYWN0LkNvbXBvbmVudFByb3BzPHR5cGVvZiBNZW51PiwgJ3NwYWNpbmcnPiAmIHtcbiAgICBpdGVtOiBBcHBIZWFkZXJEcm9wZG93bkl0ZW07XG4gICAgLyoqXG4gICAgICogSWYgdHJ1ZSwgdGhlIGRyb3Bkb3duIGlzIGJlaW5nIHJlbmRlcmVkIGFzIGEgc3RhbmRhbG9uZSBjb21wb25lbnQsIHJhdGhlciB0aGFuXG4gICAgICogcGFydCBvZiB0aGUgZ2xvYmFsIGhlYWRlci5cbiAgICAgKi9cbiAgICBzdGFuZGFsb25lPzogYm9vbGVhbjtcbiAgfTtcblxuZXhwb3J0IGNvbnN0IEFwcEhlYWRlckRyb3Bkb3duOiBSZWFjdC5GQzxBcHBIZWFkZXJEcm9wZG93blByb3BzPiA9ICh7XG4gIGFjdGlvbixcbiAgaXRlbSxcbiAgc3BhY2luZyA9ICdub3JtYWwnLFxuICBzdGFuZGFsb25lLFxufSkgPT4ge1xuICBjb25zdCBsaXN0UmVmID0gdXNlUmVmPEhUTUxVTGlzdEVsZW1lbnQ+KG51bGwpO1xuICBjb25zdCBidXR0b25SZWYgPSB1c2VSZWY8SFRNTEJ1dHRvbkVsZW1lbnQ+KG51bGwpO1xuXG4gIGNvbnN0IFtpc09wZW4sIHNldElzT3Blbl0gPSB1c2VTdGF0ZShmYWxzZSk7XG4gIGNvbnN0IHsgbGFzdE9wZW5lZERyb3Bkb3duLCBzZXRMYXN0T3BlbmVkRHJvcGRvd24gfSA9IHVzZUFwcEhlYWRlckNvbnRleHQoKTtcblxuICBjb25zdCBkcm9wZG93bklkID0gaXRlbT8udGV4dCA/PyBpdGVtPy50eXBlO1xuXG4gIGNvbnN0IHRvZ2dsZUlzT3BlbiA9ICgpID0+IHNldElzT3BlbigocHJldikgPT4gIXByZXYpO1xuXG4gIGNvbnN0IGhhbmRsZU9uQ2xpY2sgPSAoZXZlbnQ6IFJlYWN0Lk1vdXNlRXZlbnQpID0+IHtcbiAgICB0b2dnbGVJc09wZW4oKTtcbiAgICBpZiAoIWlzT3Blbikge1xuICAgICAgaWYgKGFjdGlvbikgYWN0aW9uKGV2ZW50LCBpdGVtKTtcbiAgICAgIGlmIChzZXRMYXN0T3BlbmVkRHJvcGRvd24pIHtcbiAgICAgICAgc2V0TGFzdE9wZW5lZERyb3Bkb3duKGRyb3Bkb3duSWQpO1xuICAgICAgfVxuICAgIH1cbiAgfTtcblxuICBjb25zdCBoYW5kbGVLZXlib2FyZENsb3NlID0gdXNlQ2FsbGJhY2soKCkgPT4ge1xuICAgIHNldElzT3BlbihmYWxzZSk7XG4gICAgYnV0dG9uUmVmLmN1cnJlbnQ/LmZvY3VzKCk7XG4gIH0sIFtdKTtcblxuICB1c2VFZmZlY3QoKCkgPT4ge1xuICAgIGlmIChsYXN0T3BlbmVkRHJvcGRvd24gIT09IGRyb3Bkb3duSWQgJiYgaXNPcGVuKSB7XG4gICAgICBzZXRJc09wZW4oZmFsc2UpO1xuICAgIH1cbiAgICAvLyBlc2xpbnQtZGlzYWJsZS1uZXh0LWxpbmUgcmVhY3QtaG9va3MvZXhoYXVzdGl2ZS1kZXBzXG4gIH0sIFtsYXN0T3BlbmVkRHJvcGRvd25dKTtcblxuICB1c2VFZmZlY3QoKCkgPT4ge1xuICAgIGZ1bmN0aW9uIGhhbmRsZUNsaWNrT3V0c2lkZShldmVudDogTW91c2VFdmVudCB8IEV2ZW50KSB7XG4gICAgICBjb25zdCBsaXN0ID0gbGlzdFJlZj8uY3VycmVudDtcbiAgICAgIGNvbnN0IGJ1dHRvbiA9IGJ1dHRvblJlZj8uY3VycmVudDtcbiAgICAgIGlmIChcbiAgICAgICAgaXNPcGVuICYmXG4gICAgICAgIGxpc3QgJiZcbiAgICAgICAgIWxpc3QuY29udGFpbnMoZXZlbnQudGFyZ2V0IGFzIE5vZGUpICYmXG4gICAgICAgIGJ1dHRvbiAmJlxuICAgICAgICAhYnV0dG9uLmNvbnRhaW5zKGV2ZW50LnRhcmdldCBhcyBOb2RlKVxuICAgICAgKSB7XG4gICAgICAgIHNldElzT3BlbihmYWxzZSk7XG4gICAgICB9XG4gICAgfVxuXG4gICAgZG9jdW1lbnQuYWRkRXZlbnRMaXN0ZW5lcignbW91c2Vkb3duJywgaGFuZGxlQ2xpY2tPdXRzaWRlKTtcbiAgICBkb2N1bWVudC5hZGRFdmVudExpc3RlbmVyKCdibHVyJywgaGFuZGxlQ2xpY2tPdXRzaWRlKTtcbiAgICByZXR1cm4gKCkgPT4ge1xuICAgICAgZG9jdW1lbnQucmVtb3ZlRXZlbnRMaXN0ZW5lcignbW91c2Vkb3duJywgaGFuZGxlQ2xpY2tPdXRzaWRlKTtcbiAgICAgIGRvY3VtZW50LnJlbW92ZUV2ZW50TGlzdGVuZXIoJ2JsdXInLCBoYW5kbGVDbGlja091dHNpZGUpO1xuICAgIH07XG4gIH0sIFtsaXN0UmVmLCBpc09wZW5dKTtcblxuICBjb25zdCBpc1Byb2ZpbGVEcm9wZG93biA9IGl0ZW0udHlwZSA9PT0gJ3Byb2ZpbGUtZHJvcGRvd24nO1xuICBjb25zdCBpc0dlbmVyaWNEcm9wZG93biA9IFsnZHJvcGRvd24nLCAncmVzb3VyY2VzLXNpbXBsZS1kcm9wZG93biddLmluY2x1ZGVzKFxuICAgIGl0ZW0udHlwZVxuICApO1xuXG4gIHJldHVybiAoXG4gICAgPEFwcEhlYWRlck1lbnVQcm92aWRlciBoYW5kbGVDbG9zZT17aGFuZGxlS2V5Ym9hcmRDbG9zZX0+XG4gICAgICA8QXBwSGVhZGVyTWVudU5hdkJ1dHRvblxuICAgICAgICBidXR0b25SZWY9e2J1dHRvblJlZn1cbiAgICAgICAgaGFuZGxlT25DbGljaz17aGFuZGxlT25DbGlja31cbiAgICAgICAgaXNPcGVuPXtpc09wZW59XG4gICAgICAgIGl0ZW09e2l0ZW19XG4gICAgICAvPlxuICAgICAgPEFuaW1hdGVkU2ltcGxlRHJvcGRvd25cbiAgICAgICAgaXNPcGVuPXtpc09wZW59XG4gICAgICAgIHN0eWxlPXt7XG4gICAgICAgICAgcmlnaHQ6IGlzUHJvZmlsZURyb3Bkb3duID8gJzAuNXJlbScgOiAnJyxcbiAgICAgICAgICB0b3A6IGlzR2VuZXJpY0Ryb3Bkb3duICYmIHN0YW5kYWxvbmUgPyAnMi43NXJlbScgOiAnMy41cmVtJyxcbiAgICAgICAgfX1cbiAgICAgID5cbiAgICAgICAgPENvbG9yTW9kZSBtb2RlPVwibGlnaHRcIj5cbiAgICAgICAgICA8U3R5bGVkRHJvcGRvd25NZW51XG4gICAgICAgICAgICBtaW5XaWR0aD1cIjIwMnB4XCJcbiAgICAgICAgICAgIHJlZj17bGlzdFJlZn1cbiAgICAgICAgICAgIHJvbGU9e2lzUHJvZmlsZURyb3Bkb3duID8gJ21lbnUnIDogdW5kZWZpbmVkfVxuICAgICAgICAgICAgc3BhY2luZz17c3BhY2luZ31cbiAgICAgICAgICAgIHZhcmlhbnQ9XCJwb3BvdmVyXCJcbiAgICAgICAgICAgIHdpZHRoPVwiZml0LWNvbnRlbnRcIlxuICAgICAgICAgICAgekluZGV4PXsxfVxuICAgICAgICAgICAgcHk9e3NwYWNpbmcgPT09ICdub3JtYWwnID8gMTIgOiAwfVxuICAgICAgICAgID5cbiAgICAgICAgICAgIDxTdHlsZWRMaW5rU2VjdGlvbiBhY3Rpb249e2FjdGlvbn0gaXRlbT17aXRlbX0gaXNPcGVuPXtpc09wZW59IC8+XG4gICAgICAgICAgPC9TdHlsZWREcm9wZG93bk1lbnU+XG4gICAgICAgIDwvQ29sb3JNb2RlPlxuICAgICAgPC9BbmltYXRlZFNpbXBsZURyb3Bkb3duPlxuICAgIDwvQXBwSGVhZGVyTWVudVByb3ZpZGVyPlxuICApO1xufTtcbiJdfQ== */");
|
|
44
27
|
export const AppHeaderDropdown = ({
|
|
45
28
|
action,
|
|
46
29
|
item,
|
|
@@ -49,16 +32,11 @@ export const AppHeaderDropdown = ({
|
|
|
49
32
|
}) => {
|
|
50
33
|
const listRef = useRef(null);
|
|
51
34
|
const buttonRef = useRef(null);
|
|
52
|
-
const [dimensions, setDimensions] = useState({
|
|
53
|
-
height: 0,
|
|
54
|
-
width: 0
|
|
55
|
-
});
|
|
56
35
|
const [isOpen, setIsOpen] = useState(false);
|
|
57
36
|
const {
|
|
58
37
|
lastOpenedDropdown,
|
|
59
38
|
setLastOpenedDropdown
|
|
60
39
|
} = useAppHeaderContext();
|
|
61
|
-
const tabIndex = isOpen === false ? -1 : 0;
|
|
62
40
|
const dropdownId = item?.text ?? item?.type;
|
|
63
41
|
const toggleIsOpen = () => setIsOpen(prev => !prev);
|
|
64
42
|
const handleOnClick = event => {
|
|
@@ -80,18 +58,6 @@ export const AppHeaderDropdown = ({
|
|
|
80
58
|
}
|
|
81
59
|
// eslint-disable-next-line react-hooks/exhaustive-deps
|
|
82
60
|
}, [lastOpenedDropdown]);
|
|
83
|
-
useIsomorphicLayoutEffect(() => {
|
|
84
|
-
if (listRef.current) {
|
|
85
|
-
const {
|
|
86
|
-
height,
|
|
87
|
-
width
|
|
88
|
-
} = listRef.current.getBoundingClientRect();
|
|
89
|
-
setDimensions({
|
|
90
|
-
height,
|
|
91
|
-
width
|
|
92
|
-
});
|
|
93
|
-
}
|
|
94
|
-
}, [listRef, isOpen]);
|
|
95
61
|
useEffect(() => {
|
|
96
62
|
function handleClickOutside(event) {
|
|
97
63
|
const list = listRef?.current;
|
|
@@ -109,38 +75,19 @@ export const AppHeaderDropdown = ({
|
|
|
109
75
|
}, [listRef, isOpen]);
|
|
110
76
|
const isProfileDropdown = item.type === 'profile-dropdown';
|
|
111
77
|
const isGenericDropdown = ['dropdown', 'resources-simple-dropdown'].includes(item.type);
|
|
112
|
-
|
|
113
|
-
const Provider = isProfileDropdown ? AppHeaderMenuProvider : AppHeaderDropdownProvider;
|
|
114
|
-
const topSpacing = useMemo(() => getSpacing({
|
|
115
|
-
isProfileDropdown,
|
|
116
|
-
isGenericDropdown,
|
|
117
|
-
isIconDropdown,
|
|
118
|
-
isStandalone: standalone
|
|
119
|
-
}), [isProfileDropdown, isGenericDropdown, isIconDropdown, standalone]);
|
|
120
|
-
return /*#__PURE__*/_jsxs(Provider, {
|
|
78
|
+
return /*#__PURE__*/_jsxs(AppHeaderMenuProvider, {
|
|
121
79
|
handleClose: handleKeyboardClose,
|
|
122
|
-
children: [/*#__PURE__*/_jsx(
|
|
80
|
+
children: [/*#__PURE__*/_jsx(AppHeaderMenuNavButton, {
|
|
123
81
|
buttonRef: buttonRef,
|
|
124
82
|
handleOnClick: handleOnClick,
|
|
125
83
|
isOpen: isOpen,
|
|
126
84
|
item: item
|
|
127
85
|
}), /*#__PURE__*/_jsx(AnimatedSimpleDropdown, {
|
|
86
|
+
isOpen: isOpen,
|
|
128
87
|
style: {
|
|
129
88
|
right: isProfileDropdown ? '0.5rem' : '',
|
|
130
|
-
top:
|
|
131
|
-
width: dimensions.width
|
|
132
|
-
},
|
|
133
|
-
animate: {
|
|
134
|
-
height: isOpen ? dimensions.height : 0
|
|
135
|
-
},
|
|
136
|
-
initial: {
|
|
137
|
-
borderWidth: 0,
|
|
138
|
-
height: 0
|
|
139
|
-
},
|
|
140
|
-
transition: {
|
|
141
|
-
duration: 0.175
|
|
89
|
+
top: isGenericDropdown && standalone ? '2.75rem' : '3.5rem'
|
|
142
90
|
},
|
|
143
|
-
"aria-hidden": !isOpen,
|
|
144
91
|
children: /*#__PURE__*/_jsx(ColorMode, {
|
|
145
92
|
mode: "light",
|
|
146
93
|
children: /*#__PURE__*/_jsx(StyledDropdownMenu, {
|
|
@@ -153,13 +100,9 @@ export const AppHeaderDropdown = ({
|
|
|
153
100
|
zIndex: 1,
|
|
154
101
|
py: spacing === 'normal' ? 12 : 0,
|
|
155
102
|
children: /*#__PURE__*/_jsx(StyledLinkSection, {
|
|
156
|
-
id: `menu-container${item.text}`,
|
|
157
|
-
"aria-controls": `menu-container${item.text}`,
|
|
158
|
-
"aria-label": item.text,
|
|
159
|
-
"aria-hidden": !isOpen,
|
|
160
|
-
tabIndex: tabIndex,
|
|
161
103
|
action: action,
|
|
162
|
-
item: item
|
|
104
|
+
item: item,
|
|
105
|
+
isOpen: isOpen
|
|
163
106
|
})
|
|
164
107
|
})
|
|
165
108
|
})
|
|
@@ -1,9 +1,9 @@
|
|
|
1
1
|
export declare const StyledAppHeaderLink: import("@emotion/styled").StyledComponent<(((Omit<Omit<Partial<import("@codecademy/gamut/dist/helpers").AppendedIconProps> & {
|
|
2
2
|
theme?: import("@emotion/react").Theme | undefined;
|
|
3
3
|
as?: import("react").ElementType<any, keyof import("react").JSX.IntrinsicElements> | undefined;
|
|
4
|
-
} & import("@codecademy/gamut").AnchorProps & Pick<import("react").DetailedHTMLProps<import("react").AnchorHTMLAttributes<HTMLAnchorElement>, HTMLAnchorElement>, "content" | "translate" | "property" | "hidden" | "slot" | "style" | "title" | "suppressHydrationWarning" | "className" | "id" | "lang" | "media" | "target" | "type" | "role" | "tabIndex" | "href" | "aria-activedescendant" | "aria-atomic" | "aria-autocomplete" | "aria-braillelabel" | "aria-brailleroledescription" | "aria-busy" | "aria-checked" | "aria-colcount" | "aria-colindex" | "aria-colindextext" | "aria-colspan" | "aria-controls" | "aria-current" | "aria-describedby" | "aria-description" | "aria-details" | "aria-disabled" | "aria-dropeffect" | "aria-errormessage" | "aria-expanded" | "aria-flowto" | "aria-grabbed" | "aria-haspopup" | "aria-hidden" | "aria-invalid" | "aria-keyshortcuts" | "aria-label" | "aria-labelledby" | "aria-level" | "aria-live" | "aria-modal" | "aria-multiline" | "aria-multiselectable" | "aria-orientation" | "aria-owns" | "aria-placeholder" | "aria-posinset" | "aria-pressed" | "aria-readonly" | "aria-relevant" | "aria-required" | "aria-roledescription" | "aria-rowcount" | "aria-rowindex" | "aria-rowindextext" | "aria-rowspan" | "aria-selected" | "aria-setsize" | "aria-sort" | "aria-valuemax" | "aria-valuemin" | "aria-valuenow" | "aria-valuetext" | "children" | "dangerouslySetInnerHTML" | "onCopy" | "onCopyCapture" | "onCut" | "onCutCapture" | "onPaste" | "onPasteCapture" | "onCompositionEnd" | "onCompositionEndCapture" | "onCompositionStart" | "onCompositionStartCapture" | "onCompositionUpdate" | "onCompositionUpdateCapture" | "onFocus" | "onFocusCapture" | "onBlur" | "onBlurCapture" | "onChange" | "onChangeCapture" | "onBeforeInput" | "onBeforeInputCapture" | "onInput" | "onInputCapture" | "onReset" | "onResetCapture" | "onSubmit" | "onSubmitCapture" | "onInvalid" | "onInvalidCapture" | "onLoad" | "onLoadCapture" | "onError" | "onErrorCapture" | "onKeyDown" | "onKeyDownCapture" | "onKeyPress" | "onKeyPressCapture" | "onKeyUp" | "onKeyUpCapture" | "onAbort" | "onAbortCapture" | "onCanPlay" | "onCanPlayCapture" | "onCanPlayThrough" | "onCanPlayThroughCapture" | "onDurationChange" | "onDurationChangeCapture" | "onEmptied" | "onEmptiedCapture" | "onEncrypted" | "onEncryptedCapture" | "onEnded" | "onEndedCapture" | "onLoadedData" | "onLoadedDataCapture" | "onLoadedMetadata" | "onLoadedMetadataCapture" | "onLoadStart" | "onLoadStartCapture" | "onPause" | "onPauseCapture" | "onPlay" | "onPlayCapture" | "onPlaying" | "onPlayingCapture" | "onProgress" | "onProgressCapture" | "onRateChange" | "onRateChangeCapture" | "onResize" | "onResizeCapture" | "onSeeked" | "onSeekedCapture" | "onSeeking" | "onSeekingCapture" | "onStalled" | "onStalledCapture" | "onSuspend" | "onSuspendCapture" | "onTimeUpdate" | "onTimeUpdateCapture" | "onVolumeChange" | "onVolumeChangeCapture" | "onWaiting" | "onWaitingCapture" | "onAuxClick" | "onAuxClickCapture" | "onClick" | "onClickCapture" | "onContextMenu" | "onContextMenuCapture" | "onDoubleClick" | "onDoubleClickCapture" | "onDrag" | "onDragCapture" | "onDragEnd" | "onDragEndCapture" | "onDragEnter" | "onDragEnterCapture" | "onDragExit" | "onDragExitCapture" | "onDragLeave" | "onDragLeaveCapture" | "onDragOver" | "onDragOverCapture" | "onDragStart" | "onDragStartCapture" | "onDrop" | "onDropCapture" | "onMouseDown" | "onMouseDownCapture" | "onMouseEnter" | "onMouseLeave" | "onMouseMove" | "onMouseMoveCapture" | "onMouseOut" | "onMouseOutCapture" | "onMouseOver" | "onMouseOverCapture" | "onMouseUp" | "onMouseUpCapture" | "onSelect" | "onSelectCapture" | "onTouchCancel" | "onTouchCancelCapture" | "onTouchEnd" | "onTouchEndCapture" | "onTouchMove" | "onTouchMoveCapture" | "onTouchStart" | "onTouchStartCapture" | "onPointerDown" | "onPointerDownCapture" | "onPointerMove" | "onPointerMoveCapture" | "onPointerUp" | "onPointerUpCapture" | "onPointerCancel" | "onPointerCancelCapture" | "onPointerEnter" | "onPointerLeave" | "onPointerOver" | "onPointerOverCapture" | "onPointerOut" | "onPointerOutCapture" | "onGotPointerCapture" | "onGotPointerCaptureCapture" | "onLostPointerCapture" | "onLostPointerCaptureCapture" | "onScroll" | "onScrollCapture" | "onWheel" | "onWheelCapture" | "onAnimationStart" | "onAnimationStartCapture" | "onAnimationEnd" | "onAnimationEndCapture" | "onAnimationIteration" | "onAnimationIterationCapture" | "onTransitionEnd" | "onTransitionEndCapture" | "defaultChecked" | "defaultValue" | "suppressContentEditableWarning" | "accessKey" | "autoFocus" | "contentEditable" | "contextMenu" | "dir" | "draggable" | "nonce" | "spellCheck" | "radioGroup" | "about" | "datatype" | "inlist" | "prefix" | "rel" | "resource" | "rev" | "typeof" | "vocab" | "autoCapitalize" | "autoCorrect" | "autoSave" | "itemProp" | "itemScope" | "itemType" | "itemID" | "itemRef" | "results" | "security" | "unselectable" | "inputMode" | "is" | keyof import("react").ClassAttributes<HTMLAnchorElement> | "download" | "hrefLang" | "ping" | "referrerPolicy">, "ref"> & import("react").RefAttributes<HTMLAnchorElement | HTMLButtonElement> & import("
|
|
4
|
+
} & import("@codecademy/gamut").AnchorProps & Pick<import("react").DetailedHTMLProps<import("react").AnchorHTMLAttributes<HTMLAnchorElement>, HTMLAnchorElement>, "content" | "translate" | "property" | "hidden" | "slot" | "style" | "title" | "suppressHydrationWarning" | "className" | "id" | "lang" | "media" | "target" | "type" | "role" | "tabIndex" | "href" | "aria-activedescendant" | "aria-atomic" | "aria-autocomplete" | "aria-braillelabel" | "aria-brailleroledescription" | "aria-busy" | "aria-checked" | "aria-colcount" | "aria-colindex" | "aria-colindextext" | "aria-colspan" | "aria-controls" | "aria-current" | "aria-describedby" | "aria-description" | "aria-details" | "aria-disabled" | "aria-dropeffect" | "aria-errormessage" | "aria-expanded" | "aria-flowto" | "aria-grabbed" | "aria-haspopup" | "aria-hidden" | "aria-invalid" | "aria-keyshortcuts" | "aria-label" | "aria-labelledby" | "aria-level" | "aria-live" | "aria-modal" | "aria-multiline" | "aria-multiselectable" | "aria-orientation" | "aria-owns" | "aria-placeholder" | "aria-posinset" | "aria-pressed" | "aria-readonly" | "aria-relevant" | "aria-required" | "aria-roledescription" | "aria-rowcount" | "aria-rowindex" | "aria-rowindextext" | "aria-rowspan" | "aria-selected" | "aria-setsize" | "aria-sort" | "aria-valuemax" | "aria-valuemin" | "aria-valuenow" | "aria-valuetext" | "children" | "dangerouslySetInnerHTML" | "onCopy" | "onCopyCapture" | "onCut" | "onCutCapture" | "onPaste" | "onPasteCapture" | "onCompositionEnd" | "onCompositionEndCapture" | "onCompositionStart" | "onCompositionStartCapture" | "onCompositionUpdate" | "onCompositionUpdateCapture" | "onFocus" | "onFocusCapture" | "onBlur" | "onBlurCapture" | "onChange" | "onChangeCapture" | "onBeforeInput" | "onBeforeInputCapture" | "onInput" | "onInputCapture" | "onReset" | "onResetCapture" | "onSubmit" | "onSubmitCapture" | "onInvalid" | "onInvalidCapture" | "onLoad" | "onLoadCapture" | "onError" | "onErrorCapture" | "onKeyDown" | "onKeyDownCapture" | "onKeyPress" | "onKeyPressCapture" | "onKeyUp" | "onKeyUpCapture" | "onAbort" | "onAbortCapture" | "onCanPlay" | "onCanPlayCapture" | "onCanPlayThrough" | "onCanPlayThroughCapture" | "onDurationChange" | "onDurationChangeCapture" | "onEmptied" | "onEmptiedCapture" | "onEncrypted" | "onEncryptedCapture" | "onEnded" | "onEndedCapture" | "onLoadedData" | "onLoadedDataCapture" | "onLoadedMetadata" | "onLoadedMetadataCapture" | "onLoadStart" | "onLoadStartCapture" | "onPause" | "onPauseCapture" | "onPlay" | "onPlayCapture" | "onPlaying" | "onPlayingCapture" | "onProgress" | "onProgressCapture" | "onRateChange" | "onRateChangeCapture" | "onResize" | "onResizeCapture" | "onSeeked" | "onSeekedCapture" | "onSeeking" | "onSeekingCapture" | "onStalled" | "onStalledCapture" | "onSuspend" | "onSuspendCapture" | "onTimeUpdate" | "onTimeUpdateCapture" | "onVolumeChange" | "onVolumeChangeCapture" | "onWaiting" | "onWaitingCapture" | "onAuxClick" | "onAuxClickCapture" | "onClick" | "onClickCapture" | "onContextMenu" | "onContextMenuCapture" | "onDoubleClick" | "onDoubleClickCapture" | "onDrag" | "onDragCapture" | "onDragEnd" | "onDragEndCapture" | "onDragEnter" | "onDragEnterCapture" | "onDragExit" | "onDragExitCapture" | "onDragLeave" | "onDragLeaveCapture" | "onDragOver" | "onDragOverCapture" | "onDragStart" | "onDragStartCapture" | "onDrop" | "onDropCapture" | "onMouseDown" | "onMouseDownCapture" | "onMouseEnter" | "onMouseLeave" | "onMouseMove" | "onMouseMoveCapture" | "onMouseOut" | "onMouseOutCapture" | "onMouseOver" | "onMouseOverCapture" | "onMouseUp" | "onMouseUpCapture" | "onSelect" | "onSelectCapture" | "onTouchCancel" | "onTouchCancelCapture" | "onTouchEnd" | "onTouchEndCapture" | "onTouchMove" | "onTouchMoveCapture" | "onTouchStart" | "onTouchStartCapture" | "onPointerDown" | "onPointerDownCapture" | "onPointerMove" | "onPointerMoveCapture" | "onPointerUp" | "onPointerUpCapture" | "onPointerCancel" | "onPointerCancelCapture" | "onPointerEnter" | "onPointerLeave" | "onPointerOver" | "onPointerOverCapture" | "onPointerOut" | "onPointerOutCapture" | "onGotPointerCapture" | "onGotPointerCaptureCapture" | "onLostPointerCapture" | "onLostPointerCaptureCapture" | "onScroll" | "onScrollCapture" | "onWheel" | "onWheelCapture" | "onAnimationStart" | "onAnimationStartCapture" | "onAnimationEnd" | "onAnimationEndCapture" | "onAnimationIteration" | "onAnimationIterationCapture" | "onTransitionEnd" | "onTransitionEndCapture" | "defaultChecked" | "defaultValue" | "suppressContentEditableWarning" | "accessKey" | "autoFocus" | "contentEditable" | "contextMenu" | "dir" | "draggable" | "nonce" | "spellCheck" | "radioGroup" | "about" | "datatype" | "inlist" | "prefix" | "rel" | "resource" | "rev" | "typeof" | "vocab" | "autoCapitalize" | "autoCorrect" | "autoSave" | "itemProp" | "itemScope" | "itemType" | "itemID" | "itemRef" | "results" | "security" | "unselectable" | "inputMode" | "is" | keyof import("react").ClassAttributes<HTMLAnchorElement> | "download" | "hrefLang" | "ping" | "referrerPolicy">, "ref"> & import("react").RefAttributes<HTMLAnchorElement | HTMLButtonElement> & import("../../shared").AppHeaderAction & {
|
|
5
5
|
isInDropdown?: boolean;
|
|
6
|
-
item: import("
|
|
6
|
+
item: import("../../shared").AppHeaderLinkItem;
|
|
7
7
|
mobile?: boolean;
|
|
8
8
|
onKeyDown?: (event: React.KeyboardEvent) => void;
|
|
9
9
|
role?: React.AriaRole;
|
|
@@ -15,9 +15,9 @@ export declare const StyledAppHeaderLink: import("@emotion/styled").StyledCompon
|
|
|
15
15
|
as?: import("react").ElementType<any, keyof import("react").JSX.IntrinsicElements> | undefined;
|
|
16
16
|
} & {
|
|
17
17
|
theme?: import("@emotion/react").Theme | undefined;
|
|
18
|
-
} & Pick<import("react").DetailedHTMLProps<import("react").ButtonHTMLAttributes<HTMLButtonElement>, HTMLButtonElement>, "disabled" | "content" | "translate" | "property" | "hidden" | "form" | "slot" | "style" | "title" | "suppressHydrationWarning" | "className" | "id" | "lang" | "name" | "type" | "role" | "tabIndex" | "aria-activedescendant" | "aria-atomic" | "aria-autocomplete" | "aria-braillelabel" | "aria-brailleroledescription" | "aria-busy" | "aria-checked" | "aria-colcount" | "aria-colindex" | "aria-colindextext" | "aria-colspan" | "aria-controls" | "aria-current" | "aria-describedby" | "aria-description" | "aria-details" | "aria-disabled" | "aria-dropeffect" | "aria-errormessage" | "aria-expanded" | "aria-flowto" | "aria-grabbed" | "aria-haspopup" | "aria-hidden" | "aria-invalid" | "aria-keyshortcuts" | "aria-label" | "aria-labelledby" | "aria-level" | "aria-live" | "aria-modal" | "aria-multiline" | "aria-multiselectable" | "aria-orientation" | "aria-owns" | "aria-placeholder" | "aria-posinset" | "aria-pressed" | "aria-readonly" | "aria-relevant" | "aria-required" | "aria-roledescription" | "aria-rowcount" | "aria-rowindex" | "aria-rowindextext" | "aria-rowspan" | "aria-selected" | "aria-setsize" | "aria-sort" | "aria-valuemax" | "aria-valuemin" | "aria-valuenow" | "aria-valuetext" | "children" | "dangerouslySetInnerHTML" | "onCopy" | "onCopyCapture" | "onCut" | "onCutCapture" | "onPaste" | "onPasteCapture" | "onCompositionEnd" | "onCompositionEndCapture" | "onCompositionStart" | "onCompositionStartCapture" | "onCompositionUpdate" | "onCompositionUpdateCapture" | "onFocus" | "onFocusCapture" | "onBlur" | "onBlurCapture" | "onChange" | "onChangeCapture" | "onBeforeInput" | "onBeforeInputCapture" | "onInput" | "onInputCapture" | "onReset" | "onResetCapture" | "onSubmit" | "onSubmitCapture" | "onInvalid" | "onInvalidCapture" | "onLoad" | "onLoadCapture" | "onError" | "onErrorCapture" | "onKeyDown" | "onKeyDownCapture" | "onKeyPress" | "onKeyPressCapture" | "onKeyUp" | "onKeyUpCapture" | "onAbort" | "onAbortCapture" | "onCanPlay" | "onCanPlayCapture" | "onCanPlayThrough" | "onCanPlayThroughCapture" | "onDurationChange" | "onDurationChangeCapture" | "onEmptied" | "onEmptiedCapture" | "onEncrypted" | "onEncryptedCapture" | "onEnded" | "onEndedCapture" | "onLoadedData" | "onLoadedDataCapture" | "onLoadedMetadata" | "onLoadedMetadataCapture" | "onLoadStart" | "onLoadStartCapture" | "onPause" | "onPauseCapture" | "onPlay" | "onPlayCapture" | "onPlaying" | "onPlayingCapture" | "onProgress" | "onProgressCapture" | "onRateChange" | "onRateChangeCapture" | "onResize" | "onResizeCapture" | "onSeeked" | "onSeekedCapture" | "onSeeking" | "onSeekingCapture" | "onStalled" | "onStalledCapture" | "onSuspend" | "onSuspendCapture" | "onTimeUpdate" | "onTimeUpdateCapture" | "onVolumeChange" | "onVolumeChangeCapture" | "onWaiting" | "onWaitingCapture" | "onAuxClick" | "onAuxClickCapture" | "onClick" | "onClickCapture" | "onContextMenu" | "onContextMenuCapture" | "onDoubleClick" | "onDoubleClickCapture" | "onDrag" | "onDragCapture" | "onDragEnd" | "onDragEndCapture" | "onDragEnter" | "onDragEnterCapture" | "onDragExit" | "onDragExitCapture" | "onDragLeave" | "onDragLeaveCapture" | "onDragOver" | "onDragOverCapture" | "onDragStart" | "onDragStartCapture" | "onDrop" | "onDropCapture" | "onMouseDown" | "onMouseDownCapture" | "onMouseEnter" | "onMouseLeave" | "onMouseMove" | "onMouseMoveCapture" | "onMouseOut" | "onMouseOutCapture" | "onMouseOver" | "onMouseOverCapture" | "onMouseUp" | "onMouseUpCapture" | "onSelect" | "onSelectCapture" | "onTouchCancel" | "onTouchCancelCapture" | "onTouchEnd" | "onTouchEndCapture" | "onTouchMove" | "onTouchMoveCapture" | "onTouchStart" | "onTouchStartCapture" | "onPointerDown" | "onPointerDownCapture" | "onPointerMove" | "onPointerMoveCapture" | "onPointerUp" | "onPointerUpCapture" | "onPointerCancel" | "onPointerCancelCapture" | "onPointerEnter" | "onPointerLeave" | "onPointerOver" | "onPointerOverCapture" | "onPointerOut" | "onPointerOutCapture" | "onGotPointerCapture" | "onGotPointerCaptureCapture" | "onLostPointerCapture" | "onLostPointerCaptureCapture" | "onScroll" | "onScrollCapture" | "onWheel" | "onWheelCapture" | "onAnimationStart" | "onAnimationStartCapture" | "onAnimationEnd" | "onAnimationEndCapture" | "onAnimationIteration" | "onAnimationIterationCapture" | "onTransitionEnd" | "onTransitionEndCapture" | "defaultChecked" | "defaultValue" | "suppressContentEditableWarning" | "accessKey" | "autoFocus" | "contentEditable" | "contextMenu" | "dir" | "draggable" | "nonce" | "spellCheck" | "radioGroup" | "about" | "datatype" | "inlist" | "prefix" | "rel" | "resource" | "rev" | "typeof" | "vocab" | "autoCapitalize" | "autoCorrect" | "autoSave" | "itemProp" | "itemScope" | "itemType" | "itemID" | "itemRef" | "results" | "security" | "unselectable" | "inputMode" | "is" | keyof import("react").ClassAttributes<HTMLButtonElement> | "formAction" | "formEncType" | "formMethod" | "formNoValidate" | "formTarget" | "value">, "ref"> & import("react").RefAttributes<HTMLAnchorElement | HTMLButtonElement>, "ref"> & import("react").RefAttributes<HTMLAnchorElement | HTMLButtonElement> & import("
|
|
18
|
+
} & Pick<import("react").DetailedHTMLProps<import("react").ButtonHTMLAttributes<HTMLButtonElement>, HTMLButtonElement>, "disabled" | "content" | "translate" | "property" | "hidden" | "form" | "slot" | "style" | "title" | "suppressHydrationWarning" | "className" | "id" | "lang" | "name" | "type" | "role" | "tabIndex" | "aria-activedescendant" | "aria-atomic" | "aria-autocomplete" | "aria-braillelabel" | "aria-brailleroledescription" | "aria-busy" | "aria-checked" | "aria-colcount" | "aria-colindex" | "aria-colindextext" | "aria-colspan" | "aria-controls" | "aria-current" | "aria-describedby" | "aria-description" | "aria-details" | "aria-disabled" | "aria-dropeffect" | "aria-errormessage" | "aria-expanded" | "aria-flowto" | "aria-grabbed" | "aria-haspopup" | "aria-hidden" | "aria-invalid" | "aria-keyshortcuts" | "aria-label" | "aria-labelledby" | "aria-level" | "aria-live" | "aria-modal" | "aria-multiline" | "aria-multiselectable" | "aria-orientation" | "aria-owns" | "aria-placeholder" | "aria-posinset" | "aria-pressed" | "aria-readonly" | "aria-relevant" | "aria-required" | "aria-roledescription" | "aria-rowcount" | "aria-rowindex" | "aria-rowindextext" | "aria-rowspan" | "aria-selected" | "aria-setsize" | "aria-sort" | "aria-valuemax" | "aria-valuemin" | "aria-valuenow" | "aria-valuetext" | "children" | "dangerouslySetInnerHTML" | "onCopy" | "onCopyCapture" | "onCut" | "onCutCapture" | "onPaste" | "onPasteCapture" | "onCompositionEnd" | "onCompositionEndCapture" | "onCompositionStart" | "onCompositionStartCapture" | "onCompositionUpdate" | "onCompositionUpdateCapture" | "onFocus" | "onFocusCapture" | "onBlur" | "onBlurCapture" | "onChange" | "onChangeCapture" | "onBeforeInput" | "onBeforeInputCapture" | "onInput" | "onInputCapture" | "onReset" | "onResetCapture" | "onSubmit" | "onSubmitCapture" | "onInvalid" | "onInvalidCapture" | "onLoad" | "onLoadCapture" | "onError" | "onErrorCapture" | "onKeyDown" | "onKeyDownCapture" | "onKeyPress" | "onKeyPressCapture" | "onKeyUp" | "onKeyUpCapture" | "onAbort" | "onAbortCapture" | "onCanPlay" | "onCanPlayCapture" | "onCanPlayThrough" | "onCanPlayThroughCapture" | "onDurationChange" | "onDurationChangeCapture" | "onEmptied" | "onEmptiedCapture" | "onEncrypted" | "onEncryptedCapture" | "onEnded" | "onEndedCapture" | "onLoadedData" | "onLoadedDataCapture" | "onLoadedMetadata" | "onLoadedMetadataCapture" | "onLoadStart" | "onLoadStartCapture" | "onPause" | "onPauseCapture" | "onPlay" | "onPlayCapture" | "onPlaying" | "onPlayingCapture" | "onProgress" | "onProgressCapture" | "onRateChange" | "onRateChangeCapture" | "onResize" | "onResizeCapture" | "onSeeked" | "onSeekedCapture" | "onSeeking" | "onSeekingCapture" | "onStalled" | "onStalledCapture" | "onSuspend" | "onSuspendCapture" | "onTimeUpdate" | "onTimeUpdateCapture" | "onVolumeChange" | "onVolumeChangeCapture" | "onWaiting" | "onWaitingCapture" | "onAuxClick" | "onAuxClickCapture" | "onClick" | "onClickCapture" | "onContextMenu" | "onContextMenuCapture" | "onDoubleClick" | "onDoubleClickCapture" | "onDrag" | "onDragCapture" | "onDragEnd" | "onDragEndCapture" | "onDragEnter" | "onDragEnterCapture" | "onDragExit" | "onDragExitCapture" | "onDragLeave" | "onDragLeaveCapture" | "onDragOver" | "onDragOverCapture" | "onDragStart" | "onDragStartCapture" | "onDrop" | "onDropCapture" | "onMouseDown" | "onMouseDownCapture" | "onMouseEnter" | "onMouseLeave" | "onMouseMove" | "onMouseMoveCapture" | "onMouseOut" | "onMouseOutCapture" | "onMouseOver" | "onMouseOverCapture" | "onMouseUp" | "onMouseUpCapture" | "onSelect" | "onSelectCapture" | "onTouchCancel" | "onTouchCancelCapture" | "onTouchEnd" | "onTouchEndCapture" | "onTouchMove" | "onTouchMoveCapture" | "onTouchStart" | "onTouchStartCapture" | "onPointerDown" | "onPointerDownCapture" | "onPointerMove" | "onPointerMoveCapture" | "onPointerUp" | "onPointerUpCapture" | "onPointerCancel" | "onPointerCancelCapture" | "onPointerEnter" | "onPointerLeave" | "onPointerOver" | "onPointerOverCapture" | "onPointerOut" | "onPointerOutCapture" | "onGotPointerCapture" | "onGotPointerCaptureCapture" | "onLostPointerCapture" | "onLostPointerCaptureCapture" | "onScroll" | "onScrollCapture" | "onWheel" | "onWheelCapture" | "onAnimationStart" | "onAnimationStartCapture" | "onAnimationEnd" | "onAnimationEndCapture" | "onAnimationIteration" | "onAnimationIterationCapture" | "onTransitionEnd" | "onTransitionEndCapture" | "defaultChecked" | "defaultValue" | "suppressContentEditableWarning" | "accessKey" | "autoFocus" | "contentEditable" | "contextMenu" | "dir" | "draggable" | "nonce" | "spellCheck" | "radioGroup" | "about" | "datatype" | "inlist" | "prefix" | "rel" | "resource" | "rev" | "typeof" | "vocab" | "autoCapitalize" | "autoCorrect" | "autoSave" | "itemProp" | "itemScope" | "itemType" | "itemID" | "itemRef" | "results" | "security" | "unselectable" | "inputMode" | "is" | keyof import("react").ClassAttributes<HTMLButtonElement> | "formAction" | "formEncType" | "formMethod" | "formNoValidate" | "formTarget" | "value">, "ref"> & import("react").RefAttributes<HTMLAnchorElement | HTMLButtonElement>, "ref"> & import("react").RefAttributes<HTMLAnchorElement | HTMLButtonElement> & import("../../shared").AppHeaderAction & {
|
|
19
19
|
isInDropdown?: boolean;
|
|
20
|
-
item: import("
|
|
20
|
+
item: import("../../shared").AppHeaderLinkItem;
|
|
21
21
|
mobile?: boolean;
|
|
22
22
|
onKeyDown?: (event: React.KeyboardEvent) => void;
|
|
23
23
|
role?: React.AriaRole;
|
|
@@ -29,9 +29,9 @@ export declare const StyledAppHeaderLink: import("@emotion/styled").StyledCompon
|
|
|
29
29
|
as?: import("react").ElementType<any, keyof import("react").JSX.IntrinsicElements> | undefined;
|
|
30
30
|
} & {
|
|
31
31
|
theme?: import("@emotion/react").Theme | undefined;
|
|
32
|
-
} & Pick<import("react").DetailedHTMLProps<import("react").ButtonHTMLAttributes<HTMLButtonElement>, HTMLButtonElement>, "disabled" | "content" | "translate" | "property" | "hidden" | "form" | "slot" | "style" | "title" | "suppressHydrationWarning" | "className" | "id" | "lang" | "name" | "type" | "role" | "tabIndex" | "aria-activedescendant" | "aria-atomic" | "aria-autocomplete" | "aria-braillelabel" | "aria-brailleroledescription" | "aria-busy" | "aria-checked" | "aria-colcount" | "aria-colindex" | "aria-colindextext" | "aria-colspan" | "aria-controls" | "aria-current" | "aria-describedby" | "aria-description" | "aria-details" | "aria-disabled" | "aria-dropeffect" | "aria-errormessage" | "aria-expanded" | "aria-flowto" | "aria-grabbed" | "aria-haspopup" | "aria-hidden" | "aria-invalid" | "aria-keyshortcuts" | "aria-label" | "aria-labelledby" | "aria-level" | "aria-live" | "aria-modal" | "aria-multiline" | "aria-multiselectable" | "aria-orientation" | "aria-owns" | "aria-placeholder" | "aria-posinset" | "aria-pressed" | "aria-readonly" | "aria-relevant" | "aria-required" | "aria-roledescription" | "aria-rowcount" | "aria-rowindex" | "aria-rowindextext" | "aria-rowspan" | "aria-selected" | "aria-setsize" | "aria-sort" | "aria-valuemax" | "aria-valuemin" | "aria-valuenow" | "aria-valuetext" | "children" | "dangerouslySetInnerHTML" | "onCopy" | "onCopyCapture" | "onCut" | "onCutCapture" | "onPaste" | "onPasteCapture" | "onCompositionEnd" | "onCompositionEndCapture" | "onCompositionStart" | "onCompositionStartCapture" | "onCompositionUpdate" | "onCompositionUpdateCapture" | "onFocus" | "onFocusCapture" | "onBlur" | "onBlurCapture" | "onChange" | "onChangeCapture" | "onBeforeInput" | "onBeforeInputCapture" | "onInput" | "onInputCapture" | "onReset" | "onResetCapture" | "onSubmit" | "onSubmitCapture" | "onInvalid" | "onInvalidCapture" | "onLoad" | "onLoadCapture" | "onError" | "onErrorCapture" | "onKeyDown" | "onKeyDownCapture" | "onKeyPress" | "onKeyPressCapture" | "onKeyUp" | "onKeyUpCapture" | "onAbort" | "onAbortCapture" | "onCanPlay" | "onCanPlayCapture" | "onCanPlayThrough" | "onCanPlayThroughCapture" | "onDurationChange" | "onDurationChangeCapture" | "onEmptied" | "onEmptiedCapture" | "onEncrypted" | "onEncryptedCapture" | "onEnded" | "onEndedCapture" | "onLoadedData" | "onLoadedDataCapture" | "onLoadedMetadata" | "onLoadedMetadataCapture" | "onLoadStart" | "onLoadStartCapture" | "onPause" | "onPauseCapture" | "onPlay" | "onPlayCapture" | "onPlaying" | "onPlayingCapture" | "onProgress" | "onProgressCapture" | "onRateChange" | "onRateChangeCapture" | "onResize" | "onResizeCapture" | "onSeeked" | "onSeekedCapture" | "onSeeking" | "onSeekingCapture" | "onStalled" | "onStalledCapture" | "onSuspend" | "onSuspendCapture" | "onTimeUpdate" | "onTimeUpdateCapture" | "onVolumeChange" | "onVolumeChangeCapture" | "onWaiting" | "onWaitingCapture" | "onAuxClick" | "onAuxClickCapture" | "onClick" | "onClickCapture" | "onContextMenu" | "onContextMenuCapture" | "onDoubleClick" | "onDoubleClickCapture" | "onDrag" | "onDragCapture" | "onDragEnd" | "onDragEndCapture" | "onDragEnter" | "onDragEnterCapture" | "onDragExit" | "onDragExitCapture" | "onDragLeave" | "onDragLeaveCapture" | "onDragOver" | "onDragOverCapture" | "onDragStart" | "onDragStartCapture" | "onDrop" | "onDropCapture" | "onMouseDown" | "onMouseDownCapture" | "onMouseEnter" | "onMouseLeave" | "onMouseMove" | "onMouseMoveCapture" | "onMouseOut" | "onMouseOutCapture" | "onMouseOver" | "onMouseOverCapture" | "onMouseUp" | "onMouseUpCapture" | "onSelect" | "onSelectCapture" | "onTouchCancel" | "onTouchCancelCapture" | "onTouchEnd" | "onTouchEndCapture" | "onTouchMove" | "onTouchMoveCapture" | "onTouchStart" | "onTouchStartCapture" | "onPointerDown" | "onPointerDownCapture" | "onPointerMove" | "onPointerMoveCapture" | "onPointerUp" | "onPointerUpCapture" | "onPointerCancel" | "onPointerCancelCapture" | "onPointerEnter" | "onPointerLeave" | "onPointerOver" | "onPointerOverCapture" | "onPointerOut" | "onPointerOutCapture" | "onGotPointerCapture" | "onGotPointerCaptureCapture" | "onLostPointerCapture" | "onLostPointerCaptureCapture" | "onScroll" | "onScrollCapture" | "onWheel" | "onWheelCapture" | "onAnimationStart" | "onAnimationStartCapture" | "onAnimationEnd" | "onAnimationEndCapture" | "onAnimationIteration" | "onAnimationIterationCapture" | "onTransitionEnd" | "onTransitionEndCapture" | "defaultChecked" | "defaultValue" | "suppressContentEditableWarning" | "accessKey" | "autoFocus" | "contentEditable" | "contextMenu" | "dir" | "draggable" | "nonce" | "spellCheck" | "radioGroup" | "about" | "datatype" | "inlist" | "prefix" | "rel" | "resource" | "rev" | "typeof" | "vocab" | "autoCapitalize" | "autoCorrect" | "autoSave" | "itemProp" | "itemScope" | "itemType" | "itemID" | "itemRef" | "results" | "security" | "unselectable" | "inputMode" | "is" | keyof import("react").ClassAttributes<HTMLButtonElement> | "formAction" | "formEncType" | "formMethod" | "formNoValidate" | "formTarget" | "value"> & Pick<import("react").DetailedHTMLProps<import("react").AnchorHTMLAttributes<HTMLAnchorElement>, HTMLAnchorElement>, "content" | "translate" | "property" | "hidden" | "slot" | "style" | "title" | "suppressHydrationWarning" | "className" | "id" | "lang" | "media" | "target" | "type" | "role" | "tabIndex" | "href" | "aria-activedescendant" | "aria-atomic" | "aria-autocomplete" | "aria-braillelabel" | "aria-brailleroledescription" | "aria-busy" | "aria-checked" | "aria-colcount" | "aria-colindex" | "aria-colindextext" | "aria-colspan" | "aria-controls" | "aria-current" | "aria-describedby" | "aria-description" | "aria-details" | "aria-disabled" | "aria-dropeffect" | "aria-errormessage" | "aria-expanded" | "aria-flowto" | "aria-grabbed" | "aria-haspopup" | "aria-hidden" | "aria-invalid" | "aria-keyshortcuts" | "aria-label" | "aria-labelledby" | "aria-level" | "aria-live" | "aria-modal" | "aria-multiline" | "aria-multiselectable" | "aria-orientation" | "aria-owns" | "aria-placeholder" | "aria-posinset" | "aria-pressed" | "aria-readonly" | "aria-relevant" | "aria-required" | "aria-roledescription" | "aria-rowcount" | "aria-rowindex" | "aria-rowindextext" | "aria-rowspan" | "aria-selected" | "aria-setsize" | "aria-sort" | "aria-valuemax" | "aria-valuemin" | "aria-valuenow" | "aria-valuetext" | "children" | "dangerouslySetInnerHTML" | "onCopy" | "onCopyCapture" | "onCut" | "onCutCapture" | "onPaste" | "onPasteCapture" | "onCompositionEnd" | "onCompositionEndCapture" | "onCompositionStart" | "onCompositionStartCapture" | "onCompositionUpdate" | "onCompositionUpdateCapture" | "onFocus" | "onFocusCapture" | "onBlur" | "onBlurCapture" | "onChange" | "onChangeCapture" | "onBeforeInput" | "onBeforeInputCapture" | "onInput" | "onInputCapture" | "onReset" | "onResetCapture" | "onSubmit" | "onSubmitCapture" | "onInvalid" | "onInvalidCapture" | "onLoad" | "onLoadCapture" | "onError" | "onErrorCapture" | "onKeyDown" | "onKeyDownCapture" | "onKeyPress" | "onKeyPressCapture" | "onKeyUp" | "onKeyUpCapture" | "onAbort" | "onAbortCapture" | "onCanPlay" | "onCanPlayCapture" | "onCanPlayThrough" | "onCanPlayThroughCapture" | "onDurationChange" | "onDurationChangeCapture" | "onEmptied" | "onEmptiedCapture" | "onEncrypted" | "onEncryptedCapture" | "onEnded" | "onEndedCapture" | "onLoadedData" | "onLoadedDataCapture" | "onLoadedMetadata" | "onLoadedMetadataCapture" | "onLoadStart" | "onLoadStartCapture" | "onPause" | "onPauseCapture" | "onPlay" | "onPlayCapture" | "onPlaying" | "onPlayingCapture" | "onProgress" | "onProgressCapture" | "onRateChange" | "onRateChangeCapture" | "onResize" | "onResizeCapture" | "onSeeked" | "onSeekedCapture" | "onSeeking" | "onSeekingCapture" | "onStalled" | "onStalledCapture" | "onSuspend" | "onSuspendCapture" | "onTimeUpdate" | "onTimeUpdateCapture" | "onVolumeChange" | "onVolumeChangeCapture" | "onWaiting" | "onWaitingCapture" | "onAuxClick" | "onAuxClickCapture" | "onClick" | "onClickCapture" | "onContextMenu" | "onContextMenuCapture" | "onDoubleClick" | "onDoubleClickCapture" | "onDrag" | "onDragCapture" | "onDragEnd" | "onDragEndCapture" | "onDragEnter" | "onDragEnterCapture" | "onDragExit" | "onDragExitCapture" | "onDragLeave" | "onDragLeaveCapture" | "onDragOver" | "onDragOverCapture" | "onDragStart" | "onDragStartCapture" | "onDrop" | "onDropCapture" | "onMouseDown" | "onMouseDownCapture" | "onMouseEnter" | "onMouseLeave" | "onMouseMove" | "onMouseMoveCapture" | "onMouseOut" | "onMouseOutCapture" | "onMouseOver" | "onMouseOverCapture" | "onMouseUp" | "onMouseUpCapture" | "onSelect" | "onSelectCapture" | "onTouchCancel" | "onTouchCancelCapture" | "onTouchEnd" | "onTouchEndCapture" | "onTouchMove" | "onTouchMoveCapture" | "onTouchStart" | "onTouchStartCapture" | "onPointerDown" | "onPointerDownCapture" | "onPointerMove" | "onPointerMoveCapture" | "onPointerUp" | "onPointerUpCapture" | "onPointerCancel" | "onPointerCancelCapture" | "onPointerEnter" | "onPointerLeave" | "onPointerOver" | "onPointerOverCapture" | "onPointerOut" | "onPointerOutCapture" | "onGotPointerCapture" | "onGotPointerCaptureCapture" | "onLostPointerCapture" | "onLostPointerCaptureCapture" | "onScroll" | "onScrollCapture" | "onWheel" | "onWheelCapture" | "onAnimationStart" | "onAnimationStartCapture" | "onAnimationEnd" | "onAnimationEndCapture" | "onAnimationIteration" | "onAnimationIterationCapture" | "onTransitionEnd" | "onTransitionEndCapture" | "defaultChecked" | "defaultValue" | "suppressContentEditableWarning" | "accessKey" | "autoFocus" | "contentEditable" | "contextMenu" | "dir" | "draggable" | "nonce" | "spellCheck" | "radioGroup" | "about" | "datatype" | "inlist" | "prefix" | "rel" | "resource" | "rev" | "typeof" | "vocab" | "autoCapitalize" | "autoCorrect" | "autoSave" | "itemProp" | "itemScope" | "itemType" | "itemID" | "itemRef" | "results" | "security" | "unselectable" | "inputMode" | "is" | keyof import("react").ClassAttributes<HTMLAnchorElement> | "download" | "hrefLang" | "ping" | "referrerPolicy">, "ref"> & import("react").RefAttributes<HTMLAnchorElement | HTMLButtonElement>, "ref"> & import("react").RefAttributes<HTMLAnchorElement | HTMLButtonElement> & import("../../../shared").AppHeaderAction & {
|
|
32
|
+
} & Pick<import("react").DetailedHTMLProps<import("react").ButtonHTMLAttributes<HTMLButtonElement>, HTMLButtonElement>, "disabled" | "content" | "translate" | "property" | "hidden" | "form" | "slot" | "style" | "title" | "suppressHydrationWarning" | "className" | "id" | "lang" | "name" | "type" | "role" | "tabIndex" | "aria-activedescendant" | "aria-atomic" | "aria-autocomplete" | "aria-braillelabel" | "aria-brailleroledescription" | "aria-busy" | "aria-checked" | "aria-colcount" | "aria-colindex" | "aria-colindextext" | "aria-colspan" | "aria-controls" | "aria-current" | "aria-describedby" | "aria-description" | "aria-details" | "aria-disabled" | "aria-dropeffect" | "aria-errormessage" | "aria-expanded" | "aria-flowto" | "aria-grabbed" | "aria-haspopup" | "aria-hidden" | "aria-invalid" | "aria-keyshortcuts" | "aria-label" | "aria-labelledby" | "aria-level" | "aria-live" | "aria-modal" | "aria-multiline" | "aria-multiselectable" | "aria-orientation" | "aria-owns" | "aria-placeholder" | "aria-posinset" | "aria-pressed" | "aria-readonly" | "aria-relevant" | "aria-required" | "aria-roledescription" | "aria-rowcount" | "aria-rowindex" | "aria-rowindextext" | "aria-rowspan" | "aria-selected" | "aria-setsize" | "aria-sort" | "aria-valuemax" | "aria-valuemin" | "aria-valuenow" | "aria-valuetext" | "children" | "dangerouslySetInnerHTML" | "onCopy" | "onCopyCapture" | "onCut" | "onCutCapture" | "onPaste" | "onPasteCapture" | "onCompositionEnd" | "onCompositionEndCapture" | "onCompositionStart" | "onCompositionStartCapture" | "onCompositionUpdate" | "onCompositionUpdateCapture" | "onFocus" | "onFocusCapture" | "onBlur" | "onBlurCapture" | "onChange" | "onChangeCapture" | "onBeforeInput" | "onBeforeInputCapture" | "onInput" | "onInputCapture" | "onReset" | "onResetCapture" | "onSubmit" | "onSubmitCapture" | "onInvalid" | "onInvalidCapture" | "onLoad" | "onLoadCapture" | "onError" | "onErrorCapture" | "onKeyDown" | "onKeyDownCapture" | "onKeyPress" | "onKeyPressCapture" | "onKeyUp" | "onKeyUpCapture" | "onAbort" | "onAbortCapture" | "onCanPlay" | "onCanPlayCapture" | "onCanPlayThrough" | "onCanPlayThroughCapture" | "onDurationChange" | "onDurationChangeCapture" | "onEmptied" | "onEmptiedCapture" | "onEncrypted" | "onEncryptedCapture" | "onEnded" | "onEndedCapture" | "onLoadedData" | "onLoadedDataCapture" | "onLoadedMetadata" | "onLoadedMetadataCapture" | "onLoadStart" | "onLoadStartCapture" | "onPause" | "onPauseCapture" | "onPlay" | "onPlayCapture" | "onPlaying" | "onPlayingCapture" | "onProgress" | "onProgressCapture" | "onRateChange" | "onRateChangeCapture" | "onResize" | "onResizeCapture" | "onSeeked" | "onSeekedCapture" | "onSeeking" | "onSeekingCapture" | "onStalled" | "onStalledCapture" | "onSuspend" | "onSuspendCapture" | "onTimeUpdate" | "onTimeUpdateCapture" | "onVolumeChange" | "onVolumeChangeCapture" | "onWaiting" | "onWaitingCapture" | "onAuxClick" | "onAuxClickCapture" | "onClick" | "onClickCapture" | "onContextMenu" | "onContextMenuCapture" | "onDoubleClick" | "onDoubleClickCapture" | "onDrag" | "onDragCapture" | "onDragEnd" | "onDragEndCapture" | "onDragEnter" | "onDragEnterCapture" | "onDragExit" | "onDragExitCapture" | "onDragLeave" | "onDragLeaveCapture" | "onDragOver" | "onDragOverCapture" | "onDragStart" | "onDragStartCapture" | "onDrop" | "onDropCapture" | "onMouseDown" | "onMouseDownCapture" | "onMouseEnter" | "onMouseLeave" | "onMouseMove" | "onMouseMoveCapture" | "onMouseOut" | "onMouseOutCapture" | "onMouseOver" | "onMouseOverCapture" | "onMouseUp" | "onMouseUpCapture" | "onSelect" | "onSelectCapture" | "onTouchCancel" | "onTouchCancelCapture" | "onTouchEnd" | "onTouchEndCapture" | "onTouchMove" | "onTouchMoveCapture" | "onTouchStart" | "onTouchStartCapture" | "onPointerDown" | "onPointerDownCapture" | "onPointerMove" | "onPointerMoveCapture" | "onPointerUp" | "onPointerUpCapture" | "onPointerCancel" | "onPointerCancelCapture" | "onPointerEnter" | "onPointerLeave" | "onPointerOver" | "onPointerOverCapture" | "onPointerOut" | "onPointerOutCapture" | "onGotPointerCapture" | "onGotPointerCaptureCapture" | "onLostPointerCapture" | "onLostPointerCaptureCapture" | "onScroll" | "onScrollCapture" | "onWheel" | "onWheelCapture" | "onAnimationStart" | "onAnimationStartCapture" | "onAnimationEnd" | "onAnimationEndCapture" | "onAnimationIteration" | "onAnimationIterationCapture" | "onTransitionEnd" | "onTransitionEndCapture" | "defaultChecked" | "defaultValue" | "suppressContentEditableWarning" | "accessKey" | "autoFocus" | "contentEditable" | "contextMenu" | "dir" | "draggable" | "nonce" | "spellCheck" | "radioGroup" | "about" | "datatype" | "inlist" | "prefix" | "rel" | "resource" | "rev" | "typeof" | "vocab" | "autoCapitalize" | "autoCorrect" | "autoSave" | "itemProp" | "itemScope" | "itemType" | "itemID" | "itemRef" | "results" | "security" | "unselectable" | "inputMode" | "is" | keyof import("react").ClassAttributes<HTMLButtonElement> | "formAction" | "formEncType" | "formMethod" | "formNoValidate" | "formTarget" | "value"> & Pick<import("react").DetailedHTMLProps<import("react").AnchorHTMLAttributes<HTMLAnchorElement>, HTMLAnchorElement>, "content" | "translate" | "property" | "hidden" | "slot" | "style" | "title" | "suppressHydrationWarning" | "className" | "id" | "lang" | "media" | "target" | "type" | "role" | "tabIndex" | "href" | "aria-activedescendant" | "aria-atomic" | "aria-autocomplete" | "aria-braillelabel" | "aria-brailleroledescription" | "aria-busy" | "aria-checked" | "aria-colcount" | "aria-colindex" | "aria-colindextext" | "aria-colspan" | "aria-controls" | "aria-current" | "aria-describedby" | "aria-description" | "aria-details" | "aria-disabled" | "aria-dropeffect" | "aria-errormessage" | "aria-expanded" | "aria-flowto" | "aria-grabbed" | "aria-haspopup" | "aria-hidden" | "aria-invalid" | "aria-keyshortcuts" | "aria-label" | "aria-labelledby" | "aria-level" | "aria-live" | "aria-modal" | "aria-multiline" | "aria-multiselectable" | "aria-orientation" | "aria-owns" | "aria-placeholder" | "aria-posinset" | "aria-pressed" | "aria-readonly" | "aria-relevant" | "aria-required" | "aria-roledescription" | "aria-rowcount" | "aria-rowindex" | "aria-rowindextext" | "aria-rowspan" | "aria-selected" | "aria-setsize" | "aria-sort" | "aria-valuemax" | "aria-valuemin" | "aria-valuenow" | "aria-valuetext" | "children" | "dangerouslySetInnerHTML" | "onCopy" | "onCopyCapture" | "onCut" | "onCutCapture" | "onPaste" | "onPasteCapture" | "onCompositionEnd" | "onCompositionEndCapture" | "onCompositionStart" | "onCompositionStartCapture" | "onCompositionUpdate" | "onCompositionUpdateCapture" | "onFocus" | "onFocusCapture" | "onBlur" | "onBlurCapture" | "onChange" | "onChangeCapture" | "onBeforeInput" | "onBeforeInputCapture" | "onInput" | "onInputCapture" | "onReset" | "onResetCapture" | "onSubmit" | "onSubmitCapture" | "onInvalid" | "onInvalidCapture" | "onLoad" | "onLoadCapture" | "onError" | "onErrorCapture" | "onKeyDown" | "onKeyDownCapture" | "onKeyPress" | "onKeyPressCapture" | "onKeyUp" | "onKeyUpCapture" | "onAbort" | "onAbortCapture" | "onCanPlay" | "onCanPlayCapture" | "onCanPlayThrough" | "onCanPlayThroughCapture" | "onDurationChange" | "onDurationChangeCapture" | "onEmptied" | "onEmptiedCapture" | "onEncrypted" | "onEncryptedCapture" | "onEnded" | "onEndedCapture" | "onLoadedData" | "onLoadedDataCapture" | "onLoadedMetadata" | "onLoadedMetadataCapture" | "onLoadStart" | "onLoadStartCapture" | "onPause" | "onPauseCapture" | "onPlay" | "onPlayCapture" | "onPlaying" | "onPlayingCapture" | "onProgress" | "onProgressCapture" | "onRateChange" | "onRateChangeCapture" | "onResize" | "onResizeCapture" | "onSeeked" | "onSeekedCapture" | "onSeeking" | "onSeekingCapture" | "onStalled" | "onStalledCapture" | "onSuspend" | "onSuspendCapture" | "onTimeUpdate" | "onTimeUpdateCapture" | "onVolumeChange" | "onVolumeChangeCapture" | "onWaiting" | "onWaitingCapture" | "onAuxClick" | "onAuxClickCapture" | "onClick" | "onClickCapture" | "onContextMenu" | "onContextMenuCapture" | "onDoubleClick" | "onDoubleClickCapture" | "onDrag" | "onDragCapture" | "onDragEnd" | "onDragEndCapture" | "onDragEnter" | "onDragEnterCapture" | "onDragExit" | "onDragExitCapture" | "onDragLeave" | "onDragLeaveCapture" | "onDragOver" | "onDragOverCapture" | "onDragStart" | "onDragStartCapture" | "onDrop" | "onDropCapture" | "onMouseDown" | "onMouseDownCapture" | "onMouseEnter" | "onMouseLeave" | "onMouseMove" | "onMouseMoveCapture" | "onMouseOut" | "onMouseOutCapture" | "onMouseOver" | "onMouseOverCapture" | "onMouseUp" | "onMouseUpCapture" | "onSelect" | "onSelectCapture" | "onTouchCancel" | "onTouchCancelCapture" | "onTouchEnd" | "onTouchEndCapture" | "onTouchMove" | "onTouchMoveCapture" | "onTouchStart" | "onTouchStartCapture" | "onPointerDown" | "onPointerDownCapture" | "onPointerMove" | "onPointerMoveCapture" | "onPointerUp" | "onPointerUpCapture" | "onPointerCancel" | "onPointerCancelCapture" | "onPointerEnter" | "onPointerLeave" | "onPointerOver" | "onPointerOverCapture" | "onPointerOut" | "onPointerOutCapture" | "onGotPointerCapture" | "onGotPointerCaptureCapture" | "onLostPointerCapture" | "onLostPointerCaptureCapture" | "onScroll" | "onScrollCapture" | "onWheel" | "onWheelCapture" | "onAnimationStart" | "onAnimationStartCapture" | "onAnimationEnd" | "onAnimationEndCapture" | "onAnimationIteration" | "onAnimationIterationCapture" | "onTransitionEnd" | "onTransitionEndCapture" | "defaultChecked" | "defaultValue" | "suppressContentEditableWarning" | "accessKey" | "autoFocus" | "contentEditable" | "contextMenu" | "dir" | "draggable" | "nonce" | "spellCheck" | "radioGroup" | "about" | "datatype" | "inlist" | "prefix" | "rel" | "resource" | "rev" | "typeof" | "vocab" | "autoCapitalize" | "autoCorrect" | "autoSave" | "itemProp" | "itemScope" | "itemType" | "itemID" | "itemRef" | "results" | "security" | "unselectable" | "inputMode" | "is" | keyof import("react").ClassAttributes<HTMLAnchorElement> | "download" | "hrefLang" | "ping" | "referrerPolicy">, "ref"> & import("react").RefAttributes<HTMLAnchorElement | HTMLButtonElement>, "ref"> & import("react").RefAttributes<HTMLAnchorElement | HTMLButtonElement> & import("../../shared").AppHeaderAction & {
|
|
33
33
|
isInDropdown?: boolean;
|
|
34
|
-
item: import("
|
|
34
|
+
item: import("../../shared").AppHeaderLinkItem;
|
|
35
35
|
mobile?: boolean;
|
|
36
36
|
onKeyDown?: (event: React.KeyboardEvent) => void;
|
|
37
37
|
role?: React.AriaRole;
|
|
@@ -0,0 +1,36 @@
|
|
|
1
|
+
import _styled from "@emotion/styled/base";
|
|
2
|
+
import { css, theme } from '@codecademy/gamut-styles';
|
|
3
|
+
import { AppHeaderLink } from '../AppHeaderLink';
|
|
4
|
+
export const StyledAppHeaderLink = /*#__PURE__*/_styled(AppHeaderLink, {
|
|
5
|
+
target: "exw2w3p0",
|
|
6
|
+
label: "StyledAppHeaderLink"
|
|
7
|
+
})(css({
|
|
8
|
+
display: 'flex',
|
|
9
|
+
position: 'relative',
|
|
10
|
+
'@media (max-width: 1199px)': {
|
|
11
|
+
pl: 0
|
|
12
|
+
},
|
|
13
|
+
'&::before': {
|
|
14
|
+
content: '""',
|
|
15
|
+
position: 'absolute',
|
|
16
|
+
width: 'calc(100% - 24px)',
|
|
17
|
+
left: {
|
|
18
|
+
_: 0,
|
|
19
|
+
lg: 12
|
|
20
|
+
},
|
|
21
|
+
borderRadius: 'lg',
|
|
22
|
+
transition: 'background-color 0.15s ease',
|
|
23
|
+
pointerEvents: 'none',
|
|
24
|
+
zIndex: -1
|
|
25
|
+
},
|
|
26
|
+
'&:hover::before, &:focus-visible::before': {
|
|
27
|
+
backgroundColor: theme.colors['navy-100']
|
|
28
|
+
},
|
|
29
|
+
'&:hover, &:focus-visible, &:active': {
|
|
30
|
+
color: 'hyper-400',
|
|
31
|
+
borderRadius: 'lg'
|
|
32
|
+
},
|
|
33
|
+
'&:active::before': {
|
|
34
|
+
backgroundColor: theme.colors['navy-200']
|
|
35
|
+
}
|
|
36
|
+
}), process.env.NODE_ENV === "production" ? "" : "/*# sourceMappingURL=data:application/json;charset=utf-8;base64,eyJ2ZXJzaW9uIjozLCJzb3VyY2VzIjpbIi4uLy4uLy4uLy4uL3NyYy9BcHBIZWFkZXIvQXBwSGVhZGVyRWxlbWVudHMvQXBwSGVhZGVyTGlua1NlY3Rpb25zL2VsZW1lbnRzLnRzeCJdLCJuYW1lcyI6W10sIm1hcHBpbmdzIjoiQUFLbUMiLCJmaWxlIjoiLi4vLi4vLi4vLi4vc3JjL0FwcEhlYWRlci9BcHBIZWFkZXJFbGVtZW50cy9BcHBIZWFkZXJMaW5rU2VjdGlvbnMvZWxlbWVudHMudHN4Iiwic291cmNlc0NvbnRlbnQiOlsiaW1wb3J0IHsgY3NzLCB0aGVtZSB9IGZyb20gJ0Bjb2RlY2FkZW15L2dhbXV0LXN0eWxlcyc7XG5pbXBvcnQgc3R5bGVkIGZyb20gJ0BlbW90aW9uL3N0eWxlZCc7XG5cbmltcG9ydCB7IEFwcEhlYWRlckxpbmsgfSBmcm9tICcuLi9BcHBIZWFkZXJMaW5rJztcblxuZXhwb3J0IGNvbnN0IFN0eWxlZEFwcEhlYWRlckxpbmsgPSBzdHlsZWQoQXBwSGVhZGVyTGluaykoXG4gIGNzcyh7XG4gICAgZGlzcGxheTogJ2ZsZXgnLFxuICAgIHBvc2l0aW9uOiAncmVsYXRpdmUnLFxuICAgICdAbWVkaWEgKG1heC13aWR0aDogMTE5OXB4KSc6IHtcbiAgICAgIHBsOiAwLFxuICAgIH0sXG4gICAgJyY6OmJlZm9yZSc6IHtcbiAgICAgIGNvbnRlbnQ6ICdcIlwiJyxcbiAgICAgIHBvc2l0aW9uOiAnYWJzb2x1dGUnLFxuICAgICAgd2lkdGg6ICdjYWxjKDEwMCUgLSAyNHB4KScsXG4gICAgICBsZWZ0OiB7IF86IDAsIGxnOiAxMiB9LFxuICAgICAgYm9yZGVyUmFkaXVzOiAnbGcnLFxuICAgICAgdHJhbnNpdGlvbjogJ2JhY2tncm91bmQtY29sb3IgMC4xNXMgZWFzZScsXG4gICAgICBwb2ludGVyRXZlbnRzOiAnbm9uZScsXG4gICAgICB6SW5kZXg6IC0xLFxuICAgIH0sXG4gICAgJyY6aG92ZXI6OmJlZm9yZSwgJjpmb2N1cy12aXNpYmxlOjpiZWZvcmUnOiB7XG4gICAgICBiYWNrZ3JvdW5kQ29sb3I6IHRoZW1lLmNvbG9yc1snbmF2eS0xMDAnXSxcbiAgICB9LFxuICAgICcmOmhvdmVyLCAmOmZvY3VzLXZpc2libGUsICY6YWN0aXZlJzoge1xuICAgICAgY29sb3I6ICdoeXBlci00MDAnLFxuICAgICAgYm9yZGVyUmFkaXVzOiAnbGcnLFxuICAgIH0sXG4gICAgJyY6YWN0aXZlOjpiZWZvcmUnOiB7XG4gICAgICBiYWNrZ3JvdW5kQ29sb3I6IHRoZW1lLmNvbG9yc1snbmF2eS0yMDAnXSxcbiAgICB9LFxuICB9KVxuKTtcbiJdfQ== */");
|
|
@@ -2,14 +2,7 @@ import * as React from 'react';
|
|
|
2
2
|
import { AppHeaderAction, AppHeaderDropdownItem } from '../../shared';
|
|
3
3
|
export type AppHeaderLinkSectionsProps = AppHeaderAction & {
|
|
4
4
|
item: AppHeaderDropdownItem;
|
|
5
|
-
|
|
6
|
-
role?: string;
|
|
7
|
-
id?: string;
|
|
8
|
-
style?: {};
|
|
9
|
-
onKeyDown?: (event: React.KeyboardEvent) => void;
|
|
10
|
-
onFocus?: () => void;
|
|
11
|
-
onBlur?: () => void;
|
|
5
|
+
isOpen?: boolean;
|
|
12
6
|
mobile?: boolean;
|
|
13
|
-
tabIndex?: number;
|
|
14
7
|
};
|
|
15
8
|
export declare const AppHeaderLinkSections: React.FC<AppHeaderLinkSectionsProps>;
|