@codecademy/brand 4.0.0-alpha.14deb86052.0 → 4.0.0-alpha.65b0979c7d.0

package/dist/AppHeader/AppHeaderElements/AppHeaderLogo/index.cjs

@@ -1,53 +0,0 @@
-const require_rolldown_runtime = require('../../../_virtual/rolldown_runtime.cjs');
-const require_index = require('../../../Logos/LogoCodecademy/index.cjs');
-const require_index$1 = require('../../../Logos/LogoCodecademyMini/index.cjs');
-const require_index$2 = require('../../../Logos/LogoCodecademyPro/index.cjs');
-const require_index$3 = require('../../../Logos/LogoFromSkillsoft/index.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/AppHeader/AppHeaderElements/AppHeaderLogo/index.tsx
-const getLogoComponent = (item, showMini) => {
-	if (item.checkMini && showMini) return require_index$1.LogoCodecademyMini;
-	if (item.enterprise) return require_index$3.LogoFromSkillsoft;
-	return item.pro ? require_index$2.LogoCodecademyPro : require_index.LogoCodecademy;
-};
-const AppHeaderLogo = ({ action, item }) => {
-	const [showMini, setShowMini] = (0, react.useState)(false);
-	(0, react.useEffect)(() => {
-		if (!item.checkMini) return;
-		const handleResize = () => {
-			const shouldShowMini = window.innerWidth < 480 || window.innerWidth <= 1285 && window.innerWidth >= 1200;
-			if (showMini !== shouldShowMini) setShowMini(shouldShowMini);
-		};
-		window.addEventListener("resize", handleResize);
-		handleResize();
-		return () => window.removeEventListener("resize", handleResize);
-	}, [item.checkMini, showMini]);
-	const LogoComponent = getLogoComponent(item, showMini);
-	return /* @__PURE__ */ (0, react_jsx_runtime.jsx)(react_jsx_runtime.Fragment, { children: item.removeAnchorLink ? /* @__PURE__ */ (0, react_jsx_runtime.jsx)(LogoComponent, {
-		color: "text",
-		"data-testid": item.dataTestId,
-		height: item.enterprise ? 36 : 27,
-		verticalAlign: "text-bottom",
-		role: "img",
-		...item.enterprise ? { "aria-label": "Codecademy from Skillsoft" } : {}
-	}) : /* @__PURE__ */ (0, react_jsx_runtime.jsx)(_codecademy_gamut.Anchor, {
-		variant: "interface",
-		"data-testid": item.dataTestId,
-		py: 4,
-		onClick: (event) => action(event, item),
-		href: item.href,
-		tabIndex: 0,
-		children: /* @__PURE__ */ (0, react_jsx_runtime.jsx)(LogoComponent, {
-			color: "currentColor",
-			height: item.enterprise ? 36 : 27,
-			verticalAlign: "text-bottom"
-		})
-	}) });
-};
-
-//#endregion
-exports.AppHeaderLogo = AppHeaderLogo;

package/dist/AppHeader/AppHeaderElements/AppHeaderLogo/index.d.cts

@@ -1,10 +0,0 @@
-import { AppHeaderAction, AppHeaderLogoItem } from "../../shared/types.cjs";
-import React from "react";
-
-//#region src/AppHeader/AppHeaderElements/AppHeaderLogo/index.d.ts
-type AppHeaderLogoProps = AppHeaderAction & {
-  item: AppHeaderLogoItem;
-};
-declare const AppHeaderLogo: React.FC<AppHeaderLogoProps>;
-//#endregion
-export { AppHeaderLogo, AppHeaderLogoProps };

package/dist/AppHeader/AppHeaderElements/AppHeaderMenuProvider/index.cjs

@@ -1,85 +0,0 @@
-const require_rolldown_runtime = require('../../../_virtual/rolldown_runtime.cjs');
-const require_keyboardNav = require('../../shared/keyboardNav.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/AppHeader/AppHeaderElements/AppHeaderMenuProvider/index.tsx
-const AppHeaderMenuContext = (0, react.createContext)({
-	menuItems: /* @__PURE__ */ new Set(),
-	setMenuItems: void 0
-});
-const AppHeaderMenuProvider = ({ as, children, handleClose }) => {
-	const [menuItems, setMenuItems] = (0, react.useState)(() => /* @__PURE__ */ new Set());
-	const [index, setIndex] = (0, react.useState)(0);
-	const [shouldFocus, setShouldFocus] = (0, react.useState)(false);
-	const menuItemsArray = Array.from(menuItems);
-	const length = menuItems.size - 1;
-	const first = () => {
-		setShouldFocus(true);
-		setIndex(0);
-	};
-	const back = (shouldFocus$1) => {
-		setShouldFocus(shouldFocus$1);
-		if (shouldFocus$1 && index === 0) setIndex(length);
-		else if (index !== 0) setIndex(index - 1);
-	};
-	const next = (shouldFocus$1) => {
-		setShouldFocus(shouldFocus$1);
-		if (index === length) setIndex(0);
-		else setIndex(index + 1);
-	};
-	const last = () => {
-		setShouldFocus(true);
-		setIndex(0);
-	};
-	const resetIndex = () => {
-		if (index !== 0) setIndex(0);
-	};
-	const closeDropdown = () => {
-		handleClose();
-		setShouldFocus(false);
-		setIndex(0);
-	};
-	const checkUnsetFocusHandler = (event) => {
-		if (event?.target === menuItemsArray[0] && index !== 0) setIndex(0);
-		if (event?.target === menuItemsArray[length] && index !== length) setIndex(length);
-	};
-	const keyDown = require_keyboardNav.useMenuKeyboardNavigation({
-		first,
-		back,
-		next,
-		last,
-		closeDropdown
-	});
-	(0, react.useEffect)(() => {
-		const itemToFocus = menuItemsArray[index];
-		if (itemToFocus && shouldFocus) {
-			itemToFocus.focus();
-			setShouldFocus(false);
-		}
-	}, [
-		menuItemsArray,
-		index,
-		shouldFocus
-	]);
-	return /* @__PURE__ */ (0, react_jsx_runtime.jsx)(AppHeaderMenuContext.Provider, {
-		value: {
-			menuItems,
-			resetIndex,
-			setMenuItems
-		},
-		children: /* @__PURE__ */ (0, react_jsx_runtime.jsx)(_codecademy_gamut.Box, {
-			as,
-			onKeyDown: keyDown,
-			onFocusCapture: (e) => checkUnsetFocusHandler(e),
-			children
-		})
-	});
-};
-const useAppHeaderMenuContext = () => (0, react.useContext)(AppHeaderMenuContext);
-
-//#endregion
-exports.AppHeaderMenuProvider = AppHeaderMenuProvider;
-exports.useAppHeaderMenuContext = useAppHeaderMenuContext;

package/dist/AppHeader/AppHeaderElements/AppHeaderNavButton/index.cjs

@@ -1,80 +0,0 @@
-const require_rolldown_runtime = require('../../../_virtual/rolldown_runtime.cjs');
-const require_elements = require('../../shared/elements.cjs');
-const require_index = require('../AppHeaderDropdownProvider/index.cjs');
-const require_Avatar_index = require('../../../Avatar/index.cjs');
-const require_index$1 = require('../AppHeaderMenuProvider/index.cjs');
-let _codecademy_gamut = require("@codecademy/gamut");
-let react = require("react");
-let react_jsx_runtime = require("react/jsx-runtime");
-
-//#region src/AppHeader/AppHeaderElements/AppHeaderNavButton/index.tsx
-const AppHeaderNavButton = ({ buttonRef, handleOnClick, isOpen, item, text, onFocus }) => {
-	const sharedProps = {
-		"aria-expanded": isOpen,
-		"aria-haspopup": true,
-		onClick: handleOnClick,
-		ref: buttonRef
-	};
-	if (item?.type === "profile-dropdown") return /* @__PURE__ */ (0, react_jsx_runtime.jsx)(_codecademy_gamut.TextButton, {
-		"data-testid": "avatar-dropdown-button",
-		variant: "interface",
-		onFocus,
-		...sharedProps,
-		children: /* @__PURE__ */ (0, react_jsx_runtime.jsx)(require_Avatar_index.Avatar, {
-			alt: "User profile avatar",
-			disableDropshadow: true,
-			size: 40,
-			src: item.avatar
-		})
-	});
-	if (item?.icon && "isIconOnly" in item) return /* @__PURE__ */ (0, react_jsx_runtime.jsx)(_codecademy_gamut.IconButton, {
-		icon: item.icon,
-		tip: item.text ?? "Dropdown",
-		tipProps: {
-			alignment: "bottom-center",
-			placement: "floating"
-		},
-		onFocus,
-		...sharedProps
-	});
-	return /* @__PURE__ */ (0, react_jsx_runtime.jsxs)(require_elements.DropdownAnchor, {
-		title: item?.text ?? text,
-		variant: "interface",
-		onFocus,
-		...sharedProps,
-		children: [/* @__PURE__ */ (0, react_jsx_runtime.jsx)(require_elements.StyledText, {
-			fontWeight: isOpen ? "bold" : "normal",
-			textAlign: "center",
-			title: item?.text ?? text,
-			children: item?.text ?? text
-		}), /* @__PURE__ */ (0, react_jsx_runtime.jsx)(require_elements.DropdownIcon, {
-			open: isOpen,
-			size: 12
-		})]
-	});
-};
-const AppHeaderMenuNavButton = ({ isOpen, ...props }) => {
-	const { menuItems, resetIndex } = require_index$1.useAppHeaderMenuContext();
-	(0, react.useEffect)(() => {
-		if (isOpen) menuItems.values().next().value?.focus();
-	}, [isOpen, menuItems]);
-	return /* @__PURE__ */ (0, react_jsx_runtime.jsx)(AppHeaderNavButton, {
-		isOpen,
-		onFocus: resetIndex,
-		...props
-	});
-};
-const AppHeaderDropdownNavButton = ({ isOpen, ...props }) => {
-	const { firstItemRef } = require_index.useAppHeaderDropdownContext();
-	(0, react.useEffect)(() => {
-		if (isOpen) firstItemRef?.focus();
-	}, [isOpen, firstItemRef]);
-	return /* @__PURE__ */ (0, react_jsx_runtime.jsx)(AppHeaderNavButton, {
-		isOpen,
-		...props
-	});
-};
-
-//#endregion
-exports.AppHeaderDropdownNavButton = AppHeaderDropdownNavButton;
-exports.AppHeaderMenuNavButton = AppHeaderMenuNavButton;

package/dist/AppHeader/AppHeaderElements/AppHeaderProvider/index.cjs

@@ -1,25 +0,0 @@
-const require_rolldown_runtime = require('../../../_virtual/rolldown_runtime.cjs');
-let react = require("react");
-react = require_rolldown_runtime.__toESM(react);
-let react_jsx_runtime = require("react/jsx-runtime");
-
-//#region src/AppHeader/AppHeaderElements/AppHeaderProvider/index.tsx
-const AppHeaderContext = (0, react.createContext)({
-	lastOpenedDropdown: void 0,
-	setLastOpenedDropdown: void 0
-});
-const AppHeaderProvider = ({ children }) => {
-	const [lastOpenedDropdown, setLastOpenedDropdown] = (0, react.useState)();
-	return /* @__PURE__ */ (0, react_jsx_runtime.jsx)(AppHeaderContext.Provider, {
-		value: {
-			lastOpenedDropdown,
-			setLastOpenedDropdown
-		},
-		children
-	});
-};
-const useAppHeaderContext = () => (0, react.useContext)(AppHeaderContext);
-
-//#endregion
-exports.AppHeaderProvider = AppHeaderProvider;
-exports.useAppHeaderContext = useAppHeaderContext;

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

@@ -1,118 +0,0 @@
-const require_rolldown_runtime = require('../../../_virtual/rolldown_runtime.cjs');
-const require_context = require('../../../GlobalHeader/context.cjs');
-const require_index = require('../AppHeaderDropdownProvider/index.cjs');
-const require_AppHeaderSectionContext = require('../AppHeaderSection/AppHeaderSectionContext.cjs');
-const require_PanelLayout = require('../AppHeaderSection/PanelLayout.cjs');
-const require_index$1 = require('../AppHeaderSkillTile/index.cjs');
-const require_index$2 = require('../AppHeaderFeatureCard/index.cjs');
-const require_consts = require('./consts.cjs');
-let _codecademy_gamut = require("@codecademy/gamut");
-let react_jsx_runtime = require("react/jsx-runtime");
-
-//#region src/AppHeader/AppHeaderElements/AppHeaderResourcesDropdown/NavPanels.tsx
-const DocsPanel = () => {
-	const { globalHeaderItemClick } = require_context.useGlobalHeaderItemClick();
-	const { tabIndex } = require_AppHeaderSectionContext.useAppHeaderSectionContext();
-	const { handleClose } = require_index.useAppHeaderDropdownContext();
-	return /* @__PURE__ */ (0, react_jsx_runtime.jsx)(require_PanelLayout.PanelLayout, {
-		heading: "Docs",
-		description: /* @__PURE__ */ (0, react_jsx_runtime.jsxs)(react_jsx_runtime.Fragment, { children: [
-			/* @__PURE__ */ (0, react_jsx_runtime.jsx)(_codecademy_gamut.Box, {
-				mb: 8,
-				children: "Definitions and guides to help you understand programming languages, frameworks, and concepts. Built and maintained by the coding community."
-			}),
-			"Interested in helping build it?",
-			" ",
-			/* @__PURE__ */ (0, react_jsx_runtime.jsx)(_codecademy_gamut.Anchor, {
-				tabIndex,
-				href: "/pages/contribute-docs",
-				onClick: (event) => {
-					globalHeaderItemClick(event, {
-						type: "link",
-						href: "/pages/contribute-docs",
-						text: "Contribute to Docs",
-						id: "contribute-to-docs"
-					});
-					handleClose();
-				},
-				children: "Contribute to Docs"
-			})
-		] }),
-		linkItem: {
-			type: "link",
-			href: "/docs",
-			text: "Explore all Docs",
-			trackingTarget: "topnav_resources_docs",
-			id: "docs"
-		},
-		children: /* @__PURE__ */ (0, react_jsx_runtime.jsx)(_codecademy_gamut.GridBox, {
-			gridTemplateColumns: {
-				_: "1fr",
-				xs: "1fr 1fr",
-				md: "1fr 1fr 1fr"
-			},
-			gap: 8,
-			pl: 0,
-			as: "ul",
-			listStyle: "none",
-			children: require_consts.docsLinks.map((item) => /* @__PURE__ */ (0, react_jsx_runtime.jsx)("li", { children: /* @__PURE__ */ (0, react_jsx_runtime.jsx)(require_index$1.SkillTile, { item }) }, item.id))
-		})
-	});
-};
-const LearningToolsPanel = () => {
-	return /* @__PURE__ */ (0, react_jsx_runtime.jsx)(require_PanelLayout.PanelLayout, {
-		heading: "Learning tools",
-		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__ */ (0, react_jsx_runtime.jsx)(FeatureCardPanel, { links: require_consts.learningToolsLinks })
-	});
-};
-const PracticeToolsPanel = () => {
-	return /* @__PURE__ */ (0, react_jsx_runtime.jsx)(require_PanelLayout.PanelLayout, {
-		heading: "Practice tools",
-		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__ */ (0, react_jsx_runtime.jsx)(FeatureCardPanel, { links: require_consts.practiceToolsLinks })
-	});
-};
-const InspirationPanel = () => {
-	return /* @__PURE__ */ (0, react_jsx_runtime.jsx)(require_PanelLayout.PanelLayout, {
-		heading: "Inspiration",
-		description: "Discover what's happening inside Codecademy and beyond. You'll find engineering deep dives, coding tips, job hunt insights, career growth advice, and inspiring stories from other learners.",
-		children: /* @__PURE__ */ (0, react_jsx_runtime.jsx)(FeatureCardPanel, { links: require_consts.inspirationLinks })
-	});
-};
-const FeatureCardPanel = ({ links }) => {
-	const { tabIndex } = require_AppHeaderSectionContext.useAppHeaderSectionContext();
-	const { globalHeaderItemClick } = require_context.useGlobalHeaderItemClick();
-	const { handleClose } = require_index.useAppHeaderDropdownContext();
-	return /* @__PURE__ */ (0, react_jsx_runtime.jsx)(_codecademy_gamut.GridBox, {
-		gridTemplateColumns: {
-			_: "1fr",
-			sm: "1fr 1fr"
-		},
-		gridTemplateRows: {
-			_: "1fr",
-			sm: "1fr 1fr"
-		},
-		gap: 16,
-		pl: 0,
-		as: "ul",
-		listStyle: "none",
-		children: links.map((item) => /* @__PURE__ */ (0, react_jsx_runtime.jsx)("li", { children: /* @__PURE__ */ (0, react_jsx_runtime.jsx)(_codecademy_gamut.Anchor, {
-			variant: "interface",
-			href: item.linkItem.href,
-			onClick: (event) => {
-				globalHeaderItemClick(event, item.linkItem);
-				handleClose();
-			},
-			tabIndex,
-			height: "100%",
-			children: /* @__PURE__ */ (0, react_jsx_runtime.jsx)(require_index$2.AppHeaderFeatureCard, { item })
-		}) }, `${item.linkItem.id}`))
-	});
-};
-
-//#endregion
-exports.DocsPanel = DocsPanel;
-exports.InspirationPanel = InspirationPanel;
-exports.LearningToolsPanel = LearningToolsPanel;
-exports.PracticeToolsPanel = PracticeToolsPanel;