@codecademy/brand 4.0.0 → 5.0.0-alpha.19accb830.0

package/dist/AppHeader/Search/safelyRedirect.js

@@ -1,49 +1,39 @@
-/**
- * fork of @mono/util-url/src/safelyRedirect.ts, since
- * the build script doesn't resolve @mono dependencies
- */
+import { ALLOWED_HOSTS } from "./consts.js";
 
-import { ALLOWED_HOSTS } from './consts';
-export function safelyRedirect(url) {
-  try {
-    const sanitizedURL = sanitizeURL(url);
-    if (isRelativeUrl(sanitizedURL) || hasAllowedHost(sanitizedURL)) {
-      window.location.assign(sanitizedURL);
-    } else {
-      throw new Error(`Invalid redirect url: ${sanitizedURL}`);
-    }
-  } catch (error) {}
+//#region src/AppHeader/Search/safelyRedirect.ts
+/**
+* fork of @mono/util-url/src/safelyRedirect.ts, since
+* the build script doesn't resolve @mono dependencies
+*/ function safelyRedirect(url) {
+	try {
+		const sanitizedURL = sanitizeURL(url);
+		if (isRelativeUrl(sanitizedURL) || hasAllowedHost(sanitizedURL)) window.location.assign(sanitizedURL);
+		else throw new Error(`Invalid redirect url: ${sanitizedURL}`);
+	} catch (error) {}
 }
 function hasAllowedHost(url) {
-  const parsedUrl = new URL(url);
-  const {
-    hostname
-  } = parsedUrl;
-  return ALLOWED_HOSTS.some(host =>
-  // Exact match or exact subdomain match (e.g. sub.codecademy.com)
-  hostname === host || hostname.endsWith(`.${host}`));
+	const { hostname } = new URL(url);
+	return ALLOWED_HOSTS.some((host) => hostname === host || hostname.endsWith(`.${host}`));
 }
-
-// when a url is relative, the URL constructor will throw a TypeError;
 function isRelativeUrl(url) {
-  try {
-    const parsedUrl = new URL(url);
-    return parsedUrl === undefined;
-  } catch (error) {
-    return true;
-  }
+	try {
+		return new URL(url) === void 0;
+	} catch (error) {
+		return true;
+	}
 }
-
-// supports already encoded urls by decoding and re-encoding.
-// params are handled separately to allow for the encoding of / characters
 function sanitizeURL(url) {
-  const [path, params] = url.split('?', 2);
-  const sanitizedPath = encodeURI(decodeURI(path));
-  if (!params) return sanitizedPath;
-  const urlParams = new URLSearchParams(params);
-  urlParams.forEach((value, key) => {
-    const decoded = decodeURIComponent(value);
-    urlParams.set(key, decoded);
-  });
-  return `${sanitizedPath}?${urlParams.toString()}`;
-}
+	const [path, params] = url.split("?", 2);
+	const sanitizedPath = encodeURI(decodeURI(path));
+	if (!params) return sanitizedPath;
+	const urlParams = new URLSearchParams(params);
+	urlParams.forEach((value, key) => {
+		const decoded = decodeURIComponent(value);
+		urlParams.set(key, decoded);
+	});
+	return `${sanitizedPath}?${urlParams.toString()}`;
+}
+
+//#endregion
+export { safelyRedirect };
+//# sourceMappingURL=safelyRedirect.js.map

