@codecademy/brand 4.0.0-alpha.5afdc7ccfd.0 → 4.0.0-alpha.5be5569ef.0

package/README.md

@@ -33,9 +33,3 @@ Eventually our stories will be colocated with their respective components, but i
 PR previews publish for every pull request - you can find the url in the output within the `Publish Storybook` Github action, under the `Run npx nx run-many --target=publish-storybook --parallel=3` step.
 
 This is temporarily, and the web platform team is diligently working on getting Storybook preview urls in PR comments.
-
-## SCSS Usage (remove this section when SCSS is removed)
-
-SCSS is deprecated across Codecademy, but we still have legacy SCSS that is supported for now.
-
-In this library, SCSS support is limited because of the build tools we are using. You can still use SCSS but you can't reference any asset files (images, icons, etc.) in your SCSS files. You can still import assets into JS files.

package/dist/AbbreviatedCommunityEventCard/index.d.ts

@@ -1,12 +1,8 @@
-//#region src/AbbreviatedCommunityEventCard/index.d.ts
-interface AbbreviatedEventCardProps {
-  title: string;
-  startDate: string;
-  endDate: string;
-  url: string;
-  type?: string | null;
+export interface AbbreviatedEventCardProps {
+    title: string;
+    startDate: string;
+    endDate: string;
+    url: string;
+    type?: string | null;
 }
-declare const AbbreviatedEventCard: React.FC<AbbreviatedEventCardProps>;
-//#endregion
-export { AbbreviatedEventCard, AbbreviatedEventCardProps };
-//# sourceMappingURL=index.d.ts.map
+export declare const AbbreviatedEventCard: React.FC<AbbreviatedEventCardProps>;

package/dist/AbbreviatedCommunityEventCard/index.js

@@ -1,71 +1,98 @@
-import { EventTypeIcon } from "../CommunityEventCard/EventTypeIcon.js";
-import { formatTime } from "../CommunityEventCard/index.js";
-import { Anchor, Box, Card, FlexBox, Text } from "@codecademy/gamut";
-import styled from "@emotion/styled";
-import { ArrowChevronRightIcon, ClockIcon } from "@codecademy/gamut-icons";
-import { format, parseJSON } from "date-fns";
-import upperCase from "lodash/upperCase";
-
-//#region src/AbbreviatedCommunityEventCard/index.tsx
-const AbbreviatedEventCard = ({ title, startDate, endDate, url, type }) => {
-	const StyledLink = /* @__PURE__ */ styled(Anchor, {
-		target: "eh4ud0f0",
-		label: "brand-StyledLink"
-	})("text-decoration:none;&:focus{text-decoration:none;}", "/*# sourceMappingURL=data:application/json;charset=utf-8;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoiL2hvbWUvcnVubmVyL3dvcmsvbW9uby9tb25vL2xpYnMvdWkvYnJhbmQvc3JjL0FiYnJldmlhdGVkQ29tbXVuaXR5RXZlbnRDYXJkL2luZGV4LnRzeCIsInNvdXJjZXMiOlsiL2hvbWUvcnVubmVyL3dvcmsvbW9uby9tb25vL2xpYnMvdWkvYnJhbmQvc3JjL0FiYnJldmlhdGVkQ29tbXVuaXR5RXZlbnRDYXJkL2luZGV4LnRzeCJdLCJzb3VyY2VzQ29udGVudCI6WyJpbXBvcnQgeyBBbmNob3IsIEJveCwgQ2FyZCwgRmxleEJveCwgVGV4dCB9IGZyb20gJ0Bjb2RlY2FkZW15L2dhbXV0JztcbmltcG9ydCB7IEFycm93Q2hldnJvblJpZ2h0SWNvbiwgQ2xvY2tJY29uIH0gZnJvbSAnQGNvZGVjYWRlbXkvZ2FtdXQtaWNvbnMnO1xuaW1wb3J0IHN0eWxlZCBmcm9tICdAZW1vdGlvbi9zdHlsZWQnO1xuaW1wb3J0IHsgZm9ybWF0LCBwYXJzZUpTT04gfSBmcm9tICdkYXRlLWZucyc7XG5pbXBvcnQgdXBwZXJDYXNlIGZyb20gJ2xvZGFzaC91cHBlckNhc2UnO1xuXG5pbXBvcnQgeyBmb3JtYXRUaW1lIH0gZnJvbSAnLi4vQ29tbXVuaXR5RXZlbnRDYXJkJztcbmltcG9ydCB7IEV2ZW50VHlwZUljb24gfSBmcm9tICcuLi9Db21tdW5pdHlFdmVudENhcmQvRXZlbnRUeXBlSWNvbic7XG5cbmV4cG9ydCBpbnRlcmZhY2UgQWJicmV2aWF0ZWRFdmVudENhcmRQcm9wcyB7XG4gIHRpdGxlOiBzdHJpbmc7XG4gIHN0YXJ0RGF0ZTogc3RyaW5nO1xuICBlbmREYXRlOiBzdHJpbmc7XG4gIHVybDogc3RyaW5nO1xuICB0eXBlPzogc3RyaW5nIHwgbnVsbDtcbn1cblxuZXhwb3J0IGNvbnN0IEFiYnJldmlhdGVkRXZlbnRDYXJkOiBSZWFjdC5GQzxBYmJyZXZpYXRlZEV2ZW50Q2FyZFByb3BzPiA9ICh7XG4gIHRpdGxlLFxuICBzdGFydERhdGUsXG4gIGVuZERhdGUsXG4gIHVybCxcbiAgdHlwZSxcbn0pID0+IHtcbiAgY29uc3QgU3R5bGVkTGluayA9IHN0eWxlZChBbmNob3IpYFxuICAgIHRleHQtZGVjb3JhdGlvbjogbm9uZTtcbiAgICAmOmZvY3VzIHtcbiAgICAgIHRleHQtZGVjb3JhdGlvbjogbm9uZTtcbiAgICB9XG4gIGA7XG5cbiAgcmV0dXJuIChcbiAgICA8U3R5bGVkTGluayBocmVmPXt1cmx9IHRhcmdldD1cIl9ibGFua1wiPlxuICAgICAgPENhcmQgaXNJbnRlcmFjdGl2ZT5cbiAgICAgICAgPEZsZXhCb3ggZ2FwPXsxNn0gaGVpZ2h0PVwiMTAwJVwiPlxuICAgICAgICAgIDxCb3hcbiAgICAgICAgICAgIGFsaWduQ29udGVudD1cImNlbnRlclwiXG4gICAgICAgICAgICBiZz1cIm5hdnlcIlxuICAgICAgICAgICAgYm9yZGVyUmFkaXVzPVwibWRcIlxuICAgICAgICAgICAgY29sb3I9XCJ3aGl0ZVwiXG4gICAgICAgICAgICBoZWlnaHQ9ezgwfVxuICAgICAgICAgICAganVzdGlmeUNvbnRlbnQ9XCJjZW50ZXJcIlxuICAgICAgICAgICAgcHg9ezEyfVxuICAgICAgICAgICAgd2lkdGg9ezgwfVxuICAgICAgICAgID5cbiAgICAgICAgICAgIDxUZXh0IGZvbnRGYW1pbHk9XCJhY2NlbnRcIiBmb250U2l6ZT17MjZ9IGxpbmVIZWlnaHQ9XCJub3JtYWxcIj5cbiAgICAgICAgICAgICAge3VwcGVyQ2FzZShmb3JtYXQocGFyc2VKU09OKHN0YXJ0RGF0ZSksICdMTEwgZGQnKSl9XG4gICAgICAgICAgICA8L1RleHQ+XG4gICAgICAgICAgPC9Cb3g+XG4gICAgICAgICAgPEZsZXhCb3hcbiAgICAgICAgICAgIGFsaWduSXRlbXM9XCJjZW50ZXJcIlxuICAgICAgICAgICAgZ2FwPXsxNn1cbiAgICAgICAgICAgIGp1c3RpZnlDb250ZW50PVwic3BhY2UtYmV0d2VlblwiXG4gICAgICAgICAgICBtaW5XaWR0aD17MH1cbiAgICAgICAgICAgIHdpZHRoPVwiMTAwJVwiXG4gICAgICAgICAgPlxuICAgICAgICAgICAgPEZsZXhCb3ggZmxleERpcmVjdGlvbj1cImNvbHVtblwiIGdhcD17OH0gbWluV2lkdGg9ezB9IHdpZHRoPVwiMTAwJVwiPlxuICAgICAgICAgICAgICA8VGV4dCBhcz1cImgzXCIgZm9udFNpemU9ezIyfSB0cnVuY2F0ZT1cImVsbGlwc2lzXCIgdHJ1bmNhdGVMaW5lcz17MX0+XG4gICAgICAgICAgICAgICAge3RpdGxlfVxuICAgICAgICAgICAgICA8L1RleHQ+XG4gICAgICAgICAgICAgIDxGbGV4Qm94IGFsaWduSXRlbXM9XCJjZW50ZXJcIiBqdXN0aWZ5Q29udGVudD1cInNwYWNlLWJldHdlZW5cIj5cbiAgICAgICAgICAgICAgICA8RmxleEJveCBhbGlnbkl0ZW1zPVwiY2VudGVyXCIgZ2FwPXs4fSBtaW5XaWR0aD17MH0+XG4gICAgICAgICAgICAgICAgICA8Q2xvY2tJY29uIC8+XG4gICAgICAgICAgICAgICAgICA8VGV4dFxuICAgICAgICAgICAgICAgICAgICBmb250RmFtaWx5PVwiYWNjZW50XCJcbiAgICAgICAgICAgICAgICAgICAgZm9udFNpemU9ezE0fVxuICAgICAgICAgICAgICAgICAgICB0cnVuY2F0ZT1cImVsbGlwc2lzXCJcbiAgICAgICAgICAgICAgICAgICAgdHJ1bmNhdGVMaW5lcz17MX1cbiAgICAgICAgICAgICAgICAgID5cbiAgICAgICAgICAgICAgICAgICAge2Zvcm1hdFRpbWUoc3RhcnREYXRlLCBlbmREYXRlKX1cbiAgICAgICAgICAgICAgICAgIDwvVGV4dD5cbiAgICAgICAgICAgICAgICA8L0ZsZXhCb3g+XG4gICAgICAgICAgICAgICAge3R5cGUgJiYgKFxuICAgICAgICAgICAgICAgICAgPEZsZXhCb3ggYWxpZ25JdGVtcz1cImNlbnRlclwiIGdhcD17OH0gbWluV2lkdGg9ezB9PlxuICAgICAgICAgICAgICAgICAgICA8RXZlbnRUeXBlSWNvbiBldmVudFR5cGU9e3R5cGV9IC8+XG4gICAgICAgICAgICAgICAgICA8L0ZsZXhCb3g+XG4gICAgICAgICAgICAgICAgKX1cbiAgICAgICAgICAgICAgPC9GbGV4Qm94PlxuICAgICAgICAgICAgPC9GbGV4Qm94PlxuICAgICAgICAgICAgPEFycm93Q2hldnJvblJpZ2h0SWNvbiBzaXplPXsyNH0gLz5cbiAgICAgICAgICA8L0ZsZXhCb3g+XG4gICAgICAgIDwvRmxleEJveD5cbiAgICAgIDwvQ2FyZD5cbiAgICA8L1N0eWxlZExpbms+XG4gICk7XG59O1xuIl0sIm5hbWVzIjpbXSwibWFwcGluZ3MiOiJBQXdCcUIifQ== */");
-	return /* @__PURE__ */ React.createElement(StyledLink, {
-		href: url,
-		target: "_blank"
-	}, /* @__PURE__ */ React.createElement(Card, { isInteractive: true }, /* @__PURE__ */ React.createElement(FlexBox, {
-		gap: 16,
-		height: "100%"
-	}, /* @__PURE__ */ React.createElement(Box, {
-		alignContent: "center",
-		bg: "navy",
-		borderRadius: "md",
-		color: "white",
-		height: 80,
-		justifyContent: "center",
-		px: 12,
-		width: 80
-	}, /* @__PURE__ */ React.createElement(Text, {
-		fontFamily: "accent",
-		fontSize: 26,
-		lineHeight: "normal"
-	}, upperCase(format(parseJSON(startDate), "LLL dd")))), /* @__PURE__ */ React.createElement(FlexBox, {
-		alignItems: "center",
-		gap: 16,
-		justifyContent: "space-between",
-		minWidth: 0,
-		width: "100%"
-	}, /* @__PURE__ */ React.createElement(FlexBox, {
-		flexDirection: "column",
-		gap: 8,
-		minWidth: 0,
-		width: "100%"
-	}, /* @__PURE__ */ React.createElement(Text, {
-		as: "h3",
-		fontSize: 22,
-		truncate: "ellipsis",
-		truncateLines: 1
-	}, title), /* @__PURE__ */ React.createElement(FlexBox, {
-		alignItems: "center",
-		justifyContent: "space-between"
-	}, /* @__PURE__ */ React.createElement(FlexBox, {
-		alignItems: "center",
-		gap: 8,
-		minWidth: 0
-	}, /* @__PURE__ */ React.createElement(ClockIcon, null), /* @__PURE__ */ React.createElement(Text, {
-		fontFamily: "accent",
-		fontSize: 14,
-		truncate: "ellipsis",
-		truncateLines: 1
-	}, formatTime(startDate, endDate))), type && /* @__PURE__ */ React.createElement(FlexBox, {
-		alignItems: "center",
-		gap: 8,
-		minWidth: 0
-	}, /* @__PURE__ */ React.createElement(EventTypeIcon, { eventType: type })))), /* @__PURE__ */ React.createElement(ArrowChevronRightIcon, { size: 24 })))));
-};
-
-//#endregion
-export { AbbreviatedEventCard };
-//# sourceMappingURL=index.js.map
+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, Box, Card, FlexBox, Text } from '@codecademy/gamut';
+import { ArrowChevronRightIcon, ClockIcon } from '@codecademy/gamut-icons';
+import { format, parseJSON } from 'date-fns';
+import upperCase from 'lodash/upperCase';
+import { formatTime } from '../CommunityEventCard';
+import { EventTypeIcon } from '../CommunityEventCard/EventTypeIcon';
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+export const AbbreviatedEventCard = ({
+  title,
+  startDate,
+  endDate,
+  url,
+  type
+}) => {
+  const StyledLink = /*#__PURE__*/_styled(Anchor, {
+    target: "e7686yp0",
+    label: "StyledLink"
+  })(process.env.NODE_ENV === "production" ? {
+    name: "1cp29tz",
+    styles: "text-decoration:none;&:focus{text-decoration:none;}"
+  } : {
+    name: "1cp29tz",
+    styles: "text-decoration:none;&:focus{text-decoration:none;}/*# sourceMappingURL=data:application/json;charset=utf-8;base64,eyJ2ZXJzaW9uIjozLCJzb3VyY2VzIjpbIi4uLy4uL3NyYy9BYmJyZXZpYXRlZENvbW11bml0eUV2ZW50Q2FyZC9pbmRleC50c3giXSwibmFtZXMiOltdLCJtYXBwaW5ncyI6IkFBd0JtQyIsImZpbGUiOiIuLi8uLi9zcmMvQWJicmV2aWF0ZWRDb21tdW5pdHlFdmVudENhcmQvaW5kZXgudHN4Iiwic291cmNlc0NvbnRlbnQiOlsiaW1wb3J0IHsgQW5jaG9yLCBCb3gsIENhcmQsIEZsZXhCb3gsIFRleHQgfSBmcm9tICdAY29kZWNhZGVteS9nYW11dCc7XG5pbXBvcnQgeyBBcnJvd0NoZXZyb25SaWdodEljb24sIENsb2NrSWNvbiB9IGZyb20gJ0Bjb2RlY2FkZW15L2dhbXV0LWljb25zJztcbmltcG9ydCBzdHlsZWQgZnJvbSAnQGVtb3Rpb24vc3R5bGVkJztcbmltcG9ydCB7IGZvcm1hdCwgcGFyc2VKU09OIH0gZnJvbSAnZGF0ZS1mbnMnO1xuaW1wb3J0IHVwcGVyQ2FzZSBmcm9tICdsb2Rhc2gvdXBwZXJDYXNlJztcblxuaW1wb3J0IHsgZm9ybWF0VGltZSB9IGZyb20gJy4uL0NvbW11bml0eUV2ZW50Q2FyZCc7XG5pbXBvcnQgeyBFdmVudFR5cGVJY29uIH0gZnJvbSAnLi4vQ29tbXVuaXR5RXZlbnRDYXJkL0V2ZW50VHlwZUljb24nO1xuXG5leHBvcnQgaW50ZXJmYWNlIEFiYnJldmlhdGVkRXZlbnRDYXJkUHJvcHMge1xuICB0aXRsZTogc3RyaW5nO1xuICBzdGFydERhdGU6IHN0cmluZztcbiAgZW5kRGF0ZTogc3RyaW5nO1xuICB1cmw6IHN0cmluZztcbiAgdHlwZT86IHN0cmluZyB8IG51bGw7XG59XG5cbmV4cG9ydCBjb25zdCBBYmJyZXZpYXRlZEV2ZW50Q2FyZDogUmVhY3QuRkM8QWJicmV2aWF0ZWRFdmVudENhcmRQcm9wcz4gPSAoe1xuICB0aXRsZSxcbiAgc3RhcnREYXRlLFxuICBlbmREYXRlLFxuICB1cmwsXG4gIHR5cGUsXG59KSA9PiB7XG4gIGNvbnN0IFN0eWxlZExpbmsgPSBzdHlsZWQoQW5jaG9yKWBcbiAgICB0ZXh0LWRlY29yYXRpb246IG5vbmU7XG4gICAgJjpmb2N1cyB7XG4gICAgICB0ZXh0LWRlY29yYXRpb246IG5vbmU7XG4gICAgfVxuICBgO1xuXG4gIHJldHVybiAoXG4gICAgPFN0eWxlZExpbmsgaHJlZj17dXJsfSB0YXJnZXQ9XCJfYmxhbmtcIj5cbiAgICAgIDxDYXJkIGlzSW50ZXJhY3RpdmU+XG4gICAgICAgIDxGbGV4Qm94IGdhcD17MTZ9IGhlaWdodD1cIjEwMCVcIj5cbiAgICAgICAgICA8Qm94XG4gICAgICAgICAgICBhbGlnbkNvbnRlbnQ9XCJjZW50ZXJcIlxuICAgICAgICAgICAgYmc9XCJuYXZ5XCJcbiAgICAgICAgICAgIGJvcmRlclJhZGl1cz1cIm1kXCJcbiAgICAgICAgICAgIGNvbG9yPVwid2hpdGVcIlxuICAgICAgICAgICAgaGVpZ2h0PXs4MH1cbiAgICAgICAgICAgIGp1c3RpZnlDb250ZW50PVwiY2VudGVyXCJcbiAgICAgICAgICAgIHB4PXsxMn1cbiAgICAgICAgICAgIHdpZHRoPXs4MH1cbiAgICAgICAgICA+XG4gICAgICAgICAgICA8VGV4dCBmb250RmFtaWx5PVwiYWNjZW50XCIgZm9udFNpemU9ezI2fSBsaW5lSGVpZ2h0PVwibm9ybWFsXCI+XG4gICAgICAgICAgICAgIHt1cHBlckNhc2UoZm9ybWF0KHBhcnNlSlNPTihzdGFydERhdGUpLCAnTExMIGRkJykpfVxuICAgICAgICAgICAgPC9UZXh0PlxuICAgICAgICAgIDwvQm94PlxuICAgICAgICAgIDxGbGV4Qm94XG4gICAgICAgICAgICBhbGlnbkl0ZW1zPVwiY2VudGVyXCJcbiAgICAgICAgICAgIGdhcD17MTZ9XG4gICAgICAgICAgICBqdXN0aWZ5Q29udGVudD1cInNwYWNlLWJldHdlZW5cIlxuICAgICAgICAgICAgbWluV2lkdGg9ezB9XG4gICAgICAgICAgICB3aWR0aD1cIjEwMCVcIlxuICAgICAgICAgID5cbiAgICAgICAgICAgIDxGbGV4Qm94IGZsZXhEaXJlY3Rpb249XCJjb2x1bW5cIiBnYXA9ezh9IG1pbldpZHRoPXswfSB3aWR0aD1cIjEwMCVcIj5cbiAgICAgICAgICAgICAgPFRleHQgYXM9XCJoM1wiIGZvbnRTaXplPXsyMn0gdHJ1bmNhdGU9XCJlbGxpcHNpc1wiIHRydW5jYXRlTGluZXM9ezF9PlxuICAgICAgICAgICAgICAgIHt0aXRsZX1cbiAgICAgICAgICAgICAgPC9UZXh0PlxuICAgICAgICAgICAgICA8RmxleEJveCBhbGlnbkl0ZW1zPVwiY2VudGVyXCIganVzdGlmeUNvbnRlbnQ9XCJzcGFjZS1iZXR3ZWVuXCI+XG4gICAgICAgICAgICAgICAgPEZsZXhCb3ggYWxpZ25JdGVtcz1cImNlbnRlclwiIGdhcD17OH0gbWluV2lkdGg9ezB9PlxuICAgICAgICAgICAgICAgICAgPENsb2NrSWNvbiAvPlxuICAgICAgICAgICAgICAgICAgPFRleHRcbiAgICAgICAgICAgICAgICAgICAgZm9udEZhbWlseT1cImFjY2VudFwiXG4gICAgICAgICAgICAgICAgICAgIGZvbnRTaXplPXsxNH1cbiAgICAgICAgICAgICAgICAgICAgdHJ1bmNhdGU9XCJlbGxpcHNpc1wiXG4gICAgICAgICAgICAgICAgICAgIHRydW5jYXRlTGluZXM9ezF9XG4gICAgICAgICAgICAgICAgICA+XG4gICAgICAgICAgICAgICAgICAgIHtmb3JtYXRUaW1lKHN0YXJ0RGF0ZSwgZW5kRGF0ZSl9XG4gICAgICAgICAgICAgICAgICA8L1RleHQ+XG4gICAgICAgICAgICAgICAgPC9GbGV4Qm94PlxuICAgICAgICAgICAgICAgIHt0eXBlICYmIChcbiAgICAgICAgICAgICAgICAgIDxGbGV4Qm94IGFsaWduSXRlbXM9XCJjZW50ZXJcIiBnYXA9ezh9IG1pbldpZHRoPXswfT5cbiAgICAgICAgICAgICAgICAgICAgPEV2ZW50VHlwZUljb24gZXZlbnRUeXBlPXt0eXBlfSAvPlxuICAgICAgICAgICAgICAgICAgPC9GbGV4Qm94PlxuICAgICAgICAgICAgICAgICl9XG4gICAgICAgICAgICAgIDwvRmxleEJveD5cbiAgICAgICAgICAgIDwvRmxleEJveD5cbiAgICAgICAgICAgIDxBcnJvd0NoZXZyb25SaWdodEljb24gc2l6ZT17MjR9IC8+XG4gICAgICAgICAgPC9GbGV4Qm94PlxuICAgICAgICA8L0ZsZXhCb3g+XG4gICAgICA8L0NhcmQ+XG4gICAgPC9TdHlsZWRMaW5rPlxuICApO1xufTtcbiJdfQ== */",
+    toString: _EMOTION_STRINGIFIED_CSS_ERROR__
+  });
+  return /*#__PURE__*/_jsx(StyledLink, {
+    href: url,
+    target: "_blank",
+    children: /*#__PURE__*/_jsx(Card, {
+      isInteractive: true,
+      children: /*#__PURE__*/_jsxs(FlexBox, {
+        gap: 16,
+        height: "100%",
+        children: [/*#__PURE__*/_jsx(Box, {
+          alignContent: "center",
+          bg: "navy",
+          borderRadius: "md",
+          color: "white",
+          height: 80,
+          justifyContent: "center",
+          px: 12,
+          width: 80,
+          children: /*#__PURE__*/_jsx(Text, {
+            fontFamily: "accent",
+            fontSize: 26,
+            lineHeight: "normal",
+            children: upperCase(format(parseJSON(startDate), 'LLL dd'))
+          })
+        }), /*#__PURE__*/_jsxs(FlexBox, {
+          alignItems: "center",
+          gap: 16,
+          justifyContent: "space-between",
+          minWidth: 0,
+          width: "100%",
+          children: [/*#__PURE__*/_jsxs(FlexBox, {
+            flexDirection: "column",
+            gap: 8,
+            minWidth: 0,
+            width: "100%",
+            children: [/*#__PURE__*/_jsx(Text, {
+              as: "h3",
+              fontSize: 22,
+              truncate: "ellipsis",
+              truncateLines: 1,
+              children: title
+            }), /*#__PURE__*/_jsxs(FlexBox, {
+              alignItems: "center",
+              justifyContent: "space-between",
+              children: [/*#__PURE__*/_jsxs(FlexBox, {
+                alignItems: "center",
+                gap: 8,
+                minWidth: 0,
+                children: [/*#__PURE__*/_jsx(ClockIcon, {}), /*#__PURE__*/_jsx(Text, {
+                  fontFamily: "accent",
+                  fontSize: 14,
+                  truncate: "ellipsis",
+                  truncateLines: 1,
+                  children: formatTime(startDate, endDate)
+                })]
+              }), type && /*#__PURE__*/_jsx(FlexBox, {
+                alignItems: "center",
+                gap: 8,
+                minWidth: 0,
+                children: /*#__PURE__*/_jsx(EventTypeIcon, {
+                  eventType: type
+                })
+              })]
+            })]
+          }), /*#__PURE__*/_jsx(ArrowChevronRightIcon, {
+            size: 24
+          })]
+        })]
+      })
+    })
+  });
+};

