@codecademy/brand 4.0.0-alpha.fdfb3ba880.0 → 4.0.0

package/dist/LayoutMenu/SelectedSectionItem.d.ts

@@ -1,7 +1,3 @@
-import { WithChildrenProp } from "@codecademy/gamut";
-import * as React$1 from "react";
-
-//#region src/LayoutMenu/SelectedSectionItem.d.ts
-declare const SelectedSectionItem: React$1.FC<WithChildrenProp>;
-//#endregion
-export { SelectedSectionItem };
+import { WithChildrenProp } from '@codecademy/gamut';
+import * as React from 'react';
+export declare const SelectedSectionItem: React.FC<WithChildrenProp>;

package/dist/LayoutMenu/SelectedSectionItem.js

@@ -1,20 +1,17 @@
-import { Box, Text } from "@codecademy/gamut";
-import "react";
-import { jsx } from "react/jsx-runtime";
-
-//#region src/LayoutMenu/SelectedSectionItem.tsx
-const SelectedSectionItem = ({ children }) => {
-	return /* @__PURE__ */ jsx(Box, {
-		borderLeft: 1,
-		borderWidthLeft: "6px",
-		pl: 12,
-		"aria-current": "true",
-		children: /* @__PURE__ */ jsx(Text, {
-			fontWeight: "title",
-			children
-		})
-	});
-};
-
-//#endregion
-export { SelectedSectionItem };
+import { Box, Text } from '@codecademy/gamut';
+import * as React from 'react';
+import { jsx as _jsx } from "react/jsx-runtime";
+export const SelectedSectionItem = ({
+  children
+}) => {
+  return /*#__PURE__*/_jsx(Box, {
+    borderLeft: 1,
+    borderWidthLeft: "6px",
+    pl: 12,
+    "aria-current": "true",
+    children: /*#__PURE__*/_jsx(Text, {
+      fontWeight: "title",
+      children: children
+    })
+  });
+};

package/dist/LayoutMenu/index.d.ts

@@ -1,4 +1,3 @@
-import { LayoutMenu, LayoutMenuProps } from "./LayoutMenu.js";
-import { SectionItemLink, SectionItemLinkProps } from "./SectionItemLink.js";
-import { SelectedSectionItem } from "./SelectedSectionItem.js";
-export { LayoutMenu, LayoutMenuProps, SectionItemLink, SectionItemLinkProps, SelectedSectionItem };
+export * from './LayoutMenu';
+export * from './SectionItemLink';
+export * from './SelectedSectionItem';

package/dist/LayoutMenu/index.js

@@ -1,5 +1,3 @@
-import { SectionItemLink } from "./SectionItemLink.js";
-import { SelectedSectionItem } from "./SelectedSectionItem.js";
-import { LayoutMenu } from "./LayoutMenu.js";
-
-export { LayoutMenu, SectionItemLink, SelectedSectionItem };
+export * from './LayoutMenu';
+export * from './SectionItemLink';
+export * from './SelectedSectionItem';

package/dist/LayoutMenuVariant/AccordionMenu.d.ts

