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

package/dist/lib/breakpointHooks/index.d.ts

@@ -1,6 +1,7 @@
-export type Breakpoint = 'xxs' | 'xs' | 'sm' | 'md' | 'lg' | 'xl';
-export type BreakpointMinWidths = Record<Breakpoint, number>;
-export declare const breakpoints: BreakpointMinWidths;
+//#region src/lib/breakpointHooks/index.d.ts
+type Breakpoint = 'xxs' | 'xs' | 'sm' | 'md' | 'lg' | 'xl';
+type BreakpointMinWidths = Record<Breakpoint, number>;
+declare const breakpoints: BreakpointMinWidths;
 /**
  * useBreakpoint will provide the current breakpoint to a React component.
  *
@@ -19,25 +20,27 @@ export declare const breakpoints: BreakpointMinWidths;
  * JavaScript-time screen size checks are notorious for worsening page performance.
  * @see https://web.dev/cls
  */
-export declare const useBreakpoint: () => keyof typeof breakpoints;
+declare const useBreakpoint: () => keyof typeof breakpoints;
 /**
  * @deprecated
  * Use Box, LayoutGrid, or other responsive Gamut components instead.
  * JavaScript-time screen size checks are notorious for worsening page performance.
  * @see https://web.dev/cls
  */
-export declare function useBreakpointAtOrAbove(breakpoint: Breakpoint): boolean;
+declare function useBreakpointAtOrAbove(breakpoint: Breakpoint): boolean;
 /**
  * @deprecated
  * Use Box, LayoutGrid, or other responsive Gamut components instead.
  * JavaScript-time screen size checks are notorious for worsening page performance.
  * @see https://web.dev/cls
  */
-export declare function useBreakpointAt(breakpoint: Breakpoint): boolean;
+declare function useBreakpointAt(breakpoint: Breakpoint): boolean;
 /**
  * @deprecated
  * Use Box, LayoutGrid, or other responsive Gamut components instead.
  * JavaScript-time screen size checks are notorious for worsening page performance.
  * @see https://web.dev/cls
  */
-export declare function useBreakpointAtOrBelow(breakpoint: Breakpoint): boolean;
+declare function useBreakpointAtOrBelow(breakpoint: Breakpoint): boolean;
+//#endregion
+export { Breakpoint, BreakpointMinWidths, breakpoints, useBreakpoint, useBreakpointAt, useBreakpointAtOrAbove, useBreakpointAtOrBelow };

package/dist/lib/breakpointHooks/index.js

@@ -1,60 +1,58 @@
-import { breakpoints as originalBreakpoints } from '@codecademy/gamut-styles';
-import mapValues from 'lodash/mapValues';
-import { createBreakpoint } from 'react-use';
-export const breakpoints = mapValues({
-  xxs: 0,
-  ...originalBreakpoints
-}, value => parseInt(value, 10));
+import { breakpoints } from "@codecademy/gamut-styles";
+import { createBreakpoint } from "react-use";
+import mapValues from "lodash/mapValues";
 