package/dist/AppHeader/Search/safelyRedirect.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"safelyRedirect.js","names":["ALLOWED_HOSTS","safelyRedirect","url","sanitizedURL","sanitizeURL","isRelativeUrl","hasAllowedHost","window","location","assign","Error","error","parsedUrl","URL","hostname","some","host","endsWith","undefined","path","params","split","sanitizedPath","encodeURI","decodeURI","urlParams","URLSearchParams","forEach","value","key","decoded","decodeURIComponent","set","toString"],"sources":["../../../src/AppHeader/Search/safelyRedirect.ts"],"sourcesContent":["/**\n * fork of @mono/util-url/src/safelyRedirect.ts, since\n * the build script doesn't resolve @mono dependencies\n */\n\nimport { ALLOWED_HOSTS } from './consts';\n\nexport function safelyRedirect(url: string) {\n  try {\n    const sanitizedURL = sanitizeURL(url);\n\n    if (isRelativeUrl(sanitizedURL) || hasAllowedHost(sanitizedURL)) {\n      window.location.assign(sanitizedURL);\n    } else {\n      throw new Error(`Invalid redirect url: ${sanitizedURL}`);\n    }\n  } catch (error) {}\n}\n\nfunction hasAllowedHost(url: string) {\n  const parsedUrl = new URL(url);\n  const { hostname } = parsedUrl;\n\n  return ALLOWED_HOSTS.some(\n    (host) =>\n      // Exact match or exact subdomain match (e.g. sub.codecademy.com)\n      hostname === host || hostname.endsWith(`.${host}`)\n  );\n}\n\n// when a url is relative, the URL constructor will throw a TypeError;\nfunction isRelativeUrl(url: string) {\n  try {\n    const parsedUrl = new URL(url);\n    return parsedUrl === undefined;\n  } catch (error) {\n    return true;\n  }\n}\n\n// supports already encoded urls by decoding and re-encoding.\n// params are handled separately to allow for the encoding of / characters\nfunction sanitizeURL(url: string) {\n  const [path, params] = url.split('?', 2);\n  const sanitizedPath = encodeURI(decodeURI(path));\n\n  if (!params) return sanitizedPath;\n\n  const urlParams = new URLSearchParams(params);\n  urlParams.forEach((value, key) => {\n    const decoded = decodeURIComponent(value);\n    urlParams.set(key, decoded);\n  });\n\n  return `${sanitizedPath}?${urlParams.toString()}`;\n}\n"],"mappings":";;;;;;GAOA,SAAgBC,eAAeC,KAAW;AACxC,KAAI;EACF,MAAMC,eAAeC,YAAYF,IAAAA;AAEjC,MAAIG,cAAcF,aAAAA,IAAiBG,eAAeH,aAAAA,CAChDI,QAAOC,SAASC,OAAON,aAAAA;MAEvB,OAAM,IAAIO,MAAM,yBAAyBP,eAAc;UAElDQ,OAAO;;AAGlB,SAASL,eAAeJ,KAAW;CAEjC,MAAM,EAAEY,aADU,IAAID,IAAIX,IAAAA;AAG1B,QAAOF,cAAce,MAClBC,SAECF,aAAaE,QAAQF,SAASG,SAAS,IAAID,OAAM,CAAA;;AAKvD,SAASX,cAAcH,KAAW;AAChC,KAAI;AAEF,SADkB,IAAIW,IAAIX,IAAAA,KACLgB;UACdP,OAAO;AACd,SAAO;;;AAMX,SAASP,YAAYF,KAAW;CAC9B,MAAM,CAACiB,MAAMC,UAAUlB,IAAImB,MAAM,KAAK,EAAA;CACtC,MAAMC,gBAAgBC,UAAUC,UAAUL,KAAAA,CAAAA;AAE1C,KAAI,CAACC,OAAQ,QAAOE;CAEpB,MAAMG,YAAY,IAAIC,gBAAgBN,OAAAA;AACtCK,WAAUE,SAASC,OAAOC,QAAAA;EACxB,MAAMC,UAAUC,mBAAmBH,MAAAA;AACnCH,YAAUO,IAAIH,KAAKC,QAAAA;GACrB;AAEA,QAAO,GAAGR,cAAc,GAAGG,UAAUQ,UAAQ"}

package/dist/AppHeader/Search/types.d.cts

@@ -0,0 +1,14 @@
+//#region src/AppHeader/Search/types.d.ts
+interface onTrackingClick {
+  onTrackingClick: (target: string, extraTrackingProps?: Record<string, string>) => void;
+}
+interface OnSearch {
+  onSearch: (query: string, fromPrevSearch?: string) => void;
+  onSearchAsYouType?: (query: string, searchId: string, resultsCount: number, queryLoadTime: number) => void;
+}
+interface AppHeaderSearch extends OnSearch, onTrackingClick {
+  onEnable: () => void;
+}
+//#endregion
+export { AppHeaderSearch };
+//# sourceMappingURL=types.d.cts.map

package/dist/AppHeader/Search/types.d.cts.map

@@ -0,0 +1 @@
+{"version":3,"file":"types.d.cts","names":[],"sources":["../../../src/AppHeader/Search/types.ts"],"mappings":";UAGU,eAAA;EACR,eAAA,GACE,MAAA,UACA,kBAAA,GAAqB,MAAA;AAAA;AAAA,UAIf,QAAA;EACR,QAAA,GAAW,KAAA,UAAe,cAAA;EAC1B,iBAAA,IACE,KAAA,UACA,QAAA,UACA,YAAA,UACA,aAAA;AAAA;AAAA,UASa,eAAA,SAAwB,QAAA,EAAU,eAAA;EACjD,QAAA;AAAA"}

package/dist/AppHeader/Search/types.d.ts

@@ -1,24 +1,17 @@
-import { ButtonBaseElements } from '@codecademy/gamut';
-import { Dispatch, SetStateAction } from 'react';
+import "@codecademy/gamut";
+import "react";
+
+//#region src/AppHeader/Search/types.d.ts
 interface onTrackingClick {
-    onTrackingClick: (target: string, extraTrackingProps?: Record<string, string>) => void;
+  onTrackingClick: (target: string, extraTrackingProps?: Record<string, string>) => void;
 }
 interface OnSearch {
-    onSearch: (query: string, fromPrevSearch?: string) => void;
-    onSearchAsYouType?: (query: string, searchId: string, resultsCount: number, queryLoadTime: number) => void;
+  onSearch: (query: string, fromPrevSearch?: string) => void;
+  onSearchAsYouType?: (query: string, searchId: string, resultsCount: number, queryLoadTime: number) => void;
 }
