@codecademy/brand 4.0.0-alpha.fb4adf2b4d.0 → 4.0.0

package/dist/Notifications/NotificationsContents.cjs

@@ -1,67 +0,0 @@
-const require_rolldown_runtime = require('../_virtual/rolldown_runtime.cjs');
-const require_elements = require('./elements.cjs');
-const require_keyboardNav = require('../AppHeader/shared/keyboardNav.cjs');
-require('../AppHeader/shared/index.cjs');
-const require_index$1 = require('../NotificationList/index.cjs');
-const require_useNotificationButtons = require('./useNotificationButtons.cjs');
-let _codecademy_gamut = require("@codecademy/gamut");
-let react = require("react");
-react = require_rolldown_runtime.__toESM(react);
-let _codecademy_gamut_patterns = require("@codecademy/gamut-patterns");
-
-//#region src/Notifications/NotificationsContents.tsx
-const NotificationsContents = ({ actions, handleClose, notifications }) => {
-	const notificationListRef = (0, react.useRef)(null);
-	const { clearAllButton, closeButton, showMoreButton, notifications: visibleNotifications } = require_useNotificationButtons.useNotificationButtons({
-		actions,
-		handleClose,
-		notificationListRef,
-		notifications
-	});
-	const onKeyDown = require_keyboardNav.useOnEscHandler(handleClose);
-	const onNotificationClick = (notification) => {
-		actions.click(notification);
-		if (notification.unread) actions.read([notification]);
-	};
-	(0, react.useEffect)(() => {
-		notificationListRef?.current?.focus();
-	}, [notificationListRef]);
-	(0, react.useEffect)(() => {
-		const unreadVisibleNotifications = visibleNotifications.filter((notification) => notification.unread);
-		if (unreadVisibleNotifications.length) actions.read(unreadVisibleNotifications);
-	}, [actions, visibleNotifications]);
-	return /* @__PURE__ */ react.createElement(require_elements.NotificationDialog, {
-		"aria-label": visibleNotifications.length ? `${notifications.length} unread notifications` : `My Notifications`,
-		"aria-modal": "true",
-		bg: "background",
-		"data-autofocus": true,
-		onKeyDown,
-		ref: notificationListRef,
-		role: "dialog",
-		tabIndex: -1
-	}, /* @__PURE__ */ react.createElement(_codecademy_gamut.FlexBox, {
-		alignItems: "center",
-		flexDirection: "row",
-		height: "40",
-		justifyContent: "space-between",
-		mb: 16,
-		px: 32
-	}, /* @__PURE__ */ react.createElement(_codecademy_gamut.Text, {
-		as: "h1",
-		fontSize: 22
-	}, "My Notifications"), /* @__PURE__ */ react.createElement(_codecademy_gamut.FlexBox, null, clearAllButton, closeButton)), /* @__PURE__ */ react.createElement(_codecademy_gamut.Box, { px: 32 }, /* @__PURE__ */ react.createElement(_codecademy_gamut_patterns.CheckerDense, {
-		height: "1px",
-		display: "flex"
-	})), /* @__PURE__ */ react.createElement(_codecademy_gamut.Box, {
-		maxHeight: "520px",
-		overflow: "auto"
-	}, /* @__PURE__ */ react.createElement(_codecademy_gamut.Box, { pb: 16 }, /* @__PURE__ */ react.createElement(require_index$1.NotificationList, {
-		notifications: visibleNotifications,
-		onDismiss: actions.dismiss,
-		onNotificationClick
-	})), showMoreButton));
-};
-
-//#endregion
-exports.NotificationsContents = NotificationsContents;
-//# sourceMappingURL=NotificationsContents.cjs.map

package/dist/Notifications/NotificationsContents.cjs.map

@@ -1 +0,0 @@
-{"version":3,"file":"NotificationsContents.cjs","names":["Box","FlexBox","Text","CheckerDense","useEffect","useRef","React","useOnEscHandler","NotificationList","NotificationDialog","useNotificationButtons","NotificationsContents","actions","handleClose","notifications","notificationListRef","clearAllButton","closeButton","showMoreButton","visibleNotifications","onKeyDown","onNotificationClick","notification","click","unread","read","current","focus","unreadVisibleNotifications","filter","length","aria-label","aria-modal","bg","data-autofocus","ref","role","tabIndex","alignItems","flexDirection","height","justifyContent","mb","px","as","fontSize","display","maxHeight","overflow","pb","onDismiss","dismiss"],"sources":["../../src/Notifications/NotificationsContents.tsx"],"sourcesContent":["import { Box, FlexBox, Text } from '@codecademy/gamut';\nimport { CheckerDense } from '@codecademy/gamut-patterns';\nimport { useEffect, useRef } from 'react';\nimport * as React from 'react';\n\nimport { useOnEscHandler } from '../AppHeader/shared';\nimport { NotificationList } from '../NotificationList';\nimport { Notification } from '../NotificationList/typings';\nimport { NotificationDialog } from './elements';\nimport { NotificationsProps } from './types';\nimport { useNotificationButtons } from './useNotificationButtons';\n\nexport const NotificationsContents: React.FC<NotificationsProps> = ({\n  actions,\n  handleClose,\n  notifications,\n}) => {\n  const notificationListRef = useRef<HTMLDivElement>(null);\n\n  const {\n    clearAllButton,\n    closeButton,\n    showMoreButton,\n    notifications: visibleNotifications,\n  } = useNotificationButtons({\n    actions,\n    handleClose,\n    notificationListRef,\n    notifications,\n  });\n\n  const onKeyDown = useOnEscHandler(handleClose);\n\n  const onNotificationClick = (notification: Notification) => {\n    actions.click(notification);\n\n    if (notification.unread) {\n      actions.read([notification]);\n    }\n  };\n\n  useEffect(() => {\n    notificationListRef?.current?.focus();\n  }, [notificationListRef]);\n\n  useEffect(() => {\n    const unreadVisibleNotifications = visibleNotifications.filter(\n      (notification) => notification.unread\n    );\n\n    if (unreadVisibleNotifications.length) {\n      actions.read(unreadVisibleNotifications);\n    }\n  }, [actions, visibleNotifications]);\n\n  return (\n    <NotificationDialog\n      aria-label={\n        visibleNotifications.length\n          ? `${notifications.length} unread notifications`\n          : `My Notifications`\n      }\n      aria-modal=\"true\"\n      bg=\"background\"\n      data-autofocus\n      onKeyDown={onKeyDown}\n      ref={notificationListRef}\n      role=\"dialog\"\n      tabIndex={-1}\n    >\n      <FlexBox\n        alignItems=\"center\"\n        flexDirection=\"row\"\n        height=\"40\"\n        justifyContent=\"space-between\"\n        mb={16}\n        px={32}\n      >\n        <Text as=\"h1\" fontSize={22}>\n          My Notifications\n        </Text>\n        <FlexBox>\n          {clearAllButton}\n          {closeButton}\n        </FlexBox>\n      </FlexBox>\n      <Box px={32}>\n        <CheckerDense height=\"1px\" display=\"flex\" />\n      </Box>\n      <Box maxHeight=\"520px\" overflow=\"auto\">\n        <Box pb={16}>\n          <NotificationList\n            notifications={visibleNotifications}\n            onDismiss={actions.dismiss}\n            onNotificationClick={onNotificationClick}\n          />\n        </Box>\n        {showMoreButton}\n      </Box>\n    </NotificationDialog>\n  );\n};\n"],"mappings":";;;;;;;;;;;;AAYA,MAAaW,yBAAuD,EAClEC,SACAC,aACAC,oBACD;CACC,MAAMC,wCAA6C,KAAA;CAEnD,MAAM,EACJC,gBACAC,aACAC,gBACAJ,eAAeK,yBACbT,sDAAuB;EACzBE;EACAC;EACAE;EACAD;EACF,CAAA;CAEA,MAAMM,YAAYb,oCAAgBM,YAAAA;CAElC,MAAMQ,uBAAuBC,iBAAAA;AAC3BV,UAAQW,MAAMD,aAAAA;AAEd,MAAIA,aAAaE,OACfZ,SAAQa,KAAK,CAACH,aAAa,CAAA;;AAI/BlB,4BAAU;AACRW,uBAAqBW,SAASC,OAAAA;IAC7B,CAACZ,oBAAoB,CAAA;AAExBX,4BAAU;EACR,MAAMwB,6BAA6BT,qBAAqBU,QACrDP,iBAAiBA,aAAaE,OAAM;AAGvC,MAAII,2BAA2BE,OAC7BlB,SAAQa,KAAKG,2BAAAA;IAEd,CAAChB,SAASO,qBAAqB,CAAA;AAElC,QACE,sBAAA,cAACV,qCAAAA;EACCsB,cACEZ,qBAAqBW,SACjB,GAAGhB,cAAcgB,OAAO,yBACxB;EAENE,cAAW;EACXC,IAAG;EACHC,kBAAAA;EACWd;EACXe,KAAKpB;EACLqB,MAAK;EACLC,UAAU;IAEV,sBAAA,cAACpC,2BAAAA;EACCqC,YAAW;EACXC,eAAc;EACdC,QAAO;EACPC,gBAAe;EACfC,IAAI;EACJC,IAAI;IAEJ,sBAAA,cAACzC,wBAAAA;EAAK0C,IAAG;EAAKC,UAAU;IAAI,mBAAA,EAG5B,sBAAA,cAAC5C,2BAAAA,MACEe,gBACAC,YAAAA,CAAAA,EAGL,sBAAA,cAACjB,uBAAAA,EAAI2C,IAAI,MACP,sBAAA,cAACxC,yCAAAA;EAAaqC,QAAO;EAAMM,SAAQ;MAErC,sBAAA,cAAC9C,uBAAAA;EAAI+C,WAAU;EAAQC,UAAS;IAC9B,sBAAA,cAAChD,uBAAAA,EAAIiD,IAAI,MACP,sBAAA,cAACzC,kCAAAA;EACCM,eAAeK;EACf+B,WAAWtC,QAAQuC;EACE9B;MAGxBH,eAAAA,CAAAA"}

