@codecademy/brand 4.0.0-alpha.b1cfc89ee2.0 → 4.0.0-alpha.b5e5d575e.0

package/dist/LayoutMenu/LayoutMenu.d.mts.map

@@ -1 +0,0 @@
-{"version":3,"file":"LayoutMenu.d.mts","names":[],"sources":["../../src/LayoutMenu/LayoutMenu.tsx"],"sourcesContent":[],"mappings":";;;;;;UAgBiB,eAAA,SAAwB;;AAAzC;;EASuB,UAAM,EAAA,MAAA;EAoBT;;;;EAmCP,QAAA,EAAA,CAvDA,OAwIZ,GAxIsB,OAAA,CAAM,SAuDK,CAAA,EAAA;;;;;;;;;;;;;;;;;;;;oBAnCd;;;;;oBAKA;;;;;cA8BP,YAAY,OAAA,CAAM,GAAG"}

package/dist/LayoutMenu/LayoutMenu.mjs

@@ -1,106 +0,0 @@
-import { LogoCodecademy } from "../Logos/LogoCodecademy/index.mjs";
-import { LayoutMenuSection } from "./LayoutMenuSection.mjs";
-import { AccordionMenu, isSection } from "./AccordionMenu.mjs";
-import { Box, Flyout, StrokeButton } from "@codecademy/gamut";
-import { variant } from "@codecademy/gamut-styles";
-import styled from "@emotion/styled";
-import * as React$1 from "react";
-import { useState } from "react";
-import { jsx, jsxs } from "react/jsx-runtime";
-
-//#region src/LayoutMenu/LayoutMenu.tsx
-const StyleBox = styled(Box)(variant({
-	prop: "menuHeight",
-	base: {
-		overflowY: "auto",
-		overflowX: "hidden",
-		paddingTop: "4px",
-		paddingLeft: "4px"
-	},
-	variants: {
-		sm: { height: "630px" },
-		md: { height: "1000px" },
-		lg: {
-			height: "1370px",
-			paddingLeft: "8px"
-		}
-	}
-}));
-const LayoutMenu = ({ closeLabel, sections, onSectionToggle, selectedItem, mobileButtonText, breakpoint = "lg", children, topLinkSections, menuHeight, verticalSpacing }) => {
-	const [expanded, setExpanded] = useState(false);
-	const accordionMenuSections = sections.map((section, i) => /* @__PURE__ */ jsx(Box, {
-		as: "li",
-		children: isSection(section) ? /* @__PURE__ */ jsx(AccordionMenu, {
-			section,
-			onSectionToggle,
-			onItemClick: () => setExpanded(false),
-			selectedItem,
-			verticalSpacing
-		}) : /* @__PURE__ */ jsx(React$1.Fragment, { children: section }, i)
-	}, isSection(section) ? section.slug : i));
-	const topLinkLayoutMenuSections = topLinkSections && /* @__PURE__ */ jsx(Box, {
-		as: "li",
-		children: /* @__PURE__ */ jsx(LayoutMenuSection, {
-			items: topLinkSections,
-			onItemClick: () => setExpanded(false),
-			selectedItem,
-			pb: 32
-		})
-	});
-	return /* @__PURE__ */ jsxs("nav", { 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, {
-				as: "ul",
-				listStyleType: "none",
-				py: 0,
-				px: 16,
-				m: 0,
-				children: [
-					topLinkLayoutMenuSections,
-					accordionMenuSections,
-					children ? /* @__PURE__ */ jsx(Box, {
-						as: "li",
-						children
-					}) : null
-				]
-			})
-		}), /* @__PURE__ */ jsx(StrokeButton, {
-			"aria-expanded": expanded,
-			variant: "secondary",
-			width: 1,
-			onClick: () => setExpanded(true),
-			children: mobileButtonText
-		})]
-	}), /* @__PURE__ */ jsxs(StyleBox, {
-		as: "ul",
-		listStyleType: "none",
-		p: 0,
-		m: 0,
-		menuHeight,
-		display: {
-			_: "none",
-			[breakpoint]: "block"
-		},
-		"data-testid": "desktop-menu",
-		children: [
-			topLinkLayoutMenuSections,
-			accordionMenuSections,
-			children ? /* @__PURE__ */ jsx(Box, {
-				as: "li",
-				children
-			}) : null
-		]
-	})] });
-};
-
-//#endregion
-export { LayoutMenu };
-//# sourceMappingURL=LayoutMenu.mjs.map

package/dist/LayoutMenu/LayoutMenu.mjs.map