+//#region src/lib/breakpointHooks/index.ts
+const breakpoints$1 = mapValues({
+	xxs: 0,
+	...breakpoints
+}, (value) => parseInt(value, 10));
 /**
- * useBreakpoint will provide the current breakpoint to a React component.
- *
- * If you think you need this, make sure to think twice.  It is really nice
- * to allow your styles layer to concern itself about the appearance of a
- * component at different screen sizes, and not have to maintain two different
- * components that could drift from eachother.  That being said, sometimes
- * The content, layout, and/or functionality of a mobile page/component can
- * be so different that it is non-performant or difficult to maintain the
- * changes in only styles.  For those cases where it is actually easier to maintain
- * two components or a programatic distinction of the breakpoint, this helper
- * exists.
- *
- * @deprecated
- * Use Box, LayoutGrid, or other responsive Gamut components instead.
- * JavaScript-time screen size checks are notorious for worsening page performance.
- * @see https://web.dev/cls
- */
-export const useBreakpoint = createBreakpoint(breakpoints);
-
+* useBreakpoint will provide the current breakpoint to a React component.
+*
+* If you think you need this, make sure to think twice.  It is really nice
+* to allow your styles layer to concern itself about the appearance of a
+* component at different screen sizes, and not have to maintain two different
+* components that could drift from eachother.  That being said, sometimes
+* The content, layout, and/or functionality of a mobile page/component can
+* be so different that it is non-performant or difficult to maintain the
+* changes in only styles.  For those cases where it is actually easier to maintain
+* two components or a programatic distinction of the breakpoint, this helper
+* exists.
+*
+* @deprecated
+* Use Box, LayoutGrid, or other responsive Gamut components instead.
+* JavaScript-time screen size checks are notorious for worsening page performance.
+* @see https://web.dev/cls
+*/
+const useBreakpoint = createBreakpoint(breakpoints$1);
 /**
- * @deprecated
- * Use Box, LayoutGrid, or other responsive Gamut components instead.
- * JavaScript-time screen size checks are notorious for worsening page performance.
- * @see https://web.dev/cls
- */
-export function useBreakpointAtOrAbove(breakpoint) {
-  const currentBreakpoint = useBreakpoint();
-  return breakpoints[currentBreakpoint] >= breakpoints[breakpoint];
+* @deprecated
+* Use Box, LayoutGrid, or other responsive Gamut components instead.
+* JavaScript-time screen size checks are notorious for worsening page performance.
+* @see https://web.dev/cls
+*/
+function useBreakpointAtOrAbove(breakpoint) {
+	return breakpoints$1[useBreakpoint()] >= breakpoints$1[breakpoint];
 }
-
 /**
- * @deprecated
- * Use Box, LayoutGrid, or other responsive Gamut components instead.
- * JavaScript-time screen size checks are notorious for worsening page performance.
- * @see https://web.dev/cls
- */
-export function useBreakpointAt(breakpoint) {
-  const currentBreakpoint = useBreakpoint();
-  return breakpoints[currentBreakpoint] === breakpoints[breakpoint];
+* @deprecated
+* Use Box, LayoutGrid, or other responsive Gamut components instead.
+* JavaScript-time screen size checks are notorious for worsening page performance.
+* @see https://web.dev/cls
+*/
+function useBreakpointAt(breakpoint) {
+	return breakpoints$1[useBreakpoint()] === breakpoints$1[breakpoint];
 }
-
 /**
- * @deprecated
- * Use Box, LayoutGrid, or other responsive Gamut components instead.
- * JavaScript-time screen size checks are notorious for worsening page performance.
- * @see https://web.dev/cls
- */
-export function useBreakpointAtOrBelow(breakpoint) {
-  const currentBreakpoint = useBreakpoint();
-  return breakpoints[currentBreakpoint] <= breakpoints[breakpoint];
-}
+* @deprecated
+* Use Box, LayoutGrid, or other responsive Gamut components instead.
+* JavaScript-time screen size checks are notorious for worsening page performance.
+* @see https://web.dev/cls
+*/
+function useBreakpointAtOrBelow(breakpoint) {
+	return breakpoints$1[useBreakpoint()] <= breakpoints$1[breakpoint];
+}
+
+//#endregion
+export { breakpoints$1 as breakpoints, useBreakpoint, useBreakpointAt, useBreakpointAtOrAbove, useBreakpointAtOrBelow };

package/dist/lib/catalogList/index.cjs

@@ -0,0 +1,52 @@
+const require_index = require('../resourcesList/index.cjs');
+
+//#region src/lib/catalogList/index.tsx
+const liveLearningHubItems = {
+	title: "Live Learning",
+	description: "Build skills faster through live learning with expert instructors.",
+	data: [{
+		id: "bootcamps",
+		href: "/bootcamps",
+		text: "Bootcamps",
+		description: "Learn live from industry experts.",
+		trackingTarget: "topnav_catalog_live_learning_bootcamps",
+		type: "link",
+		newTab: true,
+		badge: require_index.renderNewBadge()
+	}, {
+		id: "gk",
+		href: "/live-learning#GKLiveLearning",
+		text: "Codecademy x GK",
+		description: "Instructor-led courses, offered via our partner organization.",
+		trackingTarget: "topnav_catalog_live_learning_gk_codecademy",
+		type: "link",
+		newTab: true,
+		badge: require_index.renderNewBadge()
+	}]
+};
+const liveLearningNavPanelItems = (isCoachingEnabled) => ({
+	title: "Live Learning",
+	description: "Build skills faster through live, instructor-led sessions. Get real-time feedback, stay motivated, and deepen your understanding with expert guidance.",
+	data: [{
+		id: "bootcamps",
+		href: "/bootcamps",
+		text: "Bootcamps",
+		description: "Join live virtual bootcamps that span multiple weeks and help you build real-world, in-demand skills. Led by experts, each bootcamp includes instructor support, community, professional mentorship—and comes with Codecademy Pro access.",
+		trackingTarget: "topnav_catalog_live_learning_bootcamps",
+		type: "link",
+		newTab: true,
+		badge: require_index.renderNewBadge()
+	}, {
+		id: "coaching",
+		href: "/coaching",
+		text: isCoachingEnabled ? "Coaching" : "Coaching (Coming soon)",
+		description: "Get personalized mentorship from expert coaches to accelerate your career journey. Whether you're preparing for technical interviews, exploring career options, or seeking guidance, 1:1 coaching gives you tailored support to reach your goals.",
+		trackingTarget: "topnav_catalog_live_learning_coaching",
+		type: "link",
+		newTab: true,
+		badge: require_index.renderNewBadge()
+	}]
+});
+
+//#endregion
+exports.liveLearningNavPanelItems = liveLearningNavPanelItems;

package/dist/lib/catalogList/index.js

@@ -1,198 +1,52 @@
-import { renderNewBadge } from '../resourcesList';
-export const careerPaths = [{
-  id: 'full-stack-engineer-career-path',
-  href: '/learn/paths/full-stack-engineer-career-path',
-  trackingTarget: 'topnav_catalog_career_full_stack_engineer',
-  text: 'Full-Stack Engineer',
-  type: 'link'
-}, {
-  id: 'back-end-engineer-career-path',
-  href: '/learn/paths/back-end-engineer-career-path',
-  trackingTarget: 'topnav_catalog_career_back-end-engineer',
-  text: 'Back-End Engineer',
-  type: 'link'
-}, {
-  id: 'ios-developer',
-  href: '/learn/paths/ios-developer',
-  trackingTarget: 'topnav_catalog_career_ios-developer',
-  text: 'iOS Developer',
-  type: 'link'
-}, {
-  id: 'front-end-engineer-career-path',
-  href: '/learn/paths/front-end-engineer-career-path',
-  trackingTarget: 'topnav_catalog_career_front-end-engineer',
-  text: 'Front-End Engineer',
-  type: 'link'
-}, {
-  id: 'computer-science',
-  href: '/learn/paths/computer-science',
-  trackingTarget: 'topnav_catalog_career_computer-science',
-  text: 'Computer Science',
-  type: 'link'
-}, {
-  id: 'data-science',
-  href: '/pages/data-science-career-specializations',
-  trackingTarget: 'topnav_catalog_career_data_science',
-  text: 'Data Scientist',
-  type: 'link'
-}];
-export const liveLearningHubItems = {
-  title: 'Live Learning',
-  description: 'Build skills faster through live learning with expert instructors.',
-  data: [{
-    id: 'bootcamps',
-    href: '/bootcamps',
-    text: 'Bootcamps',
-    description: 'Learn live from industry experts.',
-    trackingTarget: 'topnav_catalog_live_learning_bootcamps',
-    type: 'link',
-    newTab: true,
-    badge: renderNewBadge()
-  }, {
-    id: 'gk',
-    href: '/live-learning#GKLiveLearning',
-    text: 'Codecademy x GK',
-    description: 'Instructor-led courses, offered via our partner organization.',
-    trackingTarget: 'topnav_catalog_live_learning_gk_codecademy',
-    type: 'link',
-    newTab: true,
-    badge: renderNewBadge()
-  }]
-};
+import { renderNewBadge } from "../resourcesList/index.js";
 
-/* Items for the variant global header. Tracking targets are kept the same for experiment */
-export const liveLearningNavPanelItems = isCoachingEnabled => ({
-  title: 'Live Learning',
-  description: 'Build skills faster through live, instructor-led sessions. Get real-time feedback, stay motivated, and deepen your understanding with expert guidance.',
-  data: [{
-    id: 'bootcamps',
-    href: '/bootcamps',
-    text: 'Bootcamps',
-    description: 'Join live virtual bootcamps that span multiple weeks and help you build real-world, in-demand skills. Led by experts, each bootcamp includes instructor support, community, professional mentorship—and comes with Codecademy Pro access.',
-    trackingTarget: 'topnav_catalog_live_learning_bootcamps',
-    type: 'link',
-    newTab: true,
-    badge: renderNewBadge()
-  }, {
-    id: 'coaching',
-    href: '/coaching',
-    text: isCoachingEnabled ? 'Coaching' : 'Coaching (Coming soon)',
-    description: "Get personalized mentorship from expert coaches to accelerate your career journey. Whether you're preparing for technical interviews, exploring career options, or seeking guidance, 1:1 coaching gives you tailored support to reach your goals.",
-    trackingTarget: 'topnav_catalog_live_learning_coaching',
-    type: 'link',
-    newTab: true,
-    badge: renderNewBadge()
-  }]
+//#region src/lib/catalogList/index.tsx
+const liveLearningHubItems = {
+	title: "Live Learning",
+	description: "Build skills faster through live learning with expert instructors.",
+	data: [{
+		id: "bootcamps",
+		href: "/bootcamps",
+		text: "Bootcamps",
+		description: "Learn live from industry experts.",
+		trackingTarget: "topnav_catalog_live_learning_bootcamps",
+		type: "link",
+		newTab: true,
+		badge: renderNewBadge()
+	}, {
+		id: "gk",
+		href: "/live-learning#GKLiveLearning",
+		text: "Codecademy x GK",
+		description: "Instructor-led courses, offered via our partner organization.",
+		trackingTarget: "topnav_catalog_live_learning_gk_codecademy",
+		type: "link",
+		newTab: true,
+		badge: renderNewBadge()
+	}]
+};
+const liveLearningNavPanelItems = (isCoachingEnabled) => ({
+	title: "Live Learning",
+	description: "Build skills faster through live, instructor-led sessions. Get real-time feedback, stay motivated, and deepen your understanding with expert guidance.",
+	data: [{
+		id: "bootcamps",
+		href: "/bootcamps",
+		text: "Bootcamps",
+		description: "Join live virtual bootcamps that span multiple weeks and help you build real-world, in-demand skills. Led by experts, each bootcamp includes instructor support, community, professional mentorship—and comes with Codecademy Pro access.",
+		trackingTarget: "topnav_catalog_live_learning_bootcamps",
+		type: "link",
+		newTab: true,
+		badge: renderNewBadge()
+	}, {
+		id: "coaching",
+		href: "/coaching",
+		text: isCoachingEnabled ? "Coaching" : "Coaching (Coming soon)",
+		description: "Get personalized mentorship from expert coaches to accelerate your career journey. Whether you're preparing for technical interviews, exploring career options, or seeking guidance, 1:1 coaching gives you tailored support to reach your goals.",
+		trackingTarget: "topnav_catalog_live_learning_coaching",
+		type: "link",
+		newTab: true,
+		badge: renderNewBadge()
+	}]
 });
-export const topLanguages = [{
-  id: 'python',
-  href: '/catalog/language/python',
-  trackingTarget: 'topnav_catalog_skill_python',
-  text: 'Python',
-  type: 'link'
-}, {
-  id: 'javascript',
-  href: '/catalog/language/javascript',
-  trackingTarget: 'topnav_catalog_skill_javascript',
-  text: 'JavaScript',
-  type: 'link'
-}, {
-  id: 'html-css',
-  href: '/catalog/language/html-css',
-  trackingTarget: 'topnav_catalog_skill_html-css',
-  text: 'HTML & CSS',
-  type: 'link'
-}, {
-  id: 'sql',
-  href: '/catalog/language/sql',
-  trackingTarget: 'topnav_catalog_skill_sql',
-  text: 'SQL',
-  type: 'link'
-}, {
-  id: 'java',
-  href: '/catalog/language/java',
-  trackingTarget: 'topnav_catalog_skill_java',
-  text: 'Java',
-  type: 'link'
-}, {
-  id: 'c-plus-plus',
-  href: '/catalog/language/c-plus-plus',
-  trackingTarget: 'topnav_catalog_skill_c-plus-plus',
-  text: 'C++',
-  type: 'link'
-}, {
-  id: 'c-sharp',
-  href: '/catalog/language/c-sharp',
-  trackingTarget: 'topnav_catalog_skill_c-sharp',
-  text: 'C#',
-  type: 'link'
-}, {
-  id: 'c',
-  href: '/catalog/language/c',
-  trackingTarget: 'topnav_catalog_skill_c',
-  text: 'C',
-  type: 'link'
-}, {
-  id: 'php',
-  href: '/catalog/language/php',
-  trackingTarget: 'topnav_catalog_skill_php',
-  text: 'PHP',
-  type: 'link'
-}, {
-  id: 'r',
-  href: '/catalog/language/r',
-  trackingTarget: 'topnav_catalog_skill_r',
-  text: 'R',
-  type: 'link'
-}, {
-  id: 'it',
-  href: '/catalog/subject/information-technology',
-  trackingTarget: 'topnav_catalog_skill_it',
-  text: 'IT',
-  type: 'link'
-}, {
-  id: 'cybersecurity',
-  href: '/catalog/subject/cybersecurity',
-  trackingTarget: 'topnav_catalog_skill_cybersecurity',
-  text: 'Cybersecurity',
-  type: 'link'
-}];
-export const getTopSubjects = () => {
-  return [{
-    id: 'cloud-computing',
-    href: '/catalog/subject/cloud-computing',
-    trackingTarget: 'topnav_catalog_skill_cloud-computing',
-    text: 'Cloud computing',
-    type: 'link'
-  }, {
-    id: 'artificial-intelligence',
-    href: '/catalog/subject/artificial-intelligence',
-    trackingTarget: 'topnav_catalog_skill_ai',
-    text: 'AI',
-    type: 'link'
-  }, {
-    id: 'web-development',
-    href: '/catalog/subject/web-development',
-    trackingTarget: 'topnav_catalog_skill_web_development',
-    text: 'Web development',
-    type: 'link'
-  }, {
-    id: 'data-science',
-    href: '/catalog/subject/data-science',
-    trackingTarget: 'topnav_catalog_skill_data-science',
-    text: 'Data science',
-    type: 'link'
-  }, {
-    id: 'web-design',
-    href: '/catalog/subject/web-design',
-    trackingTarget: 'topnav_catalog_skill_web-design',
-    text: 'Web design',
-    type: 'link'
-  }, {
-    id: 'professional-skills',
-    href: '/catalog/subject/professional-skills',
-    trackingTarget: 'topnav_catalog_skill_professional-skills',
-    text: 'Professional skills',
-    type: 'link'
-  }];
-};
+
+//#endregion
+export { liveLearningNavPanelItems };

package/dist/lib/resourcesList/index.cjs

@@ -0,0 +1,68 @@
+const require_rolldown_runtime = require('../../_virtual/rolldown_runtime.cjs');
+let _codecademy_gamut = require("@codecademy/gamut");
+let react_jsx_runtime = require("react/jsx-runtime");
+
+//#region src/lib/resourcesList/index.tsx
+const renderNewBadge = (mt = 2) => /* @__PURE__ */ (0, react_jsx_runtime.jsx)(_codecademy_gamut.Badge, {
+	size: "sm",
+	mt,
+	ml: 8,
+	alignSelf: "start",
+	variant: "accent",
+	children: "New"
+});
+const footerResourcesList = [
+	{
+		id: "articles",
+		href: "/articles",
+		trackingTarget: "articles",
+		text: "Articles"
+	},
+	{
+		id: "blog",
+		href: "https://codecademy.com/resources/blog",
+		trackingTarget: "blog",
+		text: "Blog",
+		newTab: true
+	},
+	{
+		id: "cheatsheets",
+		href: "/resources/cheatsheets/all",
+		trackingTarget: "cheatsheets_home",
+		text: "Cheatsheets"
+	},
+	{
+		id: "challenges",
+		href: "/code-challenges",
+		trackingTarget: "challenges",
+		text: "Code challenges"
+	},
+	{
+		id: "docs",
+		href: "/resources/docs",
+		trackingTarget: "docs",
+		text: "Docs"
+	},
+	{
+		id: "projects",
+		href: "/projects",
+		trackingTarget: "projects",
+		text: "Projects"
+	},
+	{
+		id: "videos",
+		href: "/resources/videos",
+		trackingTarget: "videos_homepage",
+		text: "Videos"
+	},
+	{
+		id: "workspaces",
+		href: "https://codecademy.com/pages/workspaces",
+		trackingTarget: "workspaces",
+		text: "Workspaces"
+	}
+];
+
+//#endregion
+exports.footerResourcesList = footerResourcesList;
+exports.renderNewBadge = renderNewBadge;