package/dist/Notifications/NotificationsContents.mjs

@@ -1,66 +0,0 @@
-import { NotificationDialog } from "./elements.mjs";
-import { useOnEscHandler } from "../AppHeader/shared/keyboardNav.mjs";
-import "../AppHeader/shared/index.mjs";
-import { NotificationList } from "../NotificationList/index.mjs";
-import { useNotificationButtons } from "./useNotificationButtons.mjs";
-import { Box, FlexBox, Text } from "@codecademy/gamut";
-import * as React$1 from "react";
-import { useEffect, useRef } from "react";
-import { CheckerDense } from "@codecademy/gamut-patterns";
-
-//#region src/Notifications/NotificationsContents.tsx
-const NotificationsContents = ({ actions, handleClose, notifications }) => {
-	const notificationListRef = useRef(null);
-	const { clearAllButton, closeButton, showMoreButton, notifications: visibleNotifications } = useNotificationButtons({
-		actions,
-		handleClose,
-		notificationListRef,
-		notifications
-	});
-	const onKeyDown = useOnEscHandler(handleClose);
-	const onNotificationClick = (notification) => {
-		actions.click(notification);
-		if (notification.unread) actions.read([notification]);
-	};
-	useEffect(() => {
-		notificationListRef?.current?.focus();
-	}, [notificationListRef]);
-	useEffect(() => {
-		const unreadVisibleNotifications = visibleNotifications.filter((notification) => notification.unread);
-		if (unreadVisibleNotifications.length) actions.read(unreadVisibleNotifications);
-	}, [actions, visibleNotifications]);
-	return /* @__PURE__ */ React$1.createElement(NotificationDialog, {
-		"aria-label": visibleNotifications.length ? `${notifications.length} unread notifications` : `My Notifications`,
-		"aria-modal": "true",
-		bg: "background",
-		"data-autofocus": true,
-		onKeyDown,
-		ref: notificationListRef,
-		role: "dialog",
-		tabIndex: -1
-	}, /* @__PURE__ */ React$1.createElement(FlexBox, {
-		alignItems: "center",
-		flexDirection: "row",
-		height: "40",
-		justifyContent: "space-between",
-		mb: 16,
-		px: 32
-	}, /* @__PURE__ */ React$1.createElement(Text, {
-		as: "h1",
-		fontSize: 22
-	}, "My Notifications"), /* @__PURE__ */ React$1.createElement(FlexBox, null, clearAllButton, closeButton)), /* @__PURE__ */ React$1.createElement(Box, { px: 32 }, /* @__PURE__ */ React$1.createElement(CheckerDense, {
-		height: "1px",
-		display: "flex"
-	})), /* @__PURE__ */ React$1.createElement(Box, {
-		maxHeight: "520px",
-		overflow: "auto"
-	}, /* @__PURE__ */ React$1.createElement(Box, { pb: 16 }, /* @__PURE__ */ React$1.createElement(NotificationList, {
-		notifications: visibleNotifications,
-		onDismiss: actions.dismiss,
-		onNotificationClick
-	})), showMoreButton));
-};
-
-//#endregion
-export { NotificationsContents };
-//# sourceMappingURL=NotificationsContents.mjs.map

package/dist/Notifications/NotificationsContents.mjs.map

@@ -1 +0,0 @@
-{"version":3,"file":"NotificationsContents.mjs","names":["Box","FlexBox","Text","CheckerDense","useEffect","useRef","React","useOnEscHandler","NotificationList","NotificationDialog","useNotificationButtons","NotificationsContents","actions","handleClose","notifications","notificationListRef","clearAllButton","closeButton","showMoreButton","visibleNotifications","onKeyDown","onNotificationClick","notification","click","unread","read","current","focus","unreadVisibleNotifications","filter","length","aria-label","aria-modal","bg","data-autofocus","ref","role","tabIndex","alignItems","flexDirection","height","justifyContent","mb","px","as","fontSize","display","maxHeight","overflow","pb","onDismiss","dismiss"],"sources":["../../src/Notifications/NotificationsContents.tsx"],"sourcesContent":["import { Box, FlexBox, Text } from '@codecademy/gamut';\nimport { CheckerDense } from '@codecademy/gamut-patterns';\nimport { useEffect, useRef } from 'react';\nimport * as React from 'react';\n\nimport { useOnEscHandler } from '../AppHeader/shared';\nimport { NotificationList } from '../NotificationList';\nimport { Notification } from '../NotificationList/typings';\nimport { NotificationDialog } from './elements';\nimport { NotificationsProps } from './types';\nimport { useNotificationButtons } from './useNotificationButtons';\n\nexport const NotificationsContents: React.FC<NotificationsProps> = ({\n  actions,\n  handleClose,\n  notifications,\n}) => {\n  const notificationListRef = useRef<HTMLDivElement>(null);\n\n  const {\n    clearAllButton,\n    closeButton,\n    showMoreButton,\n    notifications: visibleNotifications,\n  } = useNotificationButtons({\n    actions,\n    handleClose,\n    notificationListRef,\n    notifications,\n  });\n\n  const onKeyDown = useOnEscHandler(handleClose);\n\n  const onNotificationClick = (notification: Notification) => {\n    actions.click(notification);\n\n    if (notification.unread) {\n      actions.read([notification]);\n    }\n  };\n\n  useEffect(() => {\n    notificationListRef?.current?.focus();\n  }, [notificationListRef]);\n\n  useEffect(() => {\n    const unreadVisibleNotifications = visibleNotifications.filter(\n      (notification) => notification.unread\n    );\n\n    if (unreadVisibleNotifications.length) {\n      actions.read(unreadVisibleNotifications);\n    }\n  }, [actions, visibleNotifications]);\n\n  return (\n    <NotificationDialog\n      aria-label={\n        visibleNotifications.length\n          ? `${notifications.length} unread notifications`\n          : `My Notifications`\n      }\n      aria-modal=\"true\"\n      bg=\"background\"\n      data-autofocus\n      onKeyDown={onKeyDown}\n      ref={notificationListRef}\n      role=\"dialog\"\n      tabIndex={-1}\n    >\n      <FlexBox\n        alignItems=\"center\"\n        flexDirection=\"row\"\n        height=\"40\"\n        justifyContent=\"space-between\"\n        mb={16}\n        px={32}\n      >\n        <Text as=\"h1\" fontSize={22}>\n          My Notifications\n        </Text>\n        <FlexBox>\n          {clearAllButton}\n          {closeButton}\n        </FlexBox>\n      </FlexBox>\n      <Box px={32}>\n        <CheckerDense height=\"1px\" display=\"flex\" />\n      </Box>\n      <Box maxHeight=\"520px\" overflow=\"auto\">\n        <Box pb={16}>\n          <NotificationList\n            notifications={visibleNotifications}\n            onDismiss={actions.dismiss}\n            onNotificationClick={onNotificationClick}\n          />\n        </Box>\n        {showMoreButton}\n      </Box>\n    </NotificationDialog>\n  );\n};\n"],"mappings":";;;;;;;;;;;AAYA,MAAaW,yBAAuD,EAClEC,SACAC,aACAC,oBACD;CACC,MAAMC,sBAAsBV,OAAuB,KAAA;CAEnD,MAAM,EACJW,gBACAC,aACAC,gBACAJ,eAAeK,yBACbT,uBAAuB;EACzBE;EACAC;EACAE;EACAD;EACF,CAAA;CAEA,MAAMM,YAAYb,gBAAgBM,YAAAA;CAElC,MAAMQ,uBAAuBC,iBAAAA;AAC3BV,UAAQW,MAAMD,aAAAA;AAEd,MAAIA,aAAaE,OACfZ,SAAQa,KAAK,CAACH,aAAa,CAAA;;AAI/BlB,iBAAU;AACRW,uBAAqBW,SAASC,OAAAA;IAC7B,CAACZ,oBAAoB,CAAA;AAExBX,iBAAU;EACR,MAAMwB,6BAA6BT,qBAAqBU,QACrDP,iBAAiBA,aAAaE,OAAM;AAGvC,MAAII,2BAA2BE,OAC7BlB,SAAQa,KAAKG,2BAAAA;IAEd,CAAChB,SAASO,qBAAqB,CAAA;AAElC,QACE,wBAAA,cAACV,oBAAAA;EACCsB,cACEZ,qBAAqBW,SACjB,GAAGhB,cAAcgB,OAAO,yBACxB;EAENE,cAAW;EACXC,IAAG;EACHC,kBAAAA;EACWd;EACXe,KAAKpB;EACLqB,MAAK;EACLC,UAAU;IAEV,wBAAA,cAACpC,SAAAA;EACCqC,YAAW;EACXC,eAAc;EACdC,QAAO;EACPC,gBAAe;EACfC,IAAI;EACJC,IAAI;IAEJ,wBAAA,cAACzC,MAAAA;EAAK0C,IAAG;EAAKC,UAAU;IAAI,mBAAA,EAG5B,wBAAA,cAAC5C,SAAAA,MACEe,gBACAC,YAAAA,CAAAA,EAGL,wBAAA,cAACjB,KAAAA,EAAI2C,IAAI,MACP,wBAAA,cAACxC,cAAAA;EAAaqC,QAAO;EAAMM,SAAQ;MAErC,wBAAA,cAAC9C,KAAAA;EAAI+C,WAAU;EAAQC,UAAS;IAC9B,wBAAA,cAAChD,KAAAA,EAAIiD,IAAI,MACP,wBAAA,cAACzC,kBAAAA;EACCM,eAAeK;EACf+B,WAAWtC,QAAQuC;EACE9B;MAGxBH,eAAAA,CAAAA"}