@@ -1 +0,0 @@
-{"version":3,"file":"LayoutMenu.mjs","names":["LayoutMenu: React.FC<LayoutMenuProps>","React"],"sources":["../../src/LayoutMenu/LayoutMenu.tsx"],"sourcesContent":["import { Box, Flyout, StrokeButton, WithChildrenProp } from '@codecademy/gamut';\nimport { variant } from '@codecademy/gamut-styles';\nimport { Scale } from '@codecademy/variance/dist/types/config';\nimport styled from '@emotion/styled';\nimport { useState } from 'react';\nimport * as React from 'react';\n\nimport { LogoCodecademy } from '../Logos';\nimport {\n  AccordionMenu,\n  isSection,\n  Section,\n  SectionItem,\n} from './AccordionMenu';\nimport { LayoutMenuSection } from './LayoutMenuSection';\n\nexport interface LayoutMenuProps extends WithChildrenProp {\n  /**\n   * Accessibility label for the mobile Flyout's close button.\n   */\n  closeLabel: string;\n  /**\n   * 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.\n   * Arbitrary react nodes can also be passed and will be rendered as-is.\n   */\n  sections: (Section | React.ReactNode)[];\n  /**\n   * The slug of the current selected item\n   */\n  selectedItem?: string;\n  /**\n   * Callback to be run on click of the accordion button\n   */\n  onSectionToggle: (sectionSlug: string) => void;\n  /**\n   * Text shown in mobile button that opens flyout on click\n   */\n  mobileButtonText: string;\n  /**\n   * Breakpoint above which the menu button displays as a full sidebar\n   */\n  breakpoint?: 'xs' | 'sm' | 'md' | 'lg' | 'xl';\n  /**\n   * An array of section items, each of which become an additional link on top of the accordion section.\n   */\n  topLinkSections?: SectionItem[];\n  /**\n   * Set fixed height for menu with overflow\n   */\n  menuHeight?: 'sm' | 'md' | 'lg';\n  verticalSpacing?: Scale<{\n    readonly property: 'padding';\n    readonly scale: 'spacing';\n  }>;\n}\n\nconst StyleBox = styled(Box)(\n  variant({\n    prop: 'menuHeight',\n    base: {\n      overflowY: 'auto',\n      overflowX: 'hidden',\n      paddingTop: '4px',\n      paddingLeft: '4px',\n    },\n    variants: {\n      sm: {\n        height: '630px',\n      },\n      md: {\n        height: '1000px',\n      },\n      lg: {\n        height: '1370px',\n        paddingLeft: '8px',\n      },\n    },\n  })\n);\n\nexport const LayoutMenu: React.FC<LayoutMenuProps> = ({\n  closeLabel,\n  sections,\n  onSectionToggle,\n  selectedItem,\n  mobileButtonText,\n  breakpoint = 'lg',\n  children,\n  topLinkSections,\n  menuHeight,\n  verticalSpacing,\n}) => {\n  const [expanded, setExpanded] = useState(false);\n\n  const accordionMenuSections = sections.map((section, i) => (\n    <Box as=\"li\" key={isSection(section) ? section.slug : i}>\n      {isSection(section) ? (\n        <AccordionMenu\n          section={section}\n          onSectionToggle={onSectionToggle}\n          onItemClick={() => setExpanded(false)}\n          selectedItem={selectedItem}\n          verticalSpacing={verticalSpacing}\n        />\n      ) : (\n        // eslint-disable-next-line react/no-array-index-key\n        <React.Fragment key={i}>{section}</React.Fragment>\n      )}\n    </Box>\n  ));\n\n  const topLinkLayoutMenuSections = topLinkSections && (\n    <Box as=\"li\">\n      <LayoutMenuSection\n        items={topLinkSections}\n        onItemClick={() => setExpanded(false)}\n        selectedItem={selectedItem}\n        pb={32}\n      />\n    </Box>\n  );\n\n  return (\n    <nav>\n      <Box display={{ _: 'block', [breakpoint]: 'none' }}>\n        <Flyout\n          closeLabel={closeLabel}\n          expanded={expanded}\n          onClose={() => setExpanded(false)}\n          title={<LogoCodecademy mb={32} />}\n        >\n          <Box as=\"ul\" listStyleType=\"none\" py={0} px={16} m={0}>\n            {topLinkLayoutMenuSections}\n            {accordionMenuSections}\n            {children ? <Box as=\"li\">{children}</Box> : null}\n          </Box>\n        </Flyout>\n        <StrokeButton\n          aria-expanded={expanded}\n          variant=\"secondary\"\n          width={1}\n          onClick={() => setExpanded(true)}\n        >\n          {mobileButtonText}\n        </StrokeButton>\n      </Box>\n      <StyleBox\n        as=\"ul\"\n        listStyleType=\"none\"\n        p={0}\n        m={0}\n        menuHeight={menuHeight}\n        display={{ _: 'none', [breakpoint]: 'block' }}\n        data-testid=\"desktop-menu\"\n      >\n        {topLinkLayoutMenuSections}\n        {accordionMenuSections}\n        {children ? <Box as=\"li\">{children}</Box> : null}\n      </StyleBox>\n    </nav>\n  );\n};\n"],"mappings":";;;;;;;;;;;AAwDA,MAAM,WAAW,OAAO,IAAI,CAC1B,QAAQ;CACN,MAAM;CACN,MAAM;EACJ,WAAW;EACX,WAAW;EACX,YAAY;EACZ,aAAa;EACd;CACD,UAAU;EACR,IAAI,EACF,QAAQ,SACT;EACD,IAAI,EACF,QAAQ,UACT;EACD,IAAI;GACF,QAAQ;GACR,aAAa;GACd;EACF;CACF,CAAC,CACH;AAED,MAAaA,cAAyC,EACpD,YACA,UACA,iBACA,cACA,kBACA,aAAa,MACb,UACA,iBACA,YACA,sBACI;CACJ,MAAM,CAAC,UAAU,eAAe,SAAS,MAAM;CAE/C,MAAM,wBAAwB,SAAS,KAAK,SAAS,MACnD,oBAAC;EAAI,IAAG;YACL,UAAU,QAAQ,GACjB,oBAAC;GACU;GACQ;GACjB,mBAAmB,YAAY,MAAM;GACvB;GACG;IACjB,GAGF,oBAACC,QAAM,sBAAkB,WAAJ,EAA6B;IAXpC,UAAU,QAAQ,GAAG,QAAQ,OAAO,EAahD,CACN;CAEF,MAAM,4BAA4B,mBAChC,oBAAC;EAAI,IAAG;YACN,oBAAC;GACC,OAAO;GACP,mBAAmB,YAAY,MAAM;GACvB;GACd,IAAI;IACJ;GACE;AAGR,QACE,qBAAC,oBACC,qBAAC;EAAI,SAAS;GAAE,GAAG;IAAU,aAAa;GAAQ;aAChD,oBAAC;GACa;GACF;GACV,eAAe,YAAY,MAAM;GACjC,OAAO,oBAAC,kBAAe,IAAI,KAAM;aAEjC,qBAAC;IAAI,IAAG;IAAK,eAAc;IAAO,IAAI;IAAG,IAAI;IAAI,GAAG;;KACjD;KACA;KACA,WAAW,oBAAC;MAAI,IAAG;MAAM;OAAe,GAAG;;KACxC;IACC,EACT,oBAAC;GACC,iBAAe;GACf,SAAQ;GACR,OAAO;GACP,eAAe,YAAY,KAAK;aAE/B;IACY;GACX,EACN,qBAAC;EACC,IAAG;EACH,eAAc;EACd,GAAG;EACH,GAAG;EACS;EACZ,SAAS;GAAE,GAAG;IAAS,aAAa;GAAS;EAC7C,eAAY;;GAEX;GACA;GACA,WAAW,oBAAC;IAAI,IAAG;IAAM;KAAe,GAAG;;GACnC,IACP"}

package/dist/LayoutMenu/LayoutMenuSection.cjs