package/dist/AppBar/AppBarSection.d.ts

@@ -1,16 +1,10 @@
-import { WithChildrenProp } from "@codecademy/gamut";
-import * as React$1 from "react";
-import * as _codecademy_variance0 from "@codecademy/variance";
-import { StyleProps } from "@codecademy/variance";
-import * as _emotion_react0 from "@emotion/react";
-import * as _codecademy_variance_dist_types_config0 from "@codecademy/variance/dist/types/config";
-
-//#region src/AppBar/AppBarSection.d.ts
-declare const positionVariants: (props: _codecademy_variance_dist_types_config0.VariantProps<"position", false | "center" | "right" | "left"> & {
-  theme?: _emotion_react0.Theme;
-}) => _codecademy_variance0.CSSObject;
-interface AppBarSectionProps extends StyleProps<typeof positionVariants>, WithChildrenProp {}
-declare const AppBarSection: React$1.FC<AppBarSectionProps>;
-//#endregion
-export { AppBarSection, AppBarSectionProps };
-//# sourceMappingURL=AppBarSection.d.ts.map
+import { WithChildrenProp } from '@codecademy/gamut';
+import { StyleProps } from '@codecademy/variance';
+import * as React from 'react';
+declare const positionVariants: (props: import("@codecademy/variance/dist/types/config").VariantProps<"position", false | "right" | "left" | "center"> & {
+    theme?: import("@emotion/react").Theme;
+}) => import("@codecademy/variance").CSSObject;
+export interface AppBarSectionProps extends StyleProps<typeof positionVariants>, WithChildrenProp {
+}
+export declare const AppBarSection: React.FC<AppBarSectionProps>;
+export {};