package/dist/Notifications/NotificationsDropdown.cjs

@@ -1,23 +0,0 @@
-const require_rolldown_runtime = require('../_virtual/rolldown_runtime.cjs');
-const require_elements = require('./elements.cjs');
-const require_NotificationsContents = require('./NotificationsContents.cjs');
-let _codecademy_gamut = require("@codecademy/gamut");
-
-//#region src/Notifications/NotificationsDropdown.tsx
-const NotificationsDropdown = ({ bellRef, handleClose, isOpen, ...props }) => {
-	return /* @__PURE__ */ React.createElement(_codecademy_gamut.Popover, {
-		align: "right",
-		verticalOffset: 1,
-		outline: true,
-		isOpen,
-		targetRef: bellRef,
-		widthRestricted: false
-	}, /* @__PURE__ */ React.createElement(require_elements.NotificationsWrapper, null, /* @__PURE__ */ React.createElement(require_NotificationsContents.NotificationsContents, {
-		...props,
-		handleClose
-	})));
-};
-
-//#endregion
-exports.NotificationsDropdown = NotificationsDropdown;
-//# sourceMappingURL=NotificationsDropdown.cjs.map

package/dist/Notifications/NotificationsDropdown.cjs.map

@@ -1 +0,0 @@
-{"version":3,"file":"NotificationsDropdown.cjs","names":["Popover","NotificationsWrapper","NotificationsContents","NotificationsDropdown","bellRef","handleClose","isOpen","props","align","verticalOffset","outline","targetRef","widthRestricted"],"sources":["../../src/Notifications/NotificationsDropdown.tsx"],"sourcesContent":["import { Popover } from '@codecademy/gamut';\n\nimport { NotificationsWrapper } from './elements';\nimport { NotificationsContents } from './NotificationsContents';\nimport { NotificationsDropdownProps } from './types';\n\nexport const NotificationsDropdown: React.FC<NotificationsDropdownProps> = ({\n  bellRef,\n  handleClose,\n  isOpen,\n  ...props\n}) => {\n  return (\n    <Popover\n      align=\"right\"\n      verticalOffset={1}\n      outline\n      isOpen={isOpen}\n      targetRef={bellRef}\n      widthRestricted={false}\n    >\n      <NotificationsWrapper>\n        <NotificationsContents {...props} handleClose={handleClose} />\n      </NotificationsWrapper>\n    </Popover>\n  );\n};\n"],"mappings":";;;;;;AAMA,MAAaG,yBAA+D,EAC1EC,SACAC,aACAC,QACA,GAAGC,YACJ;AACC,QACE,sBAAA,cAACP,2BAAAA;EACCQ,OAAM;EACNC,gBAAgB;EAChBC,SAAAA;EACQJ;EACRK,WAAWP;EACXQ,iBAAiB;IAEjB,sBAAA,cAACX,uCAAAA,MACC,sBAAA,cAACC,qDAAAA;EAAuB,GAAGK;EAAoBF"}

package/dist/Notifications/NotificationsDropdown.mjs

@@ -1,22 +0,0 @@
-import { NotificationsWrapper } from "./elements.mjs";
-import { NotificationsContents } from "./NotificationsContents.mjs";
-import { Popover } from "@codecademy/gamut";
-
-//#region src/Notifications/NotificationsDropdown.tsx
-const NotificationsDropdown = ({ bellRef, handleClose, isOpen, ...props }) => {
-	return /* @__PURE__ */ React.createElement(Popover, {
-		align: "right",
-		verticalOffset: 1,
-		outline: true,
-		isOpen,
-		targetRef: bellRef,
-		widthRestricted: false
-	}, /* @__PURE__ */ React.createElement(NotificationsWrapper, null, /* @__PURE__ */ React.createElement(NotificationsContents, {
-		...props,
-		handleClose
-	})));
-};
-
-//#endregion
-export { NotificationsDropdown };
-//# sourceMappingURL=NotificationsDropdown.mjs.map

package/dist/Notifications/NotificationsDropdown.mjs.map

@@ -1 +0,0 @@
-{"version":3,"file":"NotificationsDropdown.mjs","names":["Popover","NotificationsWrapper","NotificationsContents","NotificationsDropdown","bellRef","handleClose","isOpen","props","align","verticalOffset","outline","targetRef","widthRestricted"],"sources":["../../src/Notifications/NotificationsDropdown.tsx"],"sourcesContent":["import { Popover } from '@codecademy/gamut';\n\nimport { NotificationsWrapper } from './elements';\nimport { NotificationsContents } from './NotificationsContents';\nimport { NotificationsDropdownProps } from './types';\n\nexport const NotificationsDropdown: React.FC<NotificationsDropdownProps> = ({\n  bellRef,\n  handleClose,\n  isOpen,\n  ...props\n}) => {\n  return (\n    <Popover\n      align=\"right\"\n      verticalOffset={1}\n      outline\n      isOpen={isOpen}\n      targetRef={bellRef}\n      widthRestricted={false}\n    >\n      <NotificationsWrapper>\n        <NotificationsContents {...props} handleClose={handleClose} />\n      </NotificationsWrapper>\n    </Popover>\n  );\n};\n"],"mappings":";;;;;AAMA,MAAaG,yBAA+D,EAC1EC,SACAC,aACAC,QACA,GAAGC,YACJ;AACC,QACE,sBAAA,cAACP,SAAAA;EACCQ,OAAM;EACNC,gBAAgB;EAChBC,SAAAA;EACQJ;EACRK,WAAWP;EACXQ,iBAAiB;IAEjB,sBAAA,cAACX,sBAAAA,MACC,sBAAA,cAACC,uBAAAA;EAAuB,GAAGK;EAAoBF"}