@@ -1,39 +0,0 @@
-const require_rolldown_runtime = require('../_virtual/rolldown_runtime.cjs');
-const require_SectionItemLink = require('./SectionItemLink.cjs');
-const require_SelectedSectionItem = require('./SelectedSectionItem.cjs');
-let _codecademy_gamut = require("@codecademy/gamut");
-let react = require("react");
-react = require_rolldown_runtime.__toESM(react);
-let react_jsx_runtime = require("react/jsx-runtime");
-
-//#region src/LayoutMenu/LayoutMenuSection.tsx
-const LayoutMenuSection = ({ items, selectedItem, onItemClick, verticalSpacing = 8, ...styleProps }) => /* @__PURE__ */ (0, react_jsx_runtime.jsx)(_codecademy_gamut.Box, {
-	as: "ul",
-	listStyleType: "none",
-	p: 0,
-	m: 0,
-	...styleProps,
-	children: items.map((item) => /* @__PURE__ */ (0, react_jsx_runtime.jsx)(_codecademy_gamut.Box, {
-		as: "li",
-		py: verticalSpacing,
-		px: 4,
-		children: selectedItem === item.slug ? /* @__PURE__ */ (0, react_jsx_runtime.jsx)(require_SelectedSectionItem.SelectedSectionItem, { children: /* @__PURE__ */ (0, react_jsx_runtime.jsxs)(_codecademy_gamut.FlexBox, {
-			alignItems: "center",
-			children: [item.title, item.badge]
-		}) }) : /* @__PURE__ */ (0, react_jsx_runtime.jsx)(require_SectionItemLink.SectionItemLink, {
-			href: item.href,
-			onClick: (event) => {
-				item.onClick(event);
-				onItemClick();
-			},
-			children: /* @__PURE__ */ (0, react_jsx_runtime.jsxs)(_codecademy_gamut.FlexBox, {
-				alignItems: "center",
-				children: [item.title, item.badge]
-			})
-		})
-	}, item.slug))
-});
-
-//#endregion
-exports.LayoutMenuSection = LayoutMenuSection;
-//# sourceMappingURL=LayoutMenuSection.cjs.map

package/dist/LayoutMenu/LayoutMenuSection.cjs.map

@@ -1 +0,0 @@
-{"version":3,"file":"LayoutMenuSection.cjs","names":["LayoutMenuSection: React.FC<LayoutMenuSectionProps>","Box","SelectedSectionItem","FlexBox","SectionItemLink"],"sources":["../../src/LayoutMenu/LayoutMenuSection.tsx"],"sourcesContent":["import { Box, FlexBox } from '@codecademy/gamut';\nimport { system } from '@codecademy/gamut-styles';\nimport { StyleProps } from '@codecademy/variance';\nimport { Scale } from '@codecademy/variance/dist/types/config';\nimport * as React from 'react';\n\nimport { SectionItem } from './AccordionMenu';\nimport { SectionItemLink } from './SectionItemLink';\nimport { SelectedSectionItem } from './SelectedSectionItem';\n\nexport type LayoutMenuSectionStyles = StyleProps<typeof system.space>;\n\nexport type LayoutMenuSectionProps = LayoutMenuSectionStyles & {\n  items: SectionItem[];\n  selectedItem?: string;\n  onItemClick: () => void;\n  verticalSpacing?: Scale<{\n    readonly property: 'padding';\n    readonly scale: 'spacing';\n  }>;\n};\n\nexport const LayoutMenuSection: React.FC<LayoutMenuSectionProps> = ({\n  items,\n  selectedItem,\n  onItemClick,\n  verticalSpacing = 8,\n  ...styleProps\n}) => (\n  <Box as=\"ul\" listStyleType=\"none\" p={0} m={0} {...styleProps}>\n    {items.map((item) => (\n      <Box as=\"li\" key={item.slug} py={verticalSpacing} px={4}>\n        {selectedItem === item.slug ? (\n          <SelectedSectionItem>\n            <FlexBox alignItems=\"center\">\n              {item.title}\n              {item.badge}\n            </FlexBox>\n          </SelectedSectionItem>\n        ) : (\n          <SectionItemLink\n            href={item.href}\n            onClick={(event) => {\n              item.onClick(event);\n              onItemClick();\n            }}\n          >\n            <FlexBox alignItems=\"center\">\n              {item.title}\n              {item.badge}\n            </FlexBox>\n          </SectionItemLink>\n        )}\n      </Box>\n    ))}\n  </Box>\n);\n"],"mappings":";;;;;;;;;AAsBA,MAAaA,qBAAuD,EAClE,OACA,cACA,aACA,kBAAkB,GAClB,GAAG,iBAEH,2CAACC;CAAI,IAAG;CAAK,eAAc;CAAO,GAAG;CAAG,GAAG;CAAG,GAAI;WAC/C,MAAM,KAAK,SACV,2CAACA;EAAI,IAAG;EAAqB,IAAI;EAAiB,IAAI;YACnD,iBAAiB,KAAK,OACrB,2CAACC,6DACC,4CAACC;GAAQ,YAAW;cACjB,KAAK,OACL,KAAK;IACE,GACU,GAEtB,2CAACC;GACC,MAAM,KAAK;GACX,UAAU,UAAU;AAClB,SAAK,QAAQ,MAAM;AACnB,iBAAa;;aAGf,4CAACD;IAAQ,YAAW;eACjB,KAAK,OACL,KAAK;KACE;IACM;IApBJ,KAAK,KAsBjB,CACN;EACE"}

package/dist/LayoutMenu/LayoutMenuSection.mjs

@@ -1,37 +0,0 @@
-import { SectionItemLink } from "./SectionItemLink.mjs";
-import { SelectedSectionItem } from "./SelectedSectionItem.mjs";
-import { Box, FlexBox } from "@codecademy/gamut";
-import "react";
-import { jsx, jsxs } from "react/jsx-runtime";
-
-//#region src/LayoutMenu/LayoutMenuSection.tsx
-const LayoutMenuSection = ({ items, selectedItem, onItemClick, verticalSpacing = 8, ...styleProps }) => /* @__PURE__ */ jsx(Box, {
-	as: "ul",
-	listStyleType: "none",
-	p: 0,
-	m: 0,
-	...styleProps,
-	children: items.map((item) => /* @__PURE__ */ jsx(Box, {
-		as: "li",
-		py: verticalSpacing,
-		px: 4,
-		children: selectedItem === item.slug ? /* @__PURE__ */ jsx(SelectedSectionItem, { children: /* @__PURE__ */ jsxs(FlexBox, {
-			alignItems: "center",
-			children: [item.title, item.badge]
-		}) }) : /* @__PURE__ */ jsx(SectionItemLink, {
-			href: item.href,
-			onClick: (event) => {
-				item.onClick(event);
-				onItemClick();
-			},
-			children: /* @__PURE__ */ jsxs(FlexBox, {
-				alignItems: "center",
-				children: [item.title, item.badge]
-			})
-		})
-	}, item.slug))
-});
-
-//#endregion
-export { LayoutMenuSection };
-//# sourceMappingURL=LayoutMenuSection.mjs.map

