@codecademy/brand 3.40.1-alpha.a095761d09.0 → 4.0.0-alpha.0ae245495b.0

package/dist/AppHeader/Search/DefaultResults.js

@@ -1,112 +1,102 @@
-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 { Badge, Box, FlexBox, MenuItem, Text } from '@codecademy/gamut';
-import { theme } from '@codecademy/gamut-styles';
-import { popularContent, popularSearchTerms } from './consts';
-import { SemiboldSearchIcon } from './SearchPane';
-import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
-const StyledMenuItem = /*#__PURE__*/_styled(MenuItem, {
-  target: "e1fvfd3x0",
-  label: "StyledMenuItem"
-})(process.env.NODE_ENV === "production" ? {
-  name: "1cskijm",
-  styles: "&:focus-visible:after{left:-4px;}padding:8px 0"
-} : {
-  name: "1cskijm",
-  styles: "&:focus-visible:after{left:-4px;}padding:8px 0/*# sourceMappingURL=data:application/json;charset=utf-8;base64,eyJ2ZXJzaW9uIjozLCJzb3VyY2VzIjpbIi4uLy4uLy4uL3NyYy9BcHBIZWFkZXIvU2VhcmNoL0RlZmF1bHRSZXN1bHRzLnRzeCJdLCJuYW1lcyI6W10sIm1hcHBpbmdzIjoiQUFPdUMiLCJmaWxlIjoiLi4vLi4vLi4vc3JjL0FwcEhlYWRlci9TZWFyY2gvRGVmYXVsdFJlc3VsdHMudHN4Iiwic291cmNlc0NvbnRlbnQiOlsiaW1wb3J0IHsgQmFkZ2UsIEJveCwgRmxleEJveCwgTWVudUl0ZW0sIFRleHQgfSBmcm9tICdAY29kZWNhZGVteS9nYW11dCc7XG5pbXBvcnQgeyB0aGVtZSB9IGZyb20gJ0Bjb2RlY2FkZW15L2dhbXV0LXN0eWxlcyc7XG5pbXBvcnQgc3R5bGVkIGZyb20gJ0BlbW90aW9uL3N0eWxlZCc7XG5cbmltcG9ydCB7IHBvcHVsYXJDb250ZW50LCBwb3B1bGFyU2VhcmNoVGVybXMgfSBmcm9tICcuL2NvbnN0cyc7XG5pbXBvcnQgeyBTZW1pYm9sZFNlYXJjaEljb24gfSBmcm9tICcuL1NlYXJjaFBhbmUnO1xuXG5jb25zdCBTdHlsZWRNZW51SXRlbSA9IHN0eWxlZChNZW51SXRlbSlgXG4gICY6Zm9jdXMtdmlzaWJsZTphZnRlciB7XG4gICAgbGVmdDogLTRweDtcbiAgfVxuICBwYWRkaW5nOiA4cHggMDtcbmA7XG5cbmludGVyZmFjZSBQb3B1bGFyU2VhcmNoZXNQcm9wcyB7XG4gIG5hdmlnYXRlVG9TZWFyY2g6IChzZWFyY2hUZXJtOiBzdHJpbmcpID0+IHZvaWQ7XG4gIG9uVHJhY2tpbmdDbGljazogKFxuICAgIHRhcmdldDogc3RyaW5nLFxuICAgIGV4dHJhVHJhY2tpbmdQcm9wcz86IFJlY29yZDxzdHJpbmcsIHN0cmluZz5cbiAgKSA9PiB2b2lkO1xufVxuXG5leHBvcnQgY29uc3QgUG9wdWxhclNlYXJjaGVzOiBSZWFjdC5GQzxQb3B1bGFyU2VhcmNoZXNQcm9wcz4gPSAoe1xuICBuYXZpZ2F0ZVRvU2VhcmNoLFxuICBvblRyYWNraW5nQ2xpY2ssXG59KSA9PiB7XG4gIGNvbnN0IGlzTW9iaWxlID0gdGhlbWUuYnJlYWtwb2ludHMueHMgfHwgdGhlbWUuYnJlYWtwb2ludHMuc207XG5cbiAgcmV0dXJuIChcbiAgICA8Qm94IG1iPXsyNH0gYXM9XCJsaVwiPlxuICAgICAgPFRleHQgYXM9XCJoMlwiIHZhcmlhbnQ9XCJ0aXRsZS14c1wiIG1iPXsxMn0+XG4gICAgICAgIFBvcHVsYXIgc2VhcmNoZXNcbiAgICAgIDwvVGV4dD5cbiAgICAgIDxGbGV4Qm94IGFzPVwidWxcIiBsaXN0U3R5bGU9XCJub25lXCIgcD17MH0gZmxleERpcmVjdGlvbj1cImNvbHVtblwiPlxuICAgICAgICB7cG9wdWxhclNlYXJjaFRlcm1zLm1hcCgodGVybSwgaSkgPT4gKFxuICAgICAgICAgIDxTdHlsZWRNZW51SXRlbVxuICAgICAgICAgICAgaXRlbVR5cGU9XCJsaW5rXCJcbiAgICAgICAgICAgIGtleT17dGVybX1cbiAgICAgICAgICAgIGlkPXt0ZXJtfVxuICAgICAgICAgICAgaHJlZj17YC9zZWFyY2g/cXVlcnk9JHtlbmNvZGVVUklDb21wb25lbnQodGVybSl9YH1cbiAgICAgICAgICAgIG9uQ2xpY2s9eygpID0+IHtcbiAgICAgICAgICAgICAgbmF2aWdhdGVUb1NlYXJjaCh0ZXJtKTtcbiAgICAgICAgICAgICAgb25UcmFja2luZ0NsaWNrKCdwb3B1bGFyX3NlYXJjaF90ZXJtJywge1xuICAgICAgICAgICAgICAgIG1pc2M6IEpTT04uc3RyaW5naWZ5KHtcbiAgICAgICAgICAgICAgICAgIHZhbHVlOiB0ZXJtLnRvTG93ZXJDYXNlKCksXG4gICAgICAgICAgICAgICAgICBpbmRleDogaSxcbiAgICAgICAgICAgICAgICB9KSxcbiAgICAgICAgICAgICAgfSk7XG4gICAgICAgICAgICB9fVxuICAgICAgICAgICAgcGw9ezB9XG4gICAgICAgICAgPlxuICAgICAgICAgICAgPFNlbWlib2xkU2VhcmNoSWNvbiBtYj17MiBhcyAwfSBzaXplPXsxNH0gc3Ryb2tlV2lkdGg9ezh9IC8+XG4gICAgICAgICAgICA8VGV4dCB2YXJpYW50PXtpc01vYmlsZSA/ICdwLWJhc2UnIDogJ3AtbGFyZ2UnfSBtbD17MTJ9PlxuICAgICAgICAgICAgICB7dGVybX1cbiAgICAgICAgICAgIDwvVGV4dD5cbiAgICAgICAgICA8L1N0eWxlZE1lbnVJdGVtPlxuICAgICAgICApKX1cbiAgICAgIDwvRmxleEJveD5cbiAgICA8L0JveD5cbiAgKTtcbn07XG5cbmludGVyZmFjZSBQb3B1bGFyQ29udGVudFByb3BzIHtcbiAgb25UcmFja2luZ0NsaWNrOiAoXG4gICAgdGFyZ2V0OiBzdHJpbmcsXG4gICAgZXh0cmFUcmFja2luZ1Byb3BzPzogUmVjb3JkPHN0cmluZywgc3RyaW5nPlxuICApID0+IHZvaWQ7XG59XG5cbmV4cG9ydCBjb25zdCBQb3B1bGFyQ29udGVudDogUmVhY3QuRkM8UG9wdWxhckNvbnRlbnRQcm9wcz4gPSAoe1xuICBvblRyYWNraW5nQ2xpY2ssXG59KSA9PiB7XG4gIGNvbnN0IGlzTW9iaWxlID0gdGhlbWUuYnJlYWtwb2ludHMueHMgfHwgdGhlbWUuYnJlYWtwb2ludHMuc207XG5cbiAgcmV0dXJuIChcbiAgICA8Qm94IG1iPXsyNH0gYXM9XCJsaVwiPlxuICAgICAgPFRleHQgYXM9XCJoMlwiIHZhcmlhbnQ9XCJ0aXRsZS14c1wiIG1iPXsxMn0+XG4gICAgICAgIFdoYXQgb3VyIG1lbWJlcnMgYXJlIGxlYXJuaW5nXG4gICAgICA8L1RleHQ+XG4gICAgICA8RmxleEJveCBhcz1cInVsXCIgbGlzdFN0eWxlPVwibm9uZVwiIHA9ezB9IGZsZXhEaXJlY3Rpb249XCJjb2x1bW5cIj5cbiAgICAgICAge3BvcHVsYXJDb250ZW50Lm1hcCgoYywgaSkgPT4gKFxuICAgICAgICAgIDxTdHlsZWRNZW51SXRlbVxuICAgICAgICAgICAgaXRlbVR5cGU9XCJsaW5rXCJcbiAgICAgICAgICAgIGtleT17Yy50aXRsZX1cbiAgICAgICAgICAgIGhyZWY9e2MuaHJlZn1cbiAgICAgICAgICAgIHBsPXswfVxuICAgICAgICAgICAgb25DbGljaz17KCkgPT5cbiAgICAgICAgICAgICAgb25UcmFja2luZ0NsaWNrKCdwb3B1bGFyX2NvbnRlbnQnLCB7XG4gICAgICAgICAgICAgICAgc2x1ZzogYy5zbHVnLFxuICAgICAgICAgICAgICAgIC4uLihjLmNvbnRlbnRJZCA/IHsgY29udGVudF9pZDogYy5jb250ZW50SWQgfSA6IHt9KSxcbiAgICAgICAgICAgICAgICBtaXNjOiBKU09OLnN0cmluZ2lmeSh7XG4gICAgICAgICAgICAgICAgICBjb250ZW50X3R5cGU6IGMudHlwZS50b0xvd2VyQ2FzZSgpLFxuICAgICAgICAgICAgICAgICAgaW5kZXg6IGksXG4gICAgICAgICAgICAgICAgICBocmVmOiBjLmhyZWYsXG4gICAgICAgICAgICAgICAgfSksXG4gICAgICAgICAgICAgIH0pXG4gICAgICAgICAgICB9XG4gICAgICAgICAgPlxuICAgICAgICAgICAgPEZsZXhCb3ggZmxleERpcmVjdGlvbj1cInJvd1wiIGFsaWduSXRlbXM9XCJjZW50ZXJcIj5cbiAgICAgICAgICAgICAgPFRleHQgdmFyaWFudD17aXNNb2JpbGUgPyAncC1iYXNlJyA6ICdwLWxhcmdlJ30gbXI9ezEyfT5cbiAgICAgICAgICAgICAgICB7Yy50aXRsZX1cbiAgICAgICAgICAgICAgPC9UZXh0PlxuICAgICAgICAgICAgICA8QmFkZ2Ugc2l6ZT1cInNtXCIgdmFyaWFudD1cInRlcnRpYXJ5XCI+XG4gICAgICAgICAgICAgICAge2MudHlwZX1cbiAgICAgICAgICAgICAgPC9CYWRnZT5cbiAgICAgICAgICAgIDwvRmxleEJveD5cbiAgICAgICAgICA8L1N0eWxlZE1lbnVJdGVtPlxuICAgICAgICApKX1cbiAgICAgIDwvRmxleEJveD5cbiAgICA8L0JveD5cbiAgKTtcbn07XG4iXX0= */",
-  toString: _EMOTION_STRINGIFIED_CSS_ERROR__
-});
-export const PopularSearches = ({
-  navigateToSearch,
-  onTrackingClick
-}) => {
-  const isMobile = theme.breakpoints.xs || theme.breakpoints.sm;
-  return /*#__PURE__*/_jsxs(Box, {
-    mb: 24,
-    as: "li",
-    children: [/*#__PURE__*/_jsx(Text, {
-      as: "h2",
-      variant: "title-xs",
-      mb: 12,
-      children: "Popular searches"
-    }), /*#__PURE__*/_jsx(FlexBox, {
-      as: "ul",
-      listStyle: "none",
-      p: 0,
-      flexDirection: "column",
-      children: popularSearchTerms.map((term, i) => /*#__PURE__*/_jsxs(StyledMenuItem, {
-        itemType: "link",
-        id: term,
-        href: `/search?query=${encodeURIComponent(term)}`,
-        onClick: () => {
-          navigateToSearch(term);
-          onTrackingClick('popular_search_term', {
-            misc: JSON.stringify({
-              value: term.toLowerCase(),
-              index: i
-            })
-          });
-        },
-        pl: 0,
-        children: [/*#__PURE__*/_jsx(SemiboldSearchIcon, {
-          mb: 2,
-          size: 14,
-          strokeWidth: 8
-        }), /*#__PURE__*/_jsx(Text, {
-          variant: isMobile ? 'p-base' : 'p-large',
-          ml: 12,
-          children: term
-        })]
-      }, term))
-    })]
-  });
+import { popularContent, popularSearchTerms } from "./consts.js";
+import { SemiboldSearchIcon } from "./SearchPane.js";
+import { Badge, Box, FlexBox, MenuItem, Text } from "@codecademy/gamut";
+import { theme } from "@codecademy/gamut-styles";
+import styled from "@emotion/styled";
+import { jsx, jsxs } from "react/jsx-runtime";
+
+//#region src/AppHeader/Search/DefaultResults.tsx
+const StyledMenuItem = styled(MenuItem)`
+  &:focus-visible:after {
+    left: -4px;
+  }
+  padding: 8px 0;
+`;
+const PopularSearches = ({ navigateToSearch, onTrackingClick }) => {
+	const isMobile = theme.breakpoints.xs || theme.breakpoints.sm;
+	return /* @__PURE__ */ jsxs(Box, {
+		mb: 24,
+		as: "li",
+		children: [/* @__PURE__ */ jsx(Text, {
+			as: "h2",
+			variant: "title-xs",
+			mb: 12,
+			children: "Popular searches"
+		}), /* @__PURE__ */ jsx(FlexBox, {
+			as: "ul",
+			listStyle: "none",
+			p: 0,
+			flexDirection: "column",
+			children: popularSearchTerms.map((term, i) => /* @__PURE__ */ jsxs(StyledMenuItem, {
+				itemType: "link",
+				id: term,
+				href: `/search?query=${encodeURIComponent(term)}`,
+				onClick: () => {
+					navigateToSearch(term);
+					onTrackingClick("popular_search_term", { misc: JSON.stringify({
+						value: term.toLowerCase(),
+						index: i
+					}) });
+				},
+				pl: 0,
+				children: [/* @__PURE__ */ jsx(SemiboldSearchIcon, {
+					mb: 2,
+					size: 14,
+					strokeWidth: 8
+				}), /* @__PURE__ */ jsx(Text, {
+					variant: isMobile ? "p-base" : "p-large",
+					ml: 12,
+					children: term
+				})]
+			}, term))
+		})]
+	});
 };
-export const PopularContent = ({
-  onTrackingClick
-}) => {
-  const isMobile = theme.breakpoints.xs || theme.breakpoints.sm;
-  return /*#__PURE__*/_jsxs(Box, {
-    mb: 24,
-    as: "li",
-    children: [/*#__PURE__*/_jsx(Text, {
-      as: "h2",
-      variant: "title-xs",
-      mb: 12,
-      children: "What our members are learning"
-    }), /*#__PURE__*/_jsx(FlexBox, {
-      as: "ul",
-      listStyle: "none",
-      p: 0,
-      flexDirection: "column",
-      children: popularContent.map((c, i) => /*#__PURE__*/_jsx(StyledMenuItem, {
-        itemType: "link",
-        href: c.href,
-        pl: 0,
-        onClick: () => onTrackingClick('popular_content', {
-          slug: c.slug,
-          ...(c.contentId ? {
-            content_id: c.contentId
-          } : {}),
-          misc: JSON.stringify({
-            content_type: c.type.toLowerCase(),
-            index: i,
-            href: c.href
-          })
-        }),
-        children: /*#__PURE__*/_jsxs(FlexBox, {
-          flexDirection: "row",
-          alignItems: "center",
-          children: [/*#__PURE__*/_jsx(Text, {
-            variant: isMobile ? 'p-base' : 'p-large',
-            mr: 12,
-            children: c.title
-          }), /*#__PURE__*/_jsx(Badge, {
-            size: "sm",
-            variant: "tertiary",
-            children: c.type
-          })]
-        })
-      }, c.title))
-    })]
-  });
-};
+const PopularContent = ({ onTrackingClick }) => {
+	const isMobile = theme.breakpoints.xs || theme.breakpoints.sm;
+	return /* @__PURE__ */ jsxs(Box, {
+		mb: 24,
+		as: "li",
+		children: [/* @__PURE__ */ jsx(Text, {
+			as: "h2",
+			variant: "title-xs",
+			mb: 12,
+			children: "What our members are learning"
+		}), /* @__PURE__ */ jsx(FlexBox, {
+			as: "ul",
+			listStyle: "none",
+			p: 0,
+			flexDirection: "column",
+			children: popularContent.map((c, i) => /* @__PURE__ */ jsx(StyledMenuItem, {
+				itemType: "link",
+				href: c.href,
+				pl: 0,
+				onClick: () => onTrackingClick("popular_content", {
+					slug: c.slug,
+					...c.contentId ? { content_id: c.contentId } : {},
+					misc: JSON.stringify({
+						content_type: c.type.toLowerCase(),
+						index: i,
+						href: c.href
+					})
+				}),
+				children: /* @__PURE__ */ jsxs(FlexBox, {
+					flexDirection: "row",
+					alignItems: "center",
+					children: [/* @__PURE__ */ jsx(Text, {
+						variant: isMobile ? "p-base" : "p-large",
+						mr: 12,
+						children: c.title
+					}), /* @__PURE__ */ jsx(Badge, {
+						size: "sm",
+						variant: "tertiary",
+						children: c.type
+					})]
+				})
+			}, c.title))
+		})]
+	});
+};
+
+//#endregion
+export { PopularContent, PopularSearches };

package/dist/AppHeader/Search/QuizAndHelpCenterLinks.cjs

@@ -0,0 +1,70 @@
+const require_rolldown_runtime = require('../../_virtual/rolldown_runtime.cjs');
+const require_context = require('../../GlobalHeader/context.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_jsx_runtime = require("react/jsx-runtime");
+let _codecademy_gamut_icons = require("@codecademy/gamut-icons");
+
+//#region src/AppHeader/Search/QuizAndHelpCenterLinks.tsx
+const BoldSupportIcon = (0, _emotion_styled.default)(_codecademy_gamut_icons.SupportIcon)`
+  path {
+    stroke-width: 2.5;
+  }
+  circle {
+    stroke-width: 2.5;
+  }
+`;
+const QuizAndHelpCenterLinks = ({ onTrackingClick, handleCloseDropdown }) => {
+	const { showOnboardingQuiz, showSortingQuiz } = require_context.useHeaderDisplayContext();
+	const isMobile = _codecademy_gamut_styles.theme.breakpoints.xs || _codecademy_gamut_styles.theme.breakpoints.sm;
+	return /* @__PURE__ */ (0, react_jsx_runtime.jsxs)(_codecademy_gamut.FlexBox, {
+		justifyContent: "space-between",
+		alignItems: "center",
+		borderTop: 1,
+		borderColor: "border-tertiary",
+		py: 8,
+		children: [/* @__PURE__ */ (0, react_jsx_runtime.jsx)(_codecademy_gamut.FlexBox, {
+			flexDirection: {
+				_: "column",
+				md: "row"
+			},
+			children: (showOnboardingQuiz || showSortingQuiz) && /* @__PURE__ */ (0, react_jsx_runtime.jsxs)(react_jsx_runtime.Fragment, { children: [/* @__PURE__ */ (0, react_jsx_runtime.jsx)(_codecademy_gamut.Text, {
+				fontSize: 16,
+				mr: 10,
+				children: "Not sure where to begin?"
+			}), /* @__PURE__ */ (0, react_jsx_runtime.jsx)(_codecademy_gamut.Anchor, {
+				href: showOnboardingQuiz ? "/welcome/find-a-course" : "/explore/sorting-quiz",
+				variant: "standard",
+				onClick: () => {
+					onTrackingClick(showOnboardingQuiz ? "sorting_quiz" : "onboarding_quiz");
+					handleCloseDropdown();
+				},
+				children: /* @__PURE__ */ (0, react_jsx_runtime.jsxs)(_codecademy_gamut.FlexBox, {
+					alignItems: "center",
+					gap: 10,
+					overflow: "visible",
+					children: [/* @__PURE__ */ (0, react_jsx_runtime.jsx)(_codecademy_gamut.Text, {
+						fontSize: {
+							_: 14,
+							md: 16
+						},
+						children: "Take our quiz"
+					}), /* @__PURE__ */ (0, react_jsx_runtime.jsx)(_codecademy_gamut_icons.MiniArrowRightIcon, { size: 12 })]
+				})
+			})] })
+		}), /* @__PURE__ */ (0, react_jsx_runtime.jsxs)(_codecademy_gamut.TextButton, {
+			href: "/help",
+			onClick: () => onTrackingClick("help_center"),
+			size: isMobile ? "small" : "normal",
+			children: [/* @__PURE__ */ (0, react_jsx_runtime.jsx)(BoldSupportIcon, {
+				mr: 8,
+				size: 12
+			}), "Help Center"]
+		})]
+	});
+};
+
+//#endregion
+exports.QuizAndHelpCenterLinks = QuizAndHelpCenterLinks;

package/dist/AppHeader/Search/QuizAndHelpCenterLinks.js

@@ -1,79 +1,68 @@
-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 { Anchor, FlexBox, Text, TextButton } from '@codecademy/gamut';
-import { MiniArrowRightIcon, SupportIcon } from '@codecademy/gamut-icons';
-import { theme } from '@codecademy/gamut-styles';
-import { useHeaderDisplayContext } from '../../GlobalHeader/context';
-import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-runtime";
-export const BoldSupportIcon = /*#__PURE__*/_styled(SupportIcon, {
-  target: "em954zc0",
-  label: "BoldSupportIcon"
-})(process.env.NODE_ENV === "production" ? {
-  name: "jcs9cn",
-  styles: "path{stroke-width:2.5;}circle{stroke-width:2.5;}"
-} : {
-  name: "jcs9cn",
-  styles: "path{stroke-width:2.5;}circle{stroke-width:2.5;}/*# sourceMappingURL=data:application/json;charset=utf-8;base64,eyJ2ZXJzaW9uIjozLCJzb3VyY2VzIjpbIi4uLy4uLy4uL3NyYy9BcHBIZWFkZXIvU2VhcmNoL1F1aXpBbmRIZWxwQ2VudGVyTGlua3MudHN4Il0sIm5hbWVzIjpbXSwibWFwcGluZ3MiOiJBQU9rRCIsImZpbGUiOiIuLi8uLi8uLi9zcmMvQXBwSGVhZGVyL1NlYXJjaC9RdWl6QW5kSGVscENlbnRlckxpbmtzLnRzeCIsInNvdXJjZXNDb250ZW50IjpbImltcG9ydCB7IEFuY2hvciwgRmxleEJveCwgVGV4dCwgVGV4dEJ1dHRvbiB9IGZyb20gJ0Bjb2RlY2FkZW15L2dhbXV0JztcbmltcG9ydCB7IE1pbmlBcnJvd1JpZ2h0SWNvbiwgU3VwcG9ydEljb24gfSBmcm9tICdAY29kZWNhZGVteS9nYW11dC1pY29ucyc7XG5pbXBvcnQgeyB0aGVtZSB9IGZyb20gJ0Bjb2RlY2FkZW15L2dhbXV0LXN0eWxlcyc7XG5pbXBvcnQgc3R5bGVkIGZyb20gJ0BlbW90aW9uL3N0eWxlZCc7XG5cbmltcG9ydCB7IHVzZUhlYWRlckRpc3BsYXlDb250ZXh0IH0gZnJvbSAnLi4vLi4vR2xvYmFsSGVhZGVyL2NvbnRleHQnO1xuXG5leHBvcnQgY29uc3QgQm9sZFN1cHBvcnRJY29uID0gc3R5bGVkKFN1cHBvcnRJY29uKWBcbiAgcGF0aCB7XG4gICAgc3Ryb2tlLXdpZHRoOiAyLjU7XG4gIH1cbiAgY2lyY2xlIHtcbiAgICBzdHJva2Utd2lkdGg6IDIuNTtcbiAgfVxuYDtcblxuZXhwb3J0IGNvbnN0IFF1aXpBbmRIZWxwQ2VudGVyTGlua3M6IFJlYWN0LkZDPHtcbiAgb25UcmFja2luZ0NsaWNrOiAodGFyZ2V0OiBzdHJpbmcpID0+IHZvaWQ7XG4gIGhhbmRsZUNsb3NlRHJvcGRvd246ICgpID0+IHZvaWQ7XG59PiA9ICh7IG9uVHJhY2tpbmdDbGljaywgaGFuZGxlQ2xvc2VEcm9wZG93biB9KSA9PiB7XG4gIGNvbnN0IHsgc2hvd09uYm9hcmRpbmdRdWl6LCBzaG93U29ydGluZ1F1aXogfSA9IHVzZUhlYWRlckRpc3BsYXlDb250ZXh0KCk7XG5cbiAgY29uc3QgaXNNb2JpbGUgPSB0aGVtZS5icmVha3BvaW50cy54cyB8fCB0aGVtZS5icmVha3BvaW50cy5zbTtcblxuICBjb25zdCBxdWl6TGluayA9IHNob3dPbmJvYXJkaW5nUXVpelxuICAgID8gJy93ZWxjb21lL2ZpbmQtYS1jb3Vyc2UnXG4gICAgOiAnL2V4cGxvcmUvc29ydGluZy1xdWl6JztcblxuICBjb25zdCBzaG93UXVpeiA9IHNob3dPbmJvYXJkaW5nUXVpeiB8fCBzaG93U29ydGluZ1F1aXo7XG5cbiAgcmV0dXJuIChcbiAgICA8RmxleEJveFxuICAgICAganVzdGlmeUNvbnRlbnQ9XCJzcGFjZS1iZXR3ZWVuXCJcbiAgICAgIGFsaWduSXRlbXM9XCJjZW50ZXJcIlxuICAgICAgYm9yZGVyVG9wPXsxfVxuICAgICAgYm9yZGVyQ29sb3I9XCJib3JkZXItdGVydGlhcnlcIlxuICAgICAgcHk9ezh9XG4gICAgPlxuICAgICAgPEZsZXhCb3ggZmxleERpcmVjdGlvbj17eyBfOiAnY29sdW1uJywgbWQ6ICdyb3cnIH19PlxuICAgICAgICB7c2hvd1F1aXogJiYgKFxuICAgICAgICAgIDw+XG4gICAgICAgICAgICA8VGV4dCBmb250U2l6ZT17MTZ9IG1yPXsxMCBhcyAwfT5cbiAgICAgICAgICAgICAgTm90IHN1cmUgd2hlcmUgdG8gYmVnaW4/XG4gICAgICAgICAgICA8L1RleHQ+XG4gICAgICAgICAgICA8QW5jaG9yXG4gICAgICAgICAgICAgIGhyZWY9e3F1aXpMaW5rfVxuICAgICAgICAgICAgICB2YXJpYW50PVwic3RhbmRhcmRcIlxuICAgICAgICAgICAgICBvbkNsaWNrPXsoKSA9PiB7XG4gICAgICAgICAgICAgICAgb25UcmFja2luZ0NsaWNrKFxuICAgICAgICAgICAgICAgICAgc2hvd09uYm9hcmRpbmdRdWl6ID8gJ3NvcnRpbmdfcXVpeicgOiAnb25ib2FyZGluZ19xdWl6J1xuICAgICAgICAgICAgICAgICk7XG4gICAgICAgICAgICAgICAgaGFuZGxlQ2xvc2VEcm9wZG93bigpO1xuICAgICAgICAgICAgICB9fVxuICAgICAgICAgICAgPlxuICAgICAgICAgICAgICA8RmxleEJveCBhbGlnbkl0ZW1zPVwiY2VudGVyXCIgZ2FwPXsxMCBhcyAwfSBvdmVyZmxvdz1cInZpc2libGVcIj5cbiAgICAgICAgICAgICAgICA8VGV4dCBmb250U2l6ZT17eyBfOiAxNCwgbWQ6IDE2IH19PlRha2Ugb3VyIHF1aXo8L1RleHQ+XG4gICAgICAgICAgICAgICAgPE1pbmlBcnJvd1JpZ2h0SWNvbiBzaXplPXsxMn0gLz5cbiAgICAgICAgICAgICAgPC9GbGV4Qm94PlxuICAgICAgICAgICAgPC9BbmNob3I+XG4gICAgICAgICAgPC8+XG4gICAgICAgICl9XG4gICAgICA8L0ZsZXhCb3g+XG4gICAgICA8VGV4dEJ1dHRvblxuICAgICAgICBocmVmPVwiL2hlbHBcIlxuICAgICAgICBvbkNsaWNrPXsoKSA9PiBvblRyYWNraW5nQ2xpY2soJ2hlbHBfY2VudGVyJyl9XG4gICAgICAgIHNpemU9e2lzTW9iaWxlID8gJ3NtYWxsJyA6ICdub3JtYWwnfVxuICAgICAgPlxuICAgICAgICA8Qm9sZFN1cHBvcnRJY29uIG1yPXs4fSBzaXplPXsxMn0gLz5cbiAgICAgICAgSGVscCBDZW50ZXJcbiAgICAgIDwvVGV4dEJ1dHRvbj5cbiAgICA8L0ZsZXhCb3g+XG4gICk7XG59O1xuIl19 */",
-  toString: _EMOTION_STRINGIFIED_CSS_ERROR__
-});
-export const QuizAndHelpCenterLinks = ({
-  onTrackingClick,
-  handleCloseDropdown
-}) => {
-  const {
-    showOnboardingQuiz,
-    showSortingQuiz
-  } = useHeaderDisplayContext();
-  const isMobile = theme.breakpoints.xs || theme.breakpoints.sm;
-  const quizLink = showOnboardingQuiz ? '/welcome/find-a-course' : '/explore/sorting-quiz';
-  const showQuiz = showOnboardingQuiz || showSortingQuiz;
-  return /*#__PURE__*/_jsxs(FlexBox, {
-    justifyContent: "space-between",
-    alignItems: "center",
-    borderTop: 1,
-    borderColor: "border-tertiary",
-    py: 8,
-    children: [/*#__PURE__*/_jsx(FlexBox, {
-      flexDirection: {
-        _: 'column',
-        md: 'row'
-      },
-      children: showQuiz && /*#__PURE__*/_jsxs(_Fragment, {
-        children: [/*#__PURE__*/_jsx(Text, {
-          fontSize: 16,
-          mr: 10,
-          children: "Not sure where to begin?"
-        }), /*#__PURE__*/_jsx(Anchor, {
-          href: quizLink,
-          variant: "standard",
-          onClick: () => {
-            onTrackingClick(showOnboardingQuiz ? 'sorting_quiz' : 'onboarding_quiz');
-            handleCloseDropdown();
-          },
-          children: /*#__PURE__*/_jsxs(FlexBox, {
-            alignItems: "center",
-            gap: 10,
-            overflow: "visible",
-            children: [/*#__PURE__*/_jsx(Text, {
-              fontSize: {
-                _: 14,
-                md: 16
-              },
-              children: "Take our quiz"
-            }), /*#__PURE__*/_jsx(MiniArrowRightIcon, {
-              size: 12
-            })]
-          })
-        })]
-      })
-    }), /*#__PURE__*/_jsxs(TextButton, {
-      href: "/help",
-      onClick: () => onTrackingClick('help_center'),
-      size: isMobile ? 'small' : 'normal',
-      children: [/*#__PURE__*/_jsx(BoldSupportIcon, {
-        mr: 8,
-        size: 12
-      }), "Help Center"]
-    })]
-  });
-};
+import { useHeaderDisplayContext } from "../../GlobalHeader/context.js";
+import { Anchor, FlexBox, Text, TextButton } from "@codecademy/gamut";
+import { theme } from "@codecademy/gamut-styles";
+import styled from "@emotion/styled";
+import { Fragment, jsx, jsxs } from "react/jsx-runtime";
+import { MiniArrowRightIcon, SupportIcon } from "@codecademy/gamut-icons";
+
+//#region src/AppHeader/Search/QuizAndHelpCenterLinks.tsx
+const BoldSupportIcon = styled(SupportIcon)`
+  path {
+    stroke-width: 2.5;
+  }
+  circle {
+    stroke-width: 2.5;
+  }
+`;
+const QuizAndHelpCenterLinks = ({ onTrackingClick, handleCloseDropdown }) => {
+	const { showOnboardingQuiz, showSortingQuiz } = useHeaderDisplayContext();
+	const isMobile = theme.breakpoints.xs || theme.breakpoints.sm;
+	return /* @__PURE__ */ jsxs(FlexBox, {
+		justifyContent: "space-between",
+		alignItems: "center",
+		borderTop: 1,
+		borderColor: "border-tertiary",
+		py: 8,
+		children: [/* @__PURE__ */ jsx(FlexBox, {
+			flexDirection: {
+				_: "column",
+				md: "row"
+			},
+			children: (showOnboardingQuiz || showSortingQuiz) && /* @__PURE__ */ jsxs(Fragment, { children: [/* @__PURE__ */ jsx(Text, {
+				fontSize: 16,
+				mr: 10,
+				children: "Not sure where to begin?"
+			}), /* @__PURE__ */ jsx(Anchor, {
+				href: showOnboardingQuiz ? "/welcome/find-a-course" : "/explore/sorting-quiz",
+				variant: "standard",
+				onClick: () => {
+					onTrackingClick(showOnboardingQuiz ? "sorting_quiz" : "onboarding_quiz");
+					handleCloseDropdown();
+				},
+				children: /* @__PURE__ */ jsxs(FlexBox, {
+					alignItems: "center",
+					gap: 10,
+					overflow: "visible",
+					children: [/* @__PURE__ */ jsx(Text, {
+						fontSize: {
+							_: 14,
+							md: 16
+						},
+						children: "Take our quiz"
+					}), /* @__PURE__ */ jsx(MiniArrowRightIcon, { size: 12 })]
+				})
+			})] })
+		}), /* @__PURE__ */ jsxs(TextButton, {
+			href: "/help",
+			onClick: () => onTrackingClick("help_center"),
+			size: isMobile ? "small" : "normal",
+			children: [/* @__PURE__ */ jsx(BoldSupportIcon, {
+				mr: 8,
+				size: 12
+			}), "Help Center"]
+		})]
+	});
+};
+
+//#endregion
+export { QuizAndHelpCenterLinks };

package/dist/AppHeader/Search/SearchButton.cjs

@@ -0,0 +1,50 @@
+const require_rolldown_runtime = require('../../_virtual/rolldown_runtime.cjs');
+const require_index = require('../AppHeaderElements/AppHeaderProvider/index.cjs');
+const require_index$1 = require('./SearchTrackingProvider/index.cjs');
+let _codecademy_gamut = require("@codecademy/gamut");
+let react = require("react");
+let react_jsx_runtime = require("react/jsx-runtime");
+let _codecademy_gamut_icons = require("@codecademy/gamut-icons");
+
+//#region src/AppHeader/Search/SearchButton.tsx
+let autocompleteCacheWarmed = false;
+function warmAutocompleteCache() {
+	if (typeof window !== "undefined" && !autocompleteCacheWarmed) {
+		autocompleteCacheWarmed = true;
+		const { search } = window.location;
+		const apiUrl = `/api/portal/search/autocomplete-preload${search}`;
+		fetch(apiUrl, { headers: { "Warm-Only": "true" } });
+	}
+}
+const SearchButton = ({ isSearchVisible, searchButtonRef, setIsSearchVisible, toggleSearch, onSearchAsYouType }) => {
+	const { lastOpenedDropdown, setLastOpenedDropdown } = require_index.useAppHeaderContext();
+	const { onSearchAsYouTypeParams } = require_index$1.useSearchTrackingContext();
+	const expandedToggleSearch = () => {
+		if (isSearchVisible && onSearchAsYouType && onSearchAsYouTypeParams && onSearchAsYouTypeParams.query) {
+			const { query, searchId, resultsCount, queryLoadTime } = onSearchAsYouTypeParams;
+			onSearchAsYouType(query, searchId, resultsCount, queryLoadTime);
+		}
+		toggleSearch();
+		if (!isSearchVisible && setLastOpenedDropdown) setLastOpenedDropdown("search");
+	};
+	(0, react.useEffect)(() => {
+		if (lastOpenedDropdown !== "search" && isSearchVisible) setIsSearchVisible(false);
+	}, [lastOpenedDropdown]);
+	return /* @__PURE__ */ (0, react_jsx_runtime.jsx)(_codecademy_gamut.IconButton, {
+		"aria-expanded": isSearchVisible,
+		"data-testid": "header-search",
+		icon: _codecademy_gamut_icons.SearchIcon,
+		onClick: expandedToggleSearch,
+		onMouseOver: warmAutocompleteCache,
+		ref: searchButtonRef,
+		tip: "Search",
+		tipProps: {
+			alignment: "bottom-center",
+			placement: "floating"
+		},
+		variant: "interface"
+	});
+};
+
+//#endregion
+exports.SearchButton = SearchButton;

package/dist/AppHeader/Search/SearchButton.js

@@ -1,74 +1,49 @@
-import { IconButton } from '@codecademy/gamut';
-import { SearchIcon } from '@codecademy/gamut-icons';
-import { useEffect } from 'react';
-import { useAppHeaderContext } from '../AppHeaderElements/AppHeaderProvider';
-import { useSearchTrackingContext } from './SearchTrackingProvider';
-import { jsx as _jsx } from "react/jsx-runtime";
+import { useAppHeaderContext } from "../AppHeaderElements/AppHeaderProvider/index.js";
+import { useSearchTrackingContext } from "./SearchTrackingProvider/index.js";
+import { IconButton } from "@codecademy/gamut";
+import { useEffect } from "react";
+import { jsx } from "react/jsx-runtime";
+import { SearchIcon } from "@codecademy/gamut-icons";
+
+//#region src/AppHeader/Search/SearchButton.tsx
 let autocompleteCacheWarmed = false;
 function warmAutocompleteCache() {
-  if (typeof window !== 'undefined' && !autocompleteCacheWarmed) {
-    autocompleteCacheWarmed = true;
-    const {
-      search
-    } = window.location;
-    const apiUrl = `/api/portal/search/autocomplete-preload${search}`;
-    const headers = {
-      'Warm-Only': 'true'
-    };
-    fetch(apiUrl, {
-      headers
-    });
-  }
+	if (typeof window !== "undefined" && !autocompleteCacheWarmed) {
+		autocompleteCacheWarmed = true;
+		const { search } = window.location;
+		const apiUrl = `/api/portal/search/autocomplete-preload${search}`;
+		fetch(apiUrl, { headers: { "Warm-Only": "true" } });
+	}
 }
-export const SearchButton = ({
-  isSearchVisible,
-  searchButtonRef,
-  setIsSearchVisible,
-  toggleSearch,
-  onSearchAsYouType
-}) => {
-  const {
-    lastOpenedDropdown,
-    setLastOpenedDropdown
-  } = useAppHeaderContext();
-  const {
-    onSearchAsYouTypeParams
-  } = useSearchTrackingContext();
-  const expandedToggleSearch = () => {
-    // if the search pane is visible (about to be closed) and there are search params with a query,
-    // trigger the search event before toggling
-    if (isSearchVisible && onSearchAsYouType && onSearchAsYouTypeParams && onSearchAsYouTypeParams.query) {
-      const {
-        query,
-        searchId,
-        resultsCount,
-        queryLoadTime
-      } = onSearchAsYouTypeParams;
-      onSearchAsYouType(query, searchId, resultsCount, queryLoadTime);
-    }
-    toggleSearch();
-    if (!isSearchVisible && setLastOpenedDropdown) {
-      setLastOpenedDropdown('search');
-    }
-  };
-  useEffect(() => {
-    if (lastOpenedDropdown !== 'search' && isSearchVisible) {
-      setIsSearchVisible(false);
-    }
-    // eslint-disable-next-line react-hooks/exhaustive-deps
-  }, [lastOpenedDropdown]);
-  return /*#__PURE__*/_jsx(IconButton, {
-    "aria-expanded": isSearchVisible,
-    "data-testid": "header-search",
-    icon: SearchIcon,
-    onClick: expandedToggleSearch,
-    onMouseOver: warmAutocompleteCache,
-    ref: searchButtonRef,
-    tip: "Search",
-    tipProps: {
-      alignment: 'bottom-center',
-      placement: 'floating'
-    },
-    variant: "interface"
-  });
-};
+const SearchButton = ({ isSearchVisible, searchButtonRef, setIsSearchVisible, toggleSearch, onSearchAsYouType }) => {
+	const { lastOpenedDropdown, setLastOpenedDropdown } = useAppHeaderContext();
+	const { onSearchAsYouTypeParams } = useSearchTrackingContext();
+	const expandedToggleSearch = () => {
+		if (isSearchVisible && onSearchAsYouType && onSearchAsYouTypeParams && onSearchAsYouTypeParams.query) {
+			const { query, searchId, resultsCount, queryLoadTime } = onSearchAsYouTypeParams;
+			onSearchAsYouType(query, searchId, resultsCount, queryLoadTime);
+		}
+		toggleSearch();
+		if (!isSearchVisible && setLastOpenedDropdown) setLastOpenedDropdown("search");
+	};
+	useEffect(() => {
+		if (lastOpenedDropdown !== "search" && isSearchVisible) setIsSearchVisible(false);
+	}, [lastOpenedDropdown]);
+	return /* @__PURE__ */ jsx(IconButton, {
+		"aria-expanded": isSearchVisible,
+		"data-testid": "header-search",
+		icon: SearchIcon,
+		onClick: expandedToggleSearch,
+		onMouseOver: warmAutocompleteCache,
+		ref: searchButtonRef,
+		tip: "Search",
+		tipProps: {
+			alignment: "bottom-center",
+			placement: "floating"
+		},
+		variant: "interface"
+	});
+};
+
+//#endregion
+export { SearchButton };