package/dist/AppBar/AppBarSection.js

@@ -1,37 +1,41 @@
-import { styledOptions, variant } from "@codecademy/gamut-styles";
-import styled from "@emotion/styled";
-import * as React$1 from "react";
-
-//#region src/AppBar/AppBarSection.tsx
+import _styled from "@emotion/styled/base";
+function _extends() { return _extends = Object.assign ? Object.assign.bind() : function (n) { for (var e = 1; e < arguments.length; e++) { var t = arguments[e]; for (var r in t) ({}).hasOwnProperty.call(t, r) && (n[r] = t[r]); } return n; }, _extends.apply(null, arguments); }
+import { styledOptions, variant } from '@codecademy/gamut-styles';
+import * as React from 'react';
+import { jsx as _jsx } from "react/jsx-runtime";
 const positionVariants = variant({
-	prop: "position",
-	base: {
-		display: "flex",
-		alignItems: "center",
-		height: "100%",
-		zIndex: 1
-	},
-	variants: {
-		left: { flex: 1 },
-		right: {
-			flex: 1,
-			justifyContent: "flex-end"
-		},
-		center: {
-			flex: 2,
-			justifyContent: "center",
-			textAlign: "center"
-		}
-	}
+  prop: 'position',
+  base: {
+    display: 'flex',
+    alignItems: 'center',
+    height: '100%',
+    zIndex: 1
+  },
+  variants: {
+    left: {
+      flex: 1
+    },
+    right: {
+      flex: 1,
+      justifyContent: 'flex-end'
+    },
+    center: {
+      flex: 2,
+      justifyContent: 'center',
+      textAlign: 'center'
+    }
+  }
 });