package/dist/LayoutMenu/LayoutMenuSection.mjs.map

@@ -1 +0,0 @@
-{"version":3,"file":"LayoutMenuSection.mjs","names":["LayoutMenuSection: React.FC<LayoutMenuSectionProps>"],"sources":["../../src/LayoutMenu/LayoutMenuSection.tsx"],"sourcesContent":["import { Box, FlexBox } from '@codecademy/gamut';\nimport { system } from '@codecademy/gamut-styles';\nimport { StyleProps } from '@codecademy/variance';\nimport { Scale } from '@codecademy/variance/dist/types/config';\nimport * as React from 'react';\n\nimport { SectionItem } from './AccordionMenu';\nimport { SectionItemLink } from './SectionItemLink';\nimport { SelectedSectionItem } from './SelectedSectionItem';\n\nexport type LayoutMenuSectionStyles = StyleProps<typeof system.space>;\n\nexport type LayoutMenuSectionProps = LayoutMenuSectionStyles & {\n  items: SectionItem[];\n  selectedItem?: string;\n  onItemClick: () => void;\n  verticalSpacing?: Scale<{\n    readonly property: 'padding';\n    readonly scale: 'spacing';\n  }>;\n};\n\nexport const LayoutMenuSection: React.FC<LayoutMenuSectionProps> = ({\n  items,\n  selectedItem,\n  onItemClick,\n  verticalSpacing = 8,\n  ...styleProps\n}) => (\n  <Box as=\"ul\" listStyleType=\"none\" p={0} m={0} {...styleProps}>\n    {items.map((item) => (\n      <Box as=\"li\" key={item.slug} py={verticalSpacing} px={4}>\n        {selectedItem === item.slug ? (\n          <SelectedSectionItem>\n            <FlexBox alignItems=\"center\">\n              {item.title}\n              {item.badge}\n            </FlexBox>\n          </SelectedSectionItem>\n        ) : (\n          <SectionItemLink\n            href={item.href}\n            onClick={(event) => {\n              item.onClick(event);\n              onItemClick();\n            }}\n          >\n            <FlexBox alignItems=\"center\">\n              {item.title}\n              {item.badge}\n            </FlexBox>\n          </SectionItemLink>\n        )}\n      </Box>\n    ))}\n  </Box>\n);\n"],"mappings":";;;;;;;AAsBA,MAAaA,qBAAuD,EAClE,OACA,cACA,aACA,kBAAkB,GAClB,GAAG,iBAEH,oBAAC;CAAI,IAAG;CAAK,eAAc;CAAO,GAAG;CAAG,GAAG;CAAG,GAAI;WAC/C,MAAM,KAAK,SACV,oBAAC;EAAI,IAAG;EAAqB,IAAI;EAAiB,IAAI;YACnD,iBAAiB,KAAK,OACrB,oBAAC,iCACC,qBAAC;GAAQ,YAAW;cACjB,KAAK,OACL,KAAK;IACE,GACU,GAEtB,oBAAC;GACC,MAAM,KAAK;GACX,UAAU,UAAU;AAClB,SAAK,QAAQ,MAAM;AACnB,iBAAa;;aAGf,qBAAC;IAAQ,YAAW;eACjB,KAAK,OACL,KAAK;KACE;IACM;IApBJ,KAAK,KAsBjB,CACN;EACE"}

package/dist/LayoutMenu/SectionItemLink.cjs

@@ -1,20 +0,0 @@
-const require_rolldown_runtime = require('../_virtual/rolldown_runtime.cjs');
-let _codecademy_gamut = require("@codecademy/gamut");
-let react = require("react");
-react = require_rolldown_runtime.__toESM(react);
-let react_jsx_runtime = require("react/jsx-runtime");
-
-//#region src/LayoutMenu/SectionItemLink.tsx
-const SectionItemLink = ({ onClick, href, children }) => {
-	return /* @__PURE__ */ (0, react_jsx_runtime.jsx)(_codecademy_gamut.Anchor, {
-		variant: "interface",
-		display: "block",
-		href,
-		onClick,
-		children
-	});
-};
-
-//#endregion
-exports.SectionItemLink = SectionItemLink;
-//# sourceMappingURL=SectionItemLink.cjs.map

package/dist/LayoutMenu/SectionItemLink.cjs.map

@@ -1 +0,0 @@
-{"version":3,"file":"SectionItemLink.cjs","names":["SectionItemLink: React.FC<SectionItemLinkProps>","Anchor"],"sources":["../../src/LayoutMenu/SectionItemLink.tsx"],"sourcesContent":["import { Anchor, WithChildrenProp } from '@codecademy/gamut';\nimport * as React from 'react';\n\nexport interface SectionItemLinkProps extends WithChildrenProp {\n  onClick: (event: React.MouseEvent) => void;\n  href: string;\n}\n\nexport const SectionItemLink: React.FC<SectionItemLinkProps> = ({\n  onClick,\n  href,\n  children,\n}) => {\n  return (\n    <Anchor variant=\"interface\" display=\"block\" href={href} onClick={onClick}>\n      {children}\n    </Anchor>\n  );\n};\n"],"mappings":";;;;;;;AAQA,MAAaA,mBAAmD,EAC9D,SACA,MACA,eACI;AACJ,QACE,2CAACC;EAAO,SAAQ;EAAY,SAAQ;EAAc;EAAe;EAC9D;GACM"}

package/dist/LayoutMenu/SectionItemLink.d.cts

@@ -1,12 +0,0 @@
-import { WithChildrenProp } from "@codecademy/gamut";
-import * as React$1 from "react";
-
-//#region src/LayoutMenu/SectionItemLink.d.ts
-interface SectionItemLinkProps extends WithChildrenProp {
-  onClick: (event: React$1.MouseEvent) => void;
-  href: string;
-}
-declare const SectionItemLink: React$1.FC<SectionItemLinkProps>;
-//#endregion
-export { SectionItemLink, SectionItemLinkProps };
-//# sourceMappingURL=SectionItemLink.d.cts.map

package/dist/LayoutMenu/SectionItemLink.d.cts.map

