@codecademy/brand 3.1.0-alpha.f5de9eab76.0 → 3.2.0-alpha.1b2d50df28.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/NavPanels.js +1 -1
- package/dist/AppHeader/AppHeaderElements/AppHeaderCatalogDropdown/index.js +3 -3
- package/dist/AppHeader/AppHeaderElements/AppHeaderFeatureCard/index.js +2 -1
- package/dist/AppHeader/AppHeaderElements/AppHeaderResourcesDropdown/NavPanels.js +13 -5
- package/dist/AppHeader/AppHeaderElements/AppHeaderResourcesDropdown/consts.js +55 -55
- package/dist/AppHeader/AppHeaderElements/AppHeaderResourcesDropdown/index.js +3 -3
- package/dist/AppHeader/AppHeaderElements/{AppHeaderSectionVariant/AppHeaderSectionVariant.test.js → AppHeaderSection/AppHeaderSection.test.js} +3 -3
- package/dist/AppHeader/AppHeaderElements/AppHeaderSection/NavSection.js +79 -0
- package/dist/AppHeader/AppHeaderElements/{AppHeaderSectionVariant → AppHeaderSection}/PanelLayout.js +10 -7
- package/dist/AppHeader/AppHeaderElements/{AppHeaderSectionVariant → AppHeaderSection}/index.d.ts +2 -2
- package/dist/AppHeader/AppHeaderElements/AppHeaderSection/index.js +86 -0
- package/dist/AppHeader/Search/DefaultResults.js +2 -2
- package/dist/AppHeader/Search/SearchButton.d.ts +1 -1
- package/dist/AppHeader/Search/SearchButton.js +17 -1
- package/dist/AppHeader/Search/SearchPane.js +118 -39
- package/dist/AppHeader/Search/SearchTrackingProvider/index.d.ts +17 -0
- package/dist/AppHeader/Search/SearchTrackingProvider/index.js +25 -0
- package/dist/AppHeader/Search/types.d.ts +1 -0
- package/dist/AppHeader/Search/useHeaderSearch.js +2 -1
- package/dist/AppHeader/index.js +12 -9
- package/dist/LearningOutcomeCard/index.js +3 -3
- package/dist/LearningOutcomeFlyout/index.js +9 -4
- package/package.json +1 -1
- package/dist/AppHeader/AppHeaderElements/AppHeaderSectionVariant/NavSection.js +0 -79
- package/dist/AppHeader/AppHeaderElements/AppHeaderSectionVariant/index.js +0 -86
- /package/dist/AppHeader/AppHeaderElements/{AppHeaderSectionVariant → AppHeaderSection}/NavSection.d.ts +0 -0
- /package/dist/AppHeader/AppHeaderElements/{AppHeaderSectionVariant → AppHeaderSection}/PanelLayout.d.ts +0 -0
|
@@ -6,7 +6,7 @@ import { CourseDifficulty } from '../../../ContentGroupBaseCard/types';
|
|
|
6
6
|
import { useGlobalHeaderItemClick } from '../../../GlobalHeader/context';
|
|
7
7
|
import { liveLearningHubItems, topLanguages } from '../../../lib/catalogList';
|
|
8
8
|
import { AppHeaderDietCard } from '../AppHeaderDietCard';
|
|
9
|
-
import { PanelLayout } from '../
|
|
9
|
+
import { PanelLayout } from '../AppHeaderSection/PanelLayout';
|
|
10
10
|
import { jsxs as _jsxs, jsx as _jsx } from "react/jsx-runtime";
|
|
11
11
|
export const CourseTopicsPanel = ({
|
|
12
12
|
tabIndex = 0
|
|
@@ -8,7 +8,7 @@ import { AppHeaderCatalogSection } from '../AppHeaderCatalogSection';
|
|
|
8
8
|
import { AppHeaderDropdownProvider } from '../AppHeaderDropdownProvider';
|
|
9
9
|
import { AppHeaderDropdownNavButton } from '../AppHeaderNavButton/AppHeaderDropdownNavButton';
|
|
10
10
|
import { useAppHeaderContext } from '../AppHeaderProvider';
|
|
11
|
-
import {
|
|
11
|
+
import { AppHeaderSection } from '../AppHeaderSection';
|
|
12
12
|
import { CATALOG_NAV_SECTIONS } from './consts';
|
|
13
13
|
import { MarketingBanner } from './MarketingBanner';
|
|
14
14
|
import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
|
|
@@ -21,7 +21,7 @@ const StyledAnimatedMegaMenuDropdown = /*#__PURE__*/_styled(AnimatedMegaMenuDrop
|
|
|
21
21
|
}) => displayGlobalNavRedesign ? '-58px' : isAnon ? '-9rem' : '-14rem', ";@media (min-width: 1261px){left:", ({
|
|
22
22
|
isAnon,
|
|
23
23
|
displayGlobalNavRedesign
|
|
24
|
-
}) => displayGlobalNavRedesign ? '-152px' : isAnon ? '-9rem' : '-14rem', ";}" + (process.env.NODE_ENV === "production" ? "" : "/*# sourceMappingURL=data:application/json;charset=utf-8;base64,
|
|
24
|
+
}) => displayGlobalNavRedesign ? '-152px' : isAnon ? '-9rem' : '-14rem', ";}" + (process.env.NODE_ENV === "production" ? "" : "/*# sourceMappingURL=data:application/json;charset=utf-8;base64,eyJ2ZXJzaW9uIjozLCJzb3VyY2VzIjpbIi4uLy4uLy4uLy4uL3NyYy9BcHBIZWFkZXIvQXBwSGVhZGVyRWxlbWVudHMvQXBwSGVhZGVyQ2F0YWxvZ0Ryb3Bkb3duL2luZGV4LnRzeCJdLCJuYW1lcyI6W10sIm1hcHBpbmdzIjoiQUEyQkUiLCJmaWxlIjoiLi4vLi4vLi4vLi4vc3JjL0FwcEhlYWRlci9BcHBIZWFkZXJFbGVtZW50cy9BcHBIZWFkZXJDYXRhbG9nRHJvcGRvd24vaW5kZXgudHN4Iiwic291cmNlc0NvbnRlbnQiOlsiaW1wb3J0IHsgQ29sb3JNb2RlIH0gZnJvbSAnQGNvZGVjYWRlbXkvZ2FtdXQtc3R5bGVzJztcbmltcG9ydCBzdHlsZWQgZnJvbSAnQGVtb3Rpb24vc3R5bGVkJztcbmltcG9ydCB7IHVzZUNhbGxiYWNrLCB1c2VDb250ZXh0LCB1c2VFZmZlY3QsIHVzZVJlZiwgdXNlU3RhdGUgfSBmcm9tICdyZWFjdCc7XG5pbXBvcnQgKiBhcyBSZWFjdCBmcm9tICdyZWFjdCc7XG5cbmltcG9ydCB7IEdsb2JhbE5hdlJlZGVzaWduQ29udGV4dCB9IGZyb20gJy4uLy4uLy4uL0dsb2JhbEhlYWRlcic7XG5pbXBvcnQge1xuICBBbmltYXRlZE1lZ2FNZW51RHJvcGRvd24sXG4gIEFwcEhlYWRlckFjdGlvbixcbiAgQXBwSGVhZGVyQ2F0YWxvZ0Ryb3Bkb3duSXRlbSxcbn0gZnJvbSAnLi4vLi4vc2hhcmVkJztcbmltcG9ydCB7IEFwcEhlYWRlckNhdGFsb2dTZWN0aW9uIH0gZnJvbSAnLi4vQXBwSGVhZGVyQ2F0YWxvZ1NlY3Rpb24nO1xuaW1wb3J0IHsgQXBwSGVhZGVyRHJvcGRvd25Qcm92aWRlciB9IGZyb20gJy4uL0FwcEhlYWRlckRyb3Bkb3duUHJvdmlkZXInO1xuaW1wb3J0IHsgQXBwSGVhZGVyRHJvcGRvd25OYXZCdXR0b24gfSBmcm9tICcuLi9BcHBIZWFkZXJOYXZCdXR0b24vQXBwSGVhZGVyRHJvcGRvd25OYXZCdXR0b24nO1xuaW1wb3J0IHsgdXNlQXBwSGVhZGVyQ29udGV4dCB9IGZyb20gJy4uL0FwcEhlYWRlclByb3ZpZGVyJztcbmltcG9ydCB7IEFwcEhlYWRlclNlY3Rpb24gfSBmcm9tICcuLi9BcHBIZWFkZXJTZWN0aW9uJztcbmltcG9ydCB7IENBVEFMT0dfTkFWX1NFQ1RJT05TIH0gZnJvbSAnLi9jb25zdHMnO1xuaW1wb3J0IHsgTWFya2V0aW5nQmFubmVyIH0gZnJvbSAnLi9NYXJrZXRpbmdCYW5uZXInO1xuXG5leHBvcnQgdHlwZSBBcHBIZWFkZXJDYXRhbG9nRHJvcGRvd25Qcm9wcyA9IEFwcEhlYWRlckFjdGlvbiAmIHtcbiAgaXRlbTogQXBwSGVhZGVyQ2F0YWxvZ0Ryb3Bkb3duSXRlbTtcbiAgaXNBbm9uOiBib29sZWFuO1xufTtcblxuY29uc3QgU3R5bGVkQW5pbWF0ZWRNZWdhTWVudURyb3Bkb3duID0gc3R5bGVkKEFuaW1hdGVkTWVnYU1lbnVEcm9wZG93bik8e1xuICBpc0Fub246IGJvb2xlYW47XG4gIGRpc3BsYXlHbG9iYWxOYXZSZWRlc2lnbjogYm9vbGVhbjtcbn0+YFxuICBsZWZ0OiAkeyh7IGlzQW5vbiwgZGlzcGxheUdsb2JhbE5hdlJlZGVzaWduIH0pID0+XG4gICAgZGlzcGxheUdsb2JhbE5hdlJlZGVzaWduID8gJy01OHB4JyA6IGlzQW5vbiA/ICctOXJlbScgOiAnLTE0cmVtJ307XG5cbiAgQG1lZGlhIChtaW4td2lkdGg6IDEyNjFweCkge1xuICAgIGxlZnQ6ICR7KHsgaXNBbm9uLCBkaXNwbGF5R2xvYmFsTmF2UmVkZXNpZ24gfSkgPT5cbiAgICAgIGRpc3BsYXlHbG9iYWxOYXZSZWRlc2lnbiA/ICctMTUycHgnIDogaXNBbm9uID8gJy05cmVtJyA6ICctMTRyZW0nfTtcbiAgfVxuYDtcblxuZXhwb3J0IGNvbnN0IEFwcEhlYWRlckNhdGFsb2dEcm9wZG93bjogUmVhY3QuRkM8XG4gIEFwcEhlYWRlckNhdGFsb2dEcm9wZG93blByb3BzXG4+ID0gKHsgYWN0aW9uLCBpdGVtLCBpc0Fub24gfSkgPT4ge1xuICBjb25zdCB7IHRleHQgfSA9IGl0ZW07XG4gIGNvbnN0IGNvbnRhaW5lclJlZiA9IHVzZVJlZjxIVE1MRGl2RWxlbWVudCB8IG51bGw+KG51bGwpO1xuICBjb25zdCBidXR0b25SZWYgPSB1c2VSZWY8SFRNTEJ1dHRvbkVsZW1lbnQ+KG51bGwpO1xuICBjb25zdCBbaXNPcGVuLCBzZXRJc09wZW5dID0gdXNlU3RhdGUoZmFsc2UpO1xuICBjb25zdCB7IGxhc3RPcGVuZWREcm9wZG93biwgc2V0TGFzdE9wZW5lZERyb3Bkb3duIH0gPSB1c2VBcHBIZWFkZXJDb250ZXh0KCk7XG5cbiAgY29uc3QgZm9jdXNCdXR0b24gPSAoKSA9PiB7XG4gICAgYnV0dG9uUmVmPy5jdXJyZW50Py5mb2N1cygpO1xuICB9O1xuXG4gIGNvbnN0IHRvZ2dsZUlzT3BlbiA9ICgpID0+IHNldElzT3BlbigocHJldikgPT4gIXByZXYpO1xuXG4gIGNvbnN0IGhhbmRsZU9uQ2xpY2sgPSAoZXZlbnQ6IFJlYWN0Lk1vdXNlRXZlbnQpID0+IHtcbiAgICB0b2dnbGVJc09wZW4oKTtcblxuICAgIGlmICghaXNPcGVuKSB7XG4gICAgICBhY3Rpb24oZXZlbnQsIGl0ZW0pO1xuICAgICAgaWYgKHNldExhc3RPcGVuZWREcm9wZG93bikge1xuICAgICAgICBzZXRMYXN0T3BlbmVkRHJvcGRvd24odGV4dCk7XG4gICAgICB9XG4gICAgfVxuICB9O1xuXG4gIGNvbnN0IGhhbmRsZUNsb3NlID0gdXNlQ2FsbGJhY2soKCkgPT4ge1xuICAgIHNldElzT3BlbihmYWxzZSk7XG4gICAgZm9jdXNCdXR0b24oKTtcbiAgfSwgW10pO1xuXG4gIHVzZUVmZmVjdCgoKSA9PiB7XG4gICAgaWYgKGxhc3RPcGVuZWREcm9wZG93biAhPT0gdGV4dCAmJiBpc09wZW4pIHtcbiAgICAgIHNldElzT3BlbihmYWxzZSk7XG4gICAgfVxuICAgIC8vIGVzbGludC1kaXNhYmxlLW5leHQtbGluZSByZWFjdC1ob29rcy9leGhhdXN0aXZlLWRlcHNcbiAgfSwgW2xhc3RPcGVuZWREcm9wZG93bl0pO1xuXG4gIHVzZUVmZmVjdCgoKSA9PiB7XG4gICAgZnVuY3Rpb24gaGFuZGxlQ2xpY2tPdXRzaWRlKGV2ZW50OiBNb3VzZUV2ZW50IHwgRXZlbnQpIHtcbiAgICAgIGNvbnN0IGNvbnRhaW5lciA9IGNvbnRhaW5lclJlZj8uY3VycmVudDtcbiAgICAgIGNvbnN0IGJ1dHRvbiA9IGJ1dHRvblJlZj8uY3VycmVudDtcbiAgICAgIGlmIChcbiAgICAgICAgaXNPcGVuICYmXG4gICAgICAgIGNvbnRhaW5lciAmJlxuICAgICAgICAhY29udGFpbmVyLmNvbnRhaW5zKGV2ZW50LnRhcmdldCBhcyBOb2RlKSAmJlxuICAgICAgICBidXR0b24gJiZcbiAgICAgICAgIWJ1dHRvbi5jb250YWlucyhldmVudC50YXJnZXQgYXMgTm9kZSlcbiAgICAgICkge1xuICAgICAgICBoYW5kbGVDbG9zZSgpO1xuICAgICAgfVxuICAgIH1cblxuICAgIGRvY3VtZW50LmFkZEV2ZW50TGlzdGVuZXIoJ21vdXNlZG93bicsIGhhbmRsZUNsaWNrT3V0c2lkZSk7XG4gICAgZG9jdW1lbnQuYWRkRXZlbnRMaXN0ZW5lcignYmx1cicsIGhhbmRsZUNsaWNrT3V0c2lkZSk7XG4gICAgcmV0dXJuICgpID0+IHtcbiAgICAgIGRvY3VtZW50LnJlbW92ZUV2ZW50TGlzdGVuZXIoJ21vdXNlZG93bicsIGhhbmRsZUNsaWNrT3V0c2lkZSk7XG4gICAgICBkb2N1bWVudC5yZW1vdmVFdmVudExpc3RlbmVyKCdibHVyJywgaGFuZGxlQ2xpY2tPdXRzaWRlKTtcbiAgICB9O1xuICB9LCBbY29udGFpbmVyUmVmLCBoYW5kbGVDbG9zZSwgaXNPcGVuXSk7XG4gIGNvbnN0IGRpc3BsYXlHbG9iYWxOYXZSZWRlc2lnbiA9IHVzZUNvbnRleHQoR2xvYmFsTmF2UmVkZXNpZ25Db250ZXh0KTtcblxuICByZXR1cm4gKFxuICAgIDxBcHBIZWFkZXJEcm9wZG93blByb3ZpZGVyIGhhbmRsZUNsb3NlPXtoYW5kbGVDbG9zZX0+XG4gICAgICA8QXBwSGVhZGVyRHJvcGRvd25OYXZCdXR0b25cbiAgICAgICAgYnV0dG9uUmVmPXtidXR0b25SZWZ9XG4gICAgICAgIGhhbmRsZU9uQ2xpY2s9e2hhbmRsZU9uQ2xpY2t9XG4gICAgICAgIGlzT3Blbj17aXNPcGVufVxuICAgICAgICB0aXRsZT17dGV4dH1cbiAgICAgIC8+XG4gICAgICA8U3R5bGVkQW5pbWF0ZWRNZWdhTWVudURyb3Bkb3duXG4gICAgICAgIGlzQW5vbj17aXNBbm9ufVxuICAgICAgICBkaXNwbGF5R2xvYmFsTmF2UmVkZXNpZ249e2Rpc3BsYXlHbG9iYWxOYXZSZWRlc2lnbn1cbiAgICAgICAgc3R5bGU9e3tcbiAgICAgICAgICB0b3A6ICczLjVyZW0nLFxuICAgICAgICAgIG1pbldpZHRoOiAnNjRyZW0nLFxuICAgICAgICAgIGJhY2tncm91bmRDb2xvcjogZGlzcGxheUdsb2JhbE5hdlJlZGVzaWduID8gJ3RyYW5zcGFyZW50JyA6ICcnLFxuICAgICAgICB9fVxuICAgICAgICBpbml0aWFsPXt7IGJvcmRlcldpZHRoOiAwLCBoZWlnaHQ6IDAgfX1cbiAgICAgICAgYW5pbWF0ZT17e1xuICAgICAgICAgIGJvcmRlcldpZHRoOiBpc09wZW4gPyAoZGlzcGxheUdsb2JhbE5hdlJlZGVzaWduID8gMCA6IDEpIDogMCxcbiAgICAgICAgICBoZWlnaHQ6IGlzT3BlbiA/ICdmaXQtY29udGVudCcgOiAwLFxuICAgICAgICB9fVxuICAgICAgICB0cmFuc2l0aW9uPXt7IGR1cmF0aW9uOiAwLjE3NSB9fVxuICAgICAgICBhcmlhLWhpZGRlbj17IWlzT3Blbn1cbiAgICAgICAgZGF0YS10ZXN0aWQ9XCJjYXRhbG9nLW1lbnUtZHJvcGRvd25cIlxuICAgICAgPlxuICAgICAgICB7ZGlzcGxheUdsb2JhbE5hdlJlZGVzaWduID8gKFxuICAgICAgICAgIDxDb2xvck1vZGUgbW9kZT1cImxpZ2h0XCI+XG4gICAgICAgICAgICA8QXBwSGVhZGVyU2VjdGlvblxuICAgICAgICAgICAgICBpc09wZW49e2lzT3Blbn1cbiAgICAgICAgICAgICAgcmVmPXtjb250YWluZXJSZWZ9XG4gICAgICAgICAgICAgIG5hdlNlY3Rpb25zPXtDQVRBTE9HX05BVl9TRUNUSU9OU31cbiAgICAgICAgICAgICAgTWFya2V0aW5nQmFubmVyPXtNYXJrZXRpbmdCYW5uZXJ9XG4gICAgICAgICAgICAvPlxuICAgICAgICAgIDwvQ29sb3JNb2RlPlxuICAgICAgICApIDogKFxuICAgICAgICAgIDxBcHBIZWFkZXJDYXRhbG9nU2VjdGlvblxuICAgICAgICAgICAgYWN0aW9uPXthY3Rpb259XG4gICAgICAgICAgICBpdGVtPXtpdGVtfVxuICAgICAgICAgICAgcmVmPXtjb250YWluZXJSZWZ9XG4gICAgICAgICAgICBpZD17YG1lbnUtY29udGFpbmVyJHtpdGVtLnRleHR9YH1cbiAgICAgICAgICAgIGlzT3Blbj17aXNPcGVufVxuICAgICAgICAgICAgaGFuZGxlQ2xvc2U9eygpID0+IHNldElzT3BlbihmYWxzZSl9XG4gICAgICAgICAgLz5cbiAgICAgICAgKX1cbiAgICAgIDwvU3R5bGVkQW5pbWF0ZWRNZWdhTWVudURyb3Bkb3duPlxuICAgIDwvQXBwSGVhZGVyRHJvcGRvd25Qcm92aWRlcj5cbiAgKTtcbn07XG4iXX0= */"));
|
|
25
25
|
export const AppHeaderCatalogDropdown = ({
|
|
26
26
|
action,
|
|
27
27
|
item,
|
|
@@ -106,7 +106,7 @@ export const AppHeaderCatalogDropdown = ({
|
|
|
106
106
|
"data-testid": "catalog-menu-dropdown",
|
|
107
107
|
children: displayGlobalNavRedesign ? /*#__PURE__*/_jsx(ColorMode, {
|
|
108
108
|
mode: "light",
|
|
109
|
-
children: /*#__PURE__*/_jsx(
|
|
109
|
+
children: /*#__PURE__*/_jsx(AppHeaderSection, {
|
|
110
110
|
isOpen: isOpen,
|
|
111
111
|
ref: containerRef,
|
|
112
112
|
navSections: CATALOG_NAV_SECTIONS,
|
|
@@ -10,7 +10,7 @@ const StyledCard = /*#__PURE__*/_styled(Card, {
|
|
|
10
10
|
theme
|
|
11
11
|
}) => theme.colors.primary, ";border-color:", ({
|
|
12
12
|
theme
|
|
13
|
-
}) => theme.colors.primary, ";}" + (process.env.NODE_ENV === "production" ? "" : "/*# sourceMappingURL=data:application/json;charset=utf-8;base64,eyJ2ZXJzaW9uIjozLCJzb3VyY2VzIjpbIi4uLy4uLy4uLy4uL3NyYy9BcHBIZWFkZXIvQXBwSGVhZGVyRWxlbWVudHMvQXBwSGVhZGVyRmVhdHVyZUNhcmQvaW5kZXgudHN4Il0sIm5hbWVzIjpbXSwibWFwcGluZ3MiOiJBQU8rQiIsImZpbGUiOiIuLi8uLi8uLi8uLi9zcmMvQXBwSGVhZGVyL0FwcEhlYWRlckVsZW1lbnRzL0FwcEhlYWRlckZlYXR1cmVDYXJkL2luZGV4LnRzeCIsInNvdXJjZXNDb250ZW50IjpbImltcG9ydCB7IEJveCwgQ2FyZCwgRmxleEJveCwgVGV4dCB9IGZyb20gJ0Bjb2RlY2FkZW15L2dhbXV0JztcbmltcG9ydCB7IEdyaWREZW5zZSB9IGZyb20gJ0Bjb2RlY2FkZW15L2dhbXV0LXBhdHRlcm5zJztcbmltcG9ydCB7IHRoZW1lIH0gZnJvbSAnQGNvZGVjYWRlbXkvZ2FtdXQtc3R5bGVzJztcbmltcG9ydCBzdHlsZWQgZnJvbSAnQGVtb3Rpb24vc3R5bGVkJztcblxuaW1wb3J0IHsgQXBwSGVhZGVyQ2FyZEl0ZW0gfSBmcm9tICcuLi9BcHBIZWFkZXJSZXNvdXJjZXNEcm9wZG93bi9jb25zdHMnO1xuXG5jb25zdCBTdHlsZWRDYXJkID0gc3R5bGVkKENhcmQpYFxuICAmOmhvdmVyIHtcbiAgICBjb2xvcjogJHsoeyB0aGVtZSB9KSA9PiB0aGVtZS5jb2xvcnMucHJpbWFyeX07XG4gICAgYm9yZGVyLWNvbG9yOiAkeyh7IHRoZW1lIH0pID0+IHRoZW1lLmNvbG9ycy5wcmltYXJ5fTtcbiAgfVxuYDtcblxuZXhwb3J0IGNvbnN0IEFwcEhlYWRlckZlYXR1cmVDYXJkID0gKHsgaXRlbSB9OiB7IGl0ZW06IEFwcEhlYWRlckNhcmRJdGVtIH0pID0+IHtcbiAgcmV0dXJuIChcbiAgICA8U3R5bGVkQ2FyZFxuICAgICAgaXNJbnRlcmFjdGl2ZVxuICAgICAgcHg9ezh9XG4gICAgICBweT17MjR9XG4gICAgICBib3JkZXJSYWRpdXM9XCJsZ1wiXG4gICAgICBib3JkZXI9ezF9XG4gICAgICBib3JkZXJDb2xvcj1cImJvcmRlci10ZXJ0aWFyeVwiXG4gICAgICBkaXNwbGF5PVwiZmxleFwiXG4gICAgICBhbGlnbkl0ZW1zPVwiZmxleC1zdGFydFwiXG4gICAgICBmbGV4RGlyZWN0aW9uPVwiY29sdW1uXCJcbiAgICAgIGhlaWdodD1cIjEwMCVcIlxuICAgID5cbiAgICAgIDxGbGV4Qm94IGFsaWduSXRlbXM9XCJjZW50ZXJcIiBnYXA9ezh9PlxuICAgICAgICA8Qm94XG4gICAgICAgICAgYmFja2dyb3VuZD17dGhlbWUuY29sb3JzWyduYXZ5LTIwMCddfVxuICAgICAgICAgIGJvcmRlclJhZGl1cz1cIm1kXCJcbiAgICAgICAgICBwPXs0fVxuICAgICAgICAgIGhlaWdodD17MjZ9XG4gICAgICAgID5cbiAgICAgICAgICB7aXRlbS5pY29ufVxuICAgICAgICA8L0JveD5cbiAgICAgICAgPFRleHQgdmFyaWFudD1cInRpdGxlLXhzXCI+e2l0ZW0ubGlua0l0ZW0udGV4dH08L1RleHQ+XG4gICAgICA8L0ZsZXhCb3g+
|
|
13
|
+
}) => theme.colors.primary, ";}" + (process.env.NODE_ENV === "production" ? "" : "/*# sourceMappingURL=data:application/json;charset=utf-8;base64,eyJ2ZXJzaW9uIjozLCJzb3VyY2VzIjpbIi4uLy4uLy4uLy4uL3NyYy9BcHBIZWFkZXIvQXBwSGVhZGVyRWxlbWVudHMvQXBwSGVhZGVyRmVhdHVyZUNhcmQvaW5kZXgudHN4Il0sIm5hbWVzIjpbXSwibWFwcGluZ3MiOiJBQU8rQiIsImZpbGUiOiIuLi8uLi8uLi8uLi9zcmMvQXBwSGVhZGVyL0FwcEhlYWRlckVsZW1lbnRzL0FwcEhlYWRlckZlYXR1cmVDYXJkL2luZGV4LnRzeCIsInNvdXJjZXNDb250ZW50IjpbImltcG9ydCB7IEJveCwgQ2FyZCwgRmxleEJveCwgVGV4dCB9IGZyb20gJ0Bjb2RlY2FkZW15L2dhbXV0JztcbmltcG9ydCB7IEdyaWREZW5zZSB9IGZyb20gJ0Bjb2RlY2FkZW15L2dhbXV0LXBhdHRlcm5zJztcbmltcG9ydCB7IHRoZW1lIH0gZnJvbSAnQGNvZGVjYWRlbXkvZ2FtdXQtc3R5bGVzJztcbmltcG9ydCBzdHlsZWQgZnJvbSAnQGVtb3Rpb24vc3R5bGVkJztcblxuaW1wb3J0IHsgQXBwSGVhZGVyQ2FyZEl0ZW0gfSBmcm9tICcuLi9BcHBIZWFkZXJSZXNvdXJjZXNEcm9wZG93bi9jb25zdHMnO1xuXG5jb25zdCBTdHlsZWRDYXJkID0gc3R5bGVkKENhcmQpYFxuICAmOmhvdmVyIHtcbiAgICBjb2xvcjogJHsoeyB0aGVtZSB9KSA9PiB0aGVtZS5jb2xvcnMucHJpbWFyeX07XG4gICAgYm9yZGVyLWNvbG9yOiAkeyh7IHRoZW1lIH0pID0+IHRoZW1lLmNvbG9ycy5wcmltYXJ5fTtcbiAgfVxuYDtcblxuZXhwb3J0IGNvbnN0IEFwcEhlYWRlckZlYXR1cmVDYXJkID0gKHsgaXRlbSB9OiB7IGl0ZW06IEFwcEhlYWRlckNhcmRJdGVtIH0pID0+IHtcbiAgcmV0dXJuIChcbiAgICA8U3R5bGVkQ2FyZFxuICAgICAgaXNJbnRlcmFjdGl2ZVxuICAgICAgcHg9ezh9XG4gICAgICBweT17MjR9XG4gICAgICBib3JkZXJSYWRpdXM9XCJsZ1wiXG4gICAgICBib3JkZXI9ezF9XG4gICAgICBib3JkZXJDb2xvcj1cImJvcmRlci10ZXJ0aWFyeVwiXG4gICAgICBkaXNwbGF5PVwiZmxleFwiXG4gICAgICBhbGlnbkl0ZW1zPVwiZmxleC1zdGFydFwiXG4gICAgICBmbGV4RGlyZWN0aW9uPVwiY29sdW1uXCJcbiAgICAgIGhlaWdodD1cIjEwMCVcIlxuICAgID5cbiAgICAgIDxGbGV4Qm94IGFsaWduSXRlbXM9XCJjZW50ZXJcIiBnYXA9ezh9PlxuICAgICAgICA8Qm94XG4gICAgICAgICAgYmFja2dyb3VuZD17dGhlbWUuY29sb3JzWyduYXZ5LTIwMCddfVxuICAgICAgICAgIGJvcmRlclJhZGl1cz1cIm1kXCJcbiAgICAgICAgICBwPXs0fVxuICAgICAgICAgIGhlaWdodD17MjZ9XG4gICAgICAgID5cbiAgICAgICAgICB7aXRlbS5pY29ufVxuICAgICAgICA8L0JveD5cbiAgICAgICAgPFRleHQgdmFyaWFudD1cInRpdGxlLXhzXCI+e2l0ZW0ubGlua0l0ZW0udGV4dH08L1RleHQ+XG4gICAgICA8L0ZsZXhCb3g+XG4gICAgICA8Qm94IHdpZHRoPVwiMTAwJVwiPlxuICAgICAgICA8R3JpZERlbnNlIGhlaWdodD17NH0gLz5cbiAgICAgIDwvQm94PlxuICAgICAgPFRleHQgdmFyaWFudD1cInAtYmFzZVwiIGZvbnRTaXplPXsxNH0+XG4gICAgICAgIHtpdGVtLmRlc2NyaXB0aW9ufVxuICAgICAgPC9UZXh0PlxuICAgIDwvU3R5bGVkQ2FyZD5cbiAgKTtcbn07XG4iXX0= */"));
|
|
14
14
|
export const AppHeaderFeatureCard = ({
|
|
15
15
|
item
|
|
16
16
|
}) => {
|
|
@@ -45,6 +45,7 @@ export const AppHeaderFeatureCard = ({
|
|
|
45
45
|
})
|
|
46
46
|
}), /*#__PURE__*/_jsx(Text, {
|
|
47
47
|
variant: "p-base",
|
|
48
|
+
fontSize: 14,
|
|
48
49
|
children: item.description
|
|
49
50
|
})]
|
|
50
51
|
});
|
|
@@ -1,8 +1,8 @@
|
|
|
1
|
-
import { Anchor, FlexBox, GridBox } from '@codecademy/gamut';
|
|
1
|
+
import { Anchor, Box, FlexBox, GridBox } from '@codecademy/gamut';
|
|
2
2
|
import { useGlobalHeaderItemClick } from '../../../GlobalHeader/context';
|
|
3
3
|
import { useAppHeaderDropdownContext } from '../AppHeaderDropdownProvider';
|
|
4
4
|
import { AppHeaderFeatureCard } from '../AppHeaderFeatureCard';
|
|
5
|
-
import { PanelLayout } from '../
|
|
5
|
+
import { PanelLayout } from '../AppHeaderSection/PanelLayout';
|
|
6
6
|
import { docsLinks, inspirationLinks, learningToolsLinks, practiceToolsLinks } from './consts';
|
|
7
7
|
import { jsx as _jsx, Fragment as _Fragment, jsxs as _jsxs } from "react/jsx-runtime";
|
|
8
8
|
export const DocsPanel = ({
|
|
@@ -15,7 +15,11 @@ export const DocsPanel = ({
|
|
|
15
15
|
handleClose
|
|
16
16
|
} = useAppHeaderDropdownContext();
|
|
17
17
|
const description = /*#__PURE__*/_jsxs(_Fragment, {
|
|
18
|
-
children: [
|
|
18
|
+
children: [/*#__PURE__*/_jsx(Box, {
|
|
19
|
+
mb: 8,
|
|
20
|
+
children: "Docs is a community-driven resource for all things programming. Even if you don't have a Codecademy account, you can quickly find definitions and explanations for most coding languages, frameworks, and technical concepts."
|
|
21
|
+
}), "Interested in helping build it?", ' ', /*#__PURE__*/_jsx(Anchor, {
|
|
22
|
+
tabIndex: tabIndex,
|
|
19
23
|
href: "/docs/contribute",
|
|
20
24
|
children: "Contribute to Docs"
|
|
21
25
|
})]
|
|
@@ -68,7 +72,7 @@ export const LearningToolsPanel = ({
|
|
|
68
72
|
}) => {
|
|
69
73
|
return /*#__PURE__*/_jsx(PanelLayout, {
|
|
70
74
|
heading: "Learning tools",
|
|
71
|
-
description: "
|
|
75
|
+
description: "Explore free resources that help you understand key concepts and stay on track. From articles and cheatsheets to videos and projects, these tools support you throughout your learning journey.",
|
|
72
76
|
children: /*#__PURE__*/_jsx(FeatureCardPanel, {
|
|
73
77
|
links: learningToolsLinks,
|
|
74
78
|
tabIndex: tabIndex
|
|
@@ -80,7 +84,7 @@ export const PracticeToolsPanel = ({
|
|
|
80
84
|
}) => {
|
|
81
85
|
return /*#__PURE__*/_jsx(PanelLayout, {
|
|
82
86
|
heading: "Practice tools",
|
|
83
|
-
description: "
|
|
87
|
+
description: "Build confidence and reinforce what you've learned through hands-on practice. Tackle real coding challenges, simulate job interviews, and test your skills in interactive workspaces.",
|
|
84
88
|
children: /*#__PURE__*/_jsx(FeatureCardPanel, {
|
|
85
89
|
links: practiceToolsLinks,
|
|
86
90
|
tabIndex: tabIndex
|
|
@@ -119,6 +123,9 @@ export const FeatureCardPanel = ({
|
|
|
119
123
|
lg: '1fr 1fr'
|
|
120
124
|
},
|
|
121
125
|
gap: 16,
|
|
126
|
+
pl: 0,
|
|
127
|
+
as: "ul",
|
|
128
|
+
listStyle: "none",
|
|
122
129
|
children: links.map(item => /*#__PURE__*/_jsx(Anchor, {
|
|
123
130
|
variant: "interface",
|
|
124
131
|
href: item.linkItem.href,
|
|
@@ -128,6 +135,7 @@ export const FeatureCardPanel = ({
|
|
|
128
135
|
},
|
|
129
136
|
tabIndex: tabIndex,
|
|
130
137
|
height: "100%",
|
|
138
|
+
as: "li",
|
|
131
139
|
children: /*#__PURE__*/_jsx(AppHeaderFeatureCard, {
|
|
132
140
|
item: item
|
|
133
141
|
})
|
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
import { ArticleIcon, BulbIcon, DiamondIcon, FileIcon, NotebookIcon, ProjectsIcon, RulerTriangleIcon, VideoPlayerMovieIcon } from '@codecademy/gamut-icons';
|
|
1
|
+
import { ArticleIcon, BriefcaseIcon, BulbIcon, CommentsIcon, DiamondIcon, FileIcon, InfoCircleIcon, NotebookIcon, ProjectsIcon, RulerTriangleIcon, SearchIcon, VideoPlayerMovieIcon } from '@codecademy/gamut-icons';
|
|
2
2
|
import React from 'react';
|
|
3
3
|
import { DocsPanel, InspirationPanel, LearningToolsPanel, PracticeToolsPanel } from './NavPanels';
|
|
4
4
|
import { jsx as _jsx } from "react/jsx-runtime";
|
|
@@ -150,14 +150,14 @@ export const docsLinks = [{
|
|
|
150
150
|
}];
|
|
151
151
|
export const learningToolsLinks = [{
|
|
152
152
|
linkItem: {
|
|
153
|
-
id: '
|
|
154
|
-
href: '/
|
|
155
|
-
trackingTarget: '
|
|
156
|
-
text: '
|
|
153
|
+
id: 'articles',
|
|
154
|
+
href: '/articles',
|
|
155
|
+
trackingTarget: 'topnav_resources_articles',
|
|
156
|
+
text: 'Articles',
|
|
157
157
|
type: 'link'
|
|
158
158
|
},
|
|
159
|
-
icon: /*#__PURE__*/_jsx(
|
|
160
|
-
description: "
|
|
159
|
+
icon: /*#__PURE__*/_jsx(ArticleIcon, {}),
|
|
160
|
+
description: "Articles are more in-depth explanations about concepts covered in Codecademy courses. Here you'll learn more about workflows that developers use every day, and take your coding skills to the next level."
|
|
161
161
|
}, {
|
|
162
162
|
linkItem: {
|
|
163
163
|
id: 'cheatsheets',
|
|
@@ -167,17 +167,7 @@ export const learningToolsLinks = [{
|
|
|
167
167
|
type: 'link'
|
|
168
168
|
},
|
|
169
169
|
icon: /*#__PURE__*/_jsx(NotebookIcon, {}),
|
|
170
|
-
description: '
|
|
171
|
-
}, {
|
|
172
|
-
linkItem: {
|
|
173
|
-
id: 'articles',
|
|
174
|
-
href: '/articles',
|
|
175
|
-
trackingTarget: 'topnav_resources_articles',
|
|
176
|
-
text: 'Articles',
|
|
177
|
-
type: 'link'
|
|
178
|
-
},
|
|
179
|
-
icon: /*#__PURE__*/_jsx(ArticleIcon, {}),
|
|
180
|
-
description: "Articles are more in-depth explanations about concepts covered in Codecademy courses. Here you'll learn more about workflows that developers use every day, and take your coding skills to the next level."
|
|
170
|
+
description: 'Quick-reference guides that summarize key concepts taught in our courses and paths across various programming languages, tools, and technologies.'
|
|
181
171
|
}, {
|
|
182
172
|
linkItem: {
|
|
183
173
|
id: 'videos',
|
|
@@ -188,28 +178,18 @@ export const learningToolsLinks = [{
|
|
|
188
178
|
},
|
|
189
179
|
icon: /*#__PURE__*/_jsx(VideoPlayerMovieIcon, {}),
|
|
190
180
|
description: 'Watch our best programming videos for beginner, intermediate, and advanced learners about languages, frameworks, and more.'
|
|
191
|
-
}];
|
|
192
|
-
export const practiceToolsLinks = [{
|
|
193
|
-
linkItem: {
|
|
194
|
-
id: 'interview-simulator',
|
|
195
|
-
href: '/interview-simulator',
|
|
196
|
-
trackingTarget: 'topnav_resources_interview_simulator',
|
|
197
|
-
text: 'Interview Simulator',
|
|
198
|
-
type: 'link'
|
|
199
|
-
},
|
|
200
|
-
icon: /*#__PURE__*/_jsx(ProjectsIcon, {}),
|
|
201
|
-
description: 'Discover your potential through interviewing. Identify your strengths, get actionable feedback, and boost your confidence with customized practice — at any stage in your tech career.'
|
|
202
181
|
}, {
|
|
203
182
|
linkItem: {
|
|
204
|
-
id: '
|
|
205
|
-
href: '/
|
|
206
|
-
trackingTarget: '
|
|
207
|
-
text: '
|
|
183
|
+
id: 'projects',
|
|
184
|
+
href: '/projects',
|
|
185
|
+
trackingTarget: 'topnav_resources_projects',
|
|
186
|
+
text: 'Projects',
|
|
208
187
|
type: 'link'
|
|
209
188
|
},
|
|
210
|
-
icon: /*#__PURE__*/_jsx(
|
|
211
|
-
description: "
|
|
212
|
-
}
|
|
189
|
+
icon: /*#__PURE__*/_jsx(ProjectsIcon, {}),
|
|
190
|
+
description: "Projects let you apply what you're learning. Practice new skills, connect concepts, or put it all together to create something of your own."
|
|
191
|
+
}];
|
|
192
|
+
export const practiceToolsLinks = [{
|
|
213
193
|
linkItem: {
|
|
214
194
|
id: 'code-challenges',
|
|
215
195
|
href: '/code-challenges',
|
|
@@ -229,27 +209,47 @@ export const practiceToolsLinks = [{
|
|
|
229
209
|
},
|
|
230
210
|
icon: /*#__PURE__*/_jsx(VideoPlayerMovieIcon, {}),
|
|
231
211
|
description: 'Practice building projects in 13 popular languages and libraries, tinker with code, and share your work—all without leaving your browser.'
|
|
212
|
+
}, {
|
|
213
|
+
linkItem: {
|
|
214
|
+
id: 'job-readiness',
|
|
215
|
+
href: '/job-readiness',
|
|
216
|
+
trackingTarget: 'topnav_resources_job_readiness',
|
|
217
|
+
text: 'Job-Readiness Checker',
|
|
218
|
+
type: 'link'
|
|
219
|
+
},
|
|
220
|
+
icon: /*#__PURE__*/_jsx(NotebookIcon, {}),
|
|
221
|
+
description: "Add a LinkedIn or ZipRecruiter job posting to analyze how your skills fit the job. You'll need to add more information for jobs found on other websites."
|
|
222
|
+
}, {
|
|
223
|
+
linkItem: {
|
|
224
|
+
id: 'interview-simulator',
|
|
225
|
+
href: '/interview-simulator',
|
|
226
|
+
trackingTarget: 'topnav_resources_interview_simulator',
|
|
227
|
+
text: 'Interview Simulator',
|
|
228
|
+
type: 'link'
|
|
229
|
+
},
|
|
230
|
+
icon: /*#__PURE__*/_jsx(ProjectsIcon, {}),
|
|
231
|
+
description: 'Discover your potential through interviewing. Identify your strengths, get actionable feedback, and boost your confidence with customized practice — at any stage in your tech career.'
|
|
232
232
|
}];
|
|
233
233
|
export const inspirationLinks = [{
|
|
234
234
|
linkItem: {
|
|
235
|
-
id: '
|
|
236
|
-
href: '/resources/blog/category/
|
|
237
|
-
trackingTarget: '
|
|
238
|
-
text: '
|
|
235
|
+
id: 'learner-stories',
|
|
236
|
+
href: '/resources/blog/category/get-inspired',
|
|
237
|
+
trackingTarget: 'topnav_resources_learner_stories',
|
|
238
|
+
text: 'Learner stories',
|
|
239
239
|
type: 'link'
|
|
240
240
|
},
|
|
241
|
-
icon: /*#__PURE__*/_jsx(
|
|
242
|
-
description: '
|
|
241
|
+
icon: /*#__PURE__*/_jsx(CommentsIcon, {}),
|
|
242
|
+
description: 'Learn how coding can change your life (and the world) for the better.'
|
|
243
243
|
}, {
|
|
244
244
|
linkItem: {
|
|
245
|
-
id: '
|
|
246
|
-
href: '/resources/blog/category/
|
|
247
|
-
trackingTarget: '
|
|
248
|
-
text: '
|
|
245
|
+
id: 'learning-tips',
|
|
246
|
+
href: '/resources/blog/category/learning-tips',
|
|
247
|
+
trackingTarget: 'topnav_resources_learning_tips',
|
|
248
|
+
text: 'Learning Tips',
|
|
249
249
|
type: 'link'
|
|
250
250
|
},
|
|
251
|
-
icon: /*#__PURE__*/_jsx(
|
|
252
|
-
description:
|
|
251
|
+
icon: /*#__PURE__*/_jsx(InfoCircleIcon, {}),
|
|
252
|
+
description: "Learning to code — or thinking about it? Here's how to get started, plus tips and tricks for staying motivated."
|
|
253
253
|
}, {
|
|
254
254
|
linkItem: {
|
|
255
255
|
id: 'career-advice',
|
|
@@ -258,16 +258,16 @@ export const inspirationLinks = [{
|
|
|
258
258
|
text: 'Career Advice',
|
|
259
259
|
type: 'link'
|
|
260
260
|
},
|
|
261
|
-
icon: /*#__PURE__*/_jsx(
|
|
261
|
+
icon: /*#__PURE__*/_jsx(BriefcaseIcon, {}),
|
|
262
262
|
description: 'Explore different tech jobs and learn how to advance in your career and maintain work-life balance.'
|
|
263
263
|
}, {
|
|
264
264
|
linkItem: {
|
|
265
|
-
id: '
|
|
266
|
-
href: '/resources/blog/category/
|
|
267
|
-
trackingTarget: '
|
|
268
|
-
text: '
|
|
265
|
+
id: 'finding-a-job',
|
|
266
|
+
href: '/resources/blog/category/finding-a-job',
|
|
267
|
+
trackingTarget: 'topnav_resources_finding_a_job',
|
|
268
|
+
text: 'Finding a Job',
|
|
269
269
|
type: 'link'
|
|
270
270
|
},
|
|
271
|
-
icon: /*#__PURE__*/_jsx(
|
|
272
|
-
description: 'Learn how
|
|
271
|
+
icon: /*#__PURE__*/_jsx(SearchIcon, {}),
|
|
272
|
+
description: 'Want to break into the tech industry? Learn how to write a standout resume, build a professional portfolio, prepare for technical interviews, and negotiate job offers.'
|
|
273
273
|
}];
|
|
@@ -9,7 +9,7 @@ import { AppHeaderDropdownProvider } from '../AppHeaderDropdownProvider';
|
|
|
9
9
|
import { AppHeaderDropdownNavButton } from '../AppHeaderNavButton/AppHeaderDropdownNavButton';
|
|
10
10
|
import { useAppHeaderContext } from '../AppHeaderProvider';
|
|
11
11
|
import { AppHeaderResourcesSection } from '../AppHeaderResourcesSection';
|
|
12
|
-
import {
|
|
12
|
+
import { AppHeaderSection } from '../AppHeaderSection';
|
|
13
13
|
import { RESOURCES_NAV_SECTIONS } from './consts';
|
|
14
14
|
import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
|
|
15
15
|
const StyledAnimatedMegaMenuDropdown = /*#__PURE__*/_styled(AnimatedMegaMenuDropdown, {
|
|
@@ -21,7 +21,7 @@ const StyledAnimatedMegaMenuDropdown = /*#__PURE__*/_styled(AnimatedMegaMenuDrop
|
|
|
21
21
|
}) => displayGlobalNavRedesign ? '-58px' : isAnon ? '-9rem' : '-14rem', ";@media (min-width: 1261px){left:", ({
|
|
22
22
|
isAnon,
|
|
23
23
|
displayGlobalNavRedesign
|
|
24
|
-
}) => displayGlobalNavRedesign ? '-152px' : isAnon ? '-9rem' : '-14rem', ";}" + (process.env.NODE_ENV === "production" ? "" : "/*# sourceMappingURL=data:application/json;charset=utf-8;base64,
|
|
24
|
+
}) => displayGlobalNavRedesign ? '-152px' : isAnon ? '-9rem' : '-14rem', ";}" + (process.env.NODE_ENV === "production" ? "" : "/*# sourceMappingURL=data:application/json;charset=utf-8;base64,eyJ2ZXJzaW9uIjozLCJzb3VyY2VzIjpbIi4uLy4uLy4uLy4uL3NyYy9BcHBIZWFkZXIvQXBwSGVhZGVyRWxlbWVudHMvQXBwSGVhZGVyUmVzb3VyY2VzRHJvcGRvd24vaW5kZXgudHN4Il0sIm5hbWVzIjpbXSwibWFwcGluZ3MiOiJBQTJCRSIsImZpbGUiOiIuLi8uLi8uLi8uLi9zcmMvQXBwSGVhZGVyL0FwcEhlYWRlckVsZW1lbnRzL0FwcEhlYWRlclJlc291cmNlc0Ryb3Bkb3duL2luZGV4LnRzeCIsInNvdXJjZXNDb250ZW50IjpbImltcG9ydCB7IENvbG9yTW9kZSB9IGZyb20gJ0Bjb2RlY2FkZW15L2dhbXV0LXN0eWxlcyc7XG5pbXBvcnQgc3R5bGVkIGZyb20gJ0BlbW90aW9uL3N0eWxlZCc7XG5pbXBvcnQgeyB1c2VDYWxsYmFjaywgdXNlQ29udGV4dCwgdXNlRWZmZWN0LCB1c2VSZWYsIHVzZVN0YXRlIH0gZnJvbSAncmVhY3QnO1xuaW1wb3J0ICogYXMgUmVhY3QgZnJvbSAncmVhY3QnO1xuXG5pbXBvcnQgeyBHbG9iYWxOYXZSZWRlc2lnbkNvbnRleHQgfSBmcm9tICcuLi8uLi8uLi9HbG9iYWxIZWFkZXInO1xuaW1wb3J0IHsgZ2V0SGVhZGVyUmVzb3VyY2VzTGlzdCB9IGZyb20gJy4uLy4uLy4uL2xpYi9yZXNvdXJjZXNMaXN0JztcbmltcG9ydCB7XG4gIEFuaW1hdGVkTWVnYU1lbnVEcm9wZG93bixcbiAgQXBwSGVhZGVyQWN0aW9uLFxuICBBcHBIZWFkZXJSZXNvdXJjZXNEcm9wZG93bkl0ZW0sXG59IGZyb20gJy4uLy4uL3NoYXJlZCc7XG5pbXBvcnQgeyBBcHBIZWFkZXJEcm9wZG93blByb3ZpZGVyIH0gZnJvbSAnLi4vQXBwSGVhZGVyRHJvcGRvd25Qcm92aWRlcic7XG5pbXBvcnQgeyBBcHBIZWFkZXJEcm9wZG93bk5hdkJ1dHRvbiB9IGZyb20gJy4uL0FwcEhlYWRlck5hdkJ1dHRvbi9BcHBIZWFkZXJEcm9wZG93bk5hdkJ1dHRvbic7XG5pbXBvcnQgeyB1c2VBcHBIZWFkZXJDb250ZXh0IH0gZnJvbSAnLi4vQXBwSGVhZGVyUHJvdmlkZXInO1xuaW1wb3J0IHsgQXBwSGVhZGVyUmVzb3VyY2VzU2VjdGlvbiB9IGZyb20gJy4uL0FwcEhlYWRlclJlc291cmNlc1NlY3Rpb24nO1xuaW1wb3J0IHsgQXBwSGVhZGVyU2VjdGlvbiB9IGZyb20gJy4uL0FwcEhlYWRlclNlY3Rpb24nO1xuaW1wb3J0IHsgUkVTT1VSQ0VTX05BVl9TRUNUSU9OUyB9IGZyb20gJy4vY29uc3RzJztcblxuZXhwb3J0IHR5cGUgQXBwSGVhZGVyUmVzb3VyY2VEcm9wZG93blByb3BzID0gQXBwSGVhZGVyQWN0aW9uICYge1xuICBpdGVtOiBBcHBIZWFkZXJSZXNvdXJjZXNEcm9wZG93bkl0ZW07XG4gIGlzQW5vbjogYm9vbGVhbjtcbn07XG5cbmNvbnN0IFN0eWxlZEFuaW1hdGVkTWVnYU1lbnVEcm9wZG93biA9IHN0eWxlZChBbmltYXRlZE1lZ2FNZW51RHJvcGRvd24pPHtcbiAgaXNBbm9uOiBib29sZWFuO1xuICBkaXNwbGF5R2xvYmFsTmF2UmVkZXNpZ246IGJvb2xlYW47XG59PmBcbiAgbGVmdDogJHsoeyBpc0Fub24sIGRpc3BsYXlHbG9iYWxOYXZSZWRlc2lnbiB9KSA9PlxuICAgIGRpc3BsYXlHbG9iYWxOYXZSZWRlc2lnbiA/ICctNThweCcgOiBpc0Fub24gPyAnLTlyZW0nIDogJy0xNHJlbSd9O1xuXG4gIEBtZWRpYSAobWluLXdpZHRoOiAxMjYxcHgpIHtcbiAgICBsZWZ0OiAkeyh7IGlzQW5vbiwgZGlzcGxheUdsb2JhbE5hdlJlZGVzaWduIH0pID0+XG4gICAgICBkaXNwbGF5R2xvYmFsTmF2UmVkZXNpZ24gPyAnLTE1MnB4JyA6IGlzQW5vbiA/ICctOXJlbScgOiAnLTE0cmVtJ307XG4gIH1cbmA7XG5cbmV4cG9ydCBjb25zdCBBcHBIZWFkZXJSZXNvdXJjZXNEcm9wZG93bjogUmVhY3QuRkM8XG4gIEFwcEhlYWRlclJlc291cmNlRHJvcGRvd25Qcm9wc1xuPiA9ICh7IGFjdGlvbiwgaXRlbSwgaXNBbm9uIH0pID0+IHtcbiAgY29uc3QgeyB0ZXh0IH0gPSBpdGVtO1xuICBjb25zdCBjb250YWluZXJSZWYgPSB1c2VSZWY8SFRNTERpdkVsZW1lbnQgfCBudWxsPihudWxsKTtcbiAgY29uc3QgYnV0dG9uUmVmID0gdXNlUmVmPEhUTUxCdXR0b25FbGVtZW50PihudWxsKTtcbiAgY29uc3QgZHJvcGRvd25SZWYgPSB1c2VSZWY8SFRNTERpdkVsZW1lbnQgfCBudWxsPihudWxsKTtcbiAgY29uc3QgW2lzT3Blbiwgc2V0SXNPcGVuXSA9IHVzZVN0YXRlKGZhbHNlKTtcbiAgY29uc3QgeyBsYXN0T3BlbmVkRHJvcGRvd24sIHNldExhc3RPcGVuZWREcm9wZG93biB9ID0gdXNlQXBwSGVhZGVyQ29udGV4dCgpO1xuXG4gIC8vIEFkZCBzY3JvbGxiYXIgZm9yIHNob3J0IHNjcmVlbnMgYWZ0ZXIgdHJhbnNpdGlvbiAob3RoZXJ3aXNlIHNjcm9sbGJhciBhcHBlYXJzIGFuZCBkaXNzYXBlYXJzIGZvciBhZGVxdWF0ZSBoZWlnaHRzIGR1cmluZyB0cmFuc2l0aW9uKVxuICBjb25zdCBbYW5pbWF0aW9uQ29tcGxldGVTdHlsZXMsIHNldEFuaW1hdGlvbkNvbXBsZXRlU3R5bGVzXSA9IHVzZVN0YXRlKGZhbHNlKTtcblxuICBjb25zdCBoZWFkZXJSZXNvdXJjZXNMaXN0ID0gZ2V0SGVhZGVyUmVzb3VyY2VzTGlzdCgpO1xuXG4gIGNvbnN0IGFuaW1hdGlvbkZpbmlzaGVkID0gKCkgPT4ge1xuICAgIHNldEFuaW1hdGlvbkNvbXBsZXRlU3R5bGVzKGlzT3Blbik7XG4gICAgaWYgKGlzT3BlbiAmJiBkcm9wZG93blJlZi5jdXJyZW50KSB7XG4gICAgICBkcm9wZG93blJlZi5jdXJyZW50LnNjcm9sbFRvcCA9IDA7XG4gICAgfVxuICB9O1xuXG4gIGNvbnN0IHRvZ2dsZUlzT3BlbiA9ICgpID0+IHNldElzT3BlbigocHJldikgPT4gIXByZXYpO1xuXG4gIGNvbnN0IGhhbmRsZU9uQ2xpY2sgPSAoZXZlbnQ6IFJlYWN0Lk1vdXNlRXZlbnQpID0+IHtcbiAgICB0b2dnbGVJc09wZW4oKTtcbiAgICBpZiAoIWlzT3Blbikge1xuICAgICAgYWN0aW9uKGV2ZW50LCBpdGVtKTtcbiAgICAgIGlmIChzZXRMYXN0T3BlbmVkRHJvcGRvd24pIHtcbiAgICAgICAgc2V0TGFzdE9wZW5lZERyb3Bkb3duKHRleHQpO1xuICAgICAgfVxuICAgIH1cbiAgfTtcblxuICBjb25zdCBoYW5kbGVDbG9zZSA9IHVzZUNhbGxiYWNrKCgpID0+IHtcbiAgICBzZXRJc09wZW4oZmFsc2UpO1xuICAgIGJ1dHRvblJlZj8uY3VycmVudD8uZm9jdXMoKTtcbiAgfSwgW10pO1xuXG4gIHVzZUVmZmVjdCgoKSA9PiB7XG4gICAgaWYgKGxhc3RPcGVuZWREcm9wZG93biAhPT0gdGV4dCAmJiBpc09wZW4pIHtcbiAgICAgIHNldElzT3BlbihmYWxzZSk7XG4gICAgfVxuICAgIC8vIGVzbGludC1kaXNhYmxlLW5leHQtbGluZSByZWFjdC1ob29rcy9leGhhdXN0aXZlLWRlcHNcbiAgfSwgW2xhc3RPcGVuZWREcm9wZG93bl0pO1xuXG4gIHVzZUVmZmVjdCgoKSA9PiB7XG4gICAgZnVuY3Rpb24gaGFuZGxlQ2xpY2tPdXRzaWRlKGV2ZW50OiBNb3VzZUV2ZW50IHwgRXZlbnQpIHtcbiAgICAgIGNvbnN0IGNvbnRhaW5lciA9IGNvbnRhaW5lclJlZj8uY3VycmVudDtcbiAgICAgIGNvbnN0IGJ1dHRvbiA9IGJ1dHRvblJlZj8uY3VycmVudDtcbiAgICAgIGlmIChcbiAgICAgICAgaXNPcGVuICYmXG4gICAgICAgIGNvbnRhaW5lciAmJlxuICAgICAgICAhY29udGFpbmVyLmNvbnRhaW5zKGV2ZW50LnRhcmdldCBhcyBOb2RlKSAmJlxuICAgICAgICBidXR0b24gJiZcbiAgICAgICAgIWJ1dHRvbi5jb250YWlucyhldmVudC50YXJnZXQgYXMgTm9kZSlcbiAgICAgICkge1xuICAgICAgICBoYW5kbGVDbG9zZSgpO1xuICAgICAgfVxuICAgIH1cblxuICAgIGRvY3VtZW50LmFkZEV2ZW50TGlzdGVuZXIoJ21vdXNlZG93bicsIGhhbmRsZUNsaWNrT3V0c2lkZSk7XG4gICAgZG9jdW1lbnQuYWRkRXZlbnRMaXN0ZW5lcignYmx1cicsIGhhbmRsZUNsaWNrT3V0c2lkZSk7XG4gICAgcmV0dXJuICgpID0+IHtcbiAgICAgIGRvY3VtZW50LnJlbW92ZUV2ZW50TGlzdGVuZXIoJ21vdXNlZG93bicsIGhhbmRsZUNsaWNrT3V0c2lkZSk7XG4gICAgICBkb2N1bWVudC5yZW1vdmVFdmVudExpc3RlbmVyKCdibHVyJywgaGFuZGxlQ2xpY2tPdXRzaWRlKTtcbiAgICB9O1xuICB9LCBbY29udGFpbmVyUmVmLCBoYW5kbGVDbG9zZSwgaXNPcGVuXSk7XG5cbiAgY29uc3QgZGlzcGxheUdsb2JhbE5hdlJlZGVzaWduID0gdXNlQ29udGV4dChHbG9iYWxOYXZSZWRlc2lnbkNvbnRleHQpO1xuXG4gIHJldHVybiAoXG4gICAgPEFwcEhlYWRlckRyb3Bkb3duUHJvdmlkZXIgaGFuZGxlQ2xvc2U9e2hhbmRsZUNsb3NlfT5cbiAgICAgIDxBcHBIZWFkZXJEcm9wZG93bk5hdkJ1dHRvblxuICAgICAgICBidXR0b25SZWY9e2J1dHRvblJlZn1cbiAgICAgICAgaGFuZGxlT25DbGljaz17aGFuZGxlT25DbGlja31cbiAgICAgICAgaXNPcGVuPXtpc09wZW59XG4gICAgICAgIHRpdGxlPXt0ZXh0fVxuICAgICAgLz5cbiAgICAgIDxTdHlsZWRBbmltYXRlZE1lZ2FNZW51RHJvcGRvd25cbiAgICAgICAgaXNBbm9uPXtpc0Fub259XG4gICAgICAgIGRpc3BsYXlHbG9iYWxOYXZSZWRlc2lnbj17ZGlzcGxheUdsb2JhbE5hdlJlZGVzaWdufVxuICAgICAgICB0YWJJbmRleD17LTF9IC8vIHByZXZlbnQgZnJvbSBpbnRlcmZlcmluZyB3aXRoIEFwcEhlYWRlciBmb2N1cyBsb2dpY1xuICAgICAgICByZWY9e2Ryb3Bkb3duUmVmfVxuICAgICAgICBzdHlsZT17e1xuICAgICAgICAgIHRvcDogJzMuNXJlbScsXG4gICAgICAgICAgbWluV2lkdGg6ICc2NHJlbScsXG4gICAgICAgICAgbGVmdDogaXNBbm9uID8gJy0xNC41cmVtJyA6ICctMTkuNXJlbScsXG4gICAgICAgICAgb3ZlcmZsb3dZOiAnYXV0bycsXG4gICAgICAgICAgbWF4SGVpZ2h0OiBhbmltYXRpb25Db21wbGV0ZVN0eWxlcyA/ICc4NXZoJyA6IDAsXG4gICAgICAgICAgYmFja2dyb3VuZENvbG9yOiBkaXNwbGF5R2xvYmFsTmF2UmVkZXNpZ24gPyAndHJhbnNwYXJlbnQnIDogJycsXG4gICAgICAgIH19XG4gICAgICAgIGluaXRpYWw9e3sgYm9yZGVyV2lkdGg6IDAsIGhlaWdodDogMCB9fVxuICAgICAgICBhbmltYXRlPXt7XG4gICAgICAgICAgYm9yZGVyV2lkdGg6IGlzT3BlbiA/IChkaXNwbGF5R2xvYmFsTmF2UmVkZXNpZ24gPyAwIDogMSkgOiAwLFxuICAgICAgICAgIGhlaWdodDogaXNPcGVuID8gJ2ZpdC1jb250ZW50JyA6IDAsXG4gICAgICAgIH19XG4gICAgICAgIHRyYW5zaXRpb249e3sgZHVyYXRpb246IDAuMTc1IH19XG4gICAgICAgIGFyaWEtaGlkZGVuPXshaXNPcGVufVxuICAgICAgICBkYXRhLXRlc3RpZD1cInJlc291cmNlcy1tZW51LWRyb3Bkb3duXCJcbiAgICAgICAgb25BbmltYXRpb25Db21wbGV0ZT17YW5pbWF0aW9uRmluaXNoZWR9XG4gICAgICA+XG4gICAgICAgIHtkaXNwbGF5R2xvYmFsTmF2UmVkZXNpZ24gPyAoXG4gICAgICAgICAgPENvbG9yTW9kZSBtb2RlPVwibGlnaHRcIj5cbiAgICAgICAgICAgIDxBcHBIZWFkZXJTZWN0aW9uXG4gICAgICAgICAgICAgIGlzT3Blbj17aXNPcGVufVxuICAgICAgICAgICAgICByZWY9e2NvbnRhaW5lclJlZn1cbiAgICAgICAgICAgICAgbmF2U2VjdGlvbnM9e1JFU09VUkNFU19OQVZfU0VDVElPTlN9XG4gICAgICAgICAgICAvPlxuICAgICAgICAgIDwvQ29sb3JNb2RlPlxuICAgICAgICApIDogKFxuICAgICAgICAgIDxBcHBIZWFkZXJSZXNvdXJjZXNTZWN0aW9uXG4gICAgICAgICAgICBhY3Rpb249e2FjdGlvbn1cbiAgICAgICAgICAgIHJlZj17Y29udGFpbmVyUmVmfVxuICAgICAgICAgICAgaWQ9e2BtZW51LWNvbnRhaW5lciR7aXRlbS50ZXh0fWB9XG4gICAgICAgICAgICBpc09wZW49e2lzT3Blbn1cbiAgICAgICAgICAgIGhhbmRsZUNsb3NlPXsoKSA9PiBzZXRJc09wZW4oZmFsc2UpfVxuICAgICAgICAgICAgcmVzb3VyY2VzPXtoZWFkZXJSZXNvdXJjZXNMaXN0fVxuICAgICAgICAgIC8+XG4gICAgICAgICl9XG4gICAgICA8L1N0eWxlZEFuaW1hdGVkTWVnYU1lbnVEcm9wZG93bj5cbiAgICA8L0FwcEhlYWRlckRyb3Bkb3duUHJvdmlkZXI+XG4gICk7XG59O1xuIl19 */"));
|
|
25
25
|
export const AppHeaderResourcesDropdown = ({
|
|
26
26
|
action,
|
|
27
27
|
item,
|
|
@@ -121,7 +121,7 @@ export const AppHeaderResourcesDropdown = ({
|
|
|
121
121
|
onAnimationComplete: animationFinished,
|
|
122
122
|
children: displayGlobalNavRedesign ? /*#__PURE__*/_jsx(ColorMode, {
|
|
123
123
|
mode: "light",
|
|
124
|
-
children: /*#__PURE__*/_jsx(
|
|
124
|
+
children: /*#__PURE__*/_jsx(AppHeaderSection, {
|
|
125
125
|
isOpen: isOpen,
|
|
126
126
|
ref: containerRef,
|
|
127
127
|
navSections: RESOURCES_NAV_SECTIONS
|
|
@@ -3,7 +3,7 @@ import userEvent from '@testing-library/user-event';
|
|
|
3
3
|
import React from 'react';
|
|
4
4
|
import { GlobalHeaderItemClickContext } from '../../../GlobalHeader/context';
|
|
5
5
|
import { CATALOG_NAV_SECTIONS } from '../AppHeaderCatalogDropdown/consts';
|
|
6
|
-
import {
|
|
6
|
+
import { AppHeaderSection } from '.';
|
|
7
7
|
import { jsx as _jsx } from "react/jsx-runtime";
|
|
8
8
|
const mockOnClick = jest.fn();
|
|
9
9
|
const mockKeyDownEvents = jest.fn();
|
|
@@ -21,8 +21,8 @@ const defaultProps = {
|
|
|
21
21
|
const mockContextValue = {
|
|
22
22
|
globalHeaderItemClick: mockOnClick
|
|
23
23
|
};
|
|
24
|
-
describe('
|
|
25
|
-
const renderView = setupRtl(
|
|
24
|
+
describe('AppHeaderSection', () => {
|
|
25
|
+
const renderView = setupRtl(AppHeaderSection, defaultProps).options({
|
|
26
26
|
wrapper: ({
|
|
27
27
|
children
|
|
28
28
|
}) => /*#__PURE__*/_jsx(GlobalHeaderItemClickContext.Provider, {
|
|
@@ -0,0 +1,79 @@
|
|
|
1
|
+
import _styled from "@emotion/styled/base";
|
|
2
|
+
import { Box, FlexBox } from '@codecademy/gamut';
|
|
3
|
+
import { ArrowChevronRightIcon } from '@codecademy/gamut-icons';
|
|
4
|
+
import React from 'react';
|
|
5
|
+
import { useGlobalHeaderItemClick } from '../../../GlobalHeader/context';
|
|
6
|
+
import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-runtime";
|
|
7
|
+
const NavPanelContainer = /*#__PURE__*/_styled(Box, {
|
|
8
|
+
target: "ed97qwe1",
|
|
9
|
+
label: "NavPanelContainer"
|
|
10
|
+
})("display:", ({
|
|
11
|
+
isActive
|
|
12
|
+
}) => isActive ? 'block' : 'none', ";grid-column:2/span 12;grid-row:1/span 8;background-color:", ({
|
|
13
|
+
theme
|
|
14
|
+
}) => theme.colors.background, ";border-radius:", ({
|
|
15
|
+
isActive,
|
|
16
|
+
isFirst
|
|
17
|
+
}) => isActive && isFirst ? '0 8px 8px 8px' : '8px', ";padding:16px 32px 24px 32px;" + (process.env.NODE_ENV === "production" ? "" : "/*# sourceMappingURL=data:application/json;charset=utf-8;base64,eyJ2ZXJzaW9uIjozLCJzb3VyY2VzIjpbIi4uLy4uLy4uLy4uL3NyYy9BcHBIZWFkZXIvQXBwSGVhZGVyRWxlbWVudHMvQXBwSGVhZGVyU2VjdGlvbi9OYXZTZWN0aW9uLnRzeCJdLCJuYW1lcyI6W10sIm1hcHBpbmdzIjoiQUFzQjhFIiwiZmlsZSI6Ii4uLy4uLy4uLy4uL3NyYy9BcHBIZWFkZXIvQXBwSGVhZGVyRWxlbWVudHMvQXBwSGVhZGVyU2VjdGlvbi9OYXZTZWN0aW9uLnRzeCIsInNvdXJjZXNDb250ZW50IjpbImltcG9ydCB7IEJveCwgRmxleEJveCB9IGZyb20gJ0Bjb2RlY2FkZW15L2dhbXV0JztcbmltcG9ydCB7IEFycm93Q2hldnJvblJpZ2h0SWNvbiwgR2FtdXRJY29uUHJvcHMgfSBmcm9tICdAY29kZWNhZGVteS9nYW11dC1pY29ucyc7XG5pbXBvcnQgc3R5bGVkIGZyb20gJ0BlbW90aW9uL3N0eWxlZCc7XG5pbXBvcnQgUmVhY3QsIHsgUHJvcHNXaXRoQ2hpbGRyZW4gfSBmcm9tICdyZWFjdCc7XG5cbmltcG9ydCB7IHVzZUdsb2JhbEhlYWRlckl0ZW1DbGljayB9IGZyb20gJy4uLy4uLy4uL0dsb2JhbEhlYWRlci9jb250ZXh0JztcbmltcG9ydCB7XG4gIEFwcEhlYWRlckNhdGFsb2dEcm9wZG93bkl0ZW0sXG4gIEFwcEhlYWRlclJlc291cmNlc0Ryb3Bkb3duSXRlbSxcbn0gZnJvbSAnLi4vLi4vc2hhcmVkJztcblxudHlwZSBOYXZTZWN0aW9uUHJvcHMgPSBQcm9wc1dpdGhDaGlsZHJlbiAmIHtcbiAgYWN0aXZlVGFiOiBudW1iZXI7XG4gIGl0ZW06IEFwcEhlYWRlckNhdGFsb2dEcm9wZG93bkl0ZW0gfCBBcHBIZWFkZXJSZXNvdXJjZXNEcm9wZG93bkl0ZW07XG4gIHNldEFjdGl2ZVRhYjogKHRhYjogbnVtYmVyKSA9PiB2b2lkO1xuICBpY29uPzogUmVhY3QuQ29tcG9uZW50VHlwZTxHYW11dEljb25Qcm9wcz47XG4gIHRleHQ6IHN0cmluZztcbiAgaW5kZXg6IG51bWJlcjtcbiAgY2hpbGRyZW46IFJlYWN0LlJlYWN0Tm9kZTtcbiAgdGFiSW5kZXg/OiBudW1iZXI7XG59O1xuXG5jb25zdCBOYXZQYW5lbENvbnRhaW5lciA9IHN0eWxlZChCb3gpPHsgaXNBY3RpdmU6IGJvb2xlYW47IGlzRmlyc3Q6IGJvb2xlYW4gfT5gXG4gIGRpc3BsYXk6ICR7KHsgaXNBY3RpdmUgfSkgPT4gKGlzQWN0aXZlID8gJ2Jsb2NrJyA6ICdub25lJyl9O1xuICBncmlkLWNvbHVtbjogMiAvIHNwYW4gMTI7XG4gIGdyaWQtcm93OiAxIC8gc3BhbiA4O1xuICBiYWNrZ3JvdW5kLWNvbG9yOiAkeyh7IHRoZW1lIH0pID0+IHRoZW1lLmNvbG9ycy5iYWNrZ3JvdW5kfTtcbiAgYm9yZGVyLXJhZGl1czogJHsoeyBpc0FjdGl2ZSwgaXNGaXJzdCB9KSA9PlxuICAgIGlzQWN0aXZlICYmIGlzRmlyc3QgPyAnMCA4cHggOHB4IDhweCcgOiAnOHB4J307XG4gIHBhZGRpbmc6IDE2cHggMzJweCAyNHB4IDMycHg7XG5gO1xuXG5jb25zdCBTdHlsZWRCdXR0b24gPSBzdHlsZWQuYnV0dG9uPHsgaXNBY3RpdmU6IGJvb2xlYW47IGluZGV4OiBudW1iZXIgfT5gXG4gIGdyaWQtY29sdW1uOiAxO1xuICBncmlkLXJvdzogJHsoeyBpbmRleCB9KSA9PiBpbmRleCArIDF9O1xuICBwYWRkaW5nOiAxNnB4O1xuICBib3JkZXI6IG5vbmU7XG4gIGJvcmRlci1yYWRpdXM6ICR7KHsgaXNBY3RpdmUgfSkgPT4gKGlzQWN0aXZlID8gJzhweCAwIDAgOHB4JyA6ICc4cHgnKX07XG4gIGJhY2tncm91bmQ6IG5vbmU7XG4gIGN1cnNvcjogcG9pbnRlcjtcbiAgZm9udC1zaXplOiAxOHB4O1xuICBmb250LXdlaWdodDogNDAwO1xuICBjb2xvcjogJHsoeyB0aGVtZSwgaXNBY3RpdmUgfSkgPT5cbiAgICBpc0FjdGl2ZSA/IHRoZW1lLmNvbG9ycy5wcmltYXJ5IDogdGhlbWUuY29sb3JzLnRleHR9O1xuICB0ZXh0LWFsaWduOiBsZWZ0O1xuICB3aWR0aDogJHsoeyBpc0FjdGl2ZSB9KSA9PiAoaXNBY3RpdmUgPyAnMTAwJScgOiAnY2FsYygxMDAlIC0gOHB4KScpfTtcbiAgaGVpZ2h0OiA2MHB4O1xuICBkaXNwbGF5OiBmbGV4O1xuICBqdXN0aWZ5LWNvbnRlbnQ6IHNwYWNlLWJldHdlZW47XG4gIGFsaWduLWl0ZW1zOiBjZW50ZXI7XG4gIGJhY2tncm91bmQtY29sb3I6ICR7KHsgaXNBY3RpdmUsIHRoZW1lIH0pID0+XG4gICAgaXNBY3RpdmUgPyB0aGVtZS5jb2xvcnMuYmFja2dyb3VuZCA6IHRoZW1lLmNvbG9yc1snZ3JheS0xMDAnXX07XG5cbiAgI2Fycm93LWNoZXZyb24tcmlnaHQtaWNvbiB7XG4gICAgZGlzcGxheTogJHsoeyBpc0FjdGl2ZSB9KSA9PiAoaXNBY3RpdmUgPyAnYmxvY2snIDogJ25vbmUnKX07XG4gIH1cblxuICAmOmhvdmVyLFxuICAmOmZvY3VzIHtcbiAgICBiYWNrZ3JvdW5kLWNvbG9yOiAkeyh7IHRoZW1lLCBpc0FjdGl2ZSB9KSA9PlxuICAgICAgaXNBY3RpdmUgPyB0aGVtZS5jb2xvcnMuYmFja2dyb3VuZCA6IHRoZW1lLmNvbG9yc1snbmF2eS0xMDAnXX07XG4gICAgY29sb3I6ICR7KHsgdGhlbWUgfSkgPT4gdGhlbWUuY29sb3JzLnByaW1hcnl9O1xuICB9XG5gO1xuXG5jb25zdCBOYXZTZWN0aW9uID0gKHtcbiAgYWN0aXZlVGFiLFxuICBzZXRBY3RpdmVUYWIsXG4gIGljb246IEljb24sXG4gIHRleHQsXG4gIGluZGV4LFxuICBjaGlsZHJlbixcbiAgaXRlbSxcbiAgdGFiSW5kZXgsXG59OiBOYXZTZWN0aW9uUHJvcHMpID0+IHtcbiAgY29uc3QgeyBnbG9iYWxIZWFkZXJJdGVtQ2xpY2sgfSA9IHVzZUdsb2JhbEhlYWRlckl0ZW1DbGljaygpO1xuXG4gIHJldHVybiAoXG4gICAgPD5cbiAgICAgIDxTdHlsZWRCdXR0b25cbiAgICAgICAgaXNBY3RpdmU9e2FjdGl2ZVRhYiA9PT0gaW5kZXh9XG4gICAgICAgIGluZGV4PXtpbmRleH1cbiAgICAgICAgb25DbGljaz17KGV2ZW50KSA9PiB7XG4gICAgICAgICAgZ2xvYmFsSGVhZGVySXRlbUNsaWNrKGV2ZW50LCBpdGVtKTtcbiAgICAgICAgICBzZXRBY3RpdmVUYWIoaW5kZXgpO1xuICAgICAgICB9fVxuICAgICAgICBkYXRhLXRlc3RpZD17YG5hdi1zZWN0aW9uLSR7aXRlbS5pZH1gfVxuICAgICAgICBhcmlhLWV4cGFuZGVkPXthY3RpdmVUYWIgPT09IGluZGV4fVxuICAgICAgICB0YWJJbmRleD17dGFiSW5kZXh9XG4gICAgICA+XG4gICAgICAgIDxGbGV4Qm94IGdhcD17OH0gYWxpZ25JdGVtcz1cImNlbnRlclwiPlxuICAgICAgICAgIHtJY29uICYmIDxJY29uIC8+fVxuICAgICAgICAgIHt0ZXh0fVxuICAgICAgICA8L0ZsZXhCb3g+XG4gICAgICAgIDxBcnJvd0NoZXZyb25SaWdodEljb24gaWQ9XCJhcnJvdy1jaGV2cm9uLXJpZ2h0LWljb25cIiAvPlxuICAgICAgPC9TdHlsZWRCdXR0b24+XG5cbiAgICAgIDxOYXZQYW5lbENvbnRhaW5lciBpc0FjdGl2ZT17YWN0aXZlVGFiID09PSBpbmRleH0gaXNGaXJzdD17aW5kZXggPT09IDB9PlxuICAgICAgICB7Y2hpbGRyZW59XG4gICAgICA8L05hdlBhbmVsQ29udGFpbmVyPlxuICAgIDwvPlxuICApO1xufTtcbmV4cG9ydCBkZWZhdWx0IE5hdlNlY3Rpb247XG4iXX0= */"));
|
|
18
|
+
const StyledButton = /*#__PURE__*/_styled("button", {
|
|
19
|
+
target: "ed97qwe0",
|
|
20
|
+
label: "StyledButton"
|
|
21
|
+
})("grid-column:1;grid-row:", ({
|
|
22
|
+
index
|
|
23
|
+
}) => index + 1, ";padding:16px;border:none;border-radius:", ({
|
|
24
|
+
isActive
|
|
25
|
+
}) => isActive ? '8px 0 0 8px' : '8px', ";background:none;cursor:pointer;font-size:18px;font-weight:400;color:", ({
|
|
26
|
+
theme,
|
|
27
|
+
isActive
|
|
28
|
+
}) => isActive ? theme.colors.primary : theme.colors.text, ";text-align:left;width:", ({
|
|
29
|
+
isActive
|
|
30
|
+
}) => isActive ? '100%' : 'calc(100% - 8px)', ";height:60px;display:flex;justify-content:space-between;align-items:center;background-color:", ({
|
|
31
|
+
isActive,
|
|
32
|
+
theme
|
|
33
|
+
}) => isActive ? theme.colors.background : theme.colors['gray-100'], ";#arrow-chevron-right-icon{display:", ({
|
|
34
|
+
isActive
|
|
35
|
+
}) => isActive ? 'block' : 'none', ";}&:hover,&:focus{background-color:", ({
|
|
36
|
+
theme,
|
|
37
|
+
isActive
|
|
38
|
+
}) => isActive ? theme.colors.background : theme.colors['navy-100'], ";color:", ({
|
|
39
|
+
theme
|
|
40
|
+
}) => theme.colors.primary, ";}" + (process.env.NODE_ENV === "production" ? "" : "/*# sourceMappingURL=data:application/json;charset=utf-8;base64,eyJ2ZXJzaW9uIjozLCJzb3VyY2VzIjpbIi4uLy4uLy4uLy4uL3NyYy9BcHBIZWFkZXIvQXBwSGVhZGVyRWxlbWVudHMvQXBwSGVhZGVyU2VjdGlvbi9OYXZTZWN0aW9uLnRzeCJdLCJuYW1lcyI6W10sIm1hcHBpbmdzIjoiQUFnQ3dFIiwiZmlsZSI6Ii4uLy4uLy4uLy4uL3NyYy9BcHBIZWFkZXIvQXBwSGVhZGVyRWxlbWVudHMvQXBwSGVhZGVyU2VjdGlvbi9OYXZTZWN0aW9uLnRzeCIsInNvdXJjZXNDb250ZW50IjpbImltcG9ydCB7IEJveCwgRmxleEJveCB9IGZyb20gJ0Bjb2RlY2FkZW15L2dhbXV0JztcbmltcG9ydCB7IEFycm93Q2hldnJvblJpZ2h0SWNvbiwgR2FtdXRJY29uUHJvcHMgfSBmcm9tICdAY29kZWNhZGVteS9nYW11dC1pY29ucyc7XG5pbXBvcnQgc3R5bGVkIGZyb20gJ0BlbW90aW9uL3N0eWxlZCc7XG5pbXBvcnQgUmVhY3QsIHsgUHJvcHNXaXRoQ2hpbGRyZW4gfSBmcm9tICdyZWFjdCc7XG5cbmltcG9ydCB7IHVzZUdsb2JhbEhlYWRlckl0ZW1DbGljayB9IGZyb20gJy4uLy4uLy4uL0dsb2JhbEhlYWRlci9jb250ZXh0JztcbmltcG9ydCB7XG4gIEFwcEhlYWRlckNhdGFsb2dEcm9wZG93bkl0ZW0sXG4gIEFwcEhlYWRlclJlc291cmNlc0Ryb3Bkb3duSXRlbSxcbn0gZnJvbSAnLi4vLi4vc2hhcmVkJztcblxudHlwZSBOYXZTZWN0aW9uUHJvcHMgPSBQcm9wc1dpdGhDaGlsZHJlbiAmIHtcbiAgYWN0aXZlVGFiOiBudW1iZXI7XG4gIGl0ZW06IEFwcEhlYWRlckNhdGFsb2dEcm9wZG93bkl0ZW0gfCBBcHBIZWFkZXJSZXNvdXJjZXNEcm9wZG93bkl0ZW07XG4gIHNldEFjdGl2ZVRhYjogKHRhYjogbnVtYmVyKSA9PiB2b2lkO1xuICBpY29uPzogUmVhY3QuQ29tcG9uZW50VHlwZTxHYW11dEljb25Qcm9wcz47XG4gIHRleHQ6IHN0cmluZztcbiAgaW5kZXg6IG51bWJlcjtcbiAgY2hpbGRyZW46IFJlYWN0LlJlYWN0Tm9kZTtcbiAgdGFiSW5kZXg/OiBudW1iZXI7XG59O1xuXG5jb25zdCBOYXZQYW5lbENvbnRhaW5lciA9IHN0eWxlZChCb3gpPHsgaXNBY3RpdmU6IGJvb2xlYW47IGlzRmlyc3Q6IGJvb2xlYW4gfT5gXG4gIGRpc3BsYXk6ICR7KHsgaXNBY3RpdmUgfSkgPT4gKGlzQWN0aXZlID8gJ2Jsb2NrJyA6ICdub25lJyl9O1xuICBncmlkLWNvbHVtbjogMiAvIHNwYW4gMTI7XG4gIGdyaWQtcm93OiAxIC8gc3BhbiA4O1xuICBiYWNrZ3JvdW5kLWNvbG9yOiAkeyh7IHRoZW1lIH0pID0+IHRoZW1lLmNvbG9ycy5iYWNrZ3JvdW5kfTtcbiAgYm9yZGVyLXJhZGl1czogJHsoeyBpc0FjdGl2ZSwgaXNGaXJzdCB9KSA9PlxuICAgIGlzQWN0aXZlICYmIGlzRmlyc3QgPyAnMCA4cHggOHB4IDhweCcgOiAnOHB4J307XG4gIHBhZGRpbmc6IDE2cHggMzJweCAyNHB4IDMycHg7XG5gO1xuXG5jb25zdCBTdHlsZWRCdXR0b24gPSBzdHlsZWQuYnV0dG9uPHsgaXNBY3RpdmU6IGJvb2xlYW47IGluZGV4OiBudW1iZXIgfT5gXG4gIGdyaWQtY29sdW1uOiAxO1xuICBncmlkLXJvdzogJHsoeyBpbmRleCB9KSA9PiBpbmRleCArIDF9O1xuICBwYWRkaW5nOiAxNnB4O1xuICBib3JkZXI6IG5vbmU7XG4gIGJvcmRlci1yYWRpdXM6ICR7KHsgaXNBY3RpdmUgfSkgPT4gKGlzQWN0aXZlID8gJzhweCAwIDAgOHB4JyA6ICc4cHgnKX07XG4gIGJhY2tncm91bmQ6IG5vbmU7XG4gIGN1cnNvcjogcG9pbnRlcjtcbiAgZm9udC1zaXplOiAxOHB4O1xuICBmb250LXdlaWdodDogNDAwO1xuICBjb2xvcjogJHsoeyB0aGVtZSwgaXNBY3RpdmUgfSkgPT5cbiAgICBpc0FjdGl2ZSA/IHRoZW1lLmNvbG9ycy5wcmltYXJ5IDogdGhlbWUuY29sb3JzLnRleHR9O1xuICB0ZXh0LWFsaWduOiBsZWZ0O1xuICB3aWR0aDogJHsoeyBpc0FjdGl2ZSB9KSA9PiAoaXNBY3RpdmUgPyAnMTAwJScgOiAnY2FsYygxMDAlIC0gOHB4KScpfTtcbiAgaGVpZ2h0OiA2MHB4O1xuICBkaXNwbGF5OiBmbGV4O1xuICBqdXN0aWZ5LWNvbnRlbnQ6IHNwYWNlLWJldHdlZW47XG4gIGFsaWduLWl0ZW1zOiBjZW50ZXI7XG4gIGJhY2tncm91bmQtY29sb3I6ICR7KHsgaXNBY3RpdmUsIHRoZW1lIH0pID0+XG4gICAgaXNBY3RpdmUgPyB0aGVtZS5jb2xvcnMuYmFja2dyb3VuZCA6IHRoZW1lLmNvbG9yc1snZ3JheS0xMDAnXX07XG5cbiAgI2Fycm93LWNoZXZyb24tcmlnaHQtaWNvbiB7XG4gICAgZGlzcGxheTogJHsoeyBpc0FjdGl2ZSB9KSA9PiAoaXNBY3RpdmUgPyAnYmxvY2snIDogJ25vbmUnKX07XG4gIH1cblxuICAmOmhvdmVyLFxuICAmOmZvY3VzIHtcbiAgICBiYWNrZ3JvdW5kLWNvbG9yOiAkeyh7IHRoZW1lLCBpc0FjdGl2ZSB9KSA9PlxuICAgICAgaXNBY3RpdmUgPyB0aGVtZS5jb2xvcnMuYmFja2dyb3VuZCA6IHRoZW1lLmNvbG9yc1snbmF2eS0xMDAnXX07XG4gICAgY29sb3I6ICR7KHsgdGhlbWUgfSkgPT4gdGhlbWUuY29sb3JzLnByaW1hcnl9O1xuICB9XG5gO1xuXG5jb25zdCBOYXZTZWN0aW9uID0gKHtcbiAgYWN0aXZlVGFiLFxuICBzZXRBY3RpdmVUYWIsXG4gIGljb246IEljb24sXG4gIHRleHQsXG4gIGluZGV4LFxuICBjaGlsZHJlbixcbiAgaXRlbSxcbiAgdGFiSW5kZXgsXG59OiBOYXZTZWN0aW9uUHJvcHMpID0+IHtcbiAgY29uc3QgeyBnbG9iYWxIZWFkZXJJdGVtQ2xpY2sgfSA9IHVzZUdsb2JhbEhlYWRlckl0ZW1DbGljaygpO1xuXG4gIHJldHVybiAoXG4gICAgPD5cbiAgICAgIDxTdHlsZWRCdXR0b25cbiAgICAgICAgaXNBY3RpdmU9e2FjdGl2ZVRhYiA9PT0gaW5kZXh9XG4gICAgICAgIGluZGV4PXtpbmRleH1cbiAgICAgICAgb25DbGljaz17KGV2ZW50KSA9PiB7XG4gICAgICAgICAgZ2xvYmFsSGVhZGVySXRlbUNsaWNrKGV2ZW50LCBpdGVtKTtcbiAgICAgICAgICBzZXRBY3RpdmVUYWIoaW5kZXgpO1xuICAgICAgICB9fVxuICAgICAgICBkYXRhLXRlc3RpZD17YG5hdi1zZWN0aW9uLSR7aXRlbS5pZH1gfVxuICAgICAgICBhcmlhLWV4cGFuZGVkPXthY3RpdmVUYWIgPT09IGluZGV4fVxuICAgICAgICB0YWJJbmRleD17dGFiSW5kZXh9XG4gICAgICA+XG4gICAgICAgIDxGbGV4Qm94IGdhcD17OH0gYWxpZ25JdGVtcz1cImNlbnRlclwiPlxuICAgICAgICAgIHtJY29uICYmIDxJY29uIC8+fVxuICAgICAgICAgIHt0ZXh0fVxuICAgICAgICA8L0ZsZXhCb3g+XG4gICAgICAgIDxBcnJvd0NoZXZyb25SaWdodEljb24gaWQ9XCJhcnJvdy1jaGV2cm9uLXJpZ2h0LWljb25cIiAvPlxuICAgICAgPC9TdHlsZWRCdXR0b24+XG5cbiAgICAgIDxOYXZQYW5lbENvbnRhaW5lciBpc0FjdGl2ZT17YWN0aXZlVGFiID09PSBpbmRleH0gaXNGaXJzdD17aW5kZXggPT09IDB9PlxuICAgICAgICB7Y2hpbGRyZW59XG4gICAgICA8L05hdlBhbmVsQ29udGFpbmVyPlxuICAgIDwvPlxuICApO1xufTtcbmV4cG9ydCBkZWZhdWx0IE5hdlNlY3Rpb247XG4iXX0= */"));
|
|
41
|
+
const NavSection = ({
|
|
42
|
+
activeTab,
|
|
43
|
+
setActiveTab,
|
|
44
|
+
icon: Icon,
|
|
45
|
+
text,
|
|
46
|
+
index,
|
|
47
|
+
children,
|
|
48
|
+
item,
|
|
49
|
+
tabIndex
|
|
50
|
+
}) => {
|
|
51
|
+
const {
|
|
52
|
+
globalHeaderItemClick
|
|
53
|
+
} = useGlobalHeaderItemClick();
|
|
54
|
+
return /*#__PURE__*/_jsxs(_Fragment, {
|
|
55
|
+
children: [/*#__PURE__*/_jsxs(StyledButton, {
|
|
56
|
+
isActive: activeTab === index,
|
|
57
|
+
index: index,
|
|
58
|
+
onClick: event => {
|
|
59
|
+
globalHeaderItemClick(event, item);
|
|
60
|
+
setActiveTab(index);
|
|
61
|
+
},
|
|
62
|
+
"data-testid": `nav-section-${item.id}`,
|
|
63
|
+
"aria-expanded": activeTab === index,
|
|
64
|
+
tabIndex: tabIndex,
|
|
65
|
+
children: [/*#__PURE__*/_jsxs(FlexBox, {
|
|
66
|
+
gap: 8,
|
|
67
|
+
alignItems: "center",
|
|
68
|
+
children: [Icon && /*#__PURE__*/_jsx(Icon, {}), text]
|
|
69
|
+
}), /*#__PURE__*/_jsx(ArrowChevronRightIcon, {
|
|
70
|
+
id: "arrow-chevron-right-icon"
|
|
71
|
+
})]
|
|
72
|
+
}), /*#__PURE__*/_jsx(NavPanelContainer, {
|
|
73
|
+
isActive: activeTab === index,
|
|
74
|
+
isFirst: index === 0,
|
|
75
|
+
children: children
|
|
76
|
+
})]
|
|
77
|
+
});
|
|
78
|
+
};
|
|
79
|
+
export default NavSection;
|
package/dist/AppHeader/AppHeaderElements/{AppHeaderSectionVariant → AppHeaderSection}/PanelLayout.js
RENAMED
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
import { Anchor, FlexBox, Text } from '@codecademy/gamut';
|
|
1
|
+
import { Anchor, Box, FlexBox, Text } from '@codecademy/gamut';
|
|
2
2
|
import { MiniArrowRightIcon } from '@codecademy/gamut-icons';
|
|
3
3
|
import { useGlobalHeaderItemClick } from '../../../GlobalHeader/context';
|
|
4
4
|
import { useAppHeaderDropdownContext } from '../AppHeaderDropdownProvider';
|
|
@@ -24,12 +24,15 @@ export const PanelLayout = ({
|
|
|
24
24
|
md: 16,
|
|
25
25
|
lg: 0
|
|
26
26
|
},
|
|
27
|
-
children: [/*#__PURE__*/
|
|
28
|
-
|
|
29
|
-
|
|
30
|
-
|
|
31
|
-
|
|
32
|
-
|
|
27
|
+
children: [/*#__PURE__*/_jsxs(Box, {
|
|
28
|
+
children: [/*#__PURE__*/_jsx(Text, {
|
|
29
|
+
as: "h2",
|
|
30
|
+
variant: "title-sm",
|
|
31
|
+
children: heading
|
|
32
|
+
}), /*#__PURE__*/_jsx(Text, {
|
|
33
|
+
mt: 8,
|
|
34
|
+
children: description
|
|
35
|
+
})]
|
|
33
36
|
}), children, linkItem && /*#__PURE__*/_jsx(FlexBox, {
|
|
34
37
|
justifyContent: "center",
|
|
35
38
|
children: /*#__PURE__*/_jsx(Anchor, {
|
package/dist/AppHeader/AppHeaderElements/{AppHeaderSectionVariant → AppHeaderSection}/index.d.ts
RENAMED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
import React, { RefObject } from 'react';
|
|
2
2
|
import { AppHeaderCatalogDropdownItem, AppHeaderResourcesDropdownItem } from '../../shared';
|
|
3
|
-
export type
|
|
3
|
+
export type AppHeaderSectionProps = {
|
|
4
4
|
isOpen?: boolean;
|
|
5
5
|
keyDownEvents?: (event: React.KeyboardEvent) => void;
|
|
6
6
|
ref?: RefObject<HTMLDivElement>;
|
|
@@ -14,4 +14,4 @@ export type AppHeaderSectionVariantProps = {
|
|
|
14
14
|
tabIndex: number;
|
|
15
15
|
}) => JSX.Element;
|
|
16
16
|
};
|
|
17
|
-
export declare const
|
|
17
|
+
export declare const AppHeaderSection: React.ForwardRefExoticComponent<Omit<AppHeaderSectionProps, "ref"> & React.RefAttributes<HTMLDivElement>>;
|