@@ -1,19 +1,21 @@
-import { Anchor } from "@codecademy/gamut";
-import React from "react";
-
-//#region src/LayoutMenuVariant/AccordionMenu.d.ts
-type SectionItem = {
-  title: string;
-  slug: string;
-  href: string;
-  onClick: (event: React.MouseEvent) => void;
-  badge?: JSX.Element;
-  variant?: React.ComponentProps<typeof Anchor>['variant'];
+import { Anchor } from '@codecademy/gamut';
+import React from 'react';
+export type SectionItem = {
+    title: string;
+    slug: string;
+    href: string;
+    onClick: (event: React.MouseEvent) => void;
+    badge?: JSX.Element;
+    variant?: React.ComponentProps<typeof Anchor>['variant'];
 };
-type Section = {
-  title: string;
-  slug: string;
-  items: SectionItem[];
+export type Section = {
+    title: string;
+    slug: string;
+    items: SectionItem[];
 };
-//#endregion
-export { Section, SectionItem };
+export type AccordionMenuProps = {
+    section: Section;
+    onSectionToggle: (sectionSlug: string) => void;
+    onItemClick: () => void;
+};
+export declare const AccordionMenu: React.FC<AccordionMenuProps>;

package/dist/LayoutMenuVariant/AccordionMenu.js

@@ -1,73 +1,87 @@
-import { LayoutMenuSection } from "./LayoutMenuSection.js";
-import { AccordionAreaDeprecated, Anchor, Box, Text } from "@codecademy/gamut";
-import { css, states, transitionConcat } from "@codecademy/gamut-styles";
-import styled from "@emotion/styled";
-import React, { useState } from "react";
-import { jsx, jsxs } from "react/jsx-runtime";
-import { MiniChevronDownIcon } from "@codecademy/gamut-icons";
-
-//#region src/LayoutMenuVariant/AccordionMenu.tsx
-const StyledAccordionArea = styled(AccordionAreaDeprecated)`
-  padding-block: ${({ theme: theme$1 }) => theme$1.spacing[16]};
-  position: relative;
-  left: -4px;
-
-  &:not(:first-child) {
-    border-top: 1px solid ${({ theme: theme$1 }) => theme$1.colors["navy-300"]};
+import _styled from "@emotion/styled/base";
+function _EMOTION_STRINGIFIED_CSS_ERROR__() { return "You have tried to stringify object returned from `css` function. It isn't supposed to be used directly (e.g. as value of the `className` prop), but rather handed to emotion so it can handle it (e.g. as value of `css` prop)."; }
+import { AccordionAreaDeprecated, Anchor, Box, Text } from '@codecademy/gamut';
+import { MiniChevronDownIcon } from '@codecademy/gamut-icons';
+import { css, states, transitionConcat } from '@codecademy/gamut-styles';
+import React, { useState } from 'react';
+import { LayoutMenuSection } from './LayoutMenuSection';
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+const StyledAccordionArea = /*#__PURE__*/_styled(AccordionAreaDeprecated, {
+  target: "e12elcd22",
+  label: "StyledAccordionArea"
+})("padding-block:", ({
+  theme
+}) => theme.spacing[16], ";position:relative;left:-4px;&:not(:first-child){border-top:1px solid ", ({
+  theme
+}) => theme.colors['navy-300'], ";}" + (process.env.NODE_ENV === "production" ? "" : "/*# sourceMappingURL=data:application/json;charset=utf-8;base64,eyJ2ZXJzaW9uIjozLCJzb3VyY2VzIjpbIi4uLy4uL3NyYy9MYXlvdXRNZW51VmFyaWFudC9BY2NvcmRpb25NZW51LnRzeCJdLCJuYW1lcyI6W10sIm1hcHBpbmdzIjoiQUFTMkQiLCJmaWxlIjoiLi4vLi4vc3JjL0xheW91dE1lbnVWYXJpYW50L0FjY29yZGlvbk1lbnUudHN4Iiwic291cmNlc0NvbnRlbnQiOlsiaW1wb3J0IHsgQWNjb3JkaW9uQXJlYURlcHJlY2F0ZWQsIEFuY2hvciwgQm94LCBUZXh0IH0gZnJvbSAnQGNvZGVjYWRlbXkvZ2FtdXQnO1xuaW1wb3J0IHsgTWluaUNoZXZyb25Eb3duSWNvbiB9IGZyb20gJ0Bjb2RlY2FkZW15L2dhbXV0LWljb25zJztcbmltcG9ydCB7IGNzcywgc3RhdGVzLCB0cmFuc2l0aW9uQ29uY2F0IH0gZnJvbSAnQGNvZGVjYWRlbXkvZ2FtdXQtc3R5bGVzJztcbmltcG9ydCB7IFN0eWxlUHJvcHMgfSBmcm9tICdAY29kZWNhZGVteS92YXJpYW5jZSc7XG5pbXBvcnQgc3R5bGVkIGZyb20gJ0BlbW90aW9uL3N0eWxlZCc7XG5pbXBvcnQgUmVhY3QsIHsgdXNlU3RhdGUgfSBmcm9tICdyZWFjdCc7XG5cbmltcG9ydCB7IExheW91dE1lbnVTZWN0aW9uIH0gZnJvbSAnLi9MYXlvdXRNZW51U2VjdGlvbic7XG5cbmNvbnN0IFN0eWxlZEFjY29yZGlvbkFyZWEgPSBzdHlsZWQoQWNjb3JkaW9uQXJlYURlcHJlY2F0ZWQpYFxuICBwYWRkaW5nLWJsb2NrOiAkeyh7IHRoZW1lIH0pID0+IHRoZW1lLnNwYWNpbmdbMTZdfTtcbiAgcG9zaXRpb246IHJlbGF0aXZlO1xuICBsZWZ0OiAtNHB4O1xuXG4gICY6bm90KDpmaXJzdC1jaGlsZCkge1xuICAgIGJvcmRlci10b3A6IDFweCBzb2xpZCAkeyh7IHRoZW1lIH0pID0+IHRoZW1lLmNvbG9yc1snbmF2eS0zMDAnXX07XG4gIH1cbmA7XG5cbmNvbnN0IFN0eWxlZEFuY2hvciA9IHN0eWxlZChBbmNob3IpYFxuICA6aG92ZXIge1xuICAgIGNvbG9yOiBpbmhlcml0O1xuICB9XG5gO1xuXG5jb25zdCBjaGV2cm9uU3RhdGVzID0gc3RhdGVzKHtcbiAgZXhwYW5kZWQ6IHsgdHJhbnNmb3JtOiAncm90YXRlKDE4MGRlZyknIH0sXG59KTtcblxuY29uc3QgRXhwYW5kQ2hldnJvbiA9IHN0eWxlZChNaW5pQ2hldnJvbkRvd25JY29uKTxcbiAgU3R5bGVQcm9wczx0eXBlb2YgY2hldnJvblN0YXRlcz5cbj4oXG4gIGNzcyh7XG4gICAgdHJhbnNmb3JtOiAncm90YXRlKDBkZWcpJyxcbiAgICB0cmFuc2l0aW9uOiB0cmFuc2l0aW9uQ29uY2F0KFsndHJhbnNmb3JtJ10sICdzbG93JywgJ2Vhc2Utb3V0JyksXG4gIH0pLFxuICBjaGV2cm9uU3RhdGVzXG4pO1xuXG5leHBvcnQgdHlwZSBTZWN0aW9uSXRlbSA9IHtcbiAgdGl0bGU6IHN0cmluZztcbiAgc2x1Zzogc3RyaW5nO1xuICBocmVmOiBzdHJpbmc7XG4gIG9uQ2xpY2s6IChldmVudDogUmVhY3QuTW91c2VFdmVudCkgPT4gdm9pZDtcbiAgYmFkZ2U/OiBKU1guRWxlbWVudDtcbiAgdmFyaWFudD86IFJlYWN0LkNvbXBvbmVudFByb3BzPHR5cGVvZiBBbmNob3I+Wyd2YXJpYW50J107XG59O1xuXG5leHBvcnQgdHlwZSBTZWN0aW9uID0ge1xuICB0aXRsZTogc3RyaW5nO1xuICBzbHVnOiBzdHJpbmc7XG4gIGl0ZW1zOiBTZWN0aW9uSXRlbVtdO1xufTtcblxuZXhwb3J0IHR5cGUgQWNjb3JkaW9uTWVudVByb3BzID0ge1xuICBzZWN0aW9uOiBTZWN0aW9uO1xuICBvblNlY3Rpb25Ub2dnbGU6IChzZWN0aW9uU2x1Zzogc3RyaW5nKSA9PiB2b2lkO1xuICBvbkl0ZW1DbGljazogKCkgPT4gdm9pZDtcbn07XG5cbmV4cG9ydCBjb25zdCBBY2NvcmRpb25NZW51OiBSZWFjdC5GQzxBY2NvcmRpb25NZW51UHJvcHM+ID0gKHtcbiAgc2VjdGlvbixcbiAgb25TZWN0aW9uVG9nZ2xlLFxuICBvbkl0ZW1DbGljayxcbn0pID0+IHtcbiAgY29uc3QgW2V4cGFuZGVkLCBzZXRFeHBhbmRlZF0gPSB1c2VTdGF0ZSh0cnVlKTtcblxuICByZXR1cm4gKFxuICAgIDxTdHlsZWRBY2NvcmRpb25BcmVhXG4gICAgICBleHBhbmRlZD17ZXhwYW5kZWR9XG4gICAgICB0b3A9e1xuICAgICAgICA8U3R5bGVkQW5jaG9yXG4gICAgICAgICAgdmFyaWFudD1cImludGVyZmFjZVwiXG4gICAgICAgICAgcGI9ezEyfVxuICAgICAgICAgIHB4PXs0fVxuICAgICAgICAgIG9uQ2xpY2s9eygpID0+IHtcbiAgICAgICAgICAgIG9uU2VjdGlvblRvZ2dsZShzZWN0aW9uLnNsdWcpO1xuICAgICAgICAgICAgc2V0RXhwYW5kZWQoKHByZXYpID0+ICFwcmV2KTtcbiAgICAgICAgICB9fVxuICAgICAgICAgIGFyaWEtZXhwYW5kZWQ9e2V4cGFuZGVkfVxuICAgICAgICAgIGRpc3BsYXk9XCJmbGV4XCJcbiAgICAgICAgICB3aWR0aD1cIjEwMCVcIlxuICAgICAgICA+XG4gICAgICAgICAgPEJveCBkaXNwbGF5PVwiZmxleFwiIGp1c3RpZnlDb250ZW50PVwic3BhY2UtYmV0d2VlblwiIHdpZHRoPVwiMTAwJVwiPlxuICAgICAgICAgICAgPFRleHRcbiAgICAgICAgICAgICAgdmFyaWFudD1cInAtc21hbGxcIlxuICAgICAgICAgICAgICAvLyBlc2xpbnQtZGlzYWJsZS1uZXh0LWxpbmUgZ2FtdXQvbm8taW5saW5lLXN0eWxlXG4gICAgICAgICAgICAgIHN0eWxlPXt7IGZsZXg6IDEsIGZvbnRXZWlnaHQ6ICdib2xkJyB9fVxuICAgICAgICAgICAgICB0ZXh0QWxpZ249XCJsZWZ0XCJcbiAgICAgICAgICAgID5cbiAgICAgICAgICAgICAge3NlY3Rpb24udGl0bGV9XG4gICAgICAgICAgICA8L1RleHQ+XG4gICAgICAgICAgICA8RXhwYW5kQ2hldnJvblxuICAgICAgICAgICAgICBtbD17MTJ9XG4gICAgICAgICAgICAgIHNpemU9ezE2fVxuICAgICAgICAgICAgICBleHBhbmRlZD17ZXhwYW5kZWR9XG4gICAgICAgICAgICAgIHBvc2l0aW9uPVwicmVsYXRpdmVcIlxuICAgICAgICAgICAgICB0b3A9ezR9XG4gICAgICAgICAgICAvPlxuICAgICAgICAgIDwvQm94PlxuICAgICAgICA8L1N0eWxlZEFuY2hvcj5cbiAgICAgIH1cbiAgICA+XG4gICAgICA8TGF5b3V0TWVudVNlY3Rpb24gaXRlbXM9e3NlY3Rpb24uaXRlbXN9IG9uSXRlbUNsaWNrPXtvbkl0ZW1DbGlja30gLz5cbiAgICA8L1N0eWxlZEFjY29yZGlvbkFyZWE+XG4gICk7XG59O1xuIl19 */"));
+const StyledAnchor = /*#__PURE__*/_styled(Anchor, {
+  target: "e12elcd21",
+  label: "StyledAnchor"
+})(process.env.NODE_ENV === "production" ? {
+  name: "8a4698",
+  styles: ":hover{color:inherit;}"
+} : {
+  name: "8a4698",
+  styles: ":hover{color:inherit;}/*# sourceMappingURL=data:application/json;charset=utf-8;base64,eyJ2ZXJzaW9uIjozLCJzb3VyY2VzIjpbIi4uLy4uL3NyYy9MYXlvdXRNZW51VmFyaWFudC9BY2NvcmRpb25NZW51LnRzeCJdLCJuYW1lcyI6W10sIm1hcHBpbmdzIjoiQUFtQm1DIiwiZmlsZSI6Ii4uLy4uL3NyYy9MYXlvdXRNZW51VmFyaWFudC9BY2NvcmRpb25NZW51LnRzeCIsInNvdXJjZXNDb250ZW50IjpbImltcG9ydCB7IEFjY29yZGlvbkFyZWFEZXByZWNhdGVkLCBBbmNob3IsIEJveCwgVGV4dCB9IGZyb20gJ0Bjb2RlY2FkZW15L2dhbXV0JztcbmltcG9ydCB7IE1pbmlDaGV2cm9uRG93bkljb24gfSBmcm9tICdAY29kZWNhZGVteS9nYW11dC1pY29ucyc7XG5pbXBvcnQgeyBjc3MsIHN0YXRlcywgdHJhbnNpdGlvbkNvbmNhdCB9IGZyb20gJ0Bjb2RlY2FkZW15L2dhbXV0LXN0eWxlcyc7XG5pbXBvcnQgeyBTdHlsZVByb3BzIH0gZnJvbSAnQGNvZGVjYWRlbXkvdmFyaWFuY2UnO1xuaW1wb3J0IHN0eWxlZCBmcm9tICdAZW1vdGlvbi9zdHlsZWQnO1xuaW1wb3J0IFJlYWN0LCB7IHVzZVN0YXRlIH0gZnJvbSAncmVhY3QnO1xuXG5pbXBvcnQgeyBMYXlvdXRNZW51U2VjdGlvbiB9IGZyb20gJy4vTGF5b3V0TWVudVNlY3Rpb24nO1xuXG5jb25zdCBTdHlsZWRBY2NvcmRpb25BcmVhID0gc3R5bGVkKEFjY29yZGlvbkFyZWFEZXByZWNhdGVkKWBcbiAgcGFkZGluZy1ibG9jazogJHsoeyB0aGVtZSB9KSA9PiB0aGVtZS5zcGFjaW5nWzE2XX07XG4gIHBvc2l0aW9uOiByZWxhdGl2ZTtcbiAgbGVmdDogLTRweDtcblxuICAmOm5vdCg6Zmlyc3QtY2hpbGQpIHtcbiAgICBib3JkZXItdG9wOiAxcHggc29saWQgJHsoeyB0aGVtZSB9KSA9PiB0aGVtZS5jb2xvcnNbJ25hdnktMzAwJ119O1xuICB9XG5gO1xuXG5jb25zdCBTdHlsZWRBbmNob3IgPSBzdHlsZWQoQW5jaG9yKWBcbiAgOmhvdmVyIHtcbiAgICBjb2xvcjogaW5oZXJpdDtcbiAgfVxuYDtcblxuY29uc3QgY2hldnJvblN0YXRlcyA9IHN0YXRlcyh7XG4gIGV4cGFuZGVkOiB7IHRyYW5zZm9ybTogJ3JvdGF0ZSgxODBkZWcpJyB9LFxufSk7XG5cbmNvbnN0IEV4cGFuZENoZXZyb24gPSBzdHlsZWQoTWluaUNoZXZyb25Eb3duSWNvbik8XG4gIFN0eWxlUHJvcHM8dHlwZW9mIGNoZXZyb25TdGF0ZXM+XG4+KFxuICBjc3Moe1xuICAgIHRyYW5zZm9ybTogJ3JvdGF0ZSgwZGVnKScsXG4gICAgdHJhbnNpdGlvbjogdHJhbnNpdGlvbkNvbmNhdChbJ3RyYW5zZm9ybSddLCAnc2xvdycsICdlYXNlLW91dCcpLFxuICB9KSxcbiAgY2hldnJvblN0YXRlc1xuKTtcblxuZXhwb3J0IHR5cGUgU2VjdGlvbkl0ZW0gPSB7XG4gIHRpdGxlOiBzdHJpbmc7XG4gIHNsdWc6IHN0cmluZztcbiAgaHJlZjogc3RyaW5nO1xuICBvbkNsaWNrOiAoZXZlbnQ6IFJlYWN0Lk1vdXNlRXZlbnQpID0+IHZvaWQ7XG4gIGJhZGdlPzogSlNYLkVsZW1lbnQ7XG4gIHZhcmlhbnQ/OiBSZWFjdC5Db21wb25lbnRQcm9wczx0eXBlb2YgQW5jaG9yPlsndmFyaWFudCddO1xufTtcblxuZXhwb3J0IHR5cGUgU2VjdGlvbiA9IHtcbiAgdGl0bGU6IHN0cmluZztcbiAgc2x1Zzogc3RyaW5nO1xuICBpdGVtczogU2VjdGlvbkl0ZW1bXTtcbn07XG5cbmV4cG9ydCB0eXBlIEFjY29yZGlvbk1lbnVQcm9wcyA9IHtcbiAgc2VjdGlvbjogU2VjdGlvbjtcbiAgb25TZWN0aW9uVG9nZ2xlOiAoc2VjdGlvblNsdWc6IHN0cmluZykgPT4gdm9pZDtcbiAgb25JdGVtQ2xpY2s6ICgpID0+IHZvaWQ7XG59O1xuXG5leHBvcnQgY29uc3QgQWNjb3JkaW9uTWVudTogUmVhY3QuRkM8QWNjb3JkaW9uTWVudVByb3BzPiA9ICh7XG4gIHNlY3Rpb24sXG4gIG9uU2VjdGlvblRvZ2dsZSxcbiAgb25JdGVtQ2xpY2ssXG59KSA9PiB7XG4gIGNvbnN0IFtleHBhbmRlZCwgc2V0RXhwYW5kZWRdID0gdXNlU3RhdGUodHJ1ZSk7XG5cbiAgcmV0dXJuIChcbiAgICA8U3R5bGVkQWNjb3JkaW9uQXJlYVxuICAgICAgZXhwYW5kZWQ9e2V4cGFuZGVkfVxuICAgICAgdG9wPXtcbiAgICAgICAgPFN0eWxlZEFuY2hvclxuICAgICAgICAgIHZhcmlhbnQ9XCJpbnRlcmZhY2VcIlxuICAgICAgICAgIHBiPXsxMn1cbiAgICAgICAgICBweD17NH1cbiAgICAgICAgICBvbkNsaWNrPXsoKSA9PiB7XG4gICAgICAgICAgICBvblNlY3Rpb25Ub2dnbGUoc2VjdGlvbi5zbHVnKTtcbiAgICAgICAgICAgIHNldEV4cGFuZGVkKChwcmV2KSA9PiAhcHJldik7XG4gICAgICAgICAgfX1cbiAgICAgICAgICBhcmlhLWV4cGFuZGVkPXtleHBhbmRlZH1cbiAgICAgICAgICBkaXNwbGF5PVwiZmxleFwiXG4gICAgICAgICAgd2lkdGg9XCIxMDAlXCJcbiAgICAgICAgPlxuICAgICAgICAgIDxCb3ggZGlzcGxheT1cImZsZXhcIiBqdXN0aWZ5Q29udGVudD1cInNwYWNlLWJldHdlZW5cIiB3aWR0aD1cIjEwMCVcIj5cbiAgICAgICAgICAgIDxUZXh0XG4gICAgICAgICAgICAgIHZhcmlhbnQ9XCJwLXNtYWxsXCJcbiAgICAgICAgICAgICAgLy8gZXNsaW50LWRpc2FibGUtbmV4dC1saW5lIGdhbXV0L25vLWlubGluZS1zdHlsZVxuICAgICAgICAgICAgICBzdHlsZT17eyBmbGV4OiAxLCBmb250V2VpZ2h0OiAnYm9sZCcgfX1cbiAgICAgICAgICAgICAgdGV4dEFsaWduPVwibGVmdFwiXG4gICAgICAgICAgICA+XG4gICAgICAgICAgICAgIHtzZWN0aW9uLnRpdGxlfVxuICAgICAgICAgICAgPC9UZXh0PlxuICAgICAgICAgICAgPEV4cGFuZENoZXZyb25cbiAgICAgICAgICAgICAgbWw9ezEyfVxuICAgICAgICAgICAgICBzaXplPXsxNn1cbiAgICAgICAgICAgICAgZXhwYW5kZWQ9e2V4cGFuZGVkfVxuICAgICAgICAgICAgICBwb3NpdGlvbj1cInJlbGF0aXZlXCJcbiAgICAgICAgICAgICAgdG9wPXs0fVxuICAgICAgICAgICAgLz5cbiAgICAgICAgICA8L0JveD5cbiAgICAgICAgPC9TdHlsZWRBbmNob3I+XG4gICAgICB9XG4gICAgPlxuICAgICAgPExheW91dE1lbnVTZWN0aW9uIGl0ZW1zPXtzZWN0aW9uLml0ZW1zfSBvbkl0ZW1DbGljaz17b25JdGVtQ2xpY2t9IC8+XG4gICAgPC9TdHlsZWRBY2NvcmRpb25BcmVhPlxuICApO1xufTtcbiJdfQ== */",
+  toString: _EMOTION_STRINGIFIED_CSS_ERROR__
+});
+const chevronStates = states({
+  expanded: {
+    transform: 'rotate(180deg)'
   }
-`;
-const StyledAnchor = styled(Anchor)`
-  :hover {
-    color: inherit;
-  }
-`;
-const chevronStates = states({ expanded: { transform: "rotate(180deg)" } });
-const ExpandChevron = styled(MiniChevronDownIcon)(css({
-	transform: "rotate(0deg)",
-	transition: transitionConcat(["transform"], "slow", "ease-out")
-}), chevronStates);
-const AccordionMenu = ({ section, onSectionToggle, onItemClick }) => {
-	const [expanded, setExpanded] = useState(true);
-	return /* @__PURE__ */ jsx(StyledAccordionArea, {
-		expanded,
-		top: /* @__PURE__ */ jsx(StyledAnchor, {
-			variant: "interface",
-			pb: 12,
-			px: 4,
-			onClick: () => {
-				onSectionToggle(section.slug);
-				setExpanded((prev) => !prev);
-			},
-			"aria-expanded": expanded,
-			display: "flex",
-			width: "100%",
-			children: /* @__PURE__ */ jsxs(Box, {
-				display: "flex",
-				justifyContent: "space-between",
-				width: "100%",
-				children: [/* @__PURE__ */ jsx(Text, {
-					variant: "p-small",
-					style: {
-						flex: 1,
-						fontWeight: "bold"
-					},
-					textAlign: "left",
-					children: section.title
-				}), /* @__PURE__ */ jsx(ExpandChevron, {
-					ml: 12,
-					size: 16,
-					expanded,
-					position: "relative",
-					top: 4
-				})]
-			})
-		}),
-		children: /* @__PURE__ */ jsx(LayoutMenuSection, {
-			items: section.items,
-			onItemClick
-		})
-	});
-};
-
-//#endregion
-export { AccordionMenu };
+});
+const ExpandChevron = /*#__PURE__*/_styled(MiniChevronDownIcon, {
+  target: "e12elcd20",
+  label: "ExpandChevron"
+})(css({
+  transform: 'rotate(0deg)',
+  transition: transitionConcat(['transform'], 'slow', 'ease-out')
+}), chevronStates, process.env.NODE_ENV === "production" ? "" : "/*# sourceMappingURL=data:application/json;charset=utf-8;base64,eyJ2ZXJzaW9uIjozLCJzb3VyY2VzIjpbIi4uLy4uL3NyYy9MYXlvdXRNZW51VmFyaWFudC9BY2NvcmRpb25NZW51LnRzeCJdLCJuYW1lcyI6W10sIm1hcHBpbmdzIjoiQUE2QnNCIiwiZmlsZSI6Ii4uLy4uL3NyYy9MYXlvdXRNZW51VmFyaWFudC9BY2NvcmRpb25NZW51LnRzeCIsInNvdXJjZXNDb250ZW50IjpbImltcG9ydCB7IEFjY29yZGlvbkFyZWFEZXByZWNhdGVkLCBBbmNob3IsIEJveCwgVGV4dCB9IGZyb20gJ0Bjb2RlY2FkZW15L2dhbXV0JztcbmltcG9ydCB7IE1pbmlDaGV2cm9uRG93bkljb24gfSBmcm9tICdAY29kZWNhZGVteS9nYW11dC1pY29ucyc7XG5pbXBvcnQgeyBjc3MsIHN0YXRlcywgdHJhbnNpdGlvbkNvbmNhdCB9IGZyb20gJ0Bjb2RlY2FkZW15L2dhbXV0LXN0eWxlcyc7XG5pbXBvcnQgeyBTdHlsZVByb3BzIH0gZnJvbSAnQGNvZGVjYWRlbXkvdmFyaWFuY2UnO1xuaW1wb3J0IHN0eWxlZCBmcm9tICdAZW1vdGlvbi9zdHlsZWQnO1xuaW1wb3J0IFJlYWN0LCB7IHVzZVN0YXRlIH0gZnJvbSAncmVhY3QnO1xuXG5pbXBvcnQgeyBMYXlvdXRNZW51U2VjdGlvbiB9IGZyb20gJy4vTGF5b3V0TWVudVNlY3Rpb24nO1xuXG5jb25zdCBTdHlsZWRBY2NvcmRpb25BcmVhID0gc3R5bGVkKEFjY29yZGlvbkFyZWFEZXByZWNhdGVkKWBcbiAgcGFkZGluZy1ibG9jazogJHsoeyB0aGVtZSB9KSA9PiB0aGVtZS5zcGFjaW5nWzE2XX07XG4gIHBvc2l0aW9uOiByZWxhdGl2ZTtcbiAgbGVmdDogLTRweDtcblxuICAmOm5vdCg6Zmlyc3QtY2hpbGQpIHtcbiAgICBib3JkZXItdG9wOiAxcHggc29saWQgJHsoeyB0aGVtZSB9KSA9PiB0aGVtZS5jb2xvcnNbJ25hdnktMzAwJ119O1xuICB9XG5gO1xuXG5jb25zdCBTdHlsZWRBbmNob3IgPSBzdHlsZWQoQW5jaG9yKWBcbiAgOmhvdmVyIHtcbiAgICBjb2xvcjogaW5oZXJpdDtcbiAgfVxuYDtcblxuY29uc3QgY2hldnJvblN0YXRlcyA9IHN0YXRlcyh7XG4gIGV4cGFuZGVkOiB7IHRyYW5zZm9ybTogJ3JvdGF0ZSgxODBkZWcpJyB9LFxufSk7XG5cbmNvbnN0IEV4cGFuZENoZXZyb24gPSBzdHlsZWQoTWluaUNoZXZyb25Eb3duSWNvbik8XG4gIFN0eWxlUHJvcHM8dHlwZW9mIGNoZXZyb25TdGF0ZXM+XG4+KFxuICBjc3Moe1xuICAgIHRyYW5zZm9ybTogJ3JvdGF0ZSgwZGVnKScsXG4gICAgdHJhbnNpdGlvbjogdHJhbnNpdGlvbkNvbmNhdChbJ3RyYW5zZm9ybSddLCAnc2xvdycsICdlYXNlLW91dCcpLFxuICB9KSxcbiAgY2hldnJvblN0YXRlc1xuKTtcblxuZXhwb3J0IHR5cGUgU2VjdGlvbkl0ZW0gPSB7XG4gIHRpdGxlOiBzdHJpbmc7XG4gIHNsdWc6IHN0cmluZztcbiAgaHJlZjogc3RyaW5nO1xuICBvbkNsaWNrOiAoZXZlbnQ6IFJlYWN0Lk1vdXNlRXZlbnQpID0+IHZvaWQ7XG4gIGJhZGdlPzogSlNYLkVsZW1lbnQ7XG4gIHZhcmlhbnQ/OiBSZWFjdC5Db21wb25lbnRQcm9wczx0eXBlb2YgQW5jaG9yPlsndmFyaWFudCddO1xufTtcblxuZXhwb3J0IHR5cGUgU2VjdGlvbiA9IHtcbiAgdGl0bGU6IHN0cmluZztcbiAgc2x1Zzogc3RyaW5nO1xuICBpdGVtczogU2VjdGlvbkl0ZW1bXTtcbn07XG5cbmV4cG9ydCB0eXBlIEFjY29yZGlvbk1lbnVQcm9wcyA9IHtcbiAgc2VjdGlvbjogU2VjdGlvbjtcbiAgb25TZWN0aW9uVG9nZ2xlOiAoc2VjdGlvblNsdWc6IHN0cmluZykgPT4gdm9pZDtcbiAgb25JdGVtQ2xpY2s6ICgpID0+IHZvaWQ7XG59O1xuXG5leHBvcnQgY29uc3QgQWNjb3JkaW9uTWVudTogUmVhY3QuRkM8QWNjb3JkaW9uTWVudVByb3BzPiA9ICh7XG4gIHNlY3Rpb24sXG4gIG9uU2VjdGlvblRvZ2dsZSxcbiAgb25JdGVtQ2xpY2ssXG59KSA9PiB7XG4gIGNvbnN0IFtleHBhbmRlZCwgc2V0RXhwYW5kZWRdID0gdXNlU3RhdGUodHJ1ZSk7XG5cbiAgcmV0dXJuIChcbiAgICA8U3R5bGVkQWNjb3JkaW9uQXJlYVxuICAgICAgZXhwYW5kZWQ9e2V4cGFuZGVkfVxuICAgICAgdG9wPXtcbiAgICAgICAgPFN0eWxlZEFuY2hvclxuICAgICAgICAgIHZhcmlhbnQ9XCJpbnRlcmZhY2VcIlxuICAgICAgICAgIHBiPXsxMn1cbiAgICAgICAgICBweD17NH1cbiAgICAgICAgICBvbkNsaWNrPXsoKSA9PiB7XG4gICAgICAgICAgICBvblNlY3Rpb25Ub2dnbGUoc2VjdGlvbi5zbHVnKTtcbiAgICAgICAgICAgIHNldEV4cGFuZGVkKChwcmV2KSA9PiAhcHJldik7XG4gICAgICAgICAgfX1cbiAgICAgICAgICBhcmlhLWV4cGFuZGVkPXtleHBhbmRlZH1cbiAgICAgICAgICBkaXNwbGF5PVwiZmxleFwiXG4gICAgICAgICAgd2lkdGg9XCIxMDAlXCJcbiAgICAgICAgPlxuICAgICAgICAgIDxCb3ggZGlzcGxheT1cImZsZXhcIiBqdXN0aWZ5Q29udGVudD1cInNwYWNlLWJldHdlZW5cIiB3aWR0aD1cIjEwMCVcIj5cbiAgICAgICAgICAgIDxUZXh0XG4gICAgICAgICAgICAgIHZhcmlhbnQ9XCJwLXNtYWxsXCJcbiAgICAgICAgICAgICAgLy8gZXNsaW50LWRpc2FibGUtbmV4dC1saW5lIGdhbXV0L25vLWlubGluZS1zdHlsZVxuICAgICAgICAgICAgICBzdHlsZT17eyBmbGV4OiAxLCBmb250V2VpZ2h0OiAnYm9sZCcgfX1cbiAgICAgICAgICAgICAgdGV4dEFsaWduPVwibGVmdFwiXG4gICAgICAgICAgICA+XG4gICAgICAgICAgICAgIHtzZWN0aW9uLnRpdGxlfVxuICAgICAgICAgICAgPC9UZXh0PlxuICAgICAgICAgICAgPEV4cGFuZENoZXZyb25cbiAgICAgICAgICAgICAgbWw9ezEyfVxuICAgICAgICAgICAgICBzaXplPXsxNn1cbiAgICAgICAgICAgICAgZXhwYW5kZWQ9e2V4cGFuZGVkfVxuICAgICAgICAgICAgICBwb3NpdGlvbj1cInJlbGF0aXZlXCJcbiAgICAgICAgICAgICAgdG9wPXs0fVxuICAgICAgICAgICAgLz5cbiAgICAgICAgICA8L0JveD5cbiAgICAgICAgPC9TdHlsZWRBbmNob3I+XG4gICAgICB9XG4gICAgPlxuICAgICAgPExheW91dE1lbnVTZWN0aW9uIGl0ZW1zPXtzZWN0aW9uLml0ZW1zfSBvbkl0ZW1DbGljaz17b25JdGVtQ2xpY2t9IC8+XG4gICAgPC9TdHlsZWRBY2NvcmRpb25BcmVhPlxuICApO1xufTtcbiJdfQ== */");
+export const AccordionMenu = ({
+  section,
+  onSectionToggle,
+  onItemClick
+}) => {
+  const [expanded, setExpanded] = useState(true);
+  return /*#__PURE__*/_jsx(StyledAccordionArea, {
+    expanded: expanded,
+    top: /*#__PURE__*/_jsx(StyledAnchor, {
+      variant: "interface",
+      pb: 12,
+      px: 4,
+      onClick: () => {
+        onSectionToggle(section.slug);
+        setExpanded(prev => !prev);
+      },
+      "aria-expanded": expanded,
+      display: "flex",
+      width: "100%",
+      children: /*#__PURE__*/_jsxs(Box, {
+        display: "flex",
+        justifyContent: "space-between",
+        width: "100%",
+        children: [/*#__PURE__*/_jsx(Text, {
+          variant: "p-small"
+          // eslint-disable-next-line gamut/no-inline-style
+          ,
+          style: {
+            flex: 1,
+            fontWeight: 'bold'
+          },
+          textAlign: "left",
+          children: section.title
+        }), /*#__PURE__*/_jsx(ExpandChevron, {
+          ml: 12,
+          size: 16,
+          expanded: expanded,
+          position: "relative",
+          top: 4
+        })]
+      })
+    }),
+    children: /*#__PURE__*/_jsx(LayoutMenuSection, {
+      items: section.items,
+      onItemClick: onItemClick
+    })
+  });
+};