@@ -1 +0,0 @@
-{"version":3,"file":"SectionItemLink.d.cts","names":[],"sources":["../../src/LayoutMenu/SectionItemLink.tsx"],"sourcesContent":[],"mappings":";;;;UAGiB,oBAAA,SAA6B;mBAC3B,OAAA,CAAM;EADR,IAAA,EAAA,MAAA;AAKjB;cAAa,iBAAiB,OAAA,CAAM,GAAG"}

package/dist/LayoutMenu/SectionItemLink.d.mts

@@ -1,12 +0,0 @@
-import { WithChildrenProp } from "@codecademy/gamut";
-import * as React$1 from "react";
-
-//#region src/LayoutMenu/SectionItemLink.d.ts
-interface SectionItemLinkProps extends WithChildrenProp {
-  onClick: (event: React$1.MouseEvent) => void;
-  href: string;
-}
-declare const SectionItemLink: React$1.FC<SectionItemLinkProps>;
-//#endregion
-export { SectionItemLink, SectionItemLinkProps };
-//# sourceMappingURL=SectionItemLink.d.mts.map

package/dist/LayoutMenu/SectionItemLink.d.mts.map

@@ -1 +0,0 @@
-{"version":3,"file":"SectionItemLink.d.mts","names":[],"sources":["../../src/LayoutMenu/SectionItemLink.tsx"],"sourcesContent":[],"mappings":";;;;UAGiB,oBAAA,SAA6B;mBAC3B,OAAA,CAAM;EADR,IAAA,EAAA,MAAA;AAKjB;cAAa,iBAAiB,OAAA,CAAM,GAAG"}

package/dist/LayoutMenu/SectionItemLink.mjs

@@ -1,18 +0,0 @@
-import { Anchor } from "@codecademy/gamut";
-import "react";
-import { jsx } from "react/jsx-runtime";
-
-//#region src/LayoutMenu/SectionItemLink.tsx
-const SectionItemLink = ({ onClick, href, children }) => {
-	return /* @__PURE__ */ jsx(Anchor, {
-		variant: "interface",
-		display: "block",
-		href,
-		onClick,
-		children
-	});
-};
-
-//#endregion
-export { SectionItemLink };
-//# sourceMappingURL=SectionItemLink.mjs.map

package/dist/LayoutMenu/SectionItemLink.mjs.map

@@ -1 +0,0 @@
-{"version":3,"file":"SectionItemLink.mjs","names":["SectionItemLink: React.FC<SectionItemLinkProps>"],"sources":["../../src/LayoutMenu/SectionItemLink.tsx"],"sourcesContent":["import { Anchor, WithChildrenProp } from '@codecademy/gamut';\nimport * as React from 'react';\n\nexport interface SectionItemLinkProps extends WithChildrenProp {\n  onClick: (event: React.MouseEvent) => void;\n  href: string;\n}\n\nexport const SectionItemLink: React.FC<SectionItemLinkProps> = ({\n  onClick,\n  href,\n  children,\n}) => {\n  return (\n    <Anchor variant=\"interface\" display=\"block\" href={href} onClick={onClick}>\n      {children}\n    </Anchor>\n  );\n};\n"],"mappings":";;;;;AAQA,MAAaA,mBAAmD,EAC9D,SACA,MACA,eACI;AACJ,QACE,oBAAC;EAAO,SAAQ;EAAY,SAAQ;EAAc;EAAe;EAC9D;GACM"}

package/dist/LayoutMenu/SelectedSectionItem.cjs

@@ -1,23 +0,0 @@
-const require_rolldown_runtime = require('../_virtual/rolldown_runtime.cjs');
-let _codecademy_gamut = require("@codecademy/gamut");
-let react = require("react");
-react = require_rolldown_runtime.__toESM(react);
-let react_jsx_runtime = require("react/jsx-runtime");
-
-//#region src/LayoutMenu/SelectedSectionItem.tsx
-const SelectedSectionItem = ({ children }) => {
-	return /* @__PURE__ */ (0, react_jsx_runtime.jsx)(_codecademy_gamut.Box, {
-		borderLeft: 1,
-		borderWidthLeft: "6px",
-		pl: 12,
-		"aria-current": "true",
-		children: /* @__PURE__ */ (0, react_jsx_runtime.jsx)(_codecademy_gamut.Text, {
-			fontWeight: "title",
-			children
-		})
-	});
-};
-
-//#endregion
-exports.SelectedSectionItem = SelectedSectionItem;
-//# sourceMappingURL=SelectedSectionItem.cjs.map

package/dist/LayoutMenu/SelectedSectionItem.cjs.map

@@ -1 +0,0 @@
-{"version":3,"file":"SelectedSectionItem.cjs","names":["SelectedSectionItem: React.FC<WithChildrenProp>","Box","Text"],"sources":["../../src/LayoutMenu/SelectedSectionItem.tsx"],"sourcesContent":["import { Box, Text, WithChildrenProp } from '@codecademy/gamut';\nimport * as React from 'react';\n\nexport const SelectedSectionItem: React.FC<WithChildrenProp> = ({\n  children,\n}) => {\n  return (\n    <Box borderLeft={1} borderWidthLeft=\"6px\" pl={12} aria-current=\"true\">\n      <Text fontWeight=\"title\">{children}</Text>\n    </Box>\n  );\n};\n"],"mappings":";;;;;;;AAGA,MAAaA,uBAAmD,EAC9D,eACI;AACJ,QACE,2CAACC;EAAI,YAAY;EAAG,iBAAgB;EAAM,IAAI;EAAI,gBAAa;YAC7D,2CAACC;GAAK,YAAW;GAAS;IAAgB;GACtC"}

package/dist/LayoutMenu/SelectedSectionItem.d.cts

@@ -1,8 +0,0 @@
-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 };
-//# sourceMappingURL=SelectedSectionItem.d.cts.map

package/dist/LayoutMenu/SelectedSectionItem.d.cts.map

@@ -1 +0,0 @@
-{"version":3,"file":"SelectedSectionItem.d.cts","names":[],"sources":["../../src/LayoutMenu/SelectedSectionItem.tsx"],"sourcesContent":[],"mappings":";;;;cAGa,qBAAqB,OAAA,CAAM,GAAG"}

package/dist/LayoutMenu/SelectedSectionItem.d.mts

@@ -1,8 +0,0 @@
-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 };
-//# sourceMappingURL=SelectedSectionItem.d.mts.map

package/dist/LayoutMenu/SelectedSectionItem.d.mts.map