-const StyledSection = /* @__PURE__ */ styled("div", styledOptions, {
-	target: "eq885yn0",
-	label: "brand-StyledSection"
-})(positionVariants, "/*# sourceMappingURL=data:application/json;charset=utf-8;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoiL2hvbWUvcnVubmVyL3dvcmsvbW9uby9tb25vL2xpYnMvdWkvYnJhbmQvc3JjL0FwcEJhci9BcHBCYXJTZWN0aW9uLnRzeCIsInNvdXJjZXMiOlsiL2hvbWUvcnVubmVyL3dvcmsvbW9uby9tb25vL2xpYnMvdWkvYnJhbmQvc3JjL0FwcEJhci9BcHBCYXJTZWN0aW9uLnRzeCJdLCJzb3VyY2VzQ29udGVudCI6WyJpbXBvcnQgeyBXaXRoQ2hpbGRyZW5Qcm9wIH0gZnJvbSAnQGNvZGVjYWRlbXkvZ2FtdXQnO1xuaW1wb3J0IHsgc3R5bGVkT3B0aW9ucywgdmFyaWFudCB9IGZyb20gJ0Bjb2RlY2FkZW15L2dhbXV0LXN0eWxlcyc7XG5pbXBvcnQgeyBTdHlsZVByb3BzIH0gZnJvbSAnQGNvZGVjYWRlbXkvdmFyaWFuY2UnO1xuaW1wb3J0IHN0eWxlZCBmcm9tICdAZW1vdGlvbi9zdHlsZWQnO1xuaW1wb3J0ICogYXMgUmVhY3QgZnJvbSAncmVhY3QnO1xuXG5jb25zdCBwb3NpdGlvblZhcmlhbnRzID0gdmFyaWFudCh7XG4gIHByb3A6ICdwb3NpdGlvbicsXG4gIGJhc2U6IHtcbiAgICBkaXNwbGF5OiAnZmxleCcsXG4gICAgYWxpZ25JdGVtczogJ2NlbnRlcicsXG4gICAgaGVpZ2h0OiAnMTAwJScsXG4gICAgekluZGV4OiAxLFxuICB9LFxuICB2YXJpYW50czoge1xuICAgIGxlZnQ6IHtcbiAgICAgIGZsZXg6IDEsXG4gICAgfSxcbiAgICByaWdodDoge1xuICAgICAgZmxleDogMSxcbiAgICAgIGp1c3RpZnlDb250ZW50OiAnZmxleC1lbmQnLFxuICAgIH0sXG4gICAgY2VudGVyOiB7XG4gICAgICBmbGV4OiAyLFxuICAgICAganVzdGlmeUNvbnRlbnQ6ICdjZW50ZXInLFxuICAgICAgdGV4dEFsaWduOiAnY2VudGVyJyxcbiAgICB9LFxuICB9LFxufSk7XG5cbmV4cG9ydCBpbnRlcmZhY2UgQXBwQmFyU2VjdGlvblByb3BzXG4gIGV4dGVuZHMgU3R5bGVQcm9wczx0eXBlb2YgcG9zaXRpb25WYXJpYW50cz4sXG4gICAgV2l0aENoaWxkcmVuUHJvcCB7fVxuXG5jb25zdCBTdHlsZWRTZWN0aW9uID0gc3R5bGVkKFxuICAnZGl2JyxcbiAgc3R5bGVkT3B0aW9uc1xuKTxBcHBCYXJTZWN0aW9uUHJvcHM+KHBvc2l0aW9uVmFyaWFudHMpO1xuXG5leHBvcnQgY29uc3QgQXBwQmFyU2VjdGlvbjogUmVhY3QuRkM8QXBwQmFyU2VjdGlvblByb3BzPiA9ICh7XG4gIHBvc2l0aW9uLFxuICBjaGlsZHJlbixcbn0pID0+IHtcbiAgcmV0dXJuIDxTdHlsZWRTZWN0aW9uIHBvc2l0aW9uPXtwb3NpdGlvbn0+e2NoaWxkcmVufTwvU3R5bGVkU2VjdGlvbj47XG59O1xuIl0sIm5hbWVzIjpbXSwibWFwcGluZ3MiOiJBQWtDc0IifQ== */");
-const AppBarSection = ({ position, children }) => {
-	return /* @__PURE__ */ React$1.createElement(StyledSection, { position }, children);
-};
-
-//#endregion
-export { AppBarSection };
-//# sourceMappingURL=AppBarSection.js.map
+const StyledSection = /*#__PURE__*/_styled('div', _extends({}, {
+  target: "eszklt40",
+  label: "StyledSection"
+}, styledOptions))(positionVariants, process.env.NODE_ENV === "production" ? "" : "/*# sourceMappingURL=data:application/json;charset=utf-8;base64,eyJ2ZXJzaW9uIjozLCJzb3VyY2VzIjpbIi4uLy4uL3NyYy9BcHBCYXIvQXBwQmFyU2VjdGlvbi50c3giXSwibmFtZXMiOltdLCJtYXBwaW5ncyI6IkFBa0NzQiIsImZpbGUiOiIuLi8uLi9zcmMvQXBwQmFyL0FwcEJhclNlY3Rpb24udHN4Iiwic291cmNlc0NvbnRlbnQiOlsiaW1wb3J0IHsgV2l0aENoaWxkcmVuUHJvcCB9IGZyb20gJ0Bjb2RlY2FkZW15L2dhbXV0JztcbmltcG9ydCB7IHN0eWxlZE9wdGlvbnMsIHZhcmlhbnQgfSBmcm9tICdAY29kZWNhZGVteS9nYW11dC1zdHlsZXMnO1xuaW1wb3J0IHsgU3R5bGVQcm9wcyB9IGZyb20gJ0Bjb2RlY2FkZW15L3ZhcmlhbmNlJztcbmltcG9ydCBzdHlsZWQgZnJvbSAnQGVtb3Rpb24vc3R5bGVkJztcbmltcG9ydCAqIGFzIFJlYWN0IGZyb20gJ3JlYWN0JztcblxuY29uc3QgcG9zaXRpb25WYXJpYW50cyA9IHZhcmlhbnQoe1xuICBwcm9wOiAncG9zaXRpb24nLFxuICBiYXNlOiB7XG4gICAgZGlzcGxheTogJ2ZsZXgnLFxuICAgIGFsaWduSXRlbXM6ICdjZW50ZXInLFxuICAgIGhlaWdodDogJzEwMCUnLFxuICAgIHpJbmRleDogMSxcbiAgfSxcbiAgdmFyaWFudHM6IHtcbiAgICBsZWZ0OiB7XG4gICAgICBmbGV4OiAxLFxuICAgIH0sXG4gICAgcmlnaHQ6IHtcbiAgICAgIGZsZXg6IDEsXG4gICAgICBqdXN0aWZ5Q29udGVudDogJ2ZsZXgtZW5kJyxcbiAgICB9LFxuICAgIGNlbnRlcjoge1xuICAgICAgZmxleDogMixcbiAgICAgIGp1c3RpZnlDb250ZW50OiAnY2VudGVyJyxcbiAgICAgIHRleHRBbGlnbjogJ2NlbnRlcicsXG4gICAgfSxcbiAgfSxcbn0pO1xuXG5leHBvcnQgaW50ZXJmYWNlIEFwcEJhclNlY3Rpb25Qcm9wc1xuICBleHRlbmRzIFN0eWxlUHJvcHM8dHlwZW9mIHBvc2l0aW9uVmFyaWFudHM+LFxuICAgIFdpdGhDaGlsZHJlblByb3Age31cblxuY29uc3QgU3R5bGVkU2VjdGlvbiA9IHN0eWxlZChcbiAgJ2RpdicsXG4gIHN0eWxlZE9wdGlvbnNcbik8QXBwQmFyU2VjdGlvblByb3BzPihwb3NpdGlvblZhcmlhbnRzKTtcblxuZXhwb3J0IGNvbnN0IEFwcEJhclNlY3Rpb246IFJlYWN0LkZDPEFwcEJhclNlY3Rpb25Qcm9wcz4gPSAoe1xuICBwb3NpdGlvbixcbiAgY2hpbGRyZW4sXG59KSA9PiB7XG4gIHJldHVybiA8U3R5bGVkU2VjdGlvbiBwb3NpdGlvbj17cG9zaXRpb259PntjaGlsZHJlbn08L1N0eWxlZFNlY3Rpb24+O1xufTtcbiJdfQ== */");
+export const AppBarSection = ({
+  position,
+  children
+}) => {
+  return /*#__PURE__*/_jsx(StyledSection, {
+    position: position,
+    children: children
+  });
+};