-interface ToggleSearch {
-    toggleSearch: () => void;
-    searchButtonRef: React.RefObject<ButtonBaseElements>;
+interface AppHeaderSearch extends OnSearch, onTrackingClick {
+  onEnable: () => void;
 }
-export interface AppHeaderSearch extends OnSearch, onTrackingClick {
-    onEnable: () => void;
-}
-export interface SearchButtonProps extends ToggleSearch {
-    isSearchVisible: boolean;
-    setIsSearchVisible: Dispatch<SetStateAction<boolean>>;
-    onSearchAsYouType?: OnSearch['onSearchAsYouType'];
-}
-export interface SearchPaneProps extends OnSearch, ToggleSearch, onTrackingClick {
-}
-export {};
+//#endregion
+export { AppHeaderSearch };
+//# sourceMappingURL=types.d.ts.map

package/dist/AppHeader/Search/types.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"types.d.ts","names":[],"sources":["../../../src/AppHeader/Search/types.ts"],"mappings":";;;;UAGU,eAAA;EACR,eAAA,GACE,MAAA,UACA,kBAAA,GAAqB,MAAA;AAAA;AAAA,UAIf,QAAA;EACR,QAAA,GAAW,KAAA,UAAe,cAAA;EAC1B,iBAAA,IACE,KAAA,UACA,QAAA,UACA,YAAA,UACA,aAAA;AAAA;AAAA,UASa,eAAA,SAAwB,QAAA,EAAU,eAAA;EACjD,QAAA;AAAA"}

package/dist/AppHeader/Search/useHeaderSearch.cjs

@@ -0,0 +1,40 @@
+const require_runtime = require('../../_virtual/_rolldown/runtime.cjs');
+const require_elements = require('../shared/elements.cjs');
+require('../shared/index.cjs');
+const require_SearchButton = require('./SearchButton.cjs');
+const require_SearchPane = require('./SearchPane.cjs');
+let react = require("react");
+
+//#region src/AppHeader/Search/useHeaderSearch.tsx
+const useHeaderSearch = ({ onEnable, onSearch, onTrackingClick, onSearchAsYouType }) => {
+	const [isSearchVisible, setIsSearchVisible] = (0, react.useState)(false);
+	const searchButtonRef = (0, react.useRef)(null);
+	const toggleSearch = () => {
+		if (!isSearchVisible) onEnable();
+		setIsSearchVisible((oldIsSearchVisible) => !oldIsSearchVisible);
+	};
+	return [{
+		id: "search",
+		type: "render-element",
+		renderElement: () => /* @__PURE__ */ React.createElement(require_SearchButton.SearchButton, {
+			isSearchVisible,
+			setIsSearchVisible,
+			toggleSearch,
+			searchButtonRef,
+			onSearchAsYouType
+		})
+	}, /* @__PURE__ */ React.createElement(require_elements.AnimatedHeaderZone, {
+		visible: isSearchVisible,
+		key: "search-content"
+	}, /* @__PURE__ */ React.createElement(require_SearchPane.SearchPane, {
+		onSearch,
+		onTrackingClick,
+		toggleSearch,
+		searchButtonRef,
+		onSearchAsYouType
+	}))];
+};
+
+//#endregion
+exports.useHeaderSearch = useHeaderSearch;
+//# sourceMappingURL=useHeaderSearch.cjs.map

package/dist/AppHeader/Search/useHeaderSearch.cjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"useHeaderSearch.cjs","names":["useRef","useState","AnimatedHeaderZone","SearchButton","SearchPane","useHeaderSearch","onEnable","onSearch","onTrackingClick","onSearchAsYouType","isSearchVisible","setIsSearchVisible","searchButtonRef","toggleSearch","oldIsSearchVisible","id","type","renderElement","visible","key"],"sources":["../../../src/AppHeader/Search/useHeaderSearch.tsx"],"sourcesContent":["import { ButtonBaseElements } from '@codecademy/gamut';\nimport { useRef, useState } from 'react';\n\nimport { AnimatedHeaderZone } from '../shared';\nimport { SearchButton } from './SearchButton';\nimport { SearchPane } from './SearchPane';\nimport { AppHeaderSearch } from './types';\n\nexport const useHeaderSearch = ({\n  onEnable,\n  onSearch,\n  onTrackingClick,\n  onSearchAsYouType,\n}: AppHeaderSearch) => {\n  const [isSearchVisible, setIsSearchVisible] = useState(false);\n  const searchButtonRef = useRef<ButtonBaseElements>(null);\n\n  const toggleSearch = () => {\n    if (!isSearchVisible) {\n      onEnable();\n    }\n    setIsSearchVisible((oldIsSearchVisible) => !oldIsSearchVisible);\n  };\n\n  return [\n    {\n      id: 'search',\n      type: 'render-element',\n      renderElement: () => (\n        <SearchButton\n          isSearchVisible={isSearchVisible}\n          setIsSearchVisible={setIsSearchVisible}\n          toggleSearch={toggleSearch}\n          searchButtonRef={searchButtonRef}\n          onSearchAsYouType={onSearchAsYouType}\n        />\n      ),\n    },\n    <AnimatedHeaderZone visible={isSearchVisible} key=\"search-content\">\n      <SearchPane\n        onSearch={onSearch}\n        onTrackingClick={onTrackingClick}\n        toggleSearch={toggleSearch}\n        searchButtonRef={searchButtonRef}\n        onSearchAsYouType={onSearchAsYouType}\n      />\n    </AnimatedHeaderZone>,\n  ] as const;\n};\n"],"mappings":";;;;;;;;AAQA,MAAaK,mBAAmB,EAC9BC,UACAC,UACAC,iBACAC,wBACgB;CAChB,MAAM,CAACC,iBAAiBC,0CAA+B,MAAA;CACvD,MAAMC,oCAA6C,KAAA;CAEnD,MAAMC,qBAAe;AACnB,MAAI,CAACH,gBACHJ,WAAAA;AAEFK,sBAAoBG,uBAAuB,CAACA,mBAAAA;;AAG9C,QAAO,CACL;EACEC,IAAI;EACJC,MAAM;EACNC,qBACE,sBAAA,cAACd,mCAAAA;GACkBO;GACGC;GACNE;GACGD;GACEH;;EAGzB,EACA,sBAAA,cAACP,qCAAAA;EAAmBgB,SAASR;EAAiBS,KAAI;IAChD,sBAAA,cAACf,+BAAAA;EACWG;EACOC;EACHK;EACGD;EACEH;KAGxB"}