@@ -1 +0,0 @@
-{"version":3,"file":"SelectedSectionItem.d.mts","names":[],"sources":["../../src/LayoutMenu/SelectedSectionItem.tsx"],"sourcesContent":[],"mappings":";;;;cAGa,qBAAqB,OAAA,CAAM,GAAG"}

package/dist/LayoutMenu/SelectedSectionItem.mjs

@@ -1,21 +0,0 @@
-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 };
-//# sourceMappingURL=SelectedSectionItem.mjs.map

package/dist/LayoutMenu/SelectedSectionItem.mjs.map

@@ -1 +0,0 @@
-{"version":3,"file":"SelectedSectionItem.mjs","names":["SelectedSectionItem: React.FC<WithChildrenProp>"],"sources":["../../src/LayoutMenu/SelectedSectionItem.tsx"],"sourcesContent":["import { Box, Text, WithChildrenProp } from '@codecademy/gamut';\nimport * as React from 'react';\n\nexport const SelectedSectionItem: React.FC<WithChildrenProp> = ({\n  children,\n}) => {\n  return (\n    <Box borderLeft={1} borderWidthLeft=\"6px\" pl={12} aria-current=\"true\">\n      <Text fontWeight=\"title\">{children}</Text>\n    </Box>\n  );\n};\n"],"mappings":";;;;;AAGA,MAAaA,uBAAmD,EAC9D,eACI;AACJ,QACE,oBAAC;EAAI,YAAY;EAAG,iBAAgB;EAAM,IAAI;EAAI,gBAAa;YAC7D,oBAAC;GAAK,YAAW;GAAS;IAAgB;GACtC"}

package/dist/LayoutMenu/index.d.mts

@@ -1,3 +0,0 @@
-import { LayoutMenu, LayoutMenuProps } from "./LayoutMenu.mjs";
-import { SectionItemLink, SectionItemLinkProps } from "./SectionItemLink.mjs";
-import { SelectedSectionItem } from "./SelectedSectionItem.mjs";

package/dist/LayoutMenuVariant/AccordionMenu.cjs

@@ -1,77 +0,0 @@
-const require_rolldown_runtime = require('../_virtual/rolldown_runtime.cjs');
-const require_LayoutMenuSection = require('./LayoutMenuSection.cjs');
-let _codecademy_gamut = require("@codecademy/gamut");
-let _codecademy_gamut_styles = require("@codecademy/gamut-styles");
-let _emotion_styled = require("@emotion/styled");
-_emotion_styled = require_rolldown_runtime.__toESM(_emotion_styled);
-let react = require("react");
-react = require_rolldown_runtime.__toESM(react);
-let react_jsx_runtime = require("react/jsx-runtime");
-let _codecademy_gamut_icons = require("@codecademy/gamut-icons");
-
-//#region src/LayoutMenuVariant/AccordionMenu.tsx
-const StyledAccordionArea = (0, _emotion_styled.default)(_codecademy_gamut.AccordionAreaDeprecated)`
-  padding-block: ${({ theme }) => theme.spacing[16]};
-  position: relative;
-  left: -4px;
-
-  &:not(:first-child) {
-    border-top: 1px solid ${({ theme }) => theme.colors["navy-300"]};
-  }
-`;
-const StyledAnchor = (0, _emotion_styled.default)(_codecademy_gamut.Anchor)`
-  :hover {
-    color: inherit;
-  }
-`;
-const chevronStates = (0, _codecademy_gamut_styles.states)({ expanded: { transform: "rotate(180deg)" } });
-const ExpandChevron = (0, _emotion_styled.default)(_codecademy_gamut_icons.MiniChevronDownIcon)((0, _codecademy_gamut_styles.css)({
-	transform: "rotate(0deg)",
-	transition: (0, _codecademy_gamut_styles.transitionConcat)(["transform"], "slow", "ease-out")
-}), chevronStates);
-const AccordionMenu = ({ section, onSectionToggle, onItemClick }) => {
-	const [expanded, setExpanded] = (0, react.useState)(true);
-	return /* @__PURE__ */ (0, react_jsx_runtime.jsx)(StyledAccordionArea, {
-		expanded,
-		top: /* @__PURE__ */ (0, react_jsx_runtime.jsx)(StyledAnchor, {
-			variant: "interface",
-			pb: 12,
-			px: 4,
-			onClick: () => {
-				onSectionToggle(section.slug);
-				setExpanded((prev) => !prev);
-			},
-			"aria-expanded": expanded,
-			display: "flex",
-			width: "100%",
-			children: /* @__PURE__ */ (0, react_jsx_runtime.jsxs)(_codecademy_gamut.Box, {
-				display: "flex",
-				justifyContent: "space-between",
-				width: "100%",
-				children: [/* @__PURE__ */ (0, react_jsx_runtime.jsx)(_codecademy_gamut.Text, {
-					variant: "p-small",
-					style: {
-						flex: 1,
-						fontWeight: "bold"
-					},
-					textAlign: "left",
-					children: section.title
-				}), /* @__PURE__ */ (0, react_jsx_runtime.jsx)(ExpandChevron, {
-					ml: 12,
-					size: 16,
-					expanded,
-					position: "relative",
-					top: 4
-				})]
-			})
-		}),
-		children: /* @__PURE__ */ (0, react_jsx_runtime.jsx)(require_LayoutMenuSection.LayoutMenuSection, {
-			items: section.items,
-			onItemClick
-		})
-	});
-};
-
-//#endregion
-exports.AccordionMenu = AccordionMenu;
-//# sourceMappingURL=AccordionMenu.cjs.map

package/dist/LayoutMenuVariant/AccordionMenu.cjs.map