package/dist/LayoutMenuVariant/LayoutMenu.d.ts

@@ -1,43 +1,39 @@
-import { Section, SectionItem } from "./AccordionMenu.js";
-import { WithChildrenProp } from "@codecademy/gamut";
-import React, { ComponentType } from "react";
-import { GamutIconProps } from "@codecademy/gamut-icons";
-
-//#region src/LayoutMenuVariant/LayoutMenu.d.ts
-interface LayoutMenuProps extends WithChildrenProp {
-  /**
-   * Accessibility label for the mobile Flyout's close button.
-   */
-  closeLabel: string;
-  /**
-   * An array of sections containing the title, slug, and items, each of which will become an accordion. Each item contains a title, slug, and onClick.
-   */
-  sections: Section[];
-  /**
-   * Callback to be run on click of the accordion button
-   */
-  onSectionToggle: (sectionSlug: string) => void;
-  /**
-   * Text shown in mobile button that opens flyout on click
-   */
-  mobileButtonText: string;
-  /**
-   * Icon shown in mobile button that opens flyout on click
-   */
-  mobileButtonIcon?: ComponentType<GamutIconProps>;
-  /**
-   * Breakpoint above which the menu button displays as a full sidebar
-   */
-  breakpoint?: 'xs' | 'sm' | 'md' | 'lg' | 'xl';
-  /**
-   * An array of section items, each of which become an additional link on top of the accordion section.
-   */
-  topLinkSections?: SectionItem[];
-  /**
-   * Set fixed height for menu with overflow
-   */
-  menuHeight?: 'sm' | 'md' | 'lg';
+import { WithChildrenProp } from '@codecademy/gamut';
+import { GamutIconProps } from '@codecademy/gamut-icons';
+import React, { ComponentType } from 'react';
+import { Section, SectionItem } from './AccordionMenu';
+export interface LayoutMenuProps extends WithChildrenProp {
+    /**
+     * Accessibility label for the mobile Flyout's close button.
+     */
+    closeLabel: string;
+    /**
+     * An array of sections containing the title, slug, and items, each of which will become an accordion. Each item contains a title, slug, and onClick.
+     */
+    sections: Section[];
+    /**
+     * Callback to be run on click of the accordion button
+     */
+    onSectionToggle: (sectionSlug: string) => void;
+    /**
+     * Text shown in mobile button that opens flyout on click
+     */
+    mobileButtonText: string;
+    /**
+     * Icon shown in mobile button that opens flyout on click
+     */
+    mobileButtonIcon?: ComponentType<GamutIconProps>;
+    /**
+     * Breakpoint above which the menu button displays as a full sidebar
+     */
+    breakpoint?: 'xs' | 'sm' | 'md' | 'lg' | 'xl';
+    /**
+     * An array of section items, each of which become an additional link on top of the accordion section.
+     */
+    topLinkSections?: SectionItem[];
+    /**
+     * Set fixed height for menu with overflow
+     */
+    menuHeight?: 'sm' | 'md' | 'lg';
 }
-declare const LayoutMenu: React.FC<LayoutMenuProps>;
-//#endregion
-export { LayoutMenu, LayoutMenuProps };
+export declare const LayoutMenu: React.FC<LayoutMenuProps>;

package/dist/LayoutMenuVariant/LayoutMenu.js

@@ -1,85 +1,93 @@
-import { LogoCodecademy } from "../Logos/LogoCodecademy/index.js";
-import { LayoutMenuSection } from "./LayoutMenuSection.js";
-import { AccordionMenu } from "./AccordionMenu.js";
-import { Box, Flyout, StrokeButton } from "@codecademy/gamut";
-import { variant } from "@codecademy/gamut-styles";
-import styled from "@emotion/styled";
-import React, { useState } from "react";
-import { jsx, jsxs } from "react/jsx-runtime";
-
-//#region src/LayoutMenuVariant/LayoutMenu.tsx
-const StyleBox = styled(Box)(variant({
-	prop: "menuHeight",
-	base: {
-		borderColor: "black",
-		borderStyleBottom: "solid",
-		borderWidthBottom: "1px",
-		overflowY: "auto",
-		overflowX: "hidden",
-		paddingTop: "4px",
-		paddingLeft: "4px"
-	},
-	variants: {
-		sm: { height: "630px" },
-		md: { height: "1000px" },
-		lg: { height: "1370px" }
-	}
-}));
-const LayoutMenu = ({ closeLabel, sections, onSectionToggle, mobileButtonText, mobileButtonIcon, breakpoint = "lg", children, topLinkSections, menuHeight }) => {
-	const [expanded, setExpanded] = useState(false);
-	const accordionMenuSections = sections.map((section) => /* @__PURE__ */ jsx(AccordionMenu, {
-		section,
-		onSectionToggle,
-		onItemClick: () => setExpanded(false)
-	}, section.slug));
-	const topLinkLayoutMenuSections = topLinkSections && /* @__PURE__ */ jsx(LayoutMenuSection, {
-		items: topLinkSections,
-		onItemClick: () => setExpanded(false),
-		pb: 32
-	});
-	return /* @__PURE__ */ jsxs("nav", {
-		"aria-label": "Secondary",
-		children: [/* @__PURE__ */ jsxs(Box, {
-			display: {
-				_: "block",
-				[breakpoint]: "none"
-			},
-			children: [/* @__PURE__ */ jsx(Flyout, {
-				closeLabel,
-				expanded,
-				onClose: () => setExpanded(false),
-				title: /* @__PURE__ */ jsx(LogoCodecademy, { mb: 32 }),
-				children: /* @__PURE__ */ jsxs(Box, {
-					px: 24,
-					children: [
-						topLinkLayoutMenuSections,
-						accordionMenuSections,
-						children
-					]
-				})
-			}), /* @__PURE__ */ jsx(StrokeButton, {
-				"aria-expanded": expanded,
-				variant: "secondary",
-				width: 1,
-				icon: mobileButtonIcon,
-				onClick: () => setExpanded(true),
-				children: mobileButtonText
-			})]
-		}), /* @__PURE__ */ jsxs(StyleBox, {
-			menuHeight,
-			display: {
-				_: "none",
-				[breakpoint]: "block"
-			},
-			"data-testid": "desktop-menu",
-			children: [
-				topLinkLayoutMenuSections,
-				accordionMenuSections,
-				children
-			]
-		})]
-	});
-};
-
-//#endregion
-export { LayoutMenu };
+import _styled from "@emotion/styled/base";
+import { Box, Flyout, StrokeButton } from '@codecademy/gamut';
+import { variant } from '@codecademy/gamut-styles';
+import React, { useState } from 'react';
+import { LogoCodecademy } from '../Logos';
+import { AccordionMenu } from './AccordionMenu';
+import { LayoutMenuSection } from './LayoutMenuSection';
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+const StyleBox = /*#__PURE__*/_styled(Box, {
+  target: "eht3vxm0",
+  label: "StyleBox"
+})(variant({
+  prop: 'menuHeight',
+  base: {
+    borderColor: 'black',
+    borderStyleBottom: 'solid',
+    borderWidthBottom: '1px',
+    overflowY: 'auto',
+    overflowX: 'hidden',
+    paddingTop: '4px',
+    paddingLeft: '4px'
+  },
+  variants: {
+    sm: {
+      height: '630px'
+    },
+    md: {
+      height: '1000px'
+    },
+    lg: {
+      height: '1370px'
+    }
+  }
+}), process.env.NODE_ENV === "production" ? "" : "/*# sourceMappingURL=data:application/json;charset=utf-8;base64,eyJ2ZXJzaW9uIjozLCJzb3VyY2VzIjpbIi4uLy4uL3NyYy9MYXlvdXRNZW51VmFyaWFudC9MYXlvdXRNZW51LnRzeCJdLCJuYW1lcyI6W10sIm1hcHBpbmdzIjoiQUE2Q2lCIiwiZmlsZSI6Ii4uLy4uL3NyYy9MYXlvdXRNZW51VmFyaWFudC9MYXlvdXRNZW51LnRzeCIsInNvdXJjZXNDb250ZW50IjpbImltcG9ydCB7IEJveCwgRmx5b3V0LCBTdHJva2VCdXR0b24sIFdpdGhDaGlsZHJlblByb3AgfSBmcm9tICdAY29kZWNhZGVteS9nYW11dCc7XG5pbXBvcnQgeyBHYW11dEljb25Qcm9wcyB9IGZyb20gJ0Bjb2RlY2FkZW15L2dhbXV0LWljb25zJztcbmltcG9ydCB7IHZhcmlhbnQgfSBmcm9tICdAY29kZWNhZGVteS9nYW11dC1zdHlsZXMnO1xuaW1wb3J0IHN0eWxlZCBmcm9tICdAZW1vdGlvbi9zdHlsZWQnO1xuaW1wb3J0IFJlYWN0LCB7IENvbXBvbmVudFR5cGUsIHVzZVN0YXRlIH0gZnJvbSAncmVhY3QnO1xuXG5pbXBvcnQgeyBMb2dvQ29kZWNhZGVteSB9IGZyb20gJy4uL0xvZ29zJztcbmltcG9ydCB7IEFjY29yZGlvbk1lbnUsIFNlY3Rpb24sIFNlY3Rpb25JdGVtIH0gZnJvbSAnLi9BY2NvcmRpb25NZW51JztcbmltcG9ydCB7IExheW91dE1lbnVTZWN0aW9uIH0gZnJvbSAnLi9MYXlvdXRNZW51U2VjdGlvbic7XG5cbmV4cG9ydCBpbnRlcmZhY2UgTGF5b3V0TWVudVByb3BzIGV4dGVuZHMgV2l0aENoaWxkcmVuUHJvcCB7XG4gIC8qKlxuICAgKiBBY2Nlc3NpYmlsaXR5IGxhYmVsIGZvciB0aGUgbW9iaWxlIEZseW91dCdzIGNsb3NlIGJ1dHRvbi5cbiAgICovXG4gIGNsb3NlTGFiZWw6IHN0cmluZztcbiAgLyoqXG4gICAqIEFuIGFycmF5IG9mIHNlY3Rpb25zIGNvbnRhaW5pbmcgdGhlIHRpdGxlLCBzbHVnLCBhbmQgaXRlbXMsIGVhY2ggb2Ygd2hpY2ggd2lsbCBiZWNvbWUgYW4gYWNjb3JkaW9uLiBFYWNoIGl0ZW0gY29udGFpbnMgYSB0aXRsZSwgc2x1ZywgYW5kIG9uQ2xpY2suXG4gICAqL1xuICBzZWN0aW9uczogU2VjdGlvbltdO1xuICAvKipcbiAgICogQ2FsbGJhY2sgdG8gYmUgcnVuIG9uIGNsaWNrIG9mIHRoZSBhY2NvcmRpb24gYnV0dG9uXG4gICAqL1xuICBvblNlY3Rpb25Ub2dnbGU6IChzZWN0aW9uU2x1Zzogc3RyaW5nKSA9PiB2b2lkO1xuICAvKipcbiAgICogVGV4dCBzaG93biBpbiBtb2JpbGUgYnV0dG9uIHRoYXQgb3BlbnMgZmx5b3V0IG9uIGNsaWNrXG4gICAqL1xuICBtb2JpbGVCdXR0b25UZXh0OiBzdHJpbmc7XG4gIC8qKlxuICAgKiBJY29uIHNob3duIGluIG1vYmlsZSBidXR0b24gdGhhdCBvcGVucyBmbHlvdXQgb24gY2xpY2tcbiAgICovXG4gIG1vYmlsZUJ1dHRvbkljb24/OiBDb21wb25lbnRUeXBlPEdhbXV0SWNvblByb3BzPjtcbiAgLyoqXG4gICAqIEJyZWFrcG9pbnQgYWJvdmUgd2hpY2ggdGhlIG1lbnUgYnV0dG9uIGRpc3BsYXlzIGFzIGEgZnVsbCBzaWRlYmFyXG4gICAqL1xuICBicmVha3BvaW50PzogJ3hzJyB8ICdzbScgfCAnbWQnIHwgJ2xnJyB8ICd4bCc7XG4gIC8qKlxuICAgKiBBbiBhcnJheSBvZiBzZWN0aW9uIGl0ZW1zLCBlYWNoIG9mIHdoaWNoIGJlY29tZSBhbiBhZGRpdGlvbmFsIGxpbmsgb24gdG9wIG9mIHRoZSBhY2NvcmRpb24gc2VjdGlvbi5cbiAgICovXG4gIHRvcExpbmtTZWN0aW9ucz86IFNlY3Rpb25JdGVtW107XG4gIC8qKlxuICAgKiBTZXQgZml4ZWQgaGVpZ2h0IGZvciBtZW51IHdpdGggb3ZlcmZsb3dcbiAgICovXG4gIG1lbnVIZWlnaHQ/OiAnc20nIHwgJ21kJyB8ICdsZyc7XG59XG5cbmNvbnN0IFN0eWxlQm94ID0gc3R5bGVkKEJveCkoXG4gIHZhcmlhbnQoe1xuICAgIHByb3A6ICdtZW51SGVpZ2h0JyxcbiAgICBiYXNlOiB7XG4gICAgICBib3JkZXJDb2xvcjogJ2JsYWNrJyxcbiAgICAgIGJvcmRlclN0eWxlQm90dG9tOiAnc29saWQnLFxuICAgICAgYm9yZGVyV2lkdGhCb3R0b206ICcxcHgnLFxuICAgICAgb3ZlcmZsb3dZOiAnYXV0bycsXG4gICAgICBvdmVyZmxvd1g6ICdoaWRkZW4nLFxuICAgICAgcGFkZGluZ1RvcDogJzRweCcsXG4gICAgICBwYWRkaW5nTGVmdDogJzRweCcsXG4gICAgfSxcbiAgICB2YXJpYW50czoge1xuICAgICAgc206IHtcbiAgICAgICAgaGVpZ2h0OiAnNjMwcHgnLFxuICAgICAgfSxcbiAgICAgIG1kOiB7XG4gICAgICAgIGhlaWdodDogJzEwMDBweCcsXG4gICAgICB9LFxuICAgICAgbGc6IHtcbiAgICAgICAgaGVpZ2h0OiAnMTM3MHB4JyxcbiAgICAgIH0sXG4gICAgfSxcbiAgfSlcbik7XG5cbmV4cG9ydCBjb25zdCBMYXlvdXRNZW51OiBSZWFjdC5GQzxMYXlvdXRNZW51UHJvcHM+ID0gKHtcbiAgY2xvc2VMYWJlbCxcbiAgc2VjdGlvbnMsXG4gIG9uU2VjdGlvblRvZ2dsZSxcbiAgbW9iaWxlQnV0dG9uVGV4dCxcbiAgbW9iaWxlQnV0dG9uSWNvbixcbiAgYnJlYWtwb2ludCA9ICdsZycsXG4gIGNoaWxkcmVuLFxuICB0b3BMaW5rU2VjdGlvbnMsXG4gIG1lbnVIZWlnaHQsXG59KSA9PiB7XG4gIGNvbnN0IFtleHBhbmRlZCwgc2V0RXhwYW5kZWRdID0gdXNlU3RhdGUoZmFsc2UpO1xuXG4gIGNvbnN0IGFjY29yZGlvbk1lbnVTZWN0aW9ucyA9IHNlY3Rpb25zLm1hcCgoc2VjdGlvbikgPT4gKFxuICAgIDxBY2NvcmRpb25NZW51XG4gICAgICBrZXk9e3NlY3Rpb24uc2x1Z31cbiAgICAgIHNlY3Rpb249e3NlY3Rpb259XG4gICAgICBvblNlY3Rpb25Ub2dnbGU9e29uU2VjdGlvblRvZ2dsZX1cbiAgICAgIG9uSXRlbUNsaWNrPXsoKSA9PiBzZXRFeHBhbmRlZChmYWxzZSl9XG4gICAgLz5cbiAgKSk7XG5cbiAgY29uc3QgdG9wTGlua0xheW91dE1lbnVTZWN0aW9ucyA9IHRvcExpbmtTZWN0aW9ucyAmJiAoXG4gICAgPExheW91dE1lbnVTZWN0aW9uXG4gICAgICBpdGVtcz17dG9wTGlua1NlY3Rpb25zfVxuICAgICAgb25JdGVtQ2xpY2s9eygpID0+IHNldEV4cGFuZGVkKGZhbHNlKX1cbiAgICAgIHBiPXszMn1cbiAgICAvPlxuICApO1xuXG4gIHJldHVybiAoXG4gICAgPG5hdiBhcmlhLWxhYmVsPVwiU2Vjb25kYXJ5XCI+XG4gICAgICA8Qm94IGRpc3BsYXk9e3sgXzogJ2Jsb2NrJywgW2JyZWFrcG9pbnRdOiAnbm9uZScgfX0+XG4gICAgICAgIDxGbHlvdXRcbiAgICAgICAgICBjbG9zZUxhYmVsPXtjbG9zZUxhYmVsfVxuICAgICAgICAgIGV4cGFuZGVkPXtleHBhbmRlZH1cbiAgICAgICAgICBvbkNsb3NlPXsoKSA9PiBzZXRFeHBhbmRlZChmYWxzZSl9XG4gICAgICAgICAgdGl0bGU9ezxMb2dvQ29kZWNhZGVteSBtYj17MzJ9IC8+fVxuICAgICAgICA+XG4gICAgICAgICAgPEJveCBweD17MjR9PlxuICAgICAgICAgICAge3RvcExpbmtMYXlvdXRNZW51U2VjdGlvbnN9XG4gICAgICAgICAgICB7YWNjb3JkaW9uTWVudVNlY3Rpb25zfVxuICAgICAgICAgICAge2NoaWxkcmVufVxuICAgICAgICAgIDwvQm94PlxuICAgICAgICA8L0ZseW91dD5cbiAgICAgICAgPFN0cm9rZUJ1dHRvblxuICAgICAgICAgIGFyaWEtZXhwYW5kZWQ9e2V4cGFuZGVkfVxuICAgICAgICAgIHZhcmlhbnQ9XCJzZWNvbmRhcnlcIlxuICAgICAgICAgIHdpZHRoPXsxfVxuICAgICAgICAgIGljb249e21vYmlsZUJ1dHRvbkljb259XG4gICAgICAgICAgb25DbGljaz17KCkgPT4gc2V0RXhwYW5kZWQodHJ1ZSl9XG4gICAgICAgID5cbiAgICAgICAgICB7bW9iaWxlQnV0dG9uVGV4dH1cbiAgICAgICAgPC9TdHJva2VCdXR0b24+XG4gICAgICA8L0JveD5cbiAgICAgIDxTdHlsZUJveFxuICAgICAgICBtZW51SGVpZ2h0PXttZW51SGVpZ2h0fVxuICAgICAgICBkaXNwbGF5PXt7IF86ICdub25lJywgW2JyZWFrcG9pbnRdOiAnYmxvY2snIH19XG4gICAgICAgIGRhdGEtdGVzdGlkPVwiZGVza3RvcC1tZW51XCJcbiAgICAgID5cbiAgICAgICAge3RvcExpbmtMYXlvdXRNZW51U2VjdGlvbnN9XG4gICAgICAgIHthY2NvcmRpb25NZW51U2VjdGlvbnN9XG4gICAgICAgIHtjaGlsZHJlbn1cbiAgICAgIDwvU3R5bGVCb3g+XG4gICAgPC9uYXY+XG4gICk7XG59O1xuIl19 */");
+export const LayoutMenu = ({
+  closeLabel,
+  sections,
+  onSectionToggle,
+  mobileButtonText,
+  mobileButtonIcon,
+  breakpoint = 'lg',
+  children,
+  topLinkSections,
+  menuHeight
+}) => {
+  const [expanded, setExpanded] = useState(false);
+  const accordionMenuSections = sections.map(section => /*#__PURE__*/_jsx(AccordionMenu, {
+    section: section,
+    onSectionToggle: onSectionToggle,
+    onItemClick: () => setExpanded(false)
+  }, section.slug));
+  const topLinkLayoutMenuSections = topLinkSections && /*#__PURE__*/_jsx(LayoutMenuSection, {
+    items: topLinkSections,
+    onItemClick: () => setExpanded(false),
+    pb: 32
+  });
+  return /*#__PURE__*/_jsxs("nav", {
+    "aria-label": "Secondary",
+    children: [/*#__PURE__*/_jsxs(Box, {
+      display: {
+        _: 'block',
+        [breakpoint]: 'none'
+      },
+      children: [/*#__PURE__*/_jsx(Flyout, {
+        closeLabel: closeLabel,
+        expanded: expanded,
+        onClose: () => setExpanded(false),
+        title: /*#__PURE__*/_jsx(LogoCodecademy, {
+          mb: 32
+        }),
+        children: /*#__PURE__*/_jsxs(Box, {
+          px: 24,
+          children: [topLinkLayoutMenuSections, accordionMenuSections, children]
+        })
+      }), /*#__PURE__*/_jsx(StrokeButton, {
+        "aria-expanded": expanded,
+        variant: "secondary",
+        width: 1,
+        icon: mobileButtonIcon,
+        onClick: () => setExpanded(true),
+        children: mobileButtonText
+      })]
+    }), /*#__PURE__*/_jsxs(StyleBox, {
+      menuHeight: menuHeight,
+      display: {
+        _: 'none',
+        [breakpoint]: 'block'
+      },
+      "data-testid": "desktop-menu",
+      children: [topLinkLayoutMenuSections, accordionMenuSections, children]
+    })]
+  });
+};

package/dist/LayoutMenuVariant/LayoutMenuSection.d.ts

@@ -0,0 +1,10 @@
+import { system } from '@codecademy/gamut-styles';
+import { StyleProps } from '@codecademy/variance';
+import React from 'react';
+import { SectionItem } from './AccordionMenu';
+export type LayoutMenuSectionStyles = StyleProps<typeof system.space>;
+export type LayoutMenuSectionProps = LayoutMenuSectionStyles & {
+    items: SectionItem[];
+    onItemClick: () => void;
+};
+export declare const LayoutMenuSection: React.FC<LayoutMenuSectionProps>;