package/dist/AppHeader/Search/useHeaderSearch.js

@@ -1,40 +1,39 @@
-import { useRef, useState } from 'react';
-import { AnimatedHeaderZone } from '../shared';
-import { SearchButton } from './SearchButton';
-import { SearchPane } from './SearchPane';
-import { jsx as _jsx } from "react/jsx-runtime";
-export const useHeaderSearch = ({
-  onEnable,
-  onSearch,
-  onTrackingClick,
-  onSearchAsYouType
-}) => {
-  const [isSearchVisible, setIsSearchVisible] = useState(false);
-  const searchButtonRef = useRef(null);
-  const toggleSearch = () => {
-    if (!isSearchVisible) {
-      onEnable();
-    }
-    setIsSearchVisible(oldIsSearchVisible => !oldIsSearchVisible);
-  };
-  return [{
-    id: 'search',
-    type: 'render-element',
-    renderElement: () => /*#__PURE__*/_jsx(SearchButton, {
-      isSearchVisible: isSearchVisible,
-      setIsSearchVisible: setIsSearchVisible,
-      toggleSearch: toggleSearch,
-      searchButtonRef: searchButtonRef,
-      onSearchAsYouType: onSearchAsYouType
-    })
-  }, /*#__PURE__*/_jsx(AnimatedHeaderZone, {
-    visible: isSearchVisible,
-    children: /*#__PURE__*/_jsx(SearchPane, {
-      onSearch: onSearch,
-      onTrackingClick: onTrackingClick,
-      toggleSearch: toggleSearch,
-      searchButtonRef: searchButtonRef,
-      onSearchAsYouType: onSearchAsYouType
-    })
-  }, "search-content")];
-};
+import { AnimatedHeaderZone } from "../shared/elements.js";
+import "../shared/index.js";
+import { SearchButton } from "./SearchButton.js";
+import { SearchPane } from "./SearchPane.js";
+import { useRef, useState } from "react";
+
+//#region src/AppHeader/Search/useHeaderSearch.tsx
+const useHeaderSearch = ({ onEnable, onSearch, onTrackingClick, onSearchAsYouType }) => {
+	const [isSearchVisible, setIsSearchVisible] = useState(false);
+	const searchButtonRef = useRef(null);
+	const toggleSearch = () => {
+		if (!isSearchVisible) onEnable();
+		setIsSearchVisible((oldIsSearchVisible) => !oldIsSearchVisible);
+	};
+	return [{
+		id: "search",
+		type: "render-element",
+		renderElement: () => /* @__PURE__ */ React.createElement(SearchButton, {
+			isSearchVisible,
+			setIsSearchVisible,
+			toggleSearch,
+			searchButtonRef,
+			onSearchAsYouType
+		})
+	}, /* @__PURE__ */ React.createElement(AnimatedHeaderZone, {
+		visible: isSearchVisible,
+		key: "search-content"
+	}, /* @__PURE__ */ React.createElement(SearchPane, {
+		onSearch,
+		onTrackingClick,
+		toggleSearch,
+		searchButtonRef,
+		onSearchAsYouType
+	}))];
+};
+
+//#endregion
+export { useHeaderSearch };
+//# sourceMappingURL=useHeaderSearch.js.map

package/dist/AppHeader/Search/useHeaderSearch.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"useHeaderSearch.js","names":["useRef","useState","AnimatedHeaderZone","SearchButton","SearchPane","useHeaderSearch","onEnable","onSearch","onTrackingClick","onSearchAsYouType","isSearchVisible","setIsSearchVisible","searchButtonRef","toggleSearch","oldIsSearchVisible","id","type","renderElement","visible","key"],"sources":["../../../src/AppHeader/Search/useHeaderSearch.tsx"],"sourcesContent":["import { ButtonBaseElements } from '@codecademy/gamut';\nimport { useRef, useState } from 'react';\n\nimport { AnimatedHeaderZone } from '../shared';\nimport { SearchButton } from './SearchButton';\nimport { SearchPane } from './SearchPane';\nimport { AppHeaderSearch } from './types';\n\nexport const useHeaderSearch = ({\n  onEnable,\n  onSearch,\n  onTrackingClick,\n  onSearchAsYouType,\n}: AppHeaderSearch) => {\n  const [isSearchVisible, setIsSearchVisible] = useState(false);\n  const searchButtonRef = useRef<ButtonBaseElements>(null);\n\n  const toggleSearch = () => {\n    if (!isSearchVisible) {\n      onEnable();\n    }\n    setIsSearchVisible((oldIsSearchVisible) => !oldIsSearchVisible);\n  };\n\n  return [\n    {\n      id: 'search',\n      type: 'render-element',\n      renderElement: () => (\n        <SearchButton\n          isSearchVisible={isSearchVisible}\n          setIsSearchVisible={setIsSearchVisible}\n          toggleSearch={toggleSearch}\n          searchButtonRef={searchButtonRef}\n          onSearchAsYouType={onSearchAsYouType}\n        />\n      ),\n    },\n    <AnimatedHeaderZone visible={isSearchVisible} key=\"search-content\">\n      <SearchPane\n        onSearch={onSearch}\n        onTrackingClick={onTrackingClick}\n        toggleSearch={toggleSearch}\n        searchButtonRef={searchButtonRef}\n        onSearchAsYouType={onSearchAsYouType}\n      />\n    </AnimatedHeaderZone>,\n  ] as const;\n};\n"],"mappings":";;;;;;;AAQA,MAAaK,mBAAmB,EAC9BC,UACAC,UACAC,iBACAC,wBACgB;CAChB,MAAM,CAACC,iBAAiBC,sBAAsBV,SAAS,MAAA;CACvD,MAAMW,kBAAkBZ,OAA2B,KAAA;CAEnD,MAAMa,qBAAe;AACnB,MAAI,CAACH,gBACHJ,WAAAA;AAEFK,sBAAoBG,uBAAuB,CAACA,mBAAAA;;AAG9C,QAAO,CACL;EACEC,IAAI;EACJC,MAAM;EACNC,qBACE,sBAAA,cAACd,cAAAA;GACkBO;GACGC;GACNE;GACGD;GACEH;;EAGzB,EACA,sBAAA,cAACP,oBAAAA;EAAmBgB,SAASR;EAAiBS,KAAI;IAChD,sBAAA,cAACf,YAAAA;EACWG;EACOC;EACHK;EACGD;EACEH;KAGxB"}