package/dist/Notifications/constants.cjs

@@ -1,9 +0,0 @@
-
-//#region src/Notifications/constants.ts
-/**
-* How many notifications are visible in the list at once by default.
-*/ const defaultDisplayLimit = 3;
-
-//#endregion
-exports.defaultDisplayLimit = defaultDisplayLimit;
-//# sourceMappingURL=constants.cjs.map

package/dist/Notifications/constants.cjs.map

@@ -1 +0,0 @@
-{"version":3,"file":"constants.cjs","names":["defaultDisplayLimit"],"sources":["../../src/Notifications/constants.ts"],"sourcesContent":["/**\n * How many notifications are visible in the list at once by default.\n */\nexport const defaultDisplayLimit = 3;\n"],"mappings":";;;;GAGA,MAAaA,sBAAsB"}

package/dist/Notifications/constants.mjs

@@ -1,8 +0,0 @@
-//#region src/Notifications/constants.ts
-/**
-* How many notifications are visible in the list at once by default.
-*/ const defaultDisplayLimit = 3;
-
-//#endregion
-export { defaultDisplayLimit };
-//# sourceMappingURL=constants.mjs.map

package/dist/Notifications/constants.mjs.map

@@ -1 +0,0 @@
-{"version":3,"file":"constants.mjs","names":["defaultDisplayLimit"],"sources":["../../src/Notifications/constants.ts"],"sourcesContent":["/**\n * How many notifications are visible in the list at once by default.\n */\nexport const defaultDisplayLimit = 3;\n"],"mappings":";;;GAGA,MAAaA,sBAAsB"}

package/dist/Notifications/elements.cjs

@@ -1,30 +0,0 @@
-const require_rolldown_runtime = require('../_virtual/rolldown_runtime.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);
-
-//#region src/Notifications/elements.tsx
-const NotificationsWrapper = /* @__PURE__ */ (0, _emotion_styled.default)(_codecademy_gamut.Box, {
-	target: "esr8s590",
-	label: "brand-NotificationsWrapper"
-})((0, _codecademy_gamut_styles.css)({
-	display: "flex",
-	textAlign: "left",
-	width: 400
-}), "/*# sourceMappingURL=data:application/json;charset=utf-8;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoiL2hvbWUvcnVubmVyL3dvcmsvbW9uby9tb25vL2xpYnMvdWkvYnJhbmQvc3JjL05vdGlmaWNhdGlvbnMvZWxlbWVudHMudHN4Iiwic291cmNlcyI6WyIvaG9tZS9ydW5uZXIvd29yay9tb25vL21vbm8vbGlicy91aS9icmFuZC9zcmMvTm90aWZpY2F0aW9ucy9lbGVtZW50cy50c3giXSwic291cmNlc0NvbnRlbnQiOlsiaW1wb3J0IHsgQm94LCBmb2N1c1Zpc2libGVTdHlsZSB9IGZyb20gJ0Bjb2RlY2FkZW15L2dhbXV0JztcbmltcG9ydCB7IGNzcyB9IGZyb20gJ0Bjb2RlY2FkZW15L2dhbXV0LXN0eWxlcyc7XG5pbXBvcnQgc3R5bGVkIGZyb20gJ0BlbW90aW9uL3N0eWxlZCc7XG5cbmV4cG9ydCBjb25zdCBOb3RpZmljYXRpb25zV3JhcHBlciA9IHN0eWxlZChCb3gpKFxuICBjc3Moe1xuICAgIGRpc3BsYXk6ICdmbGV4JyxcbiAgICB0ZXh0QWxpZ246ICdsZWZ0JyxcbiAgICB3aWR0aDogNDAwLFxuICB9KVxuKTtcblxuY29uc3QgZm9jdXNTdHlsZSA9IGZvY3VzVmlzaWJsZVN0eWxlKCk7XG5cbmV4cG9ydCBjb25zdCBOb3RpZmljYXRpb25EaWFsb2cgPSBzdHlsZWQoQm94KShcbiAgY3NzKHtcbiAgICBwYjogMjQsXG4gICAgcHQ6IDMyLFxuICAgIHdpZHRoOiAnMTAwJScsXG4gICAgLi4uZm9jdXNTdHlsZSxcbiAgfSlcbik7XG4iXSwibmFtZXMiOltdLCJtYXBwaW5ncyI6IkFBSW9DIn0= */");
-const focusStyle = (0, _codecademy_gamut.focusVisibleStyle)();
-const NotificationDialog = /* @__PURE__ */ (0, _emotion_styled.default)(_codecademy_gamut.Box, {
-	target: "esr8s591",
-	label: "brand-NotificationDialog"
-})((0, _codecademy_gamut_styles.css)({
-	pb: 24,
-	pt: 32,
-	width: "100%",
-	...focusStyle
-}), "/*# sourceMappingURL=data:application/json;charset=utf-8;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoiL2hvbWUvcnVubmVyL3dvcmsvbW9uby9tb25vL2xpYnMvdWkvYnJhbmQvc3JjL05vdGlmaWNhdGlvbnMvZWxlbWVudHMudHN4Iiwic291cmNlcyI6WyIvaG9tZS9ydW5uZXIvd29yay9tb25vL21vbm8vbGlicy91aS9icmFuZC9zcmMvTm90aWZpY2F0aW9ucy9lbGVtZW50cy50c3giXSwic291cmNlc0NvbnRlbnQiOlsiaW1wb3J0IHsgQm94LCBmb2N1c1Zpc2libGVTdHlsZSB9IGZyb20gJ0Bjb2RlY2FkZW15L2dhbXV0JztcbmltcG9ydCB7IGNzcyB9IGZyb20gJ0Bjb2RlY2FkZW15L2dhbXV0LXN0eWxlcyc7XG5pbXBvcnQgc3R5bGVkIGZyb20gJ0BlbW90aW9uL3N0eWxlZCc7XG5cbmV4cG9ydCBjb25zdCBOb3RpZmljYXRpb25zV3JhcHBlciA9IHN0eWxlZChCb3gpKFxuICBjc3Moe1xuICAgIGRpc3BsYXk6ICdmbGV4JyxcbiAgICB0ZXh0QWxpZ246ICdsZWZ0JyxcbiAgICB3aWR0aDogNDAwLFxuICB9KVxuKTtcblxuY29uc3QgZm9jdXNTdHlsZSA9IGZvY3VzVmlzaWJsZVN0eWxlKCk7XG5cbmV4cG9ydCBjb25zdCBOb3RpZmljYXRpb25EaWFsb2cgPSBzdHlsZWQoQm94KShcbiAgY3NzKHtcbiAgICBwYjogMjQsXG4gICAgcHQ6IDMyLFxuICAgIHdpZHRoOiAnMTAwJScsXG4gICAgLi4uZm9jdXNTdHlsZSxcbiAgfSlcbik7XG4iXSwibmFtZXMiOltdLCJtYXBwaW5ncyI6IkFBY2tDIn0= */");
-
-//#endregion
-exports.NotificationDialog = NotificationDialog;
-exports.NotificationsWrapper = NotificationsWrapper;
-//# sourceMappingURL=elements.cjs.map

package/dist/Notifications/elements.cjs.map

@@ -1 +0,0 @@
-{"version":3,"file":"elements.cjs","names":["Box","focusVisibleStyle","css","styled","NotificationsWrapper","display","textAlign","width","focusStyle","NotificationDialog","pb","pt"],"sources":["../../src/Notifications/elements.tsx"],"sourcesContent":["import { Box, focusVisibleStyle } from '@codecademy/gamut';\nimport { css } from '@codecademy/gamut-styles';\nimport styled from '@emotion/styled';\n\nexport const NotificationsWrapper = styled(Box)(\n  css({\n    display: 'flex',\n    textAlign: 'left',\n    width: 400,\n  })\n);\n\nconst focusStyle = focusVisibleStyle();\n\nexport const NotificationDialog = styled(Box)(\n  css({\n    pb: 24,\n    pt: 32,\n    width: '100%',\n    ...focusStyle,\n  })\n);\n"],"mappings":";;;;;;;AAIA,MAAaI,uBAAuBD,6CAAOH,uBAAAA;;;qCACrC;CACFK,SAAS;CACTC,WAAW;CACXC,OAAO;CACT,CAAA,EAAA,s+BAAA;AAGF,MAAMC,uDAAaP;AAEnB,MAAaQ,qBAAqBN,6CAAOH,uBAAAA;;;qCACnC;CACFU,IAAI;CACJC,IAAI;CACJJ,OAAO;CACP,GAAGC;CACL,CAAA,EAAA,s+BAAA"}

package/dist/Notifications/elements.mjs

@@ -1,27 +0,0 @@
-import { Box, focusVisibleStyle } from "@codecademy/gamut";
-import { css } from "@codecademy/gamut-styles";
-import styled from "@emotion/styled";
-
-//#region src/Notifications/elements.tsx
-const NotificationsWrapper = /* @__PURE__ */ styled(Box, {
-	target: "esr8s590",
-	label: "brand-NotificationsWrapper"
-})(css({
-	display: "flex",
-	textAlign: "left",
-	width: 400
-}), "/*# sourceMappingURL=data:application/json;charset=utf-8;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoiL2hvbWUvcnVubmVyL3dvcmsvbW9uby9tb25vL2xpYnMvdWkvYnJhbmQvc3JjL05vdGlmaWNhdGlvbnMvZWxlbWVudHMudHN4Iiwic291cmNlcyI6WyIvaG9tZS9ydW5uZXIvd29yay9tb25vL21vbm8vbGlicy91aS9icmFuZC9zcmMvTm90aWZpY2F0aW9ucy9lbGVtZW50cy50c3giXSwic291cmNlc0NvbnRlbnQiOlsiaW1wb3J0IHsgQm94LCBmb2N1c1Zpc2libGVTdHlsZSB9IGZyb20gJ0Bjb2RlY2FkZW15L2dhbXV0JztcbmltcG9ydCB7IGNzcyB9IGZyb20gJ0Bjb2RlY2FkZW15L2dhbXV0LXN0eWxlcyc7XG5pbXBvcnQgc3R5bGVkIGZyb20gJ0BlbW90aW9uL3N0eWxlZCc7XG5cbmV4cG9ydCBjb25zdCBOb3RpZmljYXRpb25zV3JhcHBlciA9IHN0eWxlZChCb3gpKFxuICBjc3Moe1xuICAgIGRpc3BsYXk6ICdmbGV4JyxcbiAgICB0ZXh0QWxpZ246ICdsZWZ0JyxcbiAgICB3aWR0aDogNDAwLFxuICB9KVxuKTtcblxuY29uc3QgZm9jdXNTdHlsZSA9IGZvY3VzVmlzaWJsZVN0eWxlKCk7XG5cbmV4cG9ydCBjb25zdCBOb3RpZmljYXRpb25EaWFsb2cgPSBzdHlsZWQoQm94KShcbiAgY3NzKHtcbiAgICBwYjogMjQsXG4gICAgcHQ6IDMyLFxuICAgIHdpZHRoOiAnMTAwJScsXG4gICAgLi4uZm9jdXNTdHlsZSxcbiAgfSlcbik7XG4iXSwibmFtZXMiOltdLCJtYXBwaW5ncyI6IkFBSW9DIn0= */");
-const focusStyle = focusVisibleStyle();
-const NotificationDialog = /* @__PURE__ */ styled(Box, {
-	target: "esr8s591",
-	label: "brand-NotificationDialog"
-})(css({
-	pb: 24,
-	pt: 32,
-	width: "100%",
-	...focusStyle
-}), "/*# sourceMappingURL=data:application/json;charset=utf-8;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoiL2hvbWUvcnVubmVyL3dvcmsvbW9uby9tb25vL2xpYnMvdWkvYnJhbmQvc3JjL05vdGlmaWNhdGlvbnMvZWxlbWVudHMudHN4Iiwic291cmNlcyI6WyIvaG9tZS9ydW5uZXIvd29yay9tb25vL21vbm8vbGlicy91aS9icmFuZC9zcmMvTm90aWZpY2F0aW9ucy9lbGVtZW50cy50c3giXSwic291cmNlc0NvbnRlbnQiOlsiaW1wb3J0IHsgQm94LCBmb2N1c1Zpc2libGVTdHlsZSB9IGZyb20gJ0Bjb2RlY2FkZW15L2dhbXV0JztcbmltcG9ydCB7IGNzcyB9IGZyb20gJ0Bjb2RlY2FkZW15L2dhbXV0LXN0eWxlcyc7XG5pbXBvcnQgc3R5bGVkIGZyb20gJ0BlbW90aW9uL3N0eWxlZCc7XG5cbmV4cG9ydCBjb25zdCBOb3RpZmljYXRpb25zV3JhcHBlciA9IHN0eWxlZChCb3gpKFxuICBjc3Moe1xuICAgIGRpc3BsYXk6ICdmbGV4JyxcbiAgICB0ZXh0QWxpZ246ICdsZWZ0JyxcbiAgICB3aWR0aDogNDAwLFxuICB9KVxuKTtcblxuY29uc3QgZm9jdXNTdHlsZSA9IGZvY3VzVmlzaWJsZVN0eWxlKCk7XG5cbmV4cG9ydCBjb25zdCBOb3RpZmljYXRpb25EaWFsb2cgPSBzdHlsZWQoQm94KShcbiAgY3NzKHtcbiAgICBwYjogMjQsXG4gICAgcHQ6IDMyLFxuICAgIHdpZHRoOiAnMTAwJScsXG4gICAgLi4uZm9jdXNTdHlsZSxcbiAgfSlcbik7XG4iXSwibmFtZXMiOltdLCJtYXBwaW5ncyI6IkFBY2tDIn0= */");
-
-//#endregion
-export { NotificationDialog, NotificationsWrapper };
-//# sourceMappingURL=elements.mjs.map

package/dist/Notifications/elements.mjs.map

@@ -1 +0,0 @@
-{"version":3,"file":"elements.mjs","names":["Box","focusVisibleStyle","css","styled","NotificationsWrapper","display","textAlign","width","focusStyle","NotificationDialog","pb","pt"],"sources":["../../src/Notifications/elements.tsx"],"sourcesContent":["import { Box, focusVisibleStyle } from '@codecademy/gamut';\nimport { css } from '@codecademy/gamut-styles';\nimport styled from '@emotion/styled';\n\nexport const NotificationsWrapper = styled(Box)(\n  css({\n    display: 'flex',\n    textAlign: 'left',\n    width: 400,\n  })\n);\n\nconst focusStyle = focusVisibleStyle();\n\nexport const NotificationDialog = styled(Box)(\n  css({\n    pb: 24,\n    pt: 32,\n    width: '100%',\n    ...focusStyle,\n  })\n);\n"],"mappings":";;;;;AAIA,MAAaI,uBAAuBD,uBAAOH,KAAAA;;;GACzCE,IAAI;CACFG,SAAS;CACTC,WAAW;CACXC,OAAO;CACT,CAAA,EAAA,s+BAAA;AAGF,MAAMC,aAAaP,mBAAAA;AAEnB,MAAaQ,qBAAqBN,uBAAOH,KAAAA;;;GACvCE,IAAI;CACFQ,IAAI;CACJC,IAAI;CACJJ,OAAO;CACP,GAAGC;CACL,CAAA,EAAA,s+BAAA"}

package/dist/Notifications/types.d.cts

@@ -1,18 +0,0 @@
-import { Notification } from "../NotificationList/typings.cjs";
-
-//#region src/Notifications/types.d.ts
-type NotificationActions = {
-  clear: () => void;
-  click: (notification: Notification) => void;
-  dismiss: (notification: Notification) => void;
-  read: (notifications: Notification[]) => void;
-  track: (target: string) => void;
-};
-type AppHeaderNotificationSettings = {
-  actions: NotificationActions;
-  notifications: Notification[];
-  onEnable: () => void;
-};
-//#endregion
-export { AppHeaderNotificationSettings };
-//# sourceMappingURL=types.d.cts.map

package/dist/Notifications/types.d.cts.map

@@ -1 +0,0 @@
-{"version":3,"file":"types.d.cts","names":[],"sources":["../../src/Notifications/types.ts"],"sourcesContent":[],"mappings":";;;KAIY,mBAAA;EAAA,KAAA,EAAA,GAAA,GAAA,IAAA;EAEY,KAAA,EAAA,CAAA,YAAA,EAAA,YAAA,EAAA,GAAA,IAAA;EACE,OAAA,EAAA,CAAA,YAAA,EAAA,YAAA,EAAA,GAAA,IAAA;EACF,IAAA,EAAA,CAAA,aAAA,EAAA,YAAA,EAAA,EAAA,GAAA,IAAA;EAAY,KAAA,EAAA,CAAA,MAAA,EAAA,MAAA,EAAA,GAAA,IAAA;AAIpC,CAAA;KAAY,6BAAA;WACD;iBACM"}

package/dist/Notifications/types.d.mts

@@ -1,19 +0,0 @@
-import { Notification } from "../NotificationList/typings.mjs";
-import "@codecademy/gamut";
-
-//#region src/Notifications/types.d.ts
-type NotificationActions = {
-  clear: () => void;
-  click: (notification: Notification) => void;
-  dismiss: (notification: Notification) => void;
-  read: (notifications: Notification[]) => void;
-  track: (target: string) => void;
-};
-type AppHeaderNotificationSettings = {
-  actions: NotificationActions;
-  notifications: Notification[];
-  onEnable: () => void;
-};
-//#endregion
-export { AppHeaderNotificationSettings };
-//# sourceMappingURL=types.d.mts.map

package/dist/Notifications/types.d.mts.map

@@ -1 +0,0 @@
-{"version":3,"file":"types.d.mts","names":[],"sources":["../../src/Notifications/types.ts"],"sourcesContent":[],"mappings":";;;;KAIY,mBAAA;;EAAA,KAAA,EAAA,CAAA,YAAA,EAEY,YAFO,EAAA,GAAA,IAAA;EAEP,OAAA,EAAA,CAAA,YAAA,EACE,YADF,EAAA,GAAA,IAAA;EACE,IAAA,EAAA,CAAA,aAAA,EACF,YADE,EAAA,EAAA,GAAA,IAAA;EACF,KAAA,EAAA,CAAA,MAAA,EAAA,MAAA,EAAA,GAAA,IAAA;CAAY;AAIxB,KAAA,6BAAA,GAA6B;WAC9B;iBACM"}

package/dist/Notifications/useHeaderNotifications.cjs

@@ -1,39 +0,0 @@
-const require_rolldown_runtime = require('../_virtual/rolldown_runtime.cjs');
-const require_elements = require('../AppHeader/shared/elements.cjs');
-require('../AppHeader/shared/index.cjs');
-const require_NotificationBell = require('./NotificationBell.cjs');
-let react = require("react");
-
-//#region src/Notifications/useHeaderNotifications.tsx
-const useHeaderNotifications = ({ settings, Renderer }) => {
-	const [isOpen, setIsOpen] = (0, react.useState)(false);
-	const bellRef = (0, react.useRef)(null);
-	if (!settings) return [null, null];
-	const handleClose = async () => {
-		await setIsOpen(false);
-		await bellRef.current?.focus();
-	};
-	return [{
-		id: "notifications",
-		type: "render-element",
-		renderElement: () => /* @__PURE__ */ React.createElement(require_NotificationBell.NotificationBell, {
-			bellRef,
-			isOpen,
-			notifications: settings.notifications,
-			setIsOpen
-		})
-	}, /* @__PURE__ */ React.createElement(require_elements.AnimatedHeaderZone, {
-		visible: isOpen,
-		key: "notifications-content"
-	}, /* @__PURE__ */ React.createElement(Renderer, {
-		actions: settings.actions,
-		bellRef,
-		notifications: settings.notifications,
-		isOpen,
-		handleClose
-	}))];
-};
-
-//#endregion
-exports.useHeaderNotifications = useHeaderNotifications;
-//# sourceMappingURL=useHeaderNotifications.cjs.map

package/dist/Notifications/useHeaderNotifications.cjs.map

@@ -1 +0,0 @@
-{"version":3,"file":"useHeaderNotifications.cjs","names":["useRef","useState","AnimatedHeaderZone","NotificationBell","useHeaderNotifications","settings","Renderer","isOpen","setIsOpen","bellRef","handleClose","current","focus","id","type","renderElement","notifications","visible","key","actions"],"sources":["../../src/Notifications/useHeaderNotifications.tsx"],"sourcesContent":["import { ButtonBaseElements } from '@codecademy/gamut';\nimport { useRef, useState } from 'react';\n\nimport { AnimatedHeaderZone } from '../AppHeader/shared';\nimport { NotificationBell } from './NotificationBell';\nimport {\n  AppHeaderNotificationSettings,\n  NotificationsDropdownProps,\n} from './types';\n\nexport type HeaderNotificationProps = {\n  settings: AppHeaderNotificationSettings | undefined;\n  Renderer: React.ComponentType<NotificationsDropdownProps>;\n};\n\nexport const useHeaderNotifications = ({\n  settings,\n  Renderer,\n}: HeaderNotificationProps) => {\n  const [isOpen, setIsOpen] = useState(false);\n  const bellRef = useRef<ButtonBaseElements>(null);\n\n  if (!settings) {\n    return [null, null];\n  }\n\n  const handleClose = async () => {\n    await setIsOpen(false);\n    await bellRef.current?.focus();\n  };\n\n  return [\n    {\n      id: 'notifications',\n      type: 'render-element',\n      renderElement: () => (\n        <NotificationBell\n          bellRef={bellRef}\n          isOpen={isOpen}\n          notifications={settings.notifications}\n          setIsOpen={setIsOpen}\n        />\n      ),\n    },\n\n    <AnimatedHeaderZone visible={isOpen} key=\"notifications-content\">\n      <Renderer\n        actions={settings.actions}\n        bellRef={bellRef}\n        notifications={settings.notifications}\n        isOpen={isOpen}\n        handleClose={handleClose}\n      />\n    </AnimatedHeaderZone>,\n  ] as const;\n};\n"],"mappings":";;;;;;;AAeA,MAAaI,0BAA0B,EACrCC,UACAC,eACwB;CACxB,MAAM,CAACC,QAAQC,iCAAsB,MAAA;CACrC,MAAMC,4BAAqC,KAAA;AAE3C,KAAI,CAACJ,SACH,QAAO,CAAC,MAAM,KAAK;CAGrB,MAAMK,cAAc,YAAA;AAClB,QAAMF,UAAU,MAAA;AAChB,QAAMC,QAAQE,SAASC,OAAAA;;AAGzB,QAAO,CACL;EACEC,IAAI;EACJC,MAAM;EACNC,qBACE,sBAAA,cAACZ,2CAAAA;GACUM;GACDF;GACRS,eAAeX,SAASW;GACbR;;EAGjB,EAEA,sBAAA,cAACN,qCAAAA;EAAmBe,SAASV;EAAQW,KAAI;IACvC,sBAAA,cAACZ,UAAAA;EACCa,SAASd,SAASc;EACTV;EACTO,eAAeX,SAASW;EAChBT;EACKG;KAGlB"}

package/dist/Notifications/useHeaderNotifications.mjs

@@ -1,38 +0,0 @@
-import { AnimatedHeaderZone } from "../AppHeader/shared/elements.mjs";
-import "../AppHeader/shared/index.mjs";
-import { NotificationBell } from "./NotificationBell.mjs";
-import { useRef, useState } from "react";
-
-//#region src/Notifications/useHeaderNotifications.tsx
-const useHeaderNotifications = ({ settings, Renderer }) => {
-	const [isOpen, setIsOpen] = useState(false);
-	const bellRef = useRef(null);
-	if (!settings) return [null, null];
-	const handleClose = async () => {
-		await setIsOpen(false);
-		await bellRef.current?.focus();
-	};
-	return [{
-		id: "notifications",
-		type: "render-element",
-		renderElement: () => /* @__PURE__ */ React.createElement(NotificationBell, {
-			bellRef,
-			isOpen,
-			notifications: settings.notifications,
-			setIsOpen
-		})
-	}, /* @__PURE__ */ React.createElement(AnimatedHeaderZone, {
-		visible: isOpen,
-		key: "notifications-content"
-	}, /* @__PURE__ */ React.createElement(Renderer, {
-		actions: settings.actions,
-		bellRef,
-		notifications: settings.notifications,
-		isOpen,
-		handleClose
-	}))];
-};
-
-//#endregion
-export { useHeaderNotifications };
-//# sourceMappingURL=useHeaderNotifications.mjs.map

package/dist/Notifications/useHeaderNotifications.mjs.map

@@ -1 +0,0 @@
-{"version":3,"file":"useHeaderNotifications.mjs","names":["useRef","useState","AnimatedHeaderZone","NotificationBell","useHeaderNotifications","settings","Renderer","isOpen","setIsOpen","bellRef","handleClose","current","focus","id","type","renderElement","notifications","visible","key","actions"],"sources":["../../src/Notifications/useHeaderNotifications.tsx"],"sourcesContent":["import { ButtonBaseElements } from '@codecademy/gamut';\nimport { useRef, useState } from 'react';\n\nimport { AnimatedHeaderZone } from '../AppHeader/shared';\nimport { NotificationBell } from './NotificationBell';\nimport {\n  AppHeaderNotificationSettings,\n  NotificationsDropdownProps,\n} from './types';\n\nexport type HeaderNotificationProps = {\n  settings: AppHeaderNotificationSettings | undefined;\n  Renderer: React.ComponentType<NotificationsDropdownProps>;\n};\n\nexport const useHeaderNotifications = ({\n  settings,\n  Renderer,\n}: HeaderNotificationProps) => {\n  const [isOpen, setIsOpen] = useState(false);\n  const bellRef = useRef<ButtonBaseElements>(null);\n\n  if (!settings) {\n    return [null, null];\n  }\n\n  const handleClose = async () => {\n    await setIsOpen(false);\n    await bellRef.current?.focus();\n  };\n\n  return [\n    {\n      id: 'notifications',\n      type: 'render-element',\n      renderElement: () => (\n        <NotificationBell\n          bellRef={bellRef}\n          isOpen={isOpen}\n          notifications={settings.notifications}\n          setIsOpen={setIsOpen}\n        />\n      ),\n    },\n\n    <AnimatedHeaderZone visible={isOpen} key=\"notifications-content\">\n      <Renderer\n        actions={settings.actions}\n        bellRef={bellRef}\n        notifications={settings.notifications}\n        isOpen={isOpen}\n        handleClose={handleClose}\n      />\n    </AnimatedHeaderZone>,\n  ] as const;\n};\n"],"mappings":";;;;;;AAeA,MAAaI,0BAA0B,EACrCC,UACAC,eACwB;CACxB,MAAM,CAACC,QAAQC,aAAaP,SAAS,MAAA;CACrC,MAAMQ,UAAUT,OAA2B,KAAA;AAE3C,KAAI,CAACK,SACH,QAAO,CAAC,MAAM,KAAK;CAGrB,MAAMK,cAAc,YAAA;AAClB,QAAMF,UAAU,MAAA;AAChB,QAAMC,QAAQE,SAASC,OAAAA;;AAGzB,QAAO,CACL;EACEC,IAAI;EACJC,MAAM;EACNC,qBACE,sBAAA,cAACZ,kBAAAA;GACUM;GACDF;GACRS,eAAeX,SAASW;GACbR;;EAGjB,EAEA,sBAAA,cAACN,oBAAAA;EAAmBe,SAASV;EAAQW,KAAI;IACvC,sBAAA,cAACZ,UAAAA;EACCa,SAASd,SAASc;EACTV;EACTO,eAAeX,SAASW;EAChBT;EACKG;KAGlB"}

package/dist/Notifications/useNotificationButtons.cjs

@@ -1,46 +0,0 @@
-const require_rolldown_runtime = require('../_virtual/rolldown_runtime.cjs');
-const require_constants = require('./constants.cjs');
-let _codecademy_gamut = require("@codecademy/gamut");
-let react = require("react");
-let _codecademy_gamut_icons = require("@codecademy/gamut-icons");
-
-//#region src/Notifications/useNotificationButtons.tsx
-const useNotificationButtons = ({ actions, handleClose, notifications, notificationListRef }) => {
-	const [showMore, setShowMore] = (0, react.useState)(false);
-	const [displayLimit, amountAdjective] = showMore ? [notifications.length, "Less"] : [require_constants.defaultDisplayLimit, "More"];
-	const closeButton = /* @__PURE__ */ React.createElement(_codecademy_gamut.IconButton, {
-		icon: _codecademy_gamut_icons.MiniDeleteIcon,
-		onClick: handleClose,
-		tip: "Close"
-	});
-	if (notifications.length === 0) return {
-		clearAllButton: null,
-		closeButton,
-		showMoreButton: null,
-		notifications
-	};
-	return {
-		clearAllButton: notifications.length > 0 && (notifications.length <= displayLimit || showMore) ? /* @__PURE__ */ React.createElement(_codecademy_gamut.TextButton, {
-			onClick: () => {
-				actions.clear();
-				actions.track("notification_clear_all");
-				notificationListRef?.current?.focus();
-			},
-			"aria-label": `Clear all ${notifications.length} notifications`,
-			mr: 8
-		}, "Clear All") : null,
-		closeButton,
-		showMoreButton: notifications.length <= require_constants.defaultDisplayLimit ? null : /* @__PURE__ */ React.createElement(_codecademy_gamut.Box, { px: 32 }, /* @__PURE__ */ React.createElement(_codecademy_gamut.TextButton, { onClick: () => {
-			setShowMore(!showMore);
-			if (!showMore) {
-				actions.track("notification_show_more");
-				actions.read(notifications.slice(require_constants.defaultDisplayLimit));
-			}
-		} }, "Show ", amountAdjective)),
-		notifications: notifications.slice(0, displayLimit)
-	};
-};
-
-//#endregion
-exports.useNotificationButtons = useNotificationButtons;
-//# sourceMappingURL=useNotificationButtons.cjs.map

package/dist/Notifications/useNotificationButtons.cjs.map

@@ -1 +0,0 @@
-{"version":3,"file":"useNotificationButtons.cjs","names":["Box","IconButton","TextButton","MiniDeleteIcon","useState","defaultDisplayLimit","useNotificationButtons","actions","handleClose","notifications","notificationListRef","showMore","setShowMore","displayLimit","amountAdjective","length","closeButton","icon","onClick","tip","clearAllButton","showMoreButton","clear","track","current","focus","aria-label","mr","px","read","slice"],"sources":["../../src/Notifications/useNotificationButtons.tsx"],"sourcesContent":["import { Box, IconButton, TextButton } from '@codecademy/gamut';\nimport { MiniDeleteIcon } from '@codecademy/gamut-icons';\nimport { ReactElement, useState } from 'react';\n\nimport { defaultDisplayLimit } from './constants';\nimport { NotificationsProps } from './types';\n\ninterface NotificationButtons\n  extends Pick<NotificationsProps, 'notifications'> {\n  clearAllButton: ReactElement | null;\n  closeButton: ReactElement;\n  showMoreButton: ReactElement | null;\n}\n\nexport const useNotificationButtons = ({\n  actions,\n  handleClose,\n  notifications,\n  notificationListRef,\n}: NotificationsProps): NotificationButtons => {\n  const [showMore, setShowMore] = useState(false);\n  const [displayLimit, amountAdjective] = showMore\n    ? [notifications.length, 'Less']\n    : [defaultDisplayLimit, 'More'];\n\n  const closeButton = (\n    <IconButton icon={MiniDeleteIcon} onClick={handleClose} tip=\"Close\" />\n  );\n\n  if (notifications.length === 0) {\n    return {\n      clearAllButton: null,\n      closeButton,\n      showMoreButton: null,\n      notifications,\n    } as const;\n  }\n\n  const clearAllButton =\n    notifications.length > 0 &&\n    (notifications.length <= displayLimit || showMore) ? (\n      <TextButton\n        onClick={() => {\n          actions.clear();\n          actions.track('notification_clear_all');\n          notificationListRef?.current?.focus();\n        }}\n        aria-label={`Clear all ${notifications.length} notifications`}\n        mr={8}\n      >\n        Clear All\n      </TextButton>\n    ) : null;\n\n  const showMoreButton =\n    notifications.length <= defaultDisplayLimit ? null : (\n      <Box px={32}>\n        <TextButton\n          onClick={() => {\n            setShowMore(!showMore);\n\n            if (!showMore) {\n              actions.track('notification_show_more');\n              actions.read(notifications.slice(defaultDisplayLimit));\n            }\n          }}\n        >\n          Show {amountAdjective}\n        </TextButton>\n      </Box>\n    );\n\n  return {\n    clearAllButton,\n    closeButton,\n    showMoreButton,\n    notifications: notifications.slice(0, displayLimit),\n  } as const;\n};\n"],"mappings":";;;;;;;AAcA,MAAaM,0BAA0B,EACrCC,SACAC,aACAC,eACAC,0BACmB;CACnB,MAAM,CAACC,UAAUC,mCAAwB,MAAA;CACzC,MAAM,CAACC,cAAcC,mBAAmBH,WACpC,CAACF,cAAcM,QAAQ,OAAO,GAC9B,CAACV,uCAAqB,OAAO;CAEjC,MAAMW,cACJ,sBAAA,cAACf,8BAAAA;EAAWgB,MAAMd;EAAgBe,SAASV;EAAaW,KAAI;;AAG9D,KAAIV,cAAcM,WAAW,EAC3B,QAAO;EACLK,gBAAgB;EAChBJ;EACAK,gBAAgB;EAChBZ;EACF;AAqCF,QAAO;EACLW,gBAlCAX,cAAcM,SAAS,MACtBN,cAAcM,UAAUF,gBAAgBF,YACvC,sBAAA,cAACT,8BAAAA;GACCgB,eAAS;AACPX,YAAQe,OAAK;AACbf,YAAQgB,MAAM,yBAAA;AACdb,yBAAqBc,SAASC,OAAAA;;GAEhCC,cAAY,aAAajB,cAAcM,OAAO;GAC9CY,IAAI;KACL,YAAA,GAGC;EAsBJX;EACAK,gBApBAZ,cAAcM,UAAUV,wCAAsB,OAC5C,sBAAA,cAACL,uBAAAA,EAAI4B,IAAI,MACP,sBAAA,cAAC1B,8BAAAA,EACCgB,eAAS;AACPN,eAAY,CAACD,SAAAA;AAEb,OAAI,CAACA,UAAU;AACbJ,YAAQgB,MAAM,yBAAA;AACdhB,YAAQsB,KAAKpB,cAAcqB,MAAMzB,sCAAAA,CAAAA;;OAGtC,SACOS,gBAAAA,CAAAA;EASZL,eAAeA,cAAcqB,MAAM,GAAGjB,aAAAA;EACxC"}

package/dist/Notifications/useNotificationButtons.mjs

@@ -1,45 +0,0 @@
-import { defaultDisplayLimit } from "./constants.mjs";
-import { Box, IconButton, TextButton } from "@codecademy/gamut";
-import { useState } from "react";
-import { MiniDeleteIcon } from "@codecademy/gamut-icons";
-
-//#region src/Notifications/useNotificationButtons.tsx
-const useNotificationButtons = ({ actions, handleClose, notifications, notificationListRef }) => {
-	const [showMore, setShowMore] = useState(false);
-	const [displayLimit, amountAdjective] = showMore ? [notifications.length, "Less"] : [defaultDisplayLimit, "More"];
-	const closeButton = /* @__PURE__ */ React.createElement(IconButton, {
-		icon: MiniDeleteIcon,
-		onClick: handleClose,
-		tip: "Close"
-	});
-	if (notifications.length === 0) return {
-		clearAllButton: null,
-		closeButton,
-		showMoreButton: null,
-		notifications
-	};
-	return {
-		clearAllButton: notifications.length > 0 && (notifications.length <= displayLimit || showMore) ? /* @__PURE__ */ React.createElement(TextButton, {
-			onClick: () => {
-				actions.clear();
-				actions.track("notification_clear_all");
-				notificationListRef?.current?.focus();
-			},
-			"aria-label": `Clear all ${notifications.length} notifications`,
-			mr: 8
-		}, "Clear All") : null,
-		closeButton,
-		showMoreButton: notifications.length <= defaultDisplayLimit ? null : /* @__PURE__ */ React.createElement(Box, { px: 32 }, /* @__PURE__ */ React.createElement(TextButton, { onClick: () => {
-			setShowMore(!showMore);
-			if (!showMore) {
-				actions.track("notification_show_more");
-				actions.read(notifications.slice(defaultDisplayLimit));
-			}
-		} }, "Show ", amountAdjective)),
-		notifications: notifications.slice(0, displayLimit)
-	};
-};
-
-//#endregion
-export { useNotificationButtons };
-//# sourceMappingURL=useNotificationButtons.mjs.map

package/dist/Notifications/useNotificationButtons.mjs.map

@@ -1 +0,0 @@
-{"version":3,"file":"useNotificationButtons.mjs","names":["Box","IconButton","TextButton","MiniDeleteIcon","useState","defaultDisplayLimit","useNotificationButtons","actions","handleClose","notifications","notificationListRef","showMore","setShowMore","displayLimit","amountAdjective","length","closeButton","icon","onClick","tip","clearAllButton","showMoreButton","clear","track","current","focus","aria-label","mr","px","read","slice"],"sources":["../../src/Notifications/useNotificationButtons.tsx"],"sourcesContent":["import { Box, IconButton, TextButton } from '@codecademy/gamut';\nimport { MiniDeleteIcon } from '@codecademy/gamut-icons';\nimport { ReactElement, useState } from 'react';\n\nimport { defaultDisplayLimit } from './constants';\nimport { NotificationsProps } from './types';\n\ninterface NotificationButtons\n  extends Pick<NotificationsProps, 'notifications'> {\n  clearAllButton: ReactElement | null;\n  closeButton: ReactElement;\n  showMoreButton: ReactElement | null;\n}\n\nexport const useNotificationButtons = ({\n  actions,\n  handleClose,\n  notifications,\n  notificationListRef,\n}: NotificationsProps): NotificationButtons => {\n  const [showMore, setShowMore] = useState(false);\n  const [displayLimit, amountAdjective] = showMore\n    ? [notifications.length, 'Less']\n    : [defaultDisplayLimit, 'More'];\n\n  const closeButton = (\n    <IconButton icon={MiniDeleteIcon} onClick={handleClose} tip=\"Close\" />\n  );\n\n  if (notifications.length === 0) {\n    return {\n      clearAllButton: null,\n      closeButton,\n      showMoreButton: null,\n      notifications,\n    } as const;\n  }\n\n  const clearAllButton =\n    notifications.length > 0 &&\n    (notifications.length <= displayLimit || showMore) ? (\n      <TextButton\n        onClick={() => {\n          actions.clear();\n          actions.track('notification_clear_all');\n          notificationListRef?.current?.focus();\n        }}\n        aria-label={`Clear all ${notifications.length} notifications`}\n        mr={8}\n      >\n        Clear All\n      </TextButton>\n    ) : null;\n\n  const showMoreButton =\n    notifications.length <= defaultDisplayLimit ? null : (\n      <Box px={32}>\n        <TextButton\n          onClick={() => {\n            setShowMore(!showMore);\n\n            if (!showMore) {\n              actions.track('notification_show_more');\n              actions.read(notifications.slice(defaultDisplayLimit));\n            }\n          }}\n        >\n          Show {amountAdjective}\n        </TextButton>\n      </Box>\n    );\n\n  return {\n    clearAllButton,\n    closeButton,\n    showMoreButton,\n    notifications: notifications.slice(0, displayLimit),\n  } as const;\n};\n"],"mappings":";;;;;;AAcA,MAAaM,0BAA0B,EACrCC,SACAC,aACAC,eACAC,0BACmB;CACnB,MAAM,CAACC,UAAUC,eAAeR,SAAS,MAAA;CACzC,MAAM,CAACS,cAAcC,mBAAmBH,WACpC,CAACF,cAAcM,QAAQ,OAAO,GAC9B,CAACV,qBAAqB,OAAO;CAEjC,MAAMW,cACJ,sBAAA,cAACf,YAAAA;EAAWgB,MAAMd;EAAgBe,SAASV;EAAaW,KAAI;;AAG9D,KAAIV,cAAcM,WAAW,EAC3B,QAAO;EACLK,gBAAgB;EAChBJ;EACAK,gBAAgB;EAChBZ;EACF;AAqCF,QAAO;EACLW,gBAlCAX,cAAcM,SAAS,MACtBN,cAAcM,UAAUF,gBAAgBF,YACvC,sBAAA,cAACT,YAAAA;GACCgB,eAAS;AACPX,YAAQe,OAAK;AACbf,YAAQgB,MAAM,yBAAA;AACdb,yBAAqBc,SAASC,OAAAA;;GAEhCC,cAAY,aAAajB,cAAcM,OAAO;GAC9CY,IAAI;KACL,YAAA,GAGC;EAsBJX;EACAK,gBApBAZ,cAAcM,UAAUV,sBAAsB,OAC5C,sBAAA,cAACL,KAAAA,EAAI4B,IAAI,MACP,sBAAA,cAAC1B,YAAAA,EACCgB,eAAS;AACPN,eAAY,CAACD,SAAAA;AAEb,OAAI,CAACA,UAAU;AACbJ,YAAQgB,MAAM,yBAAA;AACdhB,YAAQsB,KAAKpB,cAAcqB,MAAMzB,oBAAAA,CAAAA;;OAGtC,SACOS,gBAAAA,CAAAA;EASZL,eAAeA,cAAcqB,MAAM,GAAGjB,aAAAA;EACxC"}