package/dist/AppBar/index.d.ts

@@ -1,14 +1,9 @@
-import { ContentContainer, WithChildrenProp } from "@codecademy/gamut";
-import * as React$1 from "react";
-
-//#region src/AppBar/index.d.ts
-interface AppBarProps extends WithChildrenProp, Pick<React$1.ComponentProps<typeof ContentContainer>, 'aria-label' | 'as'> {
-  /**
-   * Whether the container should be larger than the default content size.
-   */
-  wide?: boolean;
+import { ContentContainer, WithChildrenProp } from '@codecademy/gamut';
+import * as React from 'react';
+export interface AppBarProps extends WithChildrenProp, Pick<React.ComponentProps<typeof ContentContainer>, 'aria-label' | 'as'> {
+    /**
+     * Whether the container should be larger than the default content size.
+     */
+    wide?: boolean;
 }
-declare const AppBar: React$1.FC<AppBarProps>;
-//#endregion
-export { AppBar, AppBarProps };
-//# sourceMappingURL=index.d.ts.map
+export declare const AppBar: React.FC<AppBarProps>;

package/dist/AppBar/index.js

@@ -1,19 +1,20 @@
-import { ContentContainer } from "@codecademy/gamut";
-import * as React$1 from "react";
-
-//#region src/AppBar/index.tsx
-const AppBar = ({ "aria-label": ariaLabel, as, wide, children }) => {
-	return /* @__PURE__ */ React$1.createElement(ContentContainer, {
-		"aria-label": ariaLabel,
-		as,
-		display: "flex",
-		alignItems: "center",
-		height: "100%",
-		size: wide ? "wide" : "medium",
-		zIndex: 14
-	}, children);
-};
-
-//#endregion
-export { AppBar };
-//# sourceMappingURL=index.js.map
+import { ContentContainer } from '@codecademy/gamut';
+import * as React from 'react';
+import { jsx as _jsx } from "react/jsx-runtime";
+export const AppBar = ({
+  'aria-label': ariaLabel,
+  as,
+  wide,
+  children
+}) => {
+  return /*#__PURE__*/_jsx(ContentContainer, {
+    "aria-label": ariaLabel,
+    as: as,
+    display: "flex",
+    alignItems: "center",
+    height: "100%",
+    size: wide ? 'wide' : 'medium',
+    zIndex: 14,
+    children: children
+  });
+};

package/dist/AppBarDeprecated/AppBarSectionDeprecated.d.ts

@@ -1,19 +1,14 @@
-import { WithChildrenProp } from "@codecademy/gamut";
-import * as React$1 from "react";
-
-//#region src/AppBarDeprecated/AppBarSectionDeprecated.d.ts
-interface AppBarSectionPropsDeprecated extends WithChildrenProp {
-  /**
-   * Position of the the section within the AppBar.
-   */
-  position?: 'left' | 'center' | 'right';
-  className?: string;
+import { WithChildrenProp } from '@codecademy/gamut';
+import * as React from 'react';
+export interface AppBarSectionPropsDeprecated extends WithChildrenProp {
+    /**
+     * Position of the the section within the AppBar.
+     */
+    position?: 'left' | 'center' | 'right';
+    className?: string;
 }
 /**
  * @deprecated use `<AppBarSection>` instead
  * this component still exists since `<Footer>` in le-shared uses classnames
  */
-declare const AppBarSectionDeprecated: React$1.FC<AppBarSectionPropsDeprecated>;
-//#endregion
-export { AppBarSectionDeprecated, AppBarSectionPropsDeprecated };
-//# sourceMappingURL=AppBarSectionDeprecated.d.ts.map
+export declare const AppBarSectionDeprecated: React.FC<AppBarSectionPropsDeprecated>;

package/dist/AppBarDeprecated/AppBarSectionDeprecated.js

@@ -1,20 +1,25 @@
-import * as React$1 from "react";
-import cx from "classnames";
-import styles from "./styles/index.module.scss";
+import cx from 'classnames';
+import * as React from 'react';
 
-//#region src/AppBarDeprecated/AppBarSectionDeprecated.tsx
+// eslint-disable-next-line gamut/no-css-standalone
+import styles from './styles/index.module.scss';
+import { jsx as _jsx } from "react/jsx-runtime";
 /**
-* @deprecated use `<AppBarSection>` instead
-* this component still exists since `<Footer>` in le-shared uses classnames
-*/ const AppBarSectionDeprecated = ({ position, className, children }) => {
-	const classes = cx(styles.section, {
-		[styles.sectionRight]: position === "right",
-		[styles.sectionLeft]: position === "left",
-		[styles.sectionCenter]: position === "center"
-	}, className);
-	return /* @__PURE__ */ React$1.createElement("div", { className: classes }, children);
-};
-
-//#endregion
-export { AppBarSectionDeprecated };
-//# sourceMappingURL=AppBarSectionDeprecated.js.map
+ * @deprecated use `<AppBarSection>` instead
+ * this component still exists since `<Footer>` in le-shared uses classnames
+ */
+export const AppBarSectionDeprecated = ({
+  position,
+  className,
+  children
+}) => {
+  const classes = cx(styles.section, {
+    [styles.sectionRight]: position === 'right',
+    [styles.sectionLeft]: position === 'left',
+    [styles.sectionCenter]: position === 'center'
+  }, className);
+  return /*#__PURE__*/_jsx("div", {
+    className: classes,
+    children: children
+  });
+};

package/dist/AppBarDeprecated/index.d.ts

@@ -1,19 +1,14 @@
-import { WithChildrenProp } from "@codecademy/gamut";
-import * as React$1 from "react";
-
-//#region src/AppBarDeprecated/index.d.ts
-interface AppBarPropsDeprecated extends WithChildrenProp {
-  className?: string;
-  /**
-   * Whether the container should be larger than the default content size.
-   */
-  wide?: boolean;
+import { WithChildrenProp } from '@codecademy/gamut';
+import * as React from 'react';
+export interface AppBarPropsDeprecated extends WithChildrenProp {
+    className?: string;
+    /**
+     * Whether the container should be larger than the default content size.
+     */
+    wide?: boolean;
 }
 /**
  * @deprecated use `<AppBar>` instead
  * this component still exists since `<Footer>` in le-shared uses classnames
  */
-declare const AppBarDeprecated: React$1.FC<AppBarPropsDeprecated>;
-//#endregion
-export { AppBarDeprecated, AppBarPropsDeprecated };
-//# sourceMappingURL=index.d.ts.map
+export declare const AppBarDeprecated: React.FC<AppBarPropsDeprecated>;

package/dist/AppBarDeprecated/index.js

@@ -1,23 +1,26 @@
-import { ContentContainer } from "@codecademy/gamut";
-import * as React$1 from "react";
-import cx from "classnames";
-import styles from "./styles/index.module.scss";
+import { ContentContainer } from '@codecademy/gamut';
+import cx from 'classnames';
+import * as React from 'react';
 
-//#region src/AppBarDeprecated/index.tsx
+// eslint-disable-next-line gamut/no-css-standalone
+import styles from './styles/index.module.scss';
+import { jsx as _jsx } from "react/jsx-runtime";
 /**
-* @deprecated use `<AppBar>` instead
-* this component still exists since `<Footer>` in le-shared uses classnames
-*/ const AppBarDeprecated = ({ wide, children, className }) => {
-	const classes = cx(styles.wrapper, className);
-	return /* @__PURE__ */ React$1.createElement(ContentContainer, {
-		className: classes,
-		display: "flex",
-		alignItems: "center",
-		height: "100%",
-		size: wide ? "wide" : "medium"
-	}, children);
-};
-
-//#endregion
-export { AppBarDeprecated };
-//# sourceMappingURL=index.js.map
+ * @deprecated use `<AppBar>` instead
+ * this component still exists since `<Footer>` in le-shared uses classnames
+ */
+export const AppBarDeprecated = ({
+  wide,
+  children,
+  className
+}) => {
+  const classes = cx(styles.wrapper, className);
+  return /*#__PURE__*/_jsx(ContentContainer, {
+    className: classes,
+    display: "flex",
+    alignItems: "center",
+    height: "100%",
+    size: wide ? 'wide' : 'medium',
+    children: children
+  });
+};

package/dist/AppHeader/AppHeaderElements/AppHeaderCatalogDropdown/MarketingBanner.d.ts

@@ -0,0 +1,13 @@
+import { Scale } from '@codecademy/variance/dist/types/config';
+export type MarketingBannerProps = {
+    source: 'catalog' | 'resources' | 'search';
+    tabIndex: number;
+    text: string;
+    href: string;
+    py?: Scale<{
+        readonly property: 'padding';
+        readonly properties: readonly ['paddingTop', 'paddingBottom'];
+        readonly scale: 'spacing';
+    }>;
+};
+export declare const MarketingBanner: React.FC<MarketingBannerProps>;