package/dist/AppHeader/index.cjs

@@ -0,0 +1,82 @@
+const require_runtime = require('../_virtual/_rolldown/runtime.cjs');
+const require_index = require('../HeaderHeightArea/index.cjs');
+const require_elements = require('./shared/elements.cjs');
+require('./shared/index.cjs');
+const require_NotificationsDropdown = require('../Notifications/NotificationsDropdown.cjs');
+const require_index$2 = require('./AppHeaderElements/AppHeaderProvider/index.cjs');
+const require_useHeaderNotifications = require('../Notifications/useHeaderNotifications.cjs');
+const require_index$3 = require('./AppHeaderElements/AppHeaderListItem/index.cjs');
+const require_index$4 = require('./Search/SearchTrackingProvider/index.cjs');
+const require_consts = require('./Search/consts.cjs');
+const require_useHeaderSearch = require('./Search/useHeaderSearch.cjs');
+const require_utils = require('./shared/utils.cjs');
+const require_index$5 = require('../GlobalPage/index.cjs');
+let react = require("react");
+react = require_runtime.__toESM(react);
+
+//#region src/AppHeader/index.tsx
+const AppHeader = ({ action, hideRightButtonDefaults, items, notifications, redirectParam, search, isStandalone, isTeams, dropdownSpacing, type = "standard" }) => {
+	const menuContainerRef = (0, react.useRef)(null);
+	const [notificationsBell, notificationsView] = require_useHeaderNotifications.useHeaderNotifications({
+		settings: notifications,
+		Renderer: require_NotificationsDropdown.NotificationsDropdown
+	});
+	const [searchButton, searchPane] = require_useHeaderSearch.useHeaderSearch({ ...search });
+	const right = (0, react.useMemo)(() => {
+		const defaultItems = hideRightButtonDefaults ? [] : [searchButton, ...notificationsBell ? [notificationsBell] : []];
+		if (isTeams) {
+			const teamsSpecificMenuItems = items.right.slice(0, -1);
+			const profile = items.right[items.right.length - 1];
+			return [
+				...teamsSpecificMenuItems,
+				...defaultItems,
+				profile
+			];
+		}
+		return [...defaultItems, ...items.right];
+	}, [
+		searchButton,
+		notificationsBell,
+		hideRightButtonDefaults,
+		items,
+		isTeams
+	]);
+	const { logError } = (0, react.useContext)(require_index$5.LogErrorContext);
+	const mapItemsToElement = (items, side) => {
+		if (items && items.some((item) => !item)) try {
+			const itemTypesString = items.map((item) => {
+				if (!item) return "**UNDEFINED ITEM**";
+				return item.type;
+			}).join(", ");
+			logError?.(`Error: Found an undefined app header item on the ${side} side of the header.`, { message: `The current array of items includes the following header item types: ${itemTypesString}` });
+		} catch (e) {
+			logError?.(`Error while logging undefined header items: ${e}`);
+		}
+		return items.filter((item) => !!item).map((item, index) => {
+			const margin = require_elements.appHeaderSpacing[type];
+			return /* @__PURE__ */ react.createElement(require_index$3.AppHeaderListItem, {
+				key: item.id,
+				mr: margin,
+				ml: side === "right" && index === 0 ? "auto" : margin
+			}, require_utils.mapAppHeaderItemToElement({
+				action,
+				item,
+				isStandalone,
+				isTeams,
+				redirectParam,
+				spacing: dropdownSpacing
+			}));
+		});
+	};
+	return /* @__PURE__ */ react.createElement(require_index.HeaderHeightArea, { display: {
+		_: "none",
+		[require_elements.appHeaderMobileBreakpoint]: "block"
+	} }, /* @__PURE__ */ react.createElement(require_index$2.AppHeaderProvider, null, /* @__PURE__ */ react.createElement(require_index$4.SearchTrackingProvider, null, /* @__PURE__ */ react.createElement(require_elements.StyledAppBar, {
+		"aria-label": "Main",
+		as: "nav"
+	}, /* @__PURE__ */ react.createElement(require_elements.StyledNavBar, { ref: menuContainerRef }, mapItemsToElement(items.left, "left"), mapItemsToElement(right, "right"))), notificationsView, searchPane)));
+};
+
+//#endregion
+exports.AppHeader = AppHeader;
+//# sourceMappingURL=index.cjs.map