@@ -1 +0,0 @@
-{"version":3,"file":"AccordionMenu.cjs","names":["AccordionAreaDeprecated","Anchor","MiniChevronDownIcon","AccordionMenu: React.FC<AccordionMenuProps>","Box","Text","LayoutMenuSection"],"sources":["../../src/LayoutMenuVariant/AccordionMenu.tsx"],"sourcesContent":["import { AccordionAreaDeprecated, Anchor, Box, Text } from '@codecademy/gamut';\nimport { MiniChevronDownIcon } from '@codecademy/gamut-icons';\nimport { css, states, transitionConcat } from '@codecademy/gamut-styles';\nimport { StyleProps } from '@codecademy/variance';\nimport styled from '@emotion/styled';\nimport React, { useState } from 'react';\n\nimport { LayoutMenuSection } from './LayoutMenuSection';\n\nconst StyledAccordionArea = styled(AccordionAreaDeprecated)`\n  padding-block: ${({ theme }) => theme.spacing[16]};\n  position: relative;\n  left: -4px;\n\n  &:not(:first-child) {\n    border-top: 1px solid ${({ theme }) => theme.colors['navy-300']};\n  }\n`;\n\nconst StyledAnchor = styled(Anchor)`\n  :hover {\n    color: inherit;\n  }\n`;\n\nconst chevronStates = states({\n  expanded: { transform: 'rotate(180deg)' },\n});\n\nconst ExpandChevron = styled(MiniChevronDownIcon)<\n  StyleProps<typeof chevronStates>\n>(\n  css({\n    transform: 'rotate(0deg)',\n    transition: transitionConcat(['transform'], 'slow', 'ease-out'),\n  }),\n  chevronStates\n);\n\nexport type SectionItem = {\n  title: string;\n  slug: string;\n  href: string;\n  onClick: (event: React.MouseEvent) => void;\n  badge?: JSX.Element;\n  variant?: React.ComponentProps<typeof Anchor>['variant'];\n};\n\nexport type Section = {\n  title: string;\n  slug: string;\n  items: SectionItem[];\n};\n\nexport type AccordionMenuProps = {\n  section: Section;\n  onSectionToggle: (sectionSlug: string) => void;\n  onItemClick: () => void;\n};\n\nexport const AccordionMenu: React.FC<AccordionMenuProps> = ({\n  section,\n  onSectionToggle,\n  onItemClick,\n}) => {\n  const [expanded, setExpanded] = useState(true);\n\n  return (\n    <StyledAccordionArea\n      expanded={expanded}\n      top={\n        <StyledAnchor\n          variant=\"interface\"\n          pb={12}\n          px={4}\n          onClick={() => {\n            onSectionToggle(section.slug);\n            setExpanded((prev) => !prev);\n          }}\n          aria-expanded={expanded}\n          display=\"flex\"\n          width=\"100%\"\n        >\n          <Box display=\"flex\" justifyContent=\"space-between\" width=\"100%\">\n            <Text\n              variant=\"p-small\"\n              // eslint-disable-next-line gamut/no-inline-style\n              style={{ flex: 1, fontWeight: 'bold' }}\n              textAlign=\"left\"\n            >\n              {section.title}\n            </Text>\n            <ExpandChevron\n              ml={12}\n              size={16}\n              expanded={expanded}\n              position=\"relative\"\n              top={4}\n            />\n          </Box>\n        </StyledAnchor>\n      }\n    >\n      <LayoutMenuSection items={section.items} onItemClick={onItemClick} />\n    </StyledAccordionArea>\n  );\n};\n"],"mappings":";;;;;;;;;;;;AASA,MAAM,sBAAsB,6BAAOA,0CAAwB;oBACvC,EAAE,YAAY,MAAM,QAAQ,IAAI;;;;;6BAKvB,EAAE,YAAY,MAAM,OAAO,YAAY;;;AAIpE,MAAM,eAAe,6BAAOC,yBAAO;;;;;AAMnC,MAAM,qDAAuB,EAC3B,UAAU,EAAE,WAAW,kBAAkB,EAC1C,CAAC;AAEF,MAAM,6CAAuBC,4CAAoB,mCAG3C;CACF,WAAW;CACX,2DAA6B,CAAC,YAAY,EAAE,QAAQ,WAAW;CAChE,CAAC,EACF,cACD;AAuBD,MAAaC,iBAA+C,EAC1D,SACA,iBACA,kBACI;CACJ,MAAM,CAAC,UAAU,mCAAwB,KAAK;AAE9C,QACE,2CAAC;EACW;EACV,KACE,2CAAC;GACC,SAAQ;GACR,IAAI;GACJ,IAAI;GACJ,eAAe;AACb,oBAAgB,QAAQ,KAAK;AAC7B,iBAAa,SAAS,CAAC,KAAK;;GAE9B,iBAAe;GACf,SAAQ;GACR,OAAM;aAEN,4CAACC;IAAI,SAAQ;IAAO,gBAAe;IAAgB,OAAM;eACvD,2CAACC;KACC,SAAQ;KAER,OAAO;MAAE,MAAM;MAAG,YAAY;MAAQ;KACtC,WAAU;eAET,QAAQ;MACJ,EACP,2CAAC;KACC,IAAI;KACJ,MAAM;KACI;KACV,UAAS;KACT,KAAK;MACL;KACE;IACO;YAGjB,2CAACC;GAAkB,OAAO,QAAQ;GAAoB;IAAe;GACjD"}

package/dist/LayoutMenuVariant/AccordionMenu.d.cts

@@ -1,20 +0,0 @@
-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'];
-};
-type Section = {
-  title: string;
-  slug: string;
-  items: SectionItem[];
-};
-//#endregion
-export { Section, SectionItem };
-//# sourceMappingURL=AccordionMenu.d.cts.map

package/dist/LayoutMenuVariant/AccordionMenu.d.cts.map

@@ -1 +0,0 @@
-{"version":3,"file":"AccordionMenu.d.cts","names":[],"sources":["../../src/LayoutMenuVariant/AccordionMenu.tsx"],"sourcesContent":[],"mappings":";;;;KAuCY,WAAA;;EAAA,IAAA,EAAA,MAAA;EAIO,IAAM,EAAA,MAAA;EACf,OAAI,EAAA,CAAA,KAAA,EADK,KAAA,CAAM,UACX,EAAA,GAAA,IAAA;EAC0B,KAAA,CAAA,EAD9B,GAAA,CAAI,OAC0B;EAA5B,OAAM,CAAA,EAAN,KAAA,CAAM,cAAA,CAAA,OAAsB,MAAtB,CAAA,CAAA,SAAA,CAAA;CAAc;AAGpB,KAAA,OAAA,GAAO;;;SAGV"}

package/dist/LayoutMenuVariant/AccordionMenu.d.mts

@@ -1,20 +0,0 @@
-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'];
-};
-type Section = {
-  title: string;
-  slug: string;
-  items: SectionItem[];
-};
-//#endregion
-export { Section, SectionItem };
-//# sourceMappingURL=AccordionMenu.d.mts.map

package/dist/LayoutMenuVariant/AccordionMenu.d.mts.map

