@codecademy/brand 3.1.0-alpha.f5de9eab76.0 → 3.2.0

package/dist/AppHeader/AppHeaderElements/AppHeaderCatalogDropdown/NavPanels.js

@@ -6,7 +6,7 @@ import { CourseDifficulty } from '../../../ContentGroupBaseCard/types';
 import { useGlobalHeaderItemClick } from '../../../GlobalHeader/context';
 import { liveLearningHubItems, topLanguages } from '../../../lib/catalogList';
 import { AppHeaderDietCard } from '../AppHeaderDietCard';
-import { PanelLayout } from '../AppHeaderSectionVariant/PanelLayout';
+import { PanelLayout } from '../AppHeaderSection/PanelLayout';
 import { jsxs as _jsxs, jsx as _jsx } from "react/jsx-runtime";
 export const CourseTopicsPanel = ({
   tabIndex = 0

package/dist/AppHeader/AppHeaderElements/AppHeaderCatalogDropdown/index.js

@@ -8,7 +8,7 @@ import { AppHeaderCatalogSection } from '../AppHeaderCatalogSection';
 import { AppHeaderDropdownProvider } from '../AppHeaderDropdownProvider';
 import { AppHeaderDropdownNavButton } from '../AppHeaderNavButton/AppHeaderDropdownNavButton';
 import { useAppHeaderContext } from '../AppHeaderProvider';
-import { AppHeaderSectionVariant } from '../AppHeaderSectionVariant';
+import { AppHeaderSection } from '../AppHeaderSection';
 import { CATALOG_NAV_SECTIONS } from './consts';
 import { MarketingBanner } from './MarketingBanner';
 import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
@@ -21,7 +21,7 @@ const StyledAnimatedMegaMenuDropdown = /*#__PURE__*/_styled(AnimatedMegaMenuDrop
 }) => displayGlobalNavRedesign ? '-58px' : isAnon ? '-9rem' : '-14rem', ";@media (min-width: 1261px){left:", ({
   isAnon,
   displayGlobalNavRedesign
-}) => displayGlobalNavRedesign ? '-152px' : isAnon ? '-9rem' : '-14rem', ";}" + (process.env.NODE_ENV === "production" ? "" : "/*# sourceMappingURL=data:application/json;charset=utf-8;base64,eyJ2ZXJzaW9uIjozLCJzb3VyY2VzIjpbIi4uLy4uLy4uLy4uL3NyYy9BcHBIZWFkZXIvQXBwSGVhZGVyRWxlbWVudHMvQXBwSGVhZGVyQ2F0YWxvZ0Ryb3Bkb3duL2luZGV4LnRzeCJdLCJuYW1lcyI6W10sIm1hcHBpbmdzIjoiQUEyQkUiLCJmaWxlIjoiLi4vLi4vLi4vLi4vc3JjL0FwcEhlYWRlci9BcHBIZWFkZXJFbGVtZW50cy9BcHBIZWFkZXJDYXRhbG9nRHJvcGRvd24vaW5kZXgudHN4Iiwic291cmNlc0NvbnRlbnQiOlsiaW1wb3J0IHsgQ29sb3JNb2RlIH0gZnJvbSAnQGNvZGVjYWRlbXkvZ2FtdXQtc3R5bGVzJztcbmltcG9ydCBzdHlsZWQgZnJvbSAnQGVtb3Rpb24vc3R5bGVkJztcbmltcG9ydCB7IHVzZUNhbGxiYWNrLCB1c2VDb250ZXh0LCB1c2VFZmZlY3QsIHVzZVJlZiwgdXNlU3RhdGUgfSBmcm9tICdyZWFjdCc7XG5pbXBvcnQgKiBhcyBSZWFjdCBmcm9tICdyZWFjdCc7XG5cbmltcG9ydCB7IEdsb2JhbE5hdlJlZGVzaWduQ29udGV4dCB9IGZyb20gJy4uLy4uLy4uL0dsb2JhbEhlYWRlcic7XG5pbXBvcnQge1xuICBBbmltYXRlZE1lZ2FNZW51RHJvcGRvd24sXG4gIEFwcEhlYWRlckFjdGlvbixcbiAgQXBwSGVhZGVyQ2F0YWxvZ0Ryb3Bkb3duSXRlbSxcbn0gZnJvbSAnLi4vLi4vc2hhcmVkJztcbmltcG9ydCB7IEFwcEhlYWRlckNhdGFsb2dTZWN0aW9uIH0gZnJvbSAnLi4vQXBwSGVhZGVyQ2F0YWxvZ1NlY3Rpb24nO1xuaW1wb3J0IHsgQXBwSGVhZGVyRHJvcGRvd25Qcm92aWRlciB9IGZyb20gJy4uL0FwcEhlYWRlckRyb3Bkb3duUHJvdmlkZXInO1xuaW1wb3J0IHsgQXBwSGVhZGVyRHJvcGRvd25OYXZCdXR0b24gfSBmcm9tICcuLi9BcHBIZWFkZXJOYXZCdXR0b24vQXBwSGVhZGVyRHJvcGRvd25OYXZCdXR0b24nO1xuaW1wb3J0IHsgdXNlQXBwSGVhZGVyQ29udGV4dCB9IGZyb20gJy4uL0FwcEhlYWRlclByb3ZpZGVyJztcbmltcG9ydCB7IEFwcEhlYWRlclNlY3Rpb25WYXJpYW50IH0gZnJvbSAnLi4vQXBwSGVhZGVyU2VjdGlvblZhcmlhbnQnO1xuaW1wb3J0IHsgQ0FUQUxPR19OQVZfU0VDVElPTlMgfSBmcm9tICcuL2NvbnN0cyc7XG5pbXBvcnQgeyBNYXJrZXRpbmdCYW5uZXIgfSBmcm9tICcuL01hcmtldGluZ0Jhbm5lcic7XG5cbmV4cG9ydCB0eXBlIEFwcEhlYWRlckNhdGFsb2dEcm9wZG93blByb3BzID0gQXBwSGVhZGVyQWN0aW9uICYge1xuICBpdGVtOiBBcHBIZWFkZXJDYXRhbG9nRHJvcGRvd25JdGVtO1xuICBpc0Fub246IGJvb2xlYW47XG59O1xuXG5jb25zdCBTdHlsZWRBbmltYXRlZE1lZ2FNZW51RHJvcGRvd24gPSBzdHlsZWQoQW5pbWF0ZWRNZWdhTWVudURyb3Bkb3duKTx7XG4gIGlzQW5vbjogYm9vbGVhbjtcbiAgZGlzcGxheUdsb2JhbE5hdlJlZGVzaWduOiBib29sZWFuO1xufT5gXG4gIGxlZnQ6ICR7KHsgaXNBbm9uLCBkaXNwbGF5R2xvYmFsTmF2UmVkZXNpZ24gfSkgPT5cbiAgICBkaXNwbGF5R2xvYmFsTmF2UmVkZXNpZ24gPyAnLTU4cHgnIDogaXNBbm9uID8gJy05cmVtJyA6ICctMTRyZW0nfTtcblxuICBAbWVkaWEgKG1pbi13aWR0aDogMTI2MXB4KSB7XG4gICAgbGVmdDogJHsoeyBpc0Fub24sIGRpc3BsYXlHbG9iYWxOYXZSZWRlc2lnbiB9KSA9PlxuICAgICAgZGlzcGxheUdsb2JhbE5hdlJlZGVzaWduID8gJy0xNTJweCcgOiBpc0Fub24gPyAnLTlyZW0nIDogJy0xNHJlbSd9O1xuICB9XG5gO1xuXG5leHBvcnQgY29uc3QgQXBwSGVhZGVyQ2F0YWxvZ0Ryb3Bkb3duOiBSZWFjdC5GQzxcbiAgQXBwSGVhZGVyQ2F0YWxvZ0Ryb3Bkb3duUHJvcHNcbj4gPSAoeyBhY3Rpb24sIGl0ZW0sIGlzQW5vbiB9KSA9PiB7XG4gIGNvbnN0IHsgdGV4dCB9ID0gaXRlbTtcbiAgY29uc3QgY29udGFpbmVyUmVmID0gdXNlUmVmPEhUTUxEaXZFbGVtZW50IHwgbnVsbD4obnVsbCk7XG4gIGNvbnN0IGJ1dHRvblJlZiA9IHVzZVJlZjxIVE1MQnV0dG9uRWxlbWVudD4obnVsbCk7XG4gIGNvbnN0IFtpc09wZW4sIHNldElzT3Blbl0gPSB1c2VTdGF0ZShmYWxzZSk7XG4gIGNvbnN0IHsgbGFzdE9wZW5lZERyb3Bkb3duLCBzZXRMYXN0T3BlbmVkRHJvcGRvd24gfSA9IHVzZUFwcEhlYWRlckNvbnRleHQoKTtcblxuICBjb25zdCBmb2N1c0J1dHRvbiA9ICgpID0+IHtcbiAgICBidXR0b25SZWY/LmN1cnJlbnQ/LmZvY3VzKCk7XG4gIH07XG5cbiAgY29uc3QgdG9nZ2xlSXNPcGVuID0gKCkgPT4gc2V0SXNPcGVuKChwcmV2KSA9PiAhcHJldik7XG5cbiAgY29uc3QgaGFuZGxlT25DbGljayA9IChldmVudDogUmVhY3QuTW91c2VFdmVudCkgPT4ge1xuICAgIHRvZ2dsZUlzT3BlbigpO1xuXG4gICAgaWYgKCFpc09wZW4pIHtcbiAgICAgIGFjdGlvbihldmVudCwgaXRlbSk7XG4gICAgICBpZiAoc2V0TGFzdE9wZW5lZERyb3Bkb3duKSB7XG4gICAgICAgIHNldExhc3RPcGVuZWREcm9wZG93bih0ZXh0KTtcbiAgICAgIH1cbiAgICB9XG4gIH07XG5cbiAgY29uc3QgaGFuZGxlQ2xvc2UgPSB1c2VDYWxsYmFjaygoKSA9PiB7XG4gICAgc2V0SXNPcGVuKGZhbHNlKTtcbiAgICBmb2N1c0J1dHRvbigpO1xuICB9LCBbXSk7XG5cbiAgdXNlRWZmZWN0KCgpID0+IHtcbiAgICBpZiAobGFzdE9wZW5lZERyb3Bkb3duICE9PSB0ZXh0ICYmIGlzT3Blbikge1xuICAgICAgc2V0SXNPcGVuKGZhbHNlKTtcbiAgICB9XG4gICAgLy8gZXNsaW50LWRpc2FibGUtbmV4dC1saW5lIHJlYWN0LWhvb2tzL2V4aGF1c3RpdmUtZGVwc1xuICB9LCBbbGFzdE9wZW5lZERyb3Bkb3duXSk7XG5cbiAgdXNlRWZmZWN0KCgpID0+IHtcbiAgICBmdW5jdGlvbiBoYW5kbGVDbGlja091dHNpZGUoZXZlbnQ6IE1vdXNlRXZlbnQgfCBFdmVudCkge1xuICAgICAgY29uc3QgY29udGFpbmVyID0gY29udGFpbmVyUmVmPy5jdXJyZW50O1xuICAgICAgY29uc3QgYnV0dG9uID0gYnV0dG9uUmVmPy5jdXJyZW50O1xuICAgICAgaWYgKFxuICAgICAgICBpc09wZW4gJiZcbiAgICAgICAgY29udGFpbmVyICYmXG4gICAgICAgICFjb250YWluZXIuY29udGFpbnMoZXZlbnQudGFyZ2V0IGFzIE5vZGUpICYmXG4gICAgICAgIGJ1dHRvbiAmJlxuICAgICAgICAhYnV0dG9uLmNvbnRhaW5zKGV2ZW50LnRhcmdldCBhcyBOb2RlKVxuICAgICAgKSB7XG4gICAgICAgIGhhbmRsZUNsb3NlKCk7XG4gICAgICB9XG4gICAgfVxuXG4gICAgZG9jdW1lbnQuYWRkRXZlbnRMaXN0ZW5lcignbW91c2Vkb3duJywgaGFuZGxlQ2xpY2tPdXRzaWRlKTtcbiAgICBkb2N1bWVudC5hZGRFdmVudExpc3RlbmVyKCdibHVyJywgaGFuZGxlQ2xpY2tPdXRzaWRlKTtcbiAgICByZXR1cm4gKCkgPT4ge1xuICAgICAgZG9jdW1lbnQucmVtb3ZlRXZlbnRMaXN0ZW5lcignbW91c2Vkb3duJywgaGFuZGxlQ2xpY2tPdXRzaWRlKTtcbiAgICAgIGRvY3VtZW50LnJlbW92ZUV2ZW50TGlzdGVuZXIoJ2JsdXInLCBoYW5kbGVDbGlja091dHNpZGUpO1xuICAgIH07XG4gIH0sIFtjb250YWluZXJSZWYsIGhhbmRsZUNsb3NlLCBpc09wZW5dKTtcbiAgY29uc3QgZGlzcGxheUdsb2JhbE5hdlJlZGVzaWduID0gdXNlQ29udGV4dChHbG9iYWxOYXZSZWRlc2lnbkNvbnRleHQpO1xuXG4gIHJldHVybiAoXG4gICAgPEFwcEhlYWRlckRyb3Bkb3duUHJvdmlkZXIgaGFuZGxlQ2xvc2U9e2hhbmRsZUNsb3NlfT5cbiAgICAgIDxBcHBIZWFkZXJEcm9wZG93bk5hdkJ1dHRvblxuICAgICAgICBidXR0b25SZWY9e2J1dHRvblJlZn1cbiAgICAgICAgaGFuZGxlT25DbGljaz17aGFuZGxlT25DbGlja31cbiAgICAgICAgaXNPcGVuPXtpc09wZW59XG4gICAgICAgIHRpdGxlPXt0ZXh0fVxuICAgICAgLz5cbiAgICAgIDxTdHlsZWRBbmltYXRlZE1lZ2FNZW51RHJvcGRvd25cbiAgICAgICAgaXNBbm9uPXtpc0Fub259XG4gICAgICAgIGRpc3BsYXlHbG9iYWxOYXZSZWRlc2lnbj17ZGlzcGxheUdsb2JhbE5hdlJlZGVzaWdufVxuICAgICAgICBzdHlsZT17e1xuICAgICAgICAgIHRvcDogJzMuNXJlbScsXG4gICAgICAgICAgbWluV2lkdGg6ICc2NHJlbScsXG4gICAgICAgICAgYmFja2dyb3VuZENvbG9yOiBkaXNwbGF5R2xvYmFsTmF2UmVkZXNpZ24gPyAndHJhbnNwYXJlbnQnIDogJycsXG4gICAgICAgIH19XG4gICAgICAgIGluaXRpYWw9e3sgYm9yZGVyV2lkdGg6IDAsIGhlaWdodDogMCB9fVxuICAgICAgICBhbmltYXRlPXt7XG4gICAgICAgICAgYm9yZGVyV2lkdGg6IGlzT3BlbiA/IChkaXNwbGF5R2xvYmFsTmF2UmVkZXNpZ24gPyAwIDogMSkgOiAwLFxuICAgICAgICAgIGhlaWdodDogaXNPcGVuID8gJ2ZpdC1jb250ZW50JyA6IDAsXG4gICAgICAgIH19XG4gICAgICAgIHRyYW5zaXRpb249e3sgZHVyYXRpb246IDAuMTc1IH19XG4gICAgICAgIGFyaWEtaGlkZGVuPXshaXNPcGVufVxuICAgICAgICBkYXRhLXRlc3RpZD1cImNhdGFsb2ctbWVudS1kcm9wZG93blwiXG4gICAgICA+XG4gICAgICAgIHtkaXNwbGF5R2xvYmFsTmF2UmVkZXNpZ24gPyAoXG4gICAgICAgICAgPENvbG9yTW9kZSBtb2RlPVwibGlnaHRcIj5cbiAgICAgICAgICAgIDxBcHBIZWFkZXJTZWN0aW9uVmFyaWFudFxuICAgICAgICAgICAgICBpc09wZW49e2lzT3Blbn1cbiAgICAgICAgICAgICAgcmVmPXtjb250YWluZXJSZWZ9XG4gICAgICAgICAgICAgIG5hdlNlY3Rpb25zPXtDQVRBTE9HX05BVl9TRUNUSU9OU31cbiAgICAgICAgICAgICAgTWFya2V0aW5nQmFubmVyPXtNYXJrZXRpbmdCYW5uZXJ9XG4gICAgICAgICAgICAvPlxuICAgICAgICAgIDwvQ29sb3JNb2RlPlxuICAgICAgICApIDogKFxuICAgICAgICAgIDxBcHBIZWFkZXJDYXRhbG9nU2VjdGlvblxuICAgICAgICAgICAgYWN0aW9uPXthY3Rpb259XG4gICAgICAgICAgICBpdGVtPXtpdGVtfVxuICAgICAgICAgICAgcmVmPXtjb250YWluZXJSZWZ9XG4gICAgICAgICAgICBpZD17YG1lbnUtY29udGFpbmVyJHtpdGVtLnRleHR9YH1cbiAgICAgICAgICAgIGlzT3Blbj17aXNPcGVufVxuICAgICAgICAgICAgaGFuZGxlQ2xvc2U9eygpID0+IHNldElzT3BlbihmYWxzZSl9XG4gICAgICAgICAgLz5cbiAgICAgICAgKX1cbiAgICAgIDwvU3R5bGVkQW5pbWF0ZWRNZWdhTWVudURyb3Bkb3duPlxuICAgIDwvQXBwSGVhZGVyRHJvcGRvd25Qcm92aWRlcj5cbiAgKTtcbn07XG4iXX0= */"));
+}) => 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= */"));
 export const AppHeaderCatalogDropdown = ({
   action,
   item,
@@ -106,7 +106,7 @@ export const AppHeaderCatalogDropdown = ({
       "data-testid": "catalog-menu-dropdown",
       children: displayGlobalNavRedesign ? /*#__PURE__*/_jsx(ColorMode, {
         mode: "light",
-        children: /*#__PURE__*/_jsx(AppHeaderSectionVariant, {
+        children: /*#__PURE__*/_jsx(AppHeaderSection, {
           isOpen: isOpen,
           ref: containerRef,
           navSections: CATALOG_NAV_SECTIONS,

package/dist/AppHeader/AppHeaderElements/AppHeaderFeatureCard/index.js

@@ -10,7 +10,7 @@ const StyledCard = /*#__PURE__*/_styled(Card, {
   theme
 }) => theme.colors.primary, ";border-color:", ({
   theme
-}) => theme.colors.primary, ";}" + (process.env.NODE_ENV === "production" ? "" : "/*# sourceMappingURL=data:application/json;charset=utf-8;base64,eyJ2ZXJzaW9uIjozLCJzb3VyY2VzIjpbIi4uLy4uLy4uLy4uL3NyYy9BcHBIZWFkZXIvQXBwSGVhZGVyRWxlbWVudHMvQXBwSGVhZGVyRmVhdHVyZUNhcmQvaW5kZXgudHN4Il0sIm5hbWVzIjpbXSwibWFwcGluZ3MiOiJBQU8rQiIsImZpbGUiOiIuLi8uLi8uLi8uLi9zcmMvQXBwSGVhZGVyL0FwcEhlYWRlckVsZW1lbnRzL0FwcEhlYWRlckZlYXR1cmVDYXJkL2luZGV4LnRzeCIsInNvdXJjZXNDb250ZW50IjpbImltcG9ydCB7IEJveCwgQ2FyZCwgRmxleEJveCwgVGV4dCB9IGZyb20gJ0Bjb2RlY2FkZW15L2dhbXV0JztcbmltcG9ydCB7IEdyaWREZW5zZSB9IGZyb20gJ0Bjb2RlY2FkZW15L2dhbXV0LXBhdHRlcm5zJztcbmltcG9ydCB7IHRoZW1lIH0gZnJvbSAnQGNvZGVjYWRlbXkvZ2FtdXQtc3R5bGVzJztcbmltcG9ydCBzdHlsZWQgZnJvbSAnQGVtb3Rpb24vc3R5bGVkJztcblxuaW1wb3J0IHsgQXBwSGVhZGVyQ2FyZEl0ZW0gfSBmcm9tICcuLi9BcHBIZWFkZXJSZXNvdXJjZXNEcm9wZG93bi9jb25zdHMnO1xuXG5jb25zdCBTdHlsZWRDYXJkID0gc3R5bGVkKENhcmQpYFxuICAmOmhvdmVyIHtcbiAgICBjb2xvcjogJHsoeyB0aGVtZSB9KSA9PiB0aGVtZS5jb2xvcnMucHJpbWFyeX07XG4gICAgYm9yZGVyLWNvbG9yOiAkeyh7IHRoZW1lIH0pID0+IHRoZW1lLmNvbG9ycy5wcmltYXJ5fTtcbiAgfVxuYDtcblxuZXhwb3J0IGNvbnN0IEFwcEhlYWRlckZlYXR1cmVDYXJkID0gKHsgaXRlbSB9OiB7IGl0ZW06IEFwcEhlYWRlckNhcmRJdGVtIH0pID0+IHtcbiAgcmV0dXJuIChcbiAgICA8U3R5bGVkQ2FyZFxuICAgICAgaXNJbnRlcmFjdGl2ZVxuICAgICAgcHg9ezh9XG4gICAgICBweT17MjR9XG4gICAgICBib3JkZXJSYWRpdXM9XCJsZ1wiXG4gICAgICBib3JkZXI9ezF9XG4gICAgICBib3JkZXJDb2xvcj1cImJvcmRlci10ZXJ0aWFyeVwiXG4gICAgICBkaXNwbGF5PVwiZmxleFwiXG4gICAgICBhbGlnbkl0ZW1zPVwiZmxleC1zdGFydFwiXG4gICAgICBmbGV4RGlyZWN0aW9uPVwiY29sdW1uXCJcbiAgICAgIGhlaWdodD1cIjEwMCVcIlxuICAgID5cbiAgICAgIDxGbGV4Qm94IGFsaWduSXRlbXM9XCJjZW50ZXJcIiBnYXA9ezh9PlxuICAgICAgICA8Qm94XG4gICAgICAgICAgYmFja2dyb3VuZD17dGhlbWUuY29sb3JzWyduYXZ5LTIwMCddfVxuICAgICAgICAgIGJvcmRlclJhZGl1cz1cIm1kXCJcbiAgICAgICAgICBwPXs0fVxuICAgICAgICAgIGhlaWdodD17MjZ9XG4gICAgICAgID5cbiAgICAgICAgICB7aXRlbS5pY29ufVxuICAgICAgICA8L0JveD5cbiAgICAgICAgPFRleHQgdmFyaWFudD1cInRpdGxlLXhzXCI+e2l0ZW0ubGlua0l0ZW0udGV4dH08L1RleHQ+XG4gICAgICA8L0ZsZXhCb3g+XG4gICAgICA8Qm94IHdpZHRoPVwiMTAwJVwiPlxuICAgICAgICA8R3JpZERlbnNlIGhlaWdodD17NH0gLz5cbiAgICAgIDwvQm94PlxuICAgICAgPFRleHQgdmFyaWFudD1cInAtYmFzZVwiPntpdGVtLmRlc2NyaXB0aW9ufTwvVGV4dD5cbiAgICA8L1N0eWxlZENhcmQ+XG4gICk7XG59O1xuIl19 */"));
+}) => theme.colors.primary, ";}" + (process.env.NODE_ENV === "production" ? "" : "/*# sourceMappingURL=data:application/json;charset=utf-8;base64,eyJ2ZXJzaW9uIjozLCJzb3VyY2VzIjpbIi4uLy4uLy4uLy4uL3NyYy9BcHBIZWFkZXIvQXBwSGVhZGVyRWxlbWVudHMvQXBwSGVhZGVyRmVhdHVyZUNhcmQvaW5kZXgudHN4Il0sIm5hbWVzIjpbXSwibWFwcGluZ3MiOiJBQU8rQiIsImZpbGUiOiIuLi8uLi8uLi8uLi9zcmMvQXBwSGVhZGVyL0FwcEhlYWRlckVsZW1lbnRzL0FwcEhlYWRlckZlYXR1cmVDYXJkL2luZGV4LnRzeCIsInNvdXJjZXNDb250ZW50IjpbImltcG9ydCB7IEJveCwgQ2FyZCwgRmxleEJveCwgVGV4dCB9IGZyb20gJ0Bjb2RlY2FkZW15L2dhbXV0JztcbmltcG9ydCB7IEdyaWREZW5zZSB9IGZyb20gJ0Bjb2RlY2FkZW15L2dhbXV0LXBhdHRlcm5zJztcbmltcG9ydCB7IHRoZW1lIH0gZnJvbSAnQGNvZGVjYWRlbXkvZ2FtdXQtc3R5bGVzJztcbmltcG9ydCBzdHlsZWQgZnJvbSAnQGVtb3Rpb24vc3R5bGVkJztcblxuaW1wb3J0IHsgQXBwSGVhZGVyQ2FyZEl0ZW0gfSBmcm9tICcuLi9BcHBIZWFkZXJSZXNvdXJjZXNEcm9wZG93bi9jb25zdHMnO1xuXG5jb25zdCBTdHlsZWRDYXJkID0gc3R5bGVkKENhcmQpYFxuICAmOmhvdmVyIHtcbiAgICBjb2xvcjogJHsoeyB0aGVtZSB9KSA9PiB0aGVtZS5jb2xvcnMucHJpbWFyeX07XG4gICAgYm9yZGVyLWNvbG9yOiAkeyh7IHRoZW1lIH0pID0+IHRoZW1lLmNvbG9ycy5wcmltYXJ5fTtcbiAgfVxuYDtcblxuZXhwb3J0IGNvbnN0IEFwcEhlYWRlckZlYXR1cmVDYXJkID0gKHsgaXRlbSB9OiB7IGl0ZW06IEFwcEhlYWRlckNhcmRJdGVtIH0pID0+IHtcbiAgcmV0dXJuIChcbiAgICA8U3R5bGVkQ2FyZFxuICAgICAgaXNJbnRlcmFjdGl2ZVxuICAgICAgcHg9ezh9XG4gICAgICBweT17MjR9XG4gICAgICBib3JkZXJSYWRpdXM9XCJsZ1wiXG4gICAgICBib3JkZXI9ezF9XG4gICAgICBib3JkZXJDb2xvcj1cImJvcmRlci10ZXJ0aWFyeVwiXG4gICAgICBkaXNwbGF5PVwiZmxleFwiXG4gICAgICBhbGlnbkl0ZW1zPVwiZmxleC1zdGFydFwiXG4gICAgICBmbGV4RGlyZWN0aW9uPVwiY29sdW1uXCJcbiAgICAgIGhlaWdodD1cIjEwMCVcIlxuICAgID5cbiAgICAgIDxGbGV4Qm94IGFsaWduSXRlbXM9XCJjZW50ZXJcIiBnYXA9ezh9PlxuICAgICAgICA8Qm94XG4gICAgICAgICAgYmFja2dyb3VuZD17dGhlbWUuY29sb3JzWyduYXZ5LTIwMCddfVxuICAgICAgICAgIGJvcmRlclJhZGl1cz1cIm1kXCJcbiAgICAgICAgICBwPXs0fVxuICAgICAgICAgIGhlaWdodD17MjZ9XG4gICAgICAgID5cbiAgICAgICAgICB7aXRlbS5pY29ufVxuICAgICAgICA8L0JveD5cbiAgICAgICAgPFRleHQgdmFyaWFudD1cInRpdGxlLXhzXCI+e2l0ZW0ubGlua0l0ZW0udGV4dH08L1RleHQ+XG4gICAgICA8L0ZsZXhCb3g+XG4gICAgICA8Qm94IHdpZHRoPVwiMTAwJVwiPlxuICAgICAgICA8R3JpZERlbnNlIGhlaWdodD17NH0gLz5cbiAgICAgIDwvQm94PlxuICAgICAgPFRleHQgdmFyaWFudD1cInAtYmFzZVwiIGZvbnRTaXplPXsxNH0+XG4gICAgICAgIHtpdGVtLmRlc2NyaXB0aW9ufVxuICAgICAgPC9UZXh0PlxuICAgIDwvU3R5bGVkQ2FyZD5cbiAgKTtcbn07XG4iXX0= */"));
 export const AppHeaderFeatureCard = ({
   item
 }) => {
@@ -45,6 +45,7 @@ export const AppHeaderFeatureCard = ({
       })
     }), /*#__PURE__*/_jsx(Text, {
       variant: "p-base",
+      fontSize: 14,
       children: item.description
     })]
   });

package/dist/AppHeader/AppHeaderElements/AppHeaderResourcesDropdown/NavPanels.js

@@ -1,8 +1,8 @@
-import { Anchor, FlexBox, GridBox } from '@codecademy/gamut';
+import { Anchor, Box, FlexBox, GridBox } from '@codecademy/gamut';
 import { useGlobalHeaderItemClick } from '../../../GlobalHeader/context';
 import { useAppHeaderDropdownContext } from '../AppHeaderDropdownProvider';
 import { AppHeaderFeatureCard } from '../AppHeaderFeatureCard';
-import { PanelLayout } from '../AppHeaderSectionVariant/PanelLayout';
+import { PanelLayout } from '../AppHeaderSection/PanelLayout';
 import { docsLinks, inspirationLinks, learningToolsLinks, practiceToolsLinks } from './consts';
 import { jsx as _jsx, Fragment as _Fragment, jsxs as _jsxs } from "react/jsx-runtime";
 export const DocsPanel = ({
@@ -15,7 +15,11 @@ export const DocsPanel = ({
     handleClose
   } = useAppHeaderDropdownContext();
   const description = /*#__PURE__*/_jsxs(_Fragment, {
-    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.", /*#__PURE__*/_jsx("br", {}), " ", /*#__PURE__*/_jsx("br", {}), "Interested in helping build it?", ' ', /*#__PURE__*/_jsx(Anchor, {
+    children: [/*#__PURE__*/_jsx(Box, {
+      mb: 8,
+      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."
+    }), "Interested in helping build it?", ' ', /*#__PURE__*/_jsx(Anchor, {
+      tabIndex: tabIndex,
       href: "/docs/contribute",
       children: "Contribute to Docs"
     })]
@@ -68,7 +72,7 @@ export const LearningToolsPanel = ({
 }) => {
   return /*#__PURE__*/_jsx(PanelLayout, {
     heading: "Learning tools",
-    description: "Faucibus ultricies risus tincidunt in placerat sodales euismod convallis nulla. Et amet platea lobortis ultrices neque sollicitudin pretium. Vulputate elit morbi ut arcu aliquam augue pellentesque. Eleifend enim suspendisse nibh lectus.",
+    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.",
     children: /*#__PURE__*/_jsx(FeatureCardPanel, {
       links: learningToolsLinks,
       tabIndex: tabIndex
@@ -80,7 +84,7 @@ export const PracticeToolsPanel = ({
 }) => {
   return /*#__PURE__*/_jsx(PanelLayout, {
     heading: "Practice tools",
-    description: "Lectus enim vulputate in leo in vulputate adipiscing aliquam purus. Semper malesuada viverra pretium cursus vel donec pulvinar nisi. Quis proin quam arcu maecenas orci tincidunt. Elementum feugiat amet mi sagittis nisi.",
+    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.",
     children: /*#__PURE__*/_jsx(FeatureCardPanel, {
       links: practiceToolsLinks,
       tabIndex: tabIndex
@@ -119,6 +123,9 @@ export const FeatureCardPanel = ({
       lg: '1fr 1fr'
     },
     gap: 16,
+    pl: 0,
+    as: "ul",
+    listStyle: "none",
     children: links.map(item => /*#__PURE__*/_jsx(Anchor, {
       variant: "interface",
       href: item.linkItem.href,
@@ -128,6 +135,7 @@ export const FeatureCardPanel = ({
       },
       tabIndex: tabIndex,
       height: "100%",
+      as: "li",
       children: /*#__PURE__*/_jsx(AppHeaderFeatureCard, {
         item: item
       })

package/dist/AppHeader/AppHeaderElements/AppHeaderResourcesDropdown/consts.js

@@ -1,4 +1,4 @@
-import { ArticleIcon, BulbIcon, DiamondIcon, FileIcon, NotebookIcon, ProjectsIcon, RulerTriangleIcon, VideoPlayerMovieIcon } from '@codecademy/gamut-icons';
+import { ArticleIcon, BriefcaseIcon, BulbIcon, CommentsIcon, DiamondIcon, FileIcon, InfoCircleIcon, NotebookIcon, ProjectsIcon, RulerTriangleIcon, SearchIcon, VideoPlayerMovieIcon } from '@codecademy/gamut-icons';
 import React from 'react';
 import { DocsPanel, InspirationPanel, LearningToolsPanel, PracticeToolsPanel } from './NavPanels';
 import { jsx as _jsx } from "react/jsx-runtime";
@@ -150,14 +150,14 @@ export const docsLinks = [{
 }];
 export const learningToolsLinks = [{
   linkItem: {
-    id: 'projects',
-    href: '/projects',
-    trackingTarget: 'topnav_resources_projects',
-    text: 'Projects',
+    id: 'articles',
+    href: '/articles',
+    trackingTarget: 'topnav_resources_articles',
+    text: 'Articles',
     type: 'link'
   },
-  icon: /*#__PURE__*/_jsx(ProjectsIcon, {}),
-  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."
+  icon: /*#__PURE__*/_jsx(ArticleIcon, {}),
+  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."
 }, {
   linkItem: {
     id: 'cheatsheets',
@@ -167,17 +167,7 @@ export const learningToolsLinks = [{
     type: 'link'
   },
   icon: /*#__PURE__*/_jsx(NotebookIcon, {}),
-  description: 'Sagittis magna mattis risus et tortor. Id morbi ornare mi convallis non. Lorem dis vulputate morbi porttitor tincidunt. Ullamcorper risus eu vestibulum malesuada ullamcorper.'
-}, {
-  linkItem: {
-    id: 'articles',
-    href: '/articles',
-    trackingTarget: 'topnav_resources_articles',
-    text: 'Articles',
-    type: 'link'
-  },
-  icon: /*#__PURE__*/_jsx(ArticleIcon, {}),
-  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."
+  description: 'Quick-reference guides that summarize key concepts taught in our courses and paths across various programming languages, tools, and technologies.'
 }, {
   linkItem: {
     id: 'videos',
@@ -188,28 +178,18 @@ export const learningToolsLinks = [{
   },
   icon: /*#__PURE__*/_jsx(VideoPlayerMovieIcon, {}),
   description: 'Watch our best programming videos for beginner, intermediate, and advanced learners about languages, frameworks, and more.'
-}];
-export const practiceToolsLinks = [{
-  linkItem: {
-    id: 'interview-simulator',
-    href: '/interview-simulator',
-    trackingTarget: 'topnav_resources_interview_simulator',
-    text: 'Interview Simulator',
-    type: 'link'
-  },
-  icon: /*#__PURE__*/_jsx(ProjectsIcon, {}),
-  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.'
 }, {
   linkItem: {
-    id: 'job-readiness',
-    href: '/job-readiness',
-    trackingTarget: 'topnav_resources_job_readiness',
-    text: 'Job-Readiness Checker',
+    id: 'projects',
+    href: '/projects',
+    trackingTarget: 'topnav_resources_projects',
+    text: 'Projects',
     type: 'link'
   },
-  icon: /*#__PURE__*/_jsx(NotebookIcon, {}),
-  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."
-}, {
+  icon: /*#__PURE__*/_jsx(ProjectsIcon, {}),
+  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."
+}];
+export const practiceToolsLinks = [{
   linkItem: {
     id: 'code-challenges',
     href: '/code-challenges',
@@ -229,27 +209,47 @@ export const practiceToolsLinks = [{
   },
   icon: /*#__PURE__*/_jsx(VideoPlayerMovieIcon, {}),
   description: 'Practice building projects in 13 popular languages and libraries, tinker with code, and share your work—all without leaving your browser.'
+}, {
+  linkItem: {
+    id: 'job-readiness',
+    href: '/job-readiness',
+    trackingTarget: 'topnav_resources_job_readiness',
+    text: 'Job-Readiness Checker',
+    type: 'link'
+  },
+  icon: /*#__PURE__*/_jsx(NotebookIcon, {}),
+  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."
+}, {
+  linkItem: {
+    id: 'interview-simulator',
+    href: '/interview-simulator',
+    trackingTarget: 'topnav_resources_interview_simulator',
+    text: 'Interview Simulator',
+    type: 'link'
+  },
+  icon: /*#__PURE__*/_jsx(ProjectsIcon, {}),
+  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.'
 }];
 export const inspirationLinks = [{
   linkItem: {
-    id: 'learning-tips',
-    href: '/resources/blog/category/learning-tips',
-    trackingTarget: 'topnav_resources_learning_tips',
-    text: 'Learning Tips',
+    id: 'learner-stories',
+    href: '/resources/blog/category/get-inspired',
+    trackingTarget: 'topnav_resources_learner_stories',
+    text: 'Learner stories',
     type: 'link'
   },
-  icon: /*#__PURE__*/_jsx(ProjectsIcon, {}),
-  description: 'Learning to code — or thinking about it? Here’s how to get started, plus tips and tricks for staying motivated.'
+  icon: /*#__PURE__*/_jsx(CommentsIcon, {}),
+  description: 'Learn how coding can change your life (and the world) for the better.'
 }, {
   linkItem: {
-    id: 'finding-a-job',
-    href: '/resources/blog/category/finding-a-job',
-    trackingTarget: 'topnav_resources_finding_a_job',
-    text: 'Finding a Job',
+    id: 'learning-tips',
+    href: '/resources/blog/category/learning-tips',
+    trackingTarget: 'topnav_resources_learning_tips',
+    text: 'Learning Tips',
     type: 'link'
   },
-  icon: /*#__PURE__*/_jsx(NotebookIcon, {}),
-  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.'
+  icon: /*#__PURE__*/_jsx(InfoCircleIcon, {}),
+  description: "Learning to code — or thinking about it? Here's how to get started, plus tips and tricks for staying motivated."
 }, {
   linkItem: {
     id: 'career-advice',
@@ -258,16 +258,16 @@ export const inspirationLinks = [{
     text: 'Career Advice',
     type: 'link'
   },
-  icon: /*#__PURE__*/_jsx(ArticleIcon, {}),
+  icon: /*#__PURE__*/_jsx(BriefcaseIcon, {}),
   description: 'Explore different tech jobs and learn how to advance in your career and maintain work-life balance.'
 }, {
   linkItem: {
-    id: 'get-inspired',
-    href: '/resources/blog/category/get-inspired',
-    trackingTarget: 'topnav_resources_get_inspired',
-    text: 'Get Inspired',
+    id: 'finding-a-job',
+    href: '/resources/blog/category/finding-a-job',
+    trackingTarget: 'topnav_resources_finding_a_job',
+    text: 'Finding a Job',
     type: 'link'
   },
-  icon: /*#__PURE__*/_jsx(VideoPlayerMovieIcon, {}),
-  description: 'Learn how coding can change your life (and the world) for the better.'
+  icon: /*#__PURE__*/_jsx(SearchIcon, {}),
+  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.'
 }];

package/dist/AppHeader/AppHeaderElements/AppHeaderResourcesDropdown/index.js

@@ -9,7 +9,7 @@ import { AppHeaderDropdownProvider } from '../AppHeaderDropdownProvider';
 import { AppHeaderDropdownNavButton } from '../AppHeaderNavButton/AppHeaderDropdownNavButton';
 import { useAppHeaderContext } from '../AppHeaderProvider';
 import { AppHeaderResourcesSection } from '../AppHeaderResourcesSection';
-import { AppHeaderSectionVariant } from '../AppHeaderSectionVariant';
+import { AppHeaderSection } from '../AppHeaderSection';
 import { RESOURCES_NAV_SECTIONS } from './consts';
 import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
 const StyledAnimatedMegaMenuDropdown = /*#__PURE__*/_styled(AnimatedMegaMenuDropdown, {
@@ -21,7 +21,7 @@ const StyledAnimatedMegaMenuDropdown = /*#__PURE__*/_styled(AnimatedMegaMenuDrop
 }) => displayGlobalNavRedesign ? '-58px' : isAnon ? '-9rem' : '-14rem', ";@media (min-width: 1261px){left:", ({
   isAnon,
   displayGlobalNavRedesign
-}) => displayGlobalNavRedesign ? '-152px' : isAnon ? '-9rem' : '-14rem', ";}" + (process.env.NODE_ENV === "production" ? "" : "/*# sourceMappingURL=data:application/json;charset=utf-8;base64,eyJ2ZXJzaW9uIjozLCJzb3VyY2VzIjpbIi4uLy4uLy4uLy4uL3NyYy9BcHBIZWFkZXIvQXBwSGVhZGVyRWxlbWVudHMvQXBwSGVhZGVyUmVzb3VyY2VzRHJvcGRvd24vaW5kZXgudHN4Il0sIm5hbWVzIjpbXSwibWFwcGluZ3MiOiJBQTJCRSIsImZpbGUiOiIuLi8uLi8uLi8uLi9zcmMvQXBwSGVhZGVyL0FwcEhlYWRlckVsZW1lbnRzL0FwcEhlYWRlclJlc291cmNlc0Ryb3Bkb3duL2luZGV4LnRzeCIsInNvdXJjZXNDb250ZW50IjpbImltcG9ydCB7IENvbG9yTW9kZSB9IGZyb20gJ0Bjb2RlY2FkZW15L2dhbXV0LXN0eWxlcyc7XG5pbXBvcnQgc3R5bGVkIGZyb20gJ0BlbW90aW9uL3N0eWxlZCc7XG5pbXBvcnQgeyB1c2VDYWxsYmFjaywgdXNlQ29udGV4dCwgdXNlRWZmZWN0LCB1c2VSZWYsIHVzZVN0YXRlIH0gZnJvbSAncmVhY3QnO1xuaW1wb3J0ICogYXMgUmVhY3QgZnJvbSAncmVhY3QnO1xuXG5pbXBvcnQgeyBHbG9iYWxOYXZSZWRlc2lnbkNvbnRleHQgfSBmcm9tICcuLi8uLi8uLi9HbG9iYWxIZWFkZXInO1xuaW1wb3J0IHsgZ2V0SGVhZGVyUmVzb3VyY2VzTGlzdCB9IGZyb20gJy4uLy4uLy4uL2xpYi9yZXNvdXJjZXNMaXN0JztcbmltcG9ydCB7XG4gIEFuaW1hdGVkTWVnYU1lbnVEcm9wZG93bixcbiAgQXBwSGVhZGVyQWN0aW9uLFxuICBBcHBIZWFkZXJSZXNvdXJjZXNEcm9wZG93bkl0ZW0sXG59IGZyb20gJy4uLy4uL3NoYXJlZCc7XG5pbXBvcnQgeyBBcHBIZWFkZXJEcm9wZG93blByb3ZpZGVyIH0gZnJvbSAnLi4vQXBwSGVhZGVyRHJvcGRvd25Qcm92aWRlcic7XG5pbXBvcnQgeyBBcHBIZWFkZXJEcm9wZG93bk5hdkJ1dHRvbiB9IGZyb20gJy4uL0FwcEhlYWRlck5hdkJ1dHRvbi9BcHBIZWFkZXJEcm9wZG93bk5hdkJ1dHRvbic7XG5pbXBvcnQgeyB1c2VBcHBIZWFkZXJDb250ZXh0IH0gZnJvbSAnLi4vQXBwSGVhZGVyUHJvdmlkZXInO1xuaW1wb3J0IHsgQXBwSGVhZGVyUmVzb3VyY2VzU2VjdGlvbiB9IGZyb20gJy4uL0FwcEhlYWRlclJlc291cmNlc1NlY3Rpb24nO1xuaW1wb3J0IHsgQXBwSGVhZGVyU2VjdGlvblZhcmlhbnQgfSBmcm9tICcuLi9BcHBIZWFkZXJTZWN0aW9uVmFyaWFudCc7XG5pbXBvcnQgeyBSRVNPVVJDRVNfTkFWX1NFQ1RJT05TIH0gZnJvbSAnLi9jb25zdHMnO1xuXG5leHBvcnQgdHlwZSBBcHBIZWFkZXJSZXNvdXJjZURyb3Bkb3duUHJvcHMgPSBBcHBIZWFkZXJBY3Rpb24gJiB7XG4gIGl0ZW06IEFwcEhlYWRlclJlc291cmNlc0Ryb3Bkb3duSXRlbTtcbiAgaXNBbm9uOiBib29sZWFuO1xufTtcblxuY29uc3QgU3R5bGVkQW5pbWF0ZWRNZWdhTWVudURyb3Bkb3duID0gc3R5bGVkKEFuaW1hdGVkTWVnYU1lbnVEcm9wZG93bik8e1xuICBpc0Fub246IGJvb2xlYW47XG4gIGRpc3BsYXlHbG9iYWxOYXZSZWRlc2lnbjogYm9vbGVhbjtcbn0+YFxuICBsZWZ0OiAkeyh7IGlzQW5vbiwgZGlzcGxheUdsb2JhbE5hdlJlZGVzaWduIH0pID0+XG4gICAgZGlzcGxheUdsb2JhbE5hdlJlZGVzaWduID8gJy01OHB4JyA6IGlzQW5vbiA/ICctOXJlbScgOiAnLTE0cmVtJ307XG5cbiAgQG1lZGlhIChtaW4td2lkdGg6IDEyNjFweCkge1xuICAgIGxlZnQ6ICR7KHsgaXNBbm9uLCBkaXNwbGF5R2xvYmFsTmF2UmVkZXNpZ24gfSkgPT5cbiAgICAgIGRpc3BsYXlHbG9iYWxOYXZSZWRlc2lnbiA/ICctMTUycHgnIDogaXNBbm9uID8gJy05cmVtJyA6ICctMTRyZW0nfTtcbiAgfVxuYDtcblxuZXhwb3J0IGNvbnN0IEFwcEhlYWRlclJlc291cmNlc0Ryb3Bkb3duOiBSZWFjdC5GQzxcbiAgQXBwSGVhZGVyUmVzb3VyY2VEcm9wZG93blByb3BzXG4+ID0gKHsgYWN0aW9uLCBpdGVtLCBpc0Fub24gfSkgPT4ge1xuICBjb25zdCB7IHRleHQgfSA9IGl0ZW07XG4gIGNvbnN0IGNvbnRhaW5lclJlZiA9IHVzZVJlZjxIVE1MRGl2RWxlbWVudCB8IG51bGw+KG51bGwpO1xuICBjb25zdCBidXR0b25SZWYgPSB1c2VSZWY8SFRNTEJ1dHRvbkVsZW1lbnQ+KG51bGwpO1xuICBjb25zdCBkcm9wZG93blJlZiA9IHVzZVJlZjxIVE1MRGl2RWxlbWVudCB8IG51bGw+KG51bGwpO1xuICBjb25zdCBbaXNPcGVuLCBzZXRJc09wZW5dID0gdXNlU3RhdGUoZmFsc2UpO1xuICBjb25zdCB7IGxhc3RPcGVuZWREcm9wZG93biwgc2V0TGFzdE9wZW5lZERyb3Bkb3duIH0gPSB1c2VBcHBIZWFkZXJDb250ZXh0KCk7XG5cbiAgLy8gQWRkIHNjcm9sbGJhciBmb3Igc2hvcnQgc2NyZWVucyBhZnRlciB0cmFuc2l0aW9uIChvdGhlcndpc2Ugc2Nyb2xsYmFyIGFwcGVhcnMgYW5kIGRpc3NhcGVhcnMgZm9yIGFkZXF1YXRlIGhlaWdodHMgZHVyaW5nIHRyYW5zaXRpb24pXG4gIGNvbnN0IFthbmltYXRpb25Db21wbGV0ZVN0eWxlcywgc2V0QW5pbWF0aW9uQ29tcGxldGVTdHlsZXNdID0gdXNlU3RhdGUoZmFsc2UpO1xuXG4gIGNvbnN0IGhlYWRlclJlc291cmNlc0xpc3QgPSBnZXRIZWFkZXJSZXNvdXJjZXNMaXN0KCk7XG5cbiAgY29uc3QgYW5pbWF0aW9uRmluaXNoZWQgPSAoKSA9PiB7XG4gICAgc2V0QW5pbWF0aW9uQ29tcGxldGVTdHlsZXMoaXNPcGVuKTtcbiAgICBpZiAoaXNPcGVuICYmIGRyb3Bkb3duUmVmLmN1cnJlbnQpIHtcbiAgICAgIGRyb3Bkb3duUmVmLmN1cnJlbnQuc2Nyb2xsVG9wID0gMDtcbiAgICB9XG4gIH07XG5cbiAgY29uc3QgdG9nZ2xlSXNPcGVuID0gKCkgPT4gc2V0SXNPcGVuKChwcmV2KSA9PiAhcHJldik7XG5cbiAgY29uc3QgaGFuZGxlT25DbGljayA9IChldmVudDogUmVhY3QuTW91c2VFdmVudCkgPT4ge1xuICAgIHRvZ2dsZUlzT3BlbigpO1xuICAgIGlmICghaXNPcGVuKSB7XG4gICAgICBhY3Rpb24oZXZlbnQsIGl0ZW0pO1xuICAgICAgaWYgKHNldExhc3RPcGVuZWREcm9wZG93bikge1xuICAgICAgICBzZXRMYXN0T3BlbmVkRHJvcGRvd24odGV4dCk7XG4gICAgICB9XG4gICAgfVxuICB9O1xuXG4gIGNvbnN0IGhhbmRsZUNsb3NlID0gdXNlQ2FsbGJhY2soKCkgPT4ge1xuICAgIHNldElzT3BlbihmYWxzZSk7XG4gICAgYnV0dG9uUmVmPy5jdXJyZW50Py5mb2N1cygpO1xuICB9LCBbXSk7XG5cbiAgdXNlRWZmZWN0KCgpID0+IHtcbiAgICBpZiAobGFzdE9wZW5lZERyb3Bkb3duICE9PSB0ZXh0ICYmIGlzT3Blbikge1xuICAgICAgc2V0SXNPcGVuKGZhbHNlKTtcbiAgICB9XG4gICAgLy8gZXNsaW50LWRpc2FibGUtbmV4dC1saW5lIHJlYWN0LWhvb2tzL2V4aGF1c3RpdmUtZGVwc1xuICB9LCBbbGFzdE9wZW5lZERyb3Bkb3duXSk7XG5cbiAgdXNlRWZmZWN0KCgpID0+IHtcbiAgICBmdW5jdGlvbiBoYW5kbGVDbGlja091dHNpZGUoZXZlbnQ6IE1vdXNlRXZlbnQgfCBFdmVudCkge1xuICAgICAgY29uc3QgY29udGFpbmVyID0gY29udGFpbmVyUmVmPy5jdXJyZW50O1xuICAgICAgY29uc3QgYnV0dG9uID0gYnV0dG9uUmVmPy5jdXJyZW50O1xuICAgICAgaWYgKFxuICAgICAgICBpc09wZW4gJiZcbiAgICAgICAgY29udGFpbmVyICYmXG4gICAgICAgICFjb250YWluZXIuY29udGFpbnMoZXZlbnQudGFyZ2V0IGFzIE5vZGUpICYmXG4gICAgICAgIGJ1dHRvbiAmJlxuICAgICAgICAhYnV0dG9uLmNvbnRhaW5zKGV2ZW50LnRhcmdldCBhcyBOb2RlKVxuICAgICAgKSB7XG4gICAgICAgIGhhbmRsZUNsb3NlKCk7XG4gICAgICB9XG4gICAgfVxuXG4gICAgZG9jdW1lbnQuYWRkRXZlbnRMaXN0ZW5lcignbW91c2Vkb3duJywgaGFuZGxlQ2xpY2tPdXRzaWRlKTtcbiAgICBkb2N1bWVudC5hZGRFdmVudExpc3RlbmVyKCdibHVyJywgaGFuZGxlQ2xpY2tPdXRzaWRlKTtcbiAgICByZXR1cm4gKCkgPT4ge1xuICAgICAgZG9jdW1lbnQucmVtb3ZlRXZlbnRMaXN0ZW5lcignbW91c2Vkb3duJywgaGFuZGxlQ2xpY2tPdXRzaWRlKTtcbiAgICAgIGRvY3VtZW50LnJlbW92ZUV2ZW50TGlzdGVuZXIoJ2JsdXInLCBoYW5kbGVDbGlja091dHNpZGUpO1xuICAgIH07XG4gIH0sIFtjb250YWluZXJSZWYsIGhhbmRsZUNsb3NlLCBpc09wZW5dKTtcblxuICBjb25zdCBkaXNwbGF5R2xvYmFsTmF2UmVkZXNpZ24gPSB1c2VDb250ZXh0KEdsb2JhbE5hdlJlZGVzaWduQ29udGV4dCk7XG5cbiAgcmV0dXJuIChcbiAgICA8QXBwSGVhZGVyRHJvcGRvd25Qcm92aWRlciBoYW5kbGVDbG9zZT17aGFuZGxlQ2xvc2V9PlxuICAgICAgPEFwcEhlYWRlckRyb3Bkb3duTmF2QnV0dG9uXG4gICAgICAgIGJ1dHRvblJlZj17YnV0dG9uUmVmfVxuICAgICAgICBoYW5kbGVPbkNsaWNrPXtoYW5kbGVPbkNsaWNrfVxuICAgICAgICBpc09wZW49e2lzT3Blbn1cbiAgICAgICAgdGl0bGU9e3RleHR9XG4gICAgICAvPlxuICAgICAgPFN0eWxlZEFuaW1hdGVkTWVnYU1lbnVEcm9wZG93blxuICAgICAgICBpc0Fub249e2lzQW5vbn1cbiAgICAgICAgZGlzcGxheUdsb2JhbE5hdlJlZGVzaWduPXtkaXNwbGF5R2xvYmFsTmF2UmVkZXNpZ259XG4gICAgICAgIHRhYkluZGV4PXstMX0gLy8gcHJldmVudCBmcm9tIGludGVyZmVyaW5nIHdpdGggQXBwSGVhZGVyIGZvY3VzIGxvZ2ljXG4gICAgICAgIHJlZj17ZHJvcGRvd25SZWZ9XG4gICAgICAgIHN0eWxlPXt7XG4gICAgICAgICAgdG9wOiAnMy41cmVtJyxcbiAgICAgICAgICBtaW5XaWR0aDogJzY0cmVtJyxcbiAgICAgICAgICBsZWZ0OiBpc0Fub24gPyAnLTE0LjVyZW0nIDogJy0xOS41cmVtJyxcbiAgICAgICAgICBvdmVyZmxvd1k6ICdhdXRvJyxcbiAgICAgICAgICBtYXhIZWlnaHQ6IGFuaW1hdGlvbkNvbXBsZXRlU3R5bGVzID8gJzg1dmgnIDogMCxcbiAgICAgICAgICBiYWNrZ3JvdW5kQ29sb3I6IGRpc3BsYXlHbG9iYWxOYXZSZWRlc2lnbiA/ICd0cmFuc3BhcmVudCcgOiAnJyxcbiAgICAgICAgfX1cbiAgICAgICAgaW5pdGlhbD17eyBib3JkZXJXaWR0aDogMCwgaGVpZ2h0OiAwIH19XG4gICAgICAgIGFuaW1hdGU9e3tcbiAgICAgICAgICBib3JkZXJXaWR0aDogaXNPcGVuID8gKGRpc3BsYXlHbG9iYWxOYXZSZWRlc2lnbiA/IDAgOiAxKSA6IDAsXG4gICAgICAgICAgaGVpZ2h0OiBpc09wZW4gPyAnZml0LWNvbnRlbnQnIDogMCxcbiAgICAgICAgfX1cbiAgICAgICAgdHJhbnNpdGlvbj17eyBkdXJhdGlvbjogMC4xNzUgfX1cbiAgICAgICAgYXJpYS1oaWRkZW49eyFpc09wZW59XG4gICAgICAgIGRhdGEtdGVzdGlkPVwicmVzb3VyY2VzLW1lbnUtZHJvcGRvd25cIlxuICAgICAgICBvbkFuaW1hdGlvbkNvbXBsZXRlPXthbmltYXRpb25GaW5pc2hlZH1cbiAgICAgID5cbiAgICAgICAge2Rpc3BsYXlHbG9iYWxOYXZSZWRlc2lnbiA/IChcbiAgICAgICAgICA8Q29sb3JNb2RlIG1vZGU9XCJsaWdodFwiPlxuICAgICAgICAgICAgPEFwcEhlYWRlclNlY3Rpb25WYXJpYW50XG4gICAgICAgICAgICAgIGlzT3Blbj17aXNPcGVufVxuICAgICAgICAgICAgICByZWY9e2NvbnRhaW5lclJlZn1cbiAgICAgICAgICAgICAgbmF2U2VjdGlvbnM9e1JFU09VUkNFU19OQVZfU0VDVElPTlN9XG4gICAgICAgICAgICAvPlxuICAgICAgICAgIDwvQ29sb3JNb2RlPlxuICAgICAgICApIDogKFxuICAgICAgICAgIDxBcHBIZWFkZXJSZXNvdXJjZXNTZWN0aW9uXG4gICAgICAgICAgICBhY3Rpb249e2FjdGlvbn1cbiAgICAgICAgICAgIHJlZj17Y29udGFpbmVyUmVmfVxuICAgICAgICAgICAgaWQ9e2BtZW51LWNvbnRhaW5lciR7aXRlbS50ZXh0fWB9XG4gICAgICAgICAgICBpc09wZW49e2lzT3Blbn1cbiAgICAgICAgICAgIGhhbmRsZUNsb3NlPXsoKSA9PiBzZXRJc09wZW4oZmFsc2UpfVxuICAgICAgICAgICAgcmVzb3VyY2VzPXtoZWFkZXJSZXNvdXJjZXNMaXN0fVxuICAgICAgICAgIC8+XG4gICAgICAgICl9XG4gICAgICA8L1N0eWxlZEFuaW1hdGVkTWVnYU1lbnVEcm9wZG93bj5cbiAgICA8L0FwcEhlYWRlckRyb3Bkb3duUHJvdmlkZXI+XG4gICk7XG59O1xuIl19 */"));
+}) => 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 */"));
 export const AppHeaderResourcesDropdown = ({
   action,
   item,
@@ -121,7 +121,7 @@ export const AppHeaderResourcesDropdown = ({
       onAnimationComplete: animationFinished,
       children: displayGlobalNavRedesign ? /*#__PURE__*/_jsx(ColorMode, {
         mode: "light",
-        children: /*#__PURE__*/_jsx(AppHeaderSectionVariant, {
+        children: /*#__PURE__*/_jsx(AppHeaderSection, {
           isOpen: isOpen,
           ref: containerRef,
           navSections: RESOURCES_NAV_SECTIONS

package/dist/AppHeader/AppHeaderElements/{AppHeaderSectionVariant/AppHeaderSectionVariant.test.js → AppHeaderSection/AppHeaderSection.test.js}

@@ -3,7 +3,7 @@ import userEvent from '@testing-library/user-event';
 import React from 'react';
 import { GlobalHeaderItemClickContext } from '../../../GlobalHeader/context';
 import { CATALOG_NAV_SECTIONS } from '../AppHeaderCatalogDropdown/consts';
-import { AppHeaderSectionVariant } from '.';
+import { AppHeaderSection } from '.';
 import { jsx as _jsx } from "react/jsx-runtime";
 const mockOnClick = jest.fn();
 const mockKeyDownEvents = jest.fn();
@@ -21,8 +21,8 @@ const defaultProps = {
 const mockContextValue = {
   globalHeaderItemClick: mockOnClick
 };
-describe('AppHeaderSectionVariant', () => {
-  const renderView = setupRtl(AppHeaderSectionVariant, defaultProps).options({
+describe('AppHeaderSection', () => {
+  const renderView = setupRtl(AppHeaderSection, defaultProps).options({
     wrapper: ({
       children
     }) => /*#__PURE__*/_jsx(GlobalHeaderItemClickContext.Provider, {

package/dist/AppHeader/AppHeaderElements/AppHeaderSection/NavSection.js

@@ -0,0 +1,79 @@
+import _styled from "@emotion/styled/base";
+import { Box, FlexBox } from '@codecademy/gamut';
+import { ArrowChevronRightIcon } from '@codecademy/gamut-icons';
+import React from 'react';
+import { useGlobalHeaderItemClick } from '../../../GlobalHeader/context';
+import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-runtime";
+const NavPanelContainer = /*#__PURE__*/_styled(Box, {
+  target: "ed97qwe1",
+  label: "NavPanelContainer"
+})("display:", ({
+  isActive
+}) => isActive ? 'block' : 'none', ";grid-column:2/span 12;grid-row:1/span 8;background-color:", ({
+  theme
+}) => theme.colors.background, ";border-radius:", ({
+  isActive,
+  isFirst
+}) => 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= */"));
+const StyledButton = /*#__PURE__*/_styled("button", {
+  target: "ed97qwe0",
+  label: "StyledButton"
+})("grid-column:1;grid-row:", ({
+  index
+}) => index + 1, ";padding:16px;border:none;border-radius:", ({
+  isActive
+}) => isActive ? '8px 0 0 8px' : '8px', ";background:none;cursor:pointer;font-size:18px;font-weight:400;color:", ({
+  theme,
+  isActive
+}) => isActive ? theme.colors.primary : theme.colors.text, ";text-align:left;width:", ({
+  isActive
+}) => isActive ? '100%' : 'calc(100% - 8px)', ";height:60px;display:flex;justify-content:space-between;align-items:center;background-color:", ({
+  isActive,
+  theme
+}) => isActive ? theme.colors.background : theme.colors['gray-100'], ";#arrow-chevron-right-icon{display:", ({
+  isActive
+}) => isActive ? 'block' : 'none', ";}&:hover,&:focus{background-color:", ({
+  theme,
+  isActive
+}) => isActive ? theme.colors.background : theme.colors['navy-100'], ";color:", ({
+  theme
+}) => 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= */"));
+const NavSection = ({
+  activeTab,
+  setActiveTab,
+  icon: Icon,
+  text,
+  index,
+  children,
+  item,
+  tabIndex
+}) => {
+  const {
+    globalHeaderItemClick
+  } = useGlobalHeaderItemClick();
+  return /*#__PURE__*/_jsxs(_Fragment, {
+    children: [/*#__PURE__*/_jsxs(StyledButton, {
+      isActive: activeTab === index,
+      index: index,
+      onClick: event => {
+        globalHeaderItemClick(event, item);
+        setActiveTab(index);
+      },
+      "data-testid": `nav-section-${item.id}`,
+      "aria-expanded": activeTab === index,
+      tabIndex: tabIndex,
+      children: [/*#__PURE__*/_jsxs(FlexBox, {
+        gap: 8,
+        alignItems: "center",
+        children: [Icon && /*#__PURE__*/_jsx(Icon, {}), text]
+      }), /*#__PURE__*/_jsx(ArrowChevronRightIcon, {
+        id: "arrow-chevron-right-icon"
+      })]
+    }), /*#__PURE__*/_jsx(NavPanelContainer, {
+      isActive: activeTab === index,
+      isFirst: index === 0,
+      children: children
+    })]
+  });
+};
+export default NavSection;

package/dist/AppHeader/AppHeaderElements/{AppHeaderSectionVariant → AppHeaderSection}/PanelLayout.js

@@ -1,4 +1,4 @@
-import { Anchor, FlexBox, Text } from '@codecademy/gamut';
+import { Anchor, Box, FlexBox, Text } from '@codecademy/gamut';
 import { MiniArrowRightIcon } from '@codecademy/gamut-icons';
 import { useGlobalHeaderItemClick } from '../../../GlobalHeader/context';
 import { useAppHeaderDropdownContext } from '../AppHeaderDropdownProvider';
@@ -24,12 +24,15 @@ export const PanelLayout = ({
       md: 16,
       lg: 0
     },
-    children: [/*#__PURE__*/_jsx(Text, {
-      as: "h2",
-      variant: "title-sm",
-      children: heading
-    }), /*#__PURE__*/_jsx(Text, {
-      children: description
+    children: [/*#__PURE__*/_jsxs(Box, {
+      children: [/*#__PURE__*/_jsx(Text, {
+        as: "h2",
+        variant: "title-sm",
+        children: heading
+      }), /*#__PURE__*/_jsx(Text, {
+        mt: 8,
+        children: description
+      })]
     }), children, linkItem && /*#__PURE__*/_jsx(FlexBox, {
       justifyContent: "center",
       children: /*#__PURE__*/_jsx(Anchor, {

package/dist/AppHeader/AppHeaderElements/{AppHeaderSectionVariant → AppHeaderSection}/index.d.ts

@@ -1,6 +1,6 @@
 import React, { RefObject } from 'react';
 import { AppHeaderCatalogDropdownItem, AppHeaderResourcesDropdownItem } from '../../shared';
-export type AppHeaderSectionVariantProps = {
+export type AppHeaderSectionProps = {
     isOpen?: boolean;
     keyDownEvents?: (event: React.KeyboardEvent) => void;
     ref?: RefObject<HTMLDivElement>;
@@ -14,4 +14,4 @@ export type AppHeaderSectionVariantProps = {
         tabIndex: number;
     }) => JSX.Element;
 };
-export declare const AppHeaderSectionVariant: React.ForwardRefExoticComponent<Omit<AppHeaderSectionVariantProps, "ref"> & React.RefAttributes<HTMLDivElement>>;
+export declare const AppHeaderSection: React.ForwardRefExoticComponent<Omit<AppHeaderSectionProps, "ref"> & React.RefAttributes<HTMLDivElement>>;