package/dist/AppHeader/index.cjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.cjs","names":["React","useContext","useMemo","useRef","LogErrorContext","HeaderHeightArea","NotificationsDropdown","useHeaderNotifications","AppHeaderListItem","AppHeaderProvider","SearchTrackingProvider","useHeaderSearch","appHeaderMobileBreakpoint","appHeaderSpacing","StyledAppBar","StyledNavBar","mapAppHeaderItemToElement","AppHeader","action","hideRightButtonDefaults","items","notifications","redirectParam","search","isStandalone","isTeams","dropdownSpacing","type","menuContainerRef","notificationsBell","notificationsView","settings","Renderer","searchButton","searchPane","right","defaultItems","teamsSpecificMenuItems","slice","profile","length","logError","mapItemsToElement","side","some","item","itemTypesString","map","join","message","e","filter","index","margin","key","id","mr","ml","spacing","display","_","aria-label","as","ref","left"],"sources":["../../src/AppHeader/index.tsx"],"sourcesContent":["import { Menu } from '@codecademy/gamut';\nimport * as React from 'react';\nimport { useContext, useMemo, useRef } from 'react';\n\nimport {\n  AppHeaderAction,\n  AppHeaderItem,\n  AppHeaderSearch,\n  FormattedAppHeaderItems,\n  LogErrorContext,\n} from '..';\nimport { HeaderHeightArea } from '../HeaderHeightArea';\nimport { NotificationsDropdown } from '../Notifications/NotificationsDropdown';\nimport { AppHeaderNotificationSettings } from '../Notifications/types';\nimport { useHeaderNotifications } from '../Notifications/useHeaderNotifications';\nimport { AppHeaderListItem } from './AppHeaderElements/AppHeaderListItem';\nimport { AppHeaderProvider } from './AppHeaderElements/AppHeaderProvider';\nimport { SearchTrackingProvider } from './Search/SearchTrackingProvider';\nimport { useHeaderSearch } from './Search/useHeaderSearch';\nimport {\n  appHeaderMobileBreakpoint,\n  appHeaderSpacing,\n  StyledAppBar,\n  StyledNavBar,\n} from './shared';\nimport { mapAppHeaderItemToElement } from './shared/utils';\n\nexport * from './Search/consts';\n\nexport type AppHeaderProps = AppHeaderAction & {\n  items: FormattedAppHeaderItems;\n  notifications?: AppHeaderNotificationSettings;\n  redirectParam?: string;\n  search: AppHeaderSearch;\n  /**\n   * used to conditonally hide the default search icon and notification bell\n   */\n  hideRightButtonDefaults?: boolean;\n  /**\n   * temporary solution to allow this to be used in LXStudio. Future Header epic here: GM-1024\n   */\n  isStandalone?: boolean;\n  isTeams?: boolean;\n  dropdownSpacing?: React.ComponentProps<typeof Menu>['spacing'];\n  type?: 'standard' | 'enterprise';\n};\n\nexport const AppHeader: React.FC<AppHeaderProps> = ({\n  action,\n  hideRightButtonDefaults,\n  items,\n  notifications,\n  redirectParam,\n  search,\n  isStandalone,\n  isTeams,\n  dropdownSpacing,\n  type = 'standard',\n}) => {\n  const menuContainerRef = useRef<HTMLUListElement>(null);\n\n  const [notificationsBell, notificationsView] = useHeaderNotifications({\n    settings: notifications,\n    Renderer: NotificationsDropdown,\n  });\n  const [searchButton, searchPane] = useHeaderSearch({\n    ...search,\n  });\n\n  const right = useMemo(() => {\n    const defaultItems = hideRightButtonDefaults\n      ? []\n      : [searchButton, ...(notificationsBell ? [notificationsBell] : [])];\n\n    if (isTeams) {\n      const teamsSpecificMenuItems = items.right.slice(0, -1);\n      const profile = items.right[items.right.length - 1];\n\n      return [...teamsSpecificMenuItems, ...defaultItems, profile];\n    }\n\n    return [...defaultItems, ...items.right];\n  }, [\n    searchButton,\n    notificationsBell,\n    hideRightButtonDefaults,\n    items,\n    isTeams,\n  ]);\n\n  const { logError } = useContext(LogErrorContext);\n\n  const mapItemsToElement = <T extends AppHeaderItem[]>(\n    items: T,\n    side: 'left' | 'right'\n  ) => {\n    // logging error to help with debugging\n    if (items && items.some((item) => !item)) {\n      try {\n        const itemTypesString = items\n          .map((item) => {\n            if (!item) return '**UNDEFINED ITEM**';\n            return item.type;\n          })\n          .join(', ');\n\n        logError?.(\n          `Error: Found an undefined app header item on the ${side} side of the header.`,\n          {\n            message: `The current array of items includes the following header item types: ${itemTypesString}`,\n          }\n        );\n      } catch (e) {\n        logError?.(`Error while logging undefined header items: ${e}`);\n      }\n    }\n\n    return (\n      items\n        // preventative measure to handle a possibly undefined item from being rendered\n        .filter((item) => !!item)\n        .map((item, index) => {\n          const margin = appHeaderSpacing[type];\n          return (\n            <AppHeaderListItem\n              key={item.id}\n              mr={margin}\n              ml={side === 'right' && index === 0 ? 'auto' : margin}\n            >\n              {mapAppHeaderItemToElement({\n                action,\n                item,\n                isStandalone,\n                isTeams,\n                redirectParam,\n                spacing: dropdownSpacing,\n              })}\n            </AppHeaderListItem>\n          );\n        })\n    );\n  };\n\n  return (\n    <HeaderHeightArea\n      display={{ _: 'none', [appHeaderMobileBreakpoint]: 'block' }}\n    >\n      <AppHeaderProvider>\n        <SearchTrackingProvider>\n          <StyledAppBar aria-label=\"Main\" as=\"nav\">\n            <StyledNavBar ref={menuContainerRef}>\n              {mapItemsToElement(items.left, 'left')}\n              {mapItemsToElement(right, 'right')}\n            </StyledNavBar>\n          </StyledAppBar>\n          {notificationsView}\n          {searchPane}\n        </SearchTrackingProvider>\n      </AppHeaderProvider>\n    </HeaderHeightArea>\n  );\n};\n"],"mappings":";;;;;;;;;;;;;;;;;AA+CA,MAAaiB,aAAuC,EAClDC,QACAC,yBACAC,OACAC,eACAC,eACAC,QACAC,cACAC,SACAC,iBACAC,OAAO,iBACR;CACC,MAAMC,qCAA4C,KAAA;CAElD,MAAM,CAACC,mBAAmBC,qBAAqBvB,sDAAuB;EACpEwB,UAAUV;EACVW,UAAU1B;EACZ,CAAA;CACA,MAAM,CAAC2B,cAAcC,cAAcvB,wCAAgB,EACjD,GAAGY,QACL,CAAA;CAEA,MAAMY,iCAAgB;EACpB,MAAMC,eAAejB,0BACjB,EAAE,GACF,CAACc,iBAAkBJ,oBAAoB,CAACA,kBAAkB,GAAG,EAAE,CAAE;AAErE,MAAIJ,SAAS;GACX,MAAMY,yBAAyBjB,MAAMe,MAAMG,MAAM,GAAG,GAAC;GACrD,MAAMC,UAAUnB,MAAMe,MAAMf,MAAMe,MAAMK,SAAS;AAEjD,UAAO;OAAIH;OAA2BD;IAAcG;IAAQ;;AAG9D,SAAO,IAAIH,iBAAiBhB,MAAMe,MAAM;IACvC;EACDF;EACAJ;EACAV;EACAC;EACAK;EACD,CAAA;CAED,MAAM,EAAEgB,mCAAwBrC,gCAAAA;CAEhC,MAAMsC,qBACJtB,OACAuB,SAAAA;AAGA,MAAIvB,SAASA,MAAMwB,MAAMC,SAAS,CAACA,KAAAA,CACjC,KAAI;GACF,MAAMC,kBAAkB1B,MACrB2B,KAAKF,SAAAA;AACJ,QAAI,CAACA,KAAM,QAAO;AAClB,WAAOA,KAAKlB;KACd,CACCqB,KAAK,KAAA;AAERP,cACE,oDAAoDE,KAAK,uBACzD,EACEM,SAAS,wEAAwEH,mBACnF,CAAA;WAEKI,GAAG;AACVT,cAAW,+CAA+CS,IAAG;;AAIjE,SACE9B,MAEG+B,QAAQN,SAAS,CAAC,CAACA,KAAAA,CACnBE,KAAKF,MAAMO,UAAAA;GACV,MAAMC,SAASxC,kCAAiBc;AAChC,UACE,sBAAA,cAACnB,mCAAAA;IACC8C,KAAKT,KAAKU;IACVC,IAAIH;IACJI,IAAId,SAAS,WAAWS,UAAU,IAAI,SAASC;MAE9CrC,wCAA0B;IACzBE;IACA2B;IACArB;IACAC;IACAH;IACAoC,SAAShC;IACX,CAAA,CAAA;IAGN;;AAIN,QACE,sBAAA,cAACrB,gCAAAA,EACCsD,SAAS;EAAEC,GAAG;GAAShD,6CAA4B;EAAQ,IAE3D,sBAAA,cAACH,mCAAAA,MACC,sBAAA,cAACC,wCAAAA,MACC,sBAAA,cAACI,+BAAAA;EAAa+C,cAAW;EAAOC,IAAG;IACjC,sBAAA,cAAC/C,+BAAAA,EAAagD,KAAKnC,oBAChBc,kBAAkBtB,MAAM4C,MAAM,OAAA,EAC9BtB,kBAAkBP,OAAO,QAAA,CAAA,CAAA,EAG7BL,mBACAI,WAAAA,CAAAA,CAAAA"}

package/dist/AppHeader/index.d.cts

@@ -0,0 +1,29 @@
+import { AppHeaderNotificationSettings } from "../Notifications/types.cjs";
+import { ALLOWED_HOSTS, ContentType, popularContent, popularSearchTerms, searchPlaceholder } from "./Search/consts.cjs";
+import { AppHeaderAction, FormattedAppHeaderItems } from "./shared/types.cjs";
+import { AppHeaderSearch } from "./Search/types.cjs";
+import { Menu } from "@codecademy/gamut";
+import * as React$1 from "react";
+
+//#region src/AppHeader/index.d.ts
+type AppHeaderProps = AppHeaderAction & {
+  items: FormattedAppHeaderItems;
+  notifications?: AppHeaderNotificationSettings;
+  redirectParam?: string;
+  search: AppHeaderSearch;
+  /**
+   * used to conditonally hide the default search icon and notification bell
+   */
+  hideRightButtonDefaults?: boolean;
+  /**
+   * temporary solution to allow this to be used in LXStudio. Future Header epic here: GM-1024
+   */
+  isStandalone?: boolean;
+  isTeams?: boolean;
+  dropdownSpacing?: React$1.ComponentProps<typeof Menu>['spacing'];
+  type?: 'standard' | 'enterprise';
+};
+declare const AppHeader: React$1.FC<AppHeaderProps>;
+//#endregion
+export { AppHeader, AppHeaderProps };
+//# sourceMappingURL=index.d.cts.map

package/dist/AppHeader/index.d.cts.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.d.cts","names":[],"sources":["../../src/AppHeader/index.tsx"],"mappings":";;;;;;;;KA6BY,cAAA,GAAiB,eAAA;EAC3B,KAAA,EAAO,uBAAA;EACP,aAAA,GAAgB,6BAAA;EAChB,aAAA;EACA,MAAA,EAAQ,eAAA;;;;EAIR,uBAAA;EAJQ;;;EAQR,YAAA;EACA,OAAA;EACA,eAAA,GAAkB,OAAA,CAAM,cAAA,QAAsB,IAAA;EAC9C,IAAA;AAAA;AAAA,cAGW,SAAA,EAAW,OAAA,CAAM,EAAA,CAAG,cAAA"}

package/dist/AppHeader/index.d.ts

@@ -1,23 +1,30 @@
-import { Menu } from '@codecademy/gamut';
-import * as React from 'react';
-import { AppHeaderAction, AppHeaderSearch, FormattedAppHeaderItems } from '..';
-import { AppHeaderNotificationSettings } from '../Notifications/types';
-export * from './Search/consts';
-export type AppHeaderProps = AppHeaderAction & {
-    items: FormattedAppHeaderItems;
-    notifications?: AppHeaderNotificationSettings;
-    redirectParam?: string;
-    search: AppHeaderSearch;
-    /**
-     * used to conditonally hide the default search icon and notification bell
-     */
-    hideRightButtonDefaults?: boolean;
-    /**
-     * temporary solution to allow this to be used in LXStudio. Future Header epic here: GM-1024
-     */
-    isStandalone?: boolean;
-    isTeams?: boolean;
-    dropdownSpacing?: React.ComponentProps<typeof Menu>['spacing'];
-    type?: 'standard' | 'enterprise';
+import { AppHeaderNotificationSettings } from "../Notifications/types.js";
+import { ALLOWED_HOSTS, ContentType, popularContent, popularSearchTerms, searchPlaceholder } from "./Search/consts.js";
+import { AppHeaderAction, FormattedAppHeaderItems } from "./shared/types.js";
+import { AppHeaderSearch } from "./Search/types.js";
+import "../index.js";
+import { Menu } from "@codecademy/gamut";
+import * as React$1 from "react";
+
+//#region src/AppHeader/index.d.ts
+type AppHeaderProps = AppHeaderAction & {
+  items: FormattedAppHeaderItems;
+  notifications?: AppHeaderNotificationSettings;
+  redirectParam?: string;
+  search: AppHeaderSearch;
+  /**
+   * used to conditonally hide the default search icon and notification bell
+   */
+  hideRightButtonDefaults?: boolean;
+  /**
+   * temporary solution to allow this to be used in LXStudio. Future Header epic here: GM-1024
+   */
+  isStandalone?: boolean;
+  isTeams?: boolean;
+  dropdownSpacing?: React$1.ComponentProps<typeof Menu>['spacing'];
+  type?: 'standard' | 'enterprise';
 };
-export declare const AppHeader: React.FC<AppHeaderProps>;
+declare const AppHeader: React$1.FC<AppHeaderProps>;
+//#endregion
+export { AppHeader, AppHeaderProps };
+//# sourceMappingURL=index.d.ts.map

package/dist/AppHeader/index.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.d.ts","names":[],"sources":["../../src/AppHeader/index.tsx"],"mappings":";;;;;;;;;KA6BY,cAAA,GAAiB,eAAA;EAC3B,KAAA,EAAO,uBAAA;EACP,aAAA,GAAgB,6BAAA;EAChB,aAAA;EACA,MAAA,EAAQ,eAAA;EAJgB;;;EAQxB,uBAAA;EANgB;;;EAUhB,YAAA;EACA,OAAA;EACA,eAAA,GAAkB,OAAA,CAAM,cAAA,QAAsB,IAAA;EAC9C,IAAA;AAAA;AAAA,cAGW,SAAA,EAAW,OAAA,CAAM,EAAA,CAAG,cAAA"}