@@ -1 +0,0 @@
-{"version":3,"file":"AccordionMenu.d.mts","names":[],"sources":["../../src/LayoutMenuVariant/AccordionMenu.tsx"],"sourcesContent":[],"mappings":";;;;KAuCY,WAAA;;EAAA,IAAA,EAAA,MAAA;EAIO,IAAM,EAAA,MAAA;EACf,OAAI,EAAA,CAAA,KAAA,EADK,KAAA,CAAM,UACX,EAAA,GAAA,IAAA;EAC0B,KAAA,CAAA,EAD9B,GAAA,CAAI,OAC0B;EAA5B,OAAM,CAAA,EAAN,KAAA,CAAM,cAAA,CAAA,OAAsB,MAAtB,CAAA,CAAA,SAAA,CAAA;CAAc;AAGpB,KAAA,OAAA,GAAO;;;SAGV"}

package/dist/LayoutMenuVariant/AccordionMenu.mjs

@@ -1,74 +0,0 @@
-import { LayoutMenuSection } from "./LayoutMenuSection.mjs";
-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"]};
-  }
-`;
-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 };
-//# sourceMappingURL=AccordionMenu.mjs.map

package/dist/LayoutMenuVariant/AccordionMenu.mjs.map

@@ -1 +0,0 @@
-{"version":3,"file":"AccordionMenu.mjs","names":["theme","AccordionMenu: React.FC<AccordionMenuProps>"],"sources":["../../src/LayoutMenuVariant/AccordionMenu.tsx"],"sourcesContent":["import { AccordionAreaDeprecated, Anchor, Box, Text } from '@codecademy/gamut';\nimport { MiniChevronDownIcon } from '@codecademy/gamut-icons';\nimport { css, states, transitionConcat } from '@codecademy/gamut-styles';\nimport { StyleProps } from '@codecademy/variance';\nimport styled from '@emotion/styled';\nimport React, { useState } from 'react';\n\nimport { LayoutMenuSection } from './LayoutMenuSection';\n\nconst StyledAccordionArea = styled(AccordionAreaDeprecated)`\n  padding-block: ${({ theme }) => theme.spacing[16]};\n  position: relative;\n  left: -4px;\n\n  &:not(:first-child) {\n    border-top: 1px solid ${({ theme }) => theme.colors['navy-300']};\n  }\n`;\n\nconst StyledAnchor = styled(Anchor)`\n  :hover {\n    color: inherit;\n  }\n`;\n\nconst chevronStates = states({\n  expanded: { transform: 'rotate(180deg)' },\n});\n\nconst ExpandChevron = styled(MiniChevronDownIcon)<\n  StyleProps<typeof chevronStates>\n>(\n  css({\n    transform: 'rotate(0deg)',\n    transition: transitionConcat(['transform'], 'slow', 'ease-out'),\n  }),\n  chevronStates\n);\n\nexport type SectionItem = {\n  title: string;\n  slug: string;\n  href: string;\n  onClick: (event: React.MouseEvent) => void;\n  badge?: JSX.Element;\n  variant?: React.ComponentProps<typeof Anchor>['variant'];\n};\n\nexport type Section = {\n  title: string;\n  slug: string;\n  items: SectionItem[];\n};\n\nexport type AccordionMenuProps = {\n  section: Section;\n  onSectionToggle: (sectionSlug: string) => void;\n  onItemClick: () => void;\n};\n\nexport const AccordionMenu: React.FC<AccordionMenuProps> = ({\n  section,\n  onSectionToggle,\n  onItemClick,\n}) => {\n  const [expanded, setExpanded] = useState(true);\n\n  return (\n    <StyledAccordionArea\n      expanded={expanded}\n      top={\n        <StyledAnchor\n          variant=\"interface\"\n          pb={12}\n          px={4}\n          onClick={() => {\n            onSectionToggle(section.slug);\n            setExpanded((prev) => !prev);\n          }}\n          aria-expanded={expanded}\n          display=\"flex\"\n          width=\"100%\"\n        >\n          <Box display=\"flex\" justifyContent=\"space-between\" width=\"100%\">\n            <Text\n              variant=\"p-small\"\n              // eslint-disable-next-line gamut/no-inline-style\n              style={{ flex: 1, fontWeight: 'bold' }}\n              textAlign=\"left\"\n            >\n              {section.title}\n            </Text>\n            <ExpandChevron\n              ml={12}\n              size={16}\n              expanded={expanded}\n              position=\"relative\"\n              top={4}\n            />\n          </Box>\n        </StyledAnchor>\n      }\n    >\n      <LayoutMenuSection items={section.items} onItemClick={onItemClick} />\n    </StyledAccordionArea>\n  );\n};\n"],"mappings":";;;;;;;;;AASA,MAAM,sBAAsB,OAAO,wBAAwB;oBACvC,EAAE,qBAAYA,QAAM,QAAQ,IAAI;;;;;6BAKvB,EAAE,qBAAYA,QAAM,OAAO,YAAY;;;AAIpE,MAAM,eAAe,OAAO,OAAO;;;;;AAMnC,MAAM,gBAAgB,OAAO,EAC3B,UAAU,EAAE,WAAW,kBAAkB,EAC1C,CAAC;AAEF,MAAM,gBAAgB,OAAO,oBAAoB,CAG/C,IAAI;CACF,WAAW;CACX,YAAY,iBAAiB,CAAC,YAAY,EAAE,QAAQ,WAAW;CAChE,CAAC,EACF,cACD;AAuBD,MAAaC,iBAA+C,EAC1D,SACA,iBACA,kBACI;CACJ,MAAM,CAAC,UAAU,eAAe,SAAS,KAAK;AAE9C,QACE,oBAAC;EACW;EACV,KACE,oBAAC;GACC,SAAQ;GACR,IAAI;GACJ,IAAI;GACJ,eAAe;AACb,oBAAgB,QAAQ,KAAK;AAC7B,iBAAa,SAAS,CAAC,KAAK;;GAE9B,iBAAe;GACf,SAAQ;GACR,OAAM;aAEN,qBAAC;IAAI,SAAQ;IAAO,gBAAe;IAAgB,OAAM;eACvD,oBAAC;KACC,SAAQ;KAER,OAAO;MAAE,MAAM;MAAG,YAAY;MAAQ;KACtC,WAAU;eAET,QAAQ;MACJ,EACP,oBAAC;KACC,IAAI;KACJ,MAAM;KACI;KACV,UAAS;KACT,KAAK;MACL;KACE;IACO;YAGjB,oBAAC;GAAkB,OAAO,QAAQ;GAAoB;IAAe;GACjD"}