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

package/dist/PageSection/index.js

@@ -1,63 +1,67 @@
-import { Box, FlexBox, Text, TextButton } from "@codecademy/gamut";
-import "react";
-import { jsx, jsxs } from "react/jsx-runtime";
-
-//#region src/PageSection/index.tsx
+import { Box, FlexBox, Text, TextButton } from '@codecademy/gamut';
+import * as React from 'react';
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
 function isSectionButtonATextButton(button) {
-	return button.text !== void 0;
+  return button.text !== undefined;
 }
-const PageSection = ({ title, headerButton, headerSecondaryButton, footerButton, children }) => {
-	const renderSectionButton = (sectionButton) => {
-		if (!isSectionButtonATextButton(sectionButton)) return sectionButton;
-		const { text, ...buttonProps } = sectionButton;
-		return /* @__PURE__ */ jsx(TextButton, {
-			...buttonProps,
-			children: text
-		});
-	};
-	const maybeRenderHeaderButton = () => {
-		if (!headerButton) return null;
-		return /* @__PURE__ */ jsx(Box, {
-			ml: 4,
-			display: "inline",
-			children: renderSectionButton(headerButton)
-		});
-	};
-	const maybeRenderHeaderSecondaryButton = () => {
-		if (!headerSecondaryButton) return null;
-		return renderSectionButton(headerSecondaryButton);
-	};
-	const renderSectionHeader = () => /* @__PURE__ */ jsxs(FlexBox, {
-		height: "2.5rem",
-		mb: 8,
-		justifyContent: "space-between",
-		children: [/* @__PURE__ */ jsxs(FlexBox, {
-			alignItems: "center",
-			children: [/* @__PURE__ */ jsx(Text, {
-				as: "h2",
-				fontSize: 22,
-				children: title
-			}), maybeRenderHeaderButton()]
-		}), maybeRenderHeaderSecondaryButton()]
-	});
-	const maybeRenderSectionFooter = () => {
-		if (!footerButton) return null;
-		return /* @__PURE__ */ jsx(FlexBox, {
-			justifyContent: "flex-end",
-			mt: 16,
-			children: renderSectionButton(footerButton)
-		});
-	};
-	return /* @__PURE__ */ jsxs(FlexBox, {
-		flexDirection: "column",
-		mb: 48,
-		children: [
-			renderSectionHeader(),
-			children,
-			maybeRenderSectionFooter()
-		]
-	});
-};
-
-//#endregion
-export { PageSection };
+export const PageSection = ({
+  title,
+  headerButton,
+  headerSecondaryButton,
+  footerButton,
+  children
+}) => {
+  const renderSectionButton = sectionButton => {
+    if (!isSectionButtonATextButton(sectionButton)) return sectionButton;
+    const {
+      text,
+      ...buttonProps
+    } = sectionButton;
+    return /*#__PURE__*/_jsx(TextButton, {
+      ...buttonProps,
+      children: text
+    });
+  };
+  const maybeRenderHeaderButton = () => {
+    if (!headerButton) return null;
+    return /*#__PURE__*/_jsx(Box, {
+      ml: 4,
+      display: "inline",
+      children: renderSectionButton(headerButton)
+    });
+  };
+  const maybeRenderHeaderSecondaryButton = () => {
+    if (!headerSecondaryButton) return null;
+    return renderSectionButton(headerSecondaryButton);
+  };
+  const renderSectionHeader = () =>
+  /*#__PURE__*/
+  // Setting height directly to height of the buttons so if they are omitted
+  // the header remains the same height.
+  _jsxs(FlexBox, {
+    height: "2.5rem",
+    mb: 8,
+    justifyContent: "space-between",
+    children: [/*#__PURE__*/_jsxs(FlexBox, {
+      alignItems: "center",
+      children: [/*#__PURE__*/_jsx(Text, {
+        as: "h2",
+        fontSize: 22,
+        children: title
+      }), maybeRenderHeaderButton()]
+    }), maybeRenderHeaderSecondaryButton()]
+  });
+  const maybeRenderSectionFooter = () => {
+    if (!footerButton) return null;
+    return /*#__PURE__*/_jsx(FlexBox, {
+      justifyContent: "flex-end",
+      mt: 16,
+      children: renderSectionButton(footerButton)
+    });
+  };
+  return /*#__PURE__*/_jsxs(FlexBox, {
+    flexDirection: "column",
+    mb: 48,
+    children: [renderSectionHeader(), children, maybeRenderSectionFooter()]
+  });
+};

package/dist/PastDue/PastDueModalContents/index.d.ts

@@ -1,12 +1,8 @@
-import React from "react";
-
-//#region src/PastDue/PastDueModalContents/index.d.ts
-interface PastDueModalProps {
-  pastDueErrorCode: string;
-  isSilverPlan: boolean;
-  closeButton: React.ReactNode;
-  updatePaymentButton: React.ReactNode;
+import React from 'react';
+export interface PastDueModalProps {
+    pastDueErrorCode: string;
+    isSilverPlan: boolean;
+    closeButton: React.ReactNode;
+    updatePaymentButton: React.ReactNode;
 }
-declare const PastDueModalContents: React.FC<React.PropsWithChildren<PastDueModalProps>>;
-//#endregion
-export { PastDueModalContents, PastDueModalProps };
+export declare const PastDueModalContents: React.FC<React.PropsWithChildren<PastDueModalProps>>;

package/dist/PastDue/PastDueModalContents/index.js

@@ -1,26 +1,30 @@
-import { pastDueErrorMessages } from "../pastDueMessages.js";
-import { Box, FlexBox, Text } from "@codecademy/gamut";
-import React from "react";
-import { Fragment, jsx, jsxs } from "react/jsx-runtime";
-
-//#region src/PastDue/PastDueModalContents/index.tsx
-const PastDueModalContents = ({ pastDueErrorCode, isSilverPlan, closeButton, updatePaymentButton }) => {
-	const pastDueErrorMessage = pastDueErrorMessages(isSilverPlan, false)[pastDueErrorCode] || pastDueErrorMessages(isSilverPlan, false).default;
-	return /* @__PURE__ */ jsxs(Fragment, { children: [/* @__PURE__ */ jsx(FlexBox, {
-		column: true,
-		children: /* @__PURE__ */ jsxs(Box, { children: [/* @__PURE__ */ jsx(Text, {
-			mb: 12,
-			children: pastDueErrorMessage.text1
-		}), /* @__PURE__ */ jsx(Text, {
-			mb: 12,
-			children: pastDueErrorMessage.text2
-		})] })
-	}), /* @__PURE__ */ jsxs(FlexBox, {
-		justifyContent: "end",
-		alignItems: "end",
-		children: [closeButton, updatePaymentButton]
-	})] });
-};
-
-//#endregion
-export { PastDueModalContents };
+import { Box, FlexBox, Text } from '@codecademy/gamut';
+import React from 'react';
+import { pastDueErrorMessages } from '../pastDueMessages';
+import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-runtime";
+export const PastDueModalContents = ({
+  pastDueErrorCode,
+  isSilverPlan,
+  closeButton,
+  updatePaymentButton
+}) => {
+  const pastDueErrorMessage = pastDueErrorMessages(isSilverPlan, false)[pastDueErrorCode] || pastDueErrorMessages(isSilverPlan, false).default;
+  return /*#__PURE__*/_jsxs(_Fragment, {
+    children: [/*#__PURE__*/_jsx(FlexBox, {
+      column: true,
+      children: /*#__PURE__*/_jsxs(Box, {
+        children: [/*#__PURE__*/_jsx(Text, {
+          mb: 12,
+          children: pastDueErrorMessage.text1
+        }), /*#__PURE__*/_jsx(Text, {
+          mb: 12,
+          children: pastDueErrorMessage.text2
+        })]
+      })
+    }), /*#__PURE__*/_jsxs(FlexBox, {
+      justifyContent: "end",
+      alignItems: "end",
+      children: [closeButton, updatePaymentButton]
+    })]
+  });
+};

package/dist/PastDue/index.d.ts

@@ -1,3 +1,2 @@
-import { PastDueModalContents, PastDueModalProps } from "./PastDueModalContents/index.js";
-import { pastDueErrorMessages } from "./pastDueMessages.js";
-export { PastDueModalContents, PastDueModalProps, pastDueErrorMessages };
+export * from './PastDueModalContents';
+export * from './pastDueMessages';

package/dist/PastDue/index.js

@@ -1,4 +1,2 @@
-import { pastDueErrorMessages } from "./pastDueMessages.js";
-import { PastDueModalContents } from "./PastDueModalContents/index.js";
-
-export { PastDueModalContents, pastDueErrorMessages };
+export * from './PastDueModalContents';
+export * from './pastDueMessages';

package/dist/PastDue/pastDueMessages.d.ts

@@ -1,8 +1,6 @@
-//#region src/PastDue/pastDueMessages.d.ts
 interface PastDueErrorMessage {
-  text1: string;
-  text2: string | JSX.Element;
+    text1: string;
+    text2: string | JSX.Element;
 }
-declare const pastDueErrorMessages: (isSilverPlan: boolean, isAlert: boolean) => Record<string, PastDueErrorMessage>;
-//#endregion
-export { pastDueErrorMessages };
+export declare const pastDueErrorMessages: (isSilverPlan: boolean, isAlert: boolean) => Record<string, PastDueErrorMessage>;
+export {};

package/dist/PastDue/pastDueMessages.js

@@ -1,53 +1,48 @@
-import { Anchor } from "@codecademy/gamut";
-import styled from "@emotion/styled";
-import { Fragment, jsx, jsxs } from "react/jsx-runtime";
-
-//#region src/PastDue/pastDueMessages.tsx
-const StyledAnchor = styled(Anchor)`
-  ${({ theme, isAlert }) => isAlert ? `color: ${theme.colors.white}` : ""};
-`;
-const pastDueErrorMessages = (isSilverPlan, isAlert) => ({
-	insufficient_funds: {
-		text1: `Your payment did not go through due to insufficient funds.`,
-		text2: `To keep learning with Codecademy ${isSilverPlan ? "Plus" : "Pro"}, please update your payment method.`
-	},
-	declined: {
-		text1: `Your payment did not go through. Contact your bank or card issuer to find out more.`,
-		text2: `To keep learning with Codecademy ${isSilverPlan ? "Plus" : "Pro"}, please update your payment method.`
-	},
-	temporary_hold: {
-		text1: `Your payment method was placed on a temporary hold. Contact your bank or card issuer to find out more.`,
-		text2: `To keep learning with Codecademy ${isSilverPlan ? "Plus" : "Pro"}, please update your payment method.`
-	},
-	invalid_transaction: {
-		text1: `Your payment did not go through. Contact your bank or card issuer to find out more about possible transaction restrictions.`,
-		text2: `To keep learning with Codecademy ${isSilverPlan ? "Plus" : "Pro"}, please update your payment method.`
-	},
-	invalid_account_number: {
-		text1: `Your payment did not go through because your card details may be incorrect.`,
-		text2: `To keep learning with Codecademy ${isSilverPlan ? "Plus" : "Pro"}, please update your card details or payment method.`
-	},
-	expired_card: {
-		text1: `Your payment did not go through because your card is expired.`,
-		text2: `To keep learning with Codecademy ${isSilverPlan ? "Plus" : "Pro"}, please update your payment method.`
-	},
-	default: {
-		text1: `Your payment did not go through. To keep learning with Codecademy ${isSilverPlan ? "Plus" : "Pro"}, please update your payment method.`,
-		text2: /* @__PURE__ */ jsxs(Fragment, { children: [
-			"Let our",
-			" ",
-			/* @__PURE__ */ jsx(StyledAnchor, {
-				href: "https://help.codecademy.com/hc/en-us",
-				target: "_blank",
-				rel: "noreferrer",
-				isAlert,
-				children: "customer support"
-			}),
-			" ",
-			"team know if you have further questions."
-		] })
-	}
-});
-
-//#endregion
-export { pastDueErrorMessages };
+import _styled from "@emotion/styled/base";
+import { Anchor } from '@codecademy/gamut';
+import { jsx as _jsx, Fragment as _Fragment, jsxs as _jsxs } from "react/jsx-runtime";
+const StyledAnchor = /*#__PURE__*/_styled(Anchor, {
+  target: "ej6f6si0",
+  label: "StyledAnchor"
+})(({
+  theme,
+  isAlert
+}) => isAlert ? `color: ${theme.colors.white}` : '', ";" + (process.env.NODE_ENV === "production" ? "" : "/*# sourceMappingURL=data:application/json;charset=utf-8;base64,eyJ2ZXJzaW9uIjozLCJzb3VyY2VzIjpbIi4uLy4uL3NyYy9QYXN0RHVlL3Bhc3REdWVNZXNzYWdlcy50c3giXSwibmFtZXMiOltdLCJtYXBwaW5ncyI6IkFBUXlEIiwiZmlsZSI6Ii4uLy4uL3NyYy9QYXN0RHVlL3Bhc3REdWVNZXNzYWdlcy50c3giLCJzb3VyY2VzQ29udGVudCI6WyJpbXBvcnQgeyBBbmNob3IgfSBmcm9tICdAY29kZWNhZGVteS9nYW11dCc7XG5pbXBvcnQgc3R5bGVkIGZyb20gJ0BlbW90aW9uL3N0eWxlZCc7XG5cbmludGVyZmFjZSBQYXN0RHVlRXJyb3JNZXNzYWdlIHtcbiAgdGV4dDE6IHN0cmluZztcbiAgdGV4dDI6IHN0cmluZyB8IEpTWC5FbGVtZW50O1xufVxuXG5jb25zdCBTdHlsZWRBbmNob3IgPSBzdHlsZWQoQW5jaG9yKTx7IGlzQWxlcnQ6IGJvb2xlYW4gfT5gXG4gICR7KHsgdGhlbWUsIGlzQWxlcnQgfSkgPT4gKGlzQWxlcnQgPyBgY29sb3I6ICR7dGhlbWUuY29sb3JzLndoaXRlfWAgOiAnJyl9O1xuYDtcblxuZXhwb3J0IGNvbnN0IHBhc3REdWVFcnJvck1lc3NhZ2VzID0gKFxuICBpc1NpbHZlclBsYW46IGJvb2xlYW4sXG4gIGlzQWxlcnQ6IGJvb2xlYW5cbik6IFJlY29yZDxzdHJpbmcsIFBhc3REdWVFcnJvck1lc3NhZ2U+ID0+ICh7XG4gIGluc3VmZmljaWVudF9mdW5kczoge1xuICAgIHRleHQxOiBgWW91ciBwYXltZW50IGRpZCBub3QgZ28gdGhyb3VnaCBkdWUgdG8gaW5zdWZmaWNpZW50IGZ1bmRzLmAsXG4gICAgdGV4dDI6IGBUbyBrZWVwIGxlYXJuaW5nIHdpdGggQ29kZWNhZGVteSAke1xuICAgICAgaXNTaWx2ZXJQbGFuID8gJ1BsdXMnIDogJ1BybydcbiAgICB9LCBwbGVhc2UgdXBkYXRlIHlvdXIgcGF5bWVudCBtZXRob2QuYCxcbiAgfSxcbiAgZGVjbGluZWQ6IHtcbiAgICB0ZXh0MTogYFlvdXIgcGF5bWVudCBkaWQgbm90IGdvIHRocm91Z2guIENvbnRhY3QgeW91ciBiYW5rIG9yIGNhcmQgaXNzdWVyIHRvIGZpbmQgb3V0IG1vcmUuYCxcbiAgICB0ZXh0MjogYFRvIGtlZXAgbGVhcm5pbmcgd2l0aCBDb2RlY2FkZW15ICR7XG4gICAgICBpc1NpbHZlclBsYW4gPyAnUGx1cycgOiAnUHJvJ1xuICAgIH0sIHBsZWFzZSB1cGRhdGUgeW91ciBwYXltZW50IG1ldGhvZC5gLFxuICB9LFxuICB0ZW1wb3JhcnlfaG9sZDoge1xuICAgIHRleHQxOiBgWW91ciBwYXltZW50IG1ldGhvZCB3YXMgcGxhY2VkIG9uIGEgdGVtcG9yYXJ5IGhvbGQuIENvbnRhY3QgeW91ciBiYW5rIG9yIGNhcmQgaXNzdWVyIHRvIGZpbmQgb3V0IG1vcmUuYCxcbiAgICB0ZXh0MjogYFRvIGtlZXAgbGVhcm5pbmcgd2l0aCBDb2RlY2FkZW15ICR7XG4gICAgICBpc1NpbHZlclBsYW4gPyAnUGx1cycgOiAnUHJvJ1xuICAgIH0sIHBsZWFzZSB1cGRhdGUgeW91ciBwYXltZW50IG1ldGhvZC5gLFxuICB9LFxuICBpbnZhbGlkX3RyYW5zYWN0aW9uOiB7XG4gICAgdGV4dDE6IGBZb3VyIHBheW1lbnQgZGlkIG5vdCBnbyB0aHJvdWdoLiBDb250YWN0IHlvdXIgYmFuayBvciBjYXJkIGlzc3VlciB0byBmaW5kIG91dCBtb3JlIGFib3V0IHBvc3NpYmxlIHRyYW5zYWN0aW9uIHJlc3RyaWN0aW9ucy5gLFxuICAgIHRleHQyOiBgVG8ga2VlcCBsZWFybmluZyB3aXRoIENvZGVjYWRlbXkgJHtcbiAgICAgIGlzU2lsdmVyUGxhbiA/ICdQbHVzJyA6ICdQcm8nXG4gICAgfSwgcGxlYXNlIHVwZGF0ZSB5b3VyIHBheW1lbnQgbWV0aG9kLmAsXG4gIH0sXG4gIGludmFsaWRfYWNjb3VudF9udW1iZXI6IHtcbiAgICB0ZXh0MTogYFlvdXIgcGF5bWVudCBkaWQgbm90IGdvIHRocm91Z2ggYmVjYXVzZSB5b3VyIGNhcmQgZGV0YWlscyBtYXkgYmUgaW5jb3JyZWN0LmAsXG4gICAgdGV4dDI6IGBUbyBrZWVwIGxlYXJuaW5nIHdpdGggQ29kZWNhZGVteSAke1xuICAgICAgaXNTaWx2ZXJQbGFuID8gJ1BsdXMnIDogJ1BybydcbiAgICB9LCBwbGVhc2UgdXBkYXRlIHlvdXIgY2FyZCBkZXRhaWxzIG9yIHBheW1lbnQgbWV0aG9kLmAsXG4gIH0sXG4gIGV4cGlyZWRfY2FyZDoge1xuICAgIHRleHQxOiBgWW91ciBwYXltZW50IGRpZCBub3QgZ28gdGhyb3VnaCBiZWNhdXNlIHlvdXIgY2FyZCBpcyBleHBpcmVkLmAsXG4gICAgdGV4dDI6IGBUbyBrZWVwIGxlYXJuaW5nIHdpdGggQ29kZWNhZGVteSAke1xuICAgICAgaXNTaWx2ZXJQbGFuID8gJ1BsdXMnIDogJ1BybydcbiAgICB9LCBwbGVhc2UgdXBkYXRlIHlvdXIgcGF5bWVudCBtZXRob2QuYCxcbiAgfSxcbiAgZGVmYXVsdDoge1xuICAgIHRleHQxOiBgWW91ciBwYXltZW50IGRpZCBub3QgZ28gdGhyb3VnaC4gVG8ga2VlcCBsZWFybmluZyB3aXRoIENvZGVjYWRlbXkgJHtcbiAgICAgIGlzU2lsdmVyUGxhbiA/ICdQbHVzJyA6ICdQcm8nXG4gICAgfSwgcGxlYXNlIHVwZGF0ZSB5b3VyIHBheW1lbnQgbWV0aG9kLmAsXG4gICAgdGV4dDI6IChcbiAgICAgIDw+XG4gICAgICAgIExldCBvdXJ7JyAnfVxuICAgICAgICA8U3R5bGVkQW5jaG9yXG4gICAgICAgICAgaHJlZj1cImh0dHBzOi8vaGVscC5jb2RlY2FkZW15LmNvbS9oYy9lbi11c1wiXG4gICAgICAgICAgdGFyZ2V0PVwiX2JsYW5rXCJcbiAgICAgICAgICByZWw9XCJub3JlZmVycmVyXCJcbiAgICAgICAgICBpc0FsZXJ0PXtpc0FsZXJ0fVxuICAgICAgICA+XG4gICAgICAgICAgY3VzdG9tZXIgc3VwcG9ydFxuICAgICAgICA8L1N0eWxlZEFuY2hvcj57JyAnfVxuICAgICAgICB0ZWFtIGtub3cgaWYgeW91IGhhdmUgZnVydGhlciBxdWVzdGlvbnMuXG4gICAgICA8Lz5cbiAgICApLFxuICB9LFxufSk7XG4iXX0= */"));
+export const pastDueErrorMessages = (isSilverPlan, isAlert) => ({
+  insufficient_funds: {
+    text1: `Your payment did not go through due to insufficient funds.`,
+    text2: `To keep learning with Codecademy ${isSilverPlan ? 'Plus' : 'Pro'}, please update your payment method.`
+  },
+  declined: {
+    text1: `Your payment did not go through. Contact your bank or card issuer to find out more.`,
+    text2: `To keep learning with Codecademy ${isSilverPlan ? 'Plus' : 'Pro'}, please update your payment method.`
+  },
+  temporary_hold: {
+    text1: `Your payment method was placed on a temporary hold. Contact your bank or card issuer to find out more.`,
+    text2: `To keep learning with Codecademy ${isSilverPlan ? 'Plus' : 'Pro'}, please update your payment method.`
+  },
+  invalid_transaction: {
+    text1: `Your payment did not go through. Contact your bank or card issuer to find out more about possible transaction restrictions.`,
+    text2: `To keep learning with Codecademy ${isSilverPlan ? 'Plus' : 'Pro'}, please update your payment method.`
+  },
+  invalid_account_number: {
+    text1: `Your payment did not go through because your card details may be incorrect.`,
+    text2: `To keep learning with Codecademy ${isSilverPlan ? 'Plus' : 'Pro'}, please update your card details or payment method.`
+  },
+  expired_card: {
+    text1: `Your payment did not go through because your card is expired.`,
+    text2: `To keep learning with Codecademy ${isSilverPlan ? 'Plus' : 'Pro'}, please update your payment method.`
+  },
+  default: {
+    text1: `Your payment did not go through. To keep learning with Codecademy ${isSilverPlan ? 'Plus' : 'Pro'}, please update your payment method.`,
+    text2: /*#__PURE__*/_jsxs(_Fragment, {
+      children: ["Let our", ' ', /*#__PURE__*/_jsx(StyledAnchor, {
+        href: "https://help.codecademy.com/hc/en-us",
+        target: "_blank",
+        rel: "noreferrer",
+        isAlert: isAlert,
+        children: "customer support"
+      }), ' ', "team know if you have further questions."]
+    })
+  }
+});

package/dist/PausableImage/BaseImage/index.d.ts

@@ -0,0 +1,15 @@
+import * as React from 'react';
+export interface BaseImageProps {
+    alt: string;
+    src: string;
+}
+export declare const Container: import("@emotion/styled").StyledComponent<{
+    theme?: import("@emotion/react").Theme;
+    as?: React.ElementType;
+}, React.DetailedHTMLProps<React.HTMLAttributes<HTMLDivElement>, HTMLDivElement>, {}>;
+export declare const PlayingImage: import("@emotion/styled").StyledComponent<{
+    theme?: import("@emotion/react").Theme;
+    as?: React.ElementType;
+}, React.DetailedHTMLProps<React.ImgHTMLAttributes<HTMLImageElement>, HTMLImageElement>, {}>;
+export declare const BaseImage: React.FC<BaseImageProps>;
+export default BaseImage;

package/dist/PausableImage/BaseImage/index.js

@@ -1,70 +1,54 @@
-import { imageStyles } from "../index.js";
-import { FillButton, HiddenText } from "@codecademy/gamut";
-import styled from "@emotion/styled";
-import { useState } from "react";
-import { jsx, jsxs } from "react/jsx-runtime";
-import { PauseIcon, PlayIcon } from "@codecademy/gamut-icons";
-import Freezeframe from "react-freezeframe";
-
-//#region src/PausableImage/BaseImage/index.tsx
-const Container = styled.div`
-  align-items: center;
-  justify-content: center;
-  height: 100%;
-  display: flex;
-  position: relative;
-  width: 100%;
-
-  > img,
-  > .react-freezeframe,
-  > .react-freezeframe img {
-    max-width: 100%;
-  }
-  .ff-container .ff-canvas {
-    transition: none;
-  }
-  .ff-loading-icon::before {
-    display: none;
-  }
-`;
-const PlayingImage = imageStyles;
-const StyledFreezeframe = styled(Freezeframe)(imageStyles);
-const BaseImage = ({ alt, ...rest }) => {
-	const [paused, setPaused] = useState(false);
-	const [liveText, buttonLabel, Icon, Image] = paused ? [
-		`${alt}, paused`,
-		"Play animated image",
-		PlayIcon,
-		StyledFreezeframe
-	] : [
-		`${alt}, playing`,
-		"Pause animated image",
-		PauseIcon,
-		PlayingImage
-	];
-	return /* @__PURE__ */ jsxs(Container, { children: [
-		/* @__PURE__ */ jsx(Image, {
-			alt,
-			...rest
-		}),
-		/* @__PURE__ */ jsx(HiddenText, {
-			"aria-live": "polite",
-			children: alt ? liveText : buttonLabel
-		}),
-		/* @__PURE__ */ jsx(FillButton, {
-			bottom: 0,
-			m: 8,
-			onClick: () => setPaused(!paused),
-			position: "absolute",
-			right: 0,
-			variant: "secondary",
-			zIndex: 1,
-			"aria-label": buttonLabel,
-			children: /* @__PURE__ */ jsx(Icon, { color: "currentColor" })
-		})
-	] });
+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 { FillButton, HiddenText } from '@codecademy/gamut';
+import { PauseIcon, PlayIcon } from '@codecademy/gamut-icons';
+import { useState } from 'react';
+import * as React from 'react';
+import Freezeframe from 'react-freezeframe';
+import { imageStyles } from '..';
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+export const Container = /*#__PURE__*/_styled("div", {
+  target: "e1oynmvg1",
+  label: "Container"
+})(process.env.NODE_ENV === "production" ? {
+  name: "1v365f0",
+  styles: "align-items:center;justify-content:center;height:100%;display:flex;position:relative;width:100%;>img,>.react-freezeframe,>.react-freezeframe img{max-width:100%;}.ff-container .ff-canvas{transition:none;}.ff-loading-icon::before{display:none;}"
+} : {
+  name: "1v365f0",
+  styles: "align-items:center;justify-content:center;height:100%;display:flex;position:relative;width:100%;>img,>.react-freezeframe,>.react-freezeframe img{max-width:100%;}.ff-container .ff-canvas{transition:none;}.ff-loading-icon::before{display:none;}/*# sourceMappingURL=data:application/json;charset=utf-8;base64,eyJ2ZXJzaW9uIjozLCJzb3VyY2VzIjpbIi4uLy4uLy4uL3NyYy9QYXVzYWJsZUltYWdlL0Jhc2VJbWFnZS9pbmRleC50c3giXSwibmFtZXMiOltdLCJtYXBwaW5ncyI6IkFBY21DIiwiZmlsZSI6Ii4uLy4uLy4uL3NyYy9QYXVzYWJsZUltYWdlL0Jhc2VJbWFnZS9pbmRleC50c3giLCJzb3VyY2VzQ29udGVudCI6WyJpbXBvcnQgeyBGaWxsQnV0dG9uLCBIaWRkZW5UZXh0IH0gZnJvbSAnQGNvZGVjYWRlbXkvZ2FtdXQnO1xuaW1wb3J0IHsgUGF1c2VJY29uLCBQbGF5SWNvbiB9IGZyb20gJ0Bjb2RlY2FkZW15L2dhbXV0LWljb25zJztcbmltcG9ydCBzdHlsZWQgZnJvbSAnQGVtb3Rpb24vc3R5bGVkJztcbmltcG9ydCB7IHVzZVN0YXRlIH0gZnJvbSAncmVhY3QnO1xuaW1wb3J0ICogYXMgUmVhY3QgZnJvbSAncmVhY3QnO1xuaW1wb3J0IEZyZWV6ZWZyYW1lIGZyb20gJ3JlYWN0LWZyZWV6ZWZyYW1lJztcblxuaW1wb3J0IHsgaW1hZ2VTdHlsZXMgfSBmcm9tICcuLic7XG5cbmV4cG9ydCBpbnRlcmZhY2UgQmFzZUltYWdlUHJvcHMge1xuICBhbHQ6IHN0cmluZztcbiAgc3JjOiBzdHJpbmc7XG59XG5cbmV4cG9ydCBjb25zdCBDb250YWluZXIgPSBzdHlsZWQuZGl2YFxuICBhbGlnbi1pdGVtczogY2VudGVyO1xuICBqdXN0aWZ5LWNvbnRlbnQ6IGNlbnRlcjtcbiAgaGVpZ2h0OiAxMDAlO1xuICBkaXNwbGF5OiBmbGV4O1xuICBwb3NpdGlvbjogcmVsYXRpdmU7XG4gIHdpZHRoOiAxMDAlO1xuXG4gID4gaW1nLFxuICA+IC5yZWFjdC1mcmVlemVmcmFtZSxcbiAgPiAucmVhY3QtZnJlZXplZnJhbWUgaW1nIHtcbiAgICBtYXgtd2lkdGg6IDEwMCU7XG4gIH1cbiAgLmZmLWNvbnRhaW5lciAuZmYtY2FudmFzIHtcbiAgICB0cmFuc2l0aW9uOiBub25lO1xuICB9XG4gIC5mZi1sb2FkaW5nLWljb246OmJlZm9yZSB7XG4gICAgZGlzcGxheTogbm9uZTtcbiAgfVxuYDtcblxuZXhwb3J0IGNvbnN0IFBsYXlpbmdJbWFnZSA9IGltYWdlU3R5bGVzO1xuXG5jb25zdCBTdHlsZWRGcmVlemVmcmFtZSA9IHN0eWxlZChGcmVlemVmcmFtZSkoaW1hZ2VTdHlsZXMpO1xuXG5leHBvcnQgY29uc3QgQmFzZUltYWdlOiBSZWFjdC5GQzxCYXNlSW1hZ2VQcm9wcz4gPSAoeyBhbHQsIC4uLnJlc3QgfSkgPT4ge1xuICBjb25zdCBbcGF1c2VkLCBzZXRQYXVzZWRdID0gdXNlU3RhdGUoZmFsc2UpO1xuXG4gIGNvbnN0IFtsaXZlVGV4dCwgYnV0dG9uTGFiZWwsIEljb24sIEltYWdlXSA9IHBhdXNlZFxuICAgID8gW2Ake2FsdH0sIHBhdXNlZGAsICdQbGF5IGFuaW1hdGVkIGltYWdlJywgUGxheUljb24sIFN0eWxlZEZyZWV6ZWZyYW1lXVxuICAgIDogW2Ake2FsdH0sIHBsYXlpbmdgLCAnUGF1c2UgYW5pbWF0ZWQgaW1hZ2UnLCBQYXVzZUljb24sIFBsYXlpbmdJbWFnZV07XG5cbiAgcmV0dXJuIChcbiAgICA8Q29udGFpbmVyPlxuICAgICAgPEltYWdlIGFsdD17YWx0fSB7Li4ucmVzdH0gLz5cbiAgICAgIHsvKiBlbnN1cmUgcHJvcGVyIGZhbGwgYmFjayBsYWJlbCBpZiBhbiBlbXB0eSBzdHJpbmcgaXMgZ2l2ZW4gYXMgYWx0ICovfVxuICAgICAgPEhpZGRlblRleHQgYXJpYS1saXZlPVwicG9saXRlXCI+e2FsdCA/IGxpdmVUZXh0IDogYnV0dG9uTGFiZWx9PC9IaWRkZW5UZXh0PlxuICAgICAgPEZpbGxCdXR0b25cbiAgICAgICAgYm90dG9tPXswfVxuICAgICAgICBtPXs4fVxuICAgICAgICBvbkNsaWNrPXsoKSA9PiBzZXRQYXVzZWQoIXBhdXNlZCl9XG4gICAgICAgIHBvc2l0aW9uPVwiYWJzb2x1dGVcIlxuICAgICAgICByaWdodD17MH1cbiAgICAgICAgdmFyaWFudD1cInNlY29uZGFyeVwiXG4gICAgICAgIHpJbmRleD17MX1cbiAgICAgICAgYXJpYS1sYWJlbD17YnV0dG9uTGFiZWx9XG4gICAgICA+XG4gICAgICAgIDxJY29uIGNvbG9yPVwiY3VycmVudENvbG9yXCIgLz5cbiAgICAgIDwvRmlsbEJ1dHRvbj5cbiAgICA8L0NvbnRhaW5lcj5cbiAgKTtcbn07XG5cbmV4cG9ydCBkZWZhdWx0IEJhc2VJbWFnZTtcbiJdfQ== */",
+  toString: _EMOTION_STRINGIFIED_CSS_ERROR__
+});
+export const PlayingImage = imageStyles;
+const StyledFreezeframe = /*#__PURE__*/_styled(Freezeframe, {
+  target: "e1oynmvg0",
+  label: "StyledFreezeframe"
+})(imageStyles, process.env.NODE_ENV === "production" ? "" : "/*# sourceMappingURL=data:application/json;charset=utf-8;base64,eyJ2ZXJzaW9uIjozLCJzb3VyY2VzIjpbIi4uLy4uLy4uL3NyYy9QYXVzYWJsZUltYWdlL0Jhc2VJbWFnZS9pbmRleC50c3giXSwibmFtZXMiOltdLCJtYXBwaW5ncyI6IkFBcUMwQiIsImZpbGUiOiIuLi8uLi8uLi9zcmMvUGF1c2FibGVJbWFnZS9CYXNlSW1hZ2UvaW5kZXgudHN4Iiwic291cmNlc0NvbnRlbnQiOlsiaW1wb3J0IHsgRmlsbEJ1dHRvbiwgSGlkZGVuVGV4dCB9IGZyb20gJ0Bjb2RlY2FkZW15L2dhbXV0JztcbmltcG9ydCB7IFBhdXNlSWNvbiwgUGxheUljb24gfSBmcm9tICdAY29kZWNhZGVteS9nYW11dC1pY29ucyc7XG5pbXBvcnQgc3R5bGVkIGZyb20gJ0BlbW90aW9uL3N0eWxlZCc7XG5pbXBvcnQgeyB1c2VTdGF0ZSB9IGZyb20gJ3JlYWN0JztcbmltcG9ydCAqIGFzIFJlYWN0IGZyb20gJ3JlYWN0JztcbmltcG9ydCBGcmVlemVmcmFtZSBmcm9tICdyZWFjdC1mcmVlemVmcmFtZSc7XG5cbmltcG9ydCB7IGltYWdlU3R5bGVzIH0gZnJvbSAnLi4nO1xuXG5leHBvcnQgaW50ZXJmYWNlIEJhc2VJbWFnZVByb3BzIHtcbiAgYWx0OiBzdHJpbmc7XG4gIHNyYzogc3RyaW5nO1xufVxuXG5leHBvcnQgY29uc3QgQ29udGFpbmVyID0gc3R5bGVkLmRpdmBcbiAgYWxpZ24taXRlbXM6IGNlbnRlcjtcbiAganVzdGlmeS1jb250ZW50OiBjZW50ZXI7XG4gIGhlaWdodDogMTAwJTtcbiAgZGlzcGxheTogZmxleDtcbiAgcG9zaXRpb246IHJlbGF0aXZlO1xuICB3aWR0aDogMTAwJTtcblxuICA+IGltZyxcbiAgPiAucmVhY3QtZnJlZXplZnJhbWUsXG4gID4gLnJlYWN0LWZyZWV6ZWZyYW1lIGltZyB7XG4gICAgbWF4LXdpZHRoOiAxMDAlO1xuICB9XG4gIC5mZi1jb250YWluZXIgLmZmLWNhbnZhcyB7XG4gICAgdHJhbnNpdGlvbjogbm9uZTtcbiAgfVxuICAuZmYtbG9hZGluZy1pY29uOjpiZWZvcmUge1xuICAgIGRpc3BsYXk6IG5vbmU7XG4gIH1cbmA7XG5cbmV4cG9ydCBjb25zdCBQbGF5aW5nSW1hZ2UgPSBpbWFnZVN0eWxlcztcblxuY29uc3QgU3R5bGVkRnJlZXplZnJhbWUgPSBzdHlsZWQoRnJlZXplZnJhbWUpKGltYWdlU3R5bGVzKTtcblxuZXhwb3J0IGNvbnN0IEJhc2VJbWFnZTogUmVhY3QuRkM8QmFzZUltYWdlUHJvcHM+ID0gKHsgYWx0LCAuLi5yZXN0IH0pID0+IHtcbiAgY29uc3QgW3BhdXNlZCwgc2V0UGF1c2VkXSA9IHVzZVN0YXRlKGZhbHNlKTtcblxuICBjb25zdCBbbGl2ZVRleHQsIGJ1dHRvbkxhYmVsLCBJY29uLCBJbWFnZV0gPSBwYXVzZWRcbiAgICA/IFtgJHthbHR9LCBwYXVzZWRgLCAnUGxheSBhbmltYXRlZCBpbWFnZScsIFBsYXlJY29uLCBTdHlsZWRGcmVlemVmcmFtZV1cbiAgICA6IFtgJHthbHR9LCBwbGF5aW5nYCwgJ1BhdXNlIGFuaW1hdGVkIGltYWdlJywgUGF1c2VJY29uLCBQbGF5aW5nSW1hZ2VdO1xuXG4gIHJldHVybiAoXG4gICAgPENvbnRhaW5lcj5cbiAgICAgIDxJbWFnZSBhbHQ9e2FsdH0gey4uLnJlc3R9IC8+XG4gICAgICB7LyogZW5zdXJlIHByb3BlciBmYWxsIGJhY2sgbGFiZWwgaWYgYW4gZW1wdHkgc3RyaW5nIGlzIGdpdmVuIGFzIGFsdCAqL31cbiAgICAgIDxIaWRkZW5UZXh0IGFyaWEtbGl2ZT1cInBvbGl0ZVwiPnthbHQgPyBsaXZlVGV4dCA6IGJ1dHRvbkxhYmVsfTwvSGlkZGVuVGV4dD5cbiAgICAgIDxGaWxsQnV0dG9uXG4gICAgICAgIGJvdHRvbT17MH1cbiAgICAgICAgbT17OH1cbiAgICAgICAgb25DbGljaz17KCkgPT4gc2V0UGF1c2VkKCFwYXVzZWQpfVxuICAgICAgICBwb3NpdGlvbj1cImFic29sdXRlXCJcbiAgICAgICAgcmlnaHQ9ezB9XG4gICAgICAgIHZhcmlhbnQ9XCJzZWNvbmRhcnlcIlxuICAgICAgICB6SW5kZXg9ezF9XG4gICAgICAgIGFyaWEtbGFiZWw9e2J1dHRvbkxhYmVsfVxuICAgICAgPlxuICAgICAgICA8SWNvbiBjb2xvcj1cImN1cnJlbnRDb2xvclwiIC8+XG4gICAgICA8L0ZpbGxCdXR0b24+XG4gICAgPC9Db250YWluZXI+XG4gICk7XG59O1xuXG5leHBvcnQgZGVmYXVsdCBCYXNlSW1hZ2U7XG4iXX0= */");
+export const BaseImage = ({
+  alt,
+  ...rest
+}) => {
+  const [paused, setPaused] = useState(false);
+  const [liveText, buttonLabel, Icon, Image] = paused ? [`${alt}, paused`, 'Play animated image', PlayIcon, StyledFreezeframe] : [`${alt}, playing`, 'Pause animated image', PauseIcon, PlayingImage];
+  return /*#__PURE__*/_jsxs(Container, {
+    children: [/*#__PURE__*/_jsx(Image, {
+      alt: alt,
+      ...rest
+    }), /*#__PURE__*/_jsx(HiddenText, {
+      "aria-live": "polite",
+      children: alt ? liveText : buttonLabel
+    }), /*#__PURE__*/_jsx(FillButton, {
+      bottom: 0,
+      m: 8,
+      onClick: () => setPaused(!paused),
+      position: "absolute",
+      right: 0,
+      variant: "secondary",
+      zIndex: 1,
+      "aria-label": buttonLabel,
+      children: /*#__PURE__*/_jsx(Icon, {
+        color: "currentColor"
+      })
+    })]
+  });
 };
-var BaseImage_default = BaseImage;
-
-//#endregion
-export { BaseImage, Container, PlayingImage, BaseImage_default as default };
+export default BaseImage;

package/dist/PausableImage/index.d.ts

@@ -1,16 +1,11 @@
-import * as _emotion_styled2 from "@emotion/styled";
-import * as React$1 from "react";
-import * as _emotion_react7 from "@emotion/react";
-
-//#region src/PausableImage/index.d.ts
+import * as React from 'react';
 interface PauseableImageProps {
-  src: string;
-  alt: string;
+    src: string;
+    alt: string;
 }
-declare const imageStyles: _emotion_styled2.StyledComponent<{
-  theme?: _emotion_react7.Theme;
-  as?: React$1.ElementType;
-}, React$1.DetailedHTMLProps<React$1.ImgHTMLAttributes<HTMLImageElement>, HTMLImageElement>, {}>;
-declare const PausableImage: React$1.FC<PauseableImageProps>;
-//#endregion
-export { PausableImage, imageStyles };
+export declare const imageStyles: import("@emotion/styled").StyledComponent<{
+    theme?: import("@emotion/react").Theme;
+    as?: React.ElementType;
+}, React.DetailedHTMLProps<React.ImgHTMLAttributes<HTMLImageElement>, HTMLImageElement>, {}>;
+export declare const PausableImage: React.FC<PauseableImageProps>;
+export {};

package/dist/PausableImage/index.js

@@ -1,28 +1,37 @@
-import styled from "@emotion/styled";
-import * as React$1 from "react";
-import { Fragment, jsx } from "react/jsx-runtime";
-import { css } from "@emotion/react";
-
-//#region src/PausableImage/index.tsx
-const BaseImage = React$1.lazy(() => import("./BaseImage/index.js"));
-const imageStyles = styled.img(css({
-	height: "auto",
-	maxHeight: "100%",
-	maxWidth: "100%",
-	"&[src$=\".svg\"]": { width: "100%" }
-}));
+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 { css } from '@emotion/react';
+import * as React from 'react';
+import { jsx as _jsx, Fragment as _Fragment } from "react/jsx-runtime";
+const BaseImage = /*#__PURE__*/React.lazy(() => import('./BaseImage'));
+export const imageStyles = /*#__PURE__*/_styled("img", {
+  target: "eubpdj90",
+  label: "imageStyles"
+})(process.env.NODE_ENV === "production" ? {
+  name: "1hzevmy-imageStyles",
+  styles: "height:auto;max-height:100%;max-width:100%;&[src$=\".svg\"]{width:100%;};label:imageStyles;"
+} : {
+  name: "1hzevmy-imageStyles",
+  styles: "height:auto;max-height:100%;max-width:100%;&[src$=\".svg\"]{width:100%;};label:imageStyles;/*# sourceMappingURL=data:application/json;charset=utf-8;base64,eyJ2ZXJzaW9uIjozLCJzb3VyY2VzIjpbIi4uLy4uL3NyYy9QYXVzYWJsZUltYWdlL2luZGV4LnRzeCJdLCJuYW1lcyI6W10sIm1hcHBpbmdzIjoiQUFXRSIsImZpbGUiOiIuLi8uLi9zcmMvUGF1c2FibGVJbWFnZS9pbmRleC50c3giLCJzb3VyY2VzQ29udGVudCI6WyJpbXBvcnQgeyBjc3MgfSBmcm9tICdAZW1vdGlvbi9yZWFjdCc7XG5pbXBvcnQgc3R5bGVkIGZyb20gJ0BlbW90aW9uL3N0eWxlZCc7XG5pbXBvcnQgKiBhcyBSZWFjdCBmcm9tICdyZWFjdCc7XG5cbmNvbnN0IEJhc2VJbWFnZSA9IFJlYWN0LmxhenkoKCkgPT4gaW1wb3J0KCcuL0Jhc2VJbWFnZScpKTtcblxuaW50ZXJmYWNlIFBhdXNlYWJsZUltYWdlUHJvcHMge1xuICBzcmM6IHN0cmluZztcbiAgYWx0OiBzdHJpbmc7XG59XG5leHBvcnQgY29uc3QgaW1hZ2VTdHlsZXMgPSBzdHlsZWQuaW1nKFxuICBjc3Moe1xuICAgIGhlaWdodDogJ2F1dG8nLFxuICAgIG1heEhlaWdodDogJzEwMCUnLFxuICAgIG1heFdpZHRoOiAnMTAwJScsXG4gICAgJyZbc3JjJD1cIi5zdmdcIl0nOiB7XG4gICAgICB3aWR0aDogJzEwMCUnLFxuICAgIH0sXG4gIH0pXG4pO1xuXG5jb25zdCBTdGF0aWNJbWFnZSA9IGltYWdlU3R5bGVzO1xuXG5leHBvcnQgY29uc3QgUGF1c2FibGVJbWFnZTogUmVhY3QuRkM8UGF1c2VhYmxlSW1hZ2VQcm9wcz4gPSAocHJvcHMpID0+IHtcbiAgY29uc3Qgc3RhdGljSW1hZ2UgPSA8U3RhdGljSW1hZ2Ugey4uLnByb3BzfSAvPjtcblxuICAvLyBBdm9pZCByZW5kZXJpbmcgUmVhY3QuU3VzcGVuc2Ugb24gdGhlIHNlcnZlciB1bnRpbCBpdCdzIGZ1bGx5IHN1cHBvcnRlZCBieSBSZWFjdCAmIG91ciBhcHBsaWNhdGlvbnNcbiAgY29uc3QgW2lzTW91bnRlZCwgc2V0SXNNb3VudGVkXSA9IFJlYWN0LnVzZVN0YXRlKGZhbHNlKTtcbiAgUmVhY3QudXNlRWZmZWN0KCgpID0+IHtcbiAgICBzZXRJc01vdW50ZWQodHJ1ZSk7XG4gIH0sIFtdKTtcblxuICByZXR1cm4gKFxuICAgIDw+XG4gICAgICB7aXNNb3VudGVkICYmIHByb3BzLnNyYz8uZW5kc1dpdGgoJy5naWYnKSA/IChcbiAgICAgICAgPFJlYWN0LlN1c3BlbnNlIGZhbGxiYWNrPXtzdGF0aWNJbWFnZX0+XG4gICAgICAgICAgPEJhc2VJbWFnZSB7Li4ucHJvcHN9IC8+XG4gICAgICAgIDwvUmVhY3QuU3VzcGVuc2U+XG4gICAgICApIDogKFxuICAgICAgICBzdGF0aWNJbWFnZVxuICAgICAgKX1cbiAgICA8Lz5cbiAgKTtcbn07XG4iXX0= */",
+  toString: _EMOTION_STRINGIFIED_CSS_ERROR__
+}, process.env.NODE_ENV === "production" ? "" : "/*# sourceMappingURL=data:application/json;charset=utf-8;base64,eyJ2ZXJzaW9uIjozLCJzb3VyY2VzIjpbIi4uLy4uL3NyYy9QYXVzYWJsZUltYWdlL2luZGV4LnRzeCJdLCJuYW1lcyI6W10sIm1hcHBpbmdzIjoiQUFVMkIiLCJmaWxlIjoiLi4vLi4vc3JjL1BhdXNhYmxlSW1hZ2UvaW5kZXgudHN4Iiwic291cmNlc0NvbnRlbnQiOlsiaW1wb3J0IHsgY3NzIH0gZnJvbSAnQGVtb3Rpb24vcmVhY3QnO1xuaW1wb3J0IHN0eWxlZCBmcm9tICdAZW1vdGlvbi9zdHlsZWQnO1xuaW1wb3J0ICogYXMgUmVhY3QgZnJvbSAncmVhY3QnO1xuXG5jb25zdCBCYXNlSW1hZ2UgPSBSZWFjdC5sYXp5KCgpID0+IGltcG9ydCgnLi9CYXNlSW1hZ2UnKSk7XG5cbmludGVyZmFjZSBQYXVzZWFibGVJbWFnZVByb3BzIHtcbiAgc3JjOiBzdHJpbmc7XG4gIGFsdDogc3RyaW5nO1xufVxuZXhwb3J0IGNvbnN0IGltYWdlU3R5bGVzID0gc3R5bGVkLmltZyhcbiAgY3NzKHtcbiAgICBoZWlnaHQ6ICdhdXRvJyxcbiAgICBtYXhIZWlnaHQ6ICcxMDAlJyxcbiAgICBtYXhXaWR0aDogJzEwMCUnLFxuICAgICcmW3NyYyQ9XCIuc3ZnXCJdJzoge1xuICAgICAgd2lkdGg6ICcxMDAlJyxcbiAgICB9LFxuICB9KVxuKTtcblxuY29uc3QgU3RhdGljSW1hZ2UgPSBpbWFnZVN0eWxlcztcblxuZXhwb3J0IGNvbnN0IFBhdXNhYmxlSW1hZ2U6IFJlYWN0LkZDPFBhdXNlYWJsZUltYWdlUHJvcHM+ID0gKHByb3BzKSA9PiB7XG4gIGNvbnN0IHN0YXRpY0ltYWdlID0gPFN0YXRpY0ltYWdlIHsuLi5wcm9wc30gLz47XG5cbiAgLy8gQXZvaWQgcmVuZGVyaW5nIFJlYWN0LlN1c3BlbnNlIG9uIHRoZSBzZXJ2ZXIgdW50aWwgaXQncyBmdWxseSBzdXBwb3J0ZWQgYnkgUmVhY3QgJiBvdXIgYXBwbGljYXRpb25zXG4gIGNvbnN0IFtpc01vdW50ZWQsIHNldElzTW91bnRlZF0gPSBSZWFjdC51c2VTdGF0ZShmYWxzZSk7XG4gIFJlYWN0LnVzZUVmZmVjdCgoKSA9PiB7XG4gICAgc2V0SXNNb3VudGVkKHRydWUpO1xuICB9LCBbXSk7XG5cbiAgcmV0dXJuIChcbiAgICA8PlxuICAgICAge2lzTW91bnRlZCAmJiBwcm9wcy5zcmM/LmVuZHNXaXRoKCcuZ2lmJykgPyAoXG4gICAgICAgIDxSZWFjdC5TdXNwZW5zZSBmYWxsYmFjaz17c3RhdGljSW1hZ2V9PlxuICAgICAgICAgIDxCYXNlSW1hZ2Ugey4uLnByb3BzfSAvPlxuICAgICAgICA8L1JlYWN0LlN1c3BlbnNlPlxuICAgICAgKSA6IChcbiAgICAgICAgc3RhdGljSW1hZ2VcbiAgICAgICl9XG4gICAgPC8+XG4gICk7XG59O1xuIl19 */");
 const StaticImage = imageStyles;
-const PausableImage = (props) => {
-	const staticImage = /* @__PURE__ */ jsx(StaticImage, { ...props });
-	const [isMounted, setIsMounted] = React$1.useState(false);
-	React$1.useEffect(() => {
-		setIsMounted(true);
-	}, []);
-	return /* @__PURE__ */ jsx(Fragment, { children: isMounted && props.src?.endsWith(".gif") ? /* @__PURE__ */ jsx(React$1.Suspense, {
-		fallback: staticImage,
-		children: /* @__PURE__ */ jsx(BaseImage, { ...props })
-	}) : staticImage });
-};
+export const PausableImage = props => {
+  const staticImage = /*#__PURE__*/_jsx(StaticImage, {
+    ...props
+  });
 
-//#endregion
-export { PausableImage, imageStyles };
+  // Avoid rendering React.Suspense on the server until it's fully supported by React & our applications
+  const [isMounted, setIsMounted] = React.useState(false);
+  React.useEffect(() => {
+    setIsMounted(true);
+  }, []);
+  return /*#__PURE__*/_jsx(_Fragment, {
+    children: isMounted && props.src?.endsWith('.gif') ? /*#__PURE__*/_jsx(React.Suspense, {
+      fallback: staticImage,
+      children: /*#__PURE__*/_jsx(BaseImage, {
+        ...props
+      })
+    }) : staticImage
+  });
+};

package/dist/PlanCard/PlanCardBanner.d.ts

@@ -1,10 +1,7 @@
-import React from "react";
-
-//#region src/PlanCard/PlanCardBanner.d.ts
+import React from 'react';
 interface PlanCardBannerProps {
-  text: string;
-  icon?: React.ReactNode;
+    text: string;
+    icon?: React.ReactNode;
 }
-declare const PlanCardBanner: React.FC<PlanCardBannerProps>;
-//#endregion
-export { PlanCardBanner };
+export declare const PlanCardBanner: React.FC<PlanCardBannerProps>;
+export {};