@chtc/web-components 2.0.6 → 2.0.8

package/Article/components/Article.d.ts

@@ -1,6 +1,13 @@
 import { BackendArticle } from '../types';
-declare const Article: ({ article }: {
+import type { SiteImageComponent } from "../../images/types";
+interface ArticleProps {
     article: BackendArticle;
-}) => import("react").JSX.Element;
+    /**
+     * Component rendered for images in the article body. Defaults to a plain
+     * `<img>`; pass `next/image` or `ExportedImage` to have them optimized.
+     */
+    imageComponent?: SiteImageComponent;
+}
+declare const Article: ({ article, imageComponent }: ArticleProps) => import("react").JSX.Element;
 export default Article;
 //# sourceMappingURL=Article.d.ts.map

package/Article/components/Article.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"Article.d.ts","sourceRoot":"","sources":["../../../src/Article/components/Article.tsx"],"names":[],"mappings":"AAGA,OAAO,EAAC,cAAc,EAAC,MAAM,UAAU,CAAA;AAIvC,QAAA,MAAM,OAAO,GAAI,aAAW;IAAC,OAAO,EAAE,cAAc,CAAA;CAAC,gCAoBpD,CAAA;AAED,eAAe,OAAO,CAAC"}
+{"version":3,"file":"Article.d.ts","sourceRoot":"","sources":["../../../src/Article/components/Article.tsx"],"names":[],"mappings":"AAGA,OAAO,EAAC,cAAc,EAAC,MAAM,UAAU,CAAA;AAGvC,OAAO,KAAK,EAAC,kBAAkB,EAAC,MAAM,oBAAoB,CAAC;AAE3D,UAAU,YAAY;IACrB,OAAO,EAAE,cAAc,CAAC;IACxB;;;OAGG;IACH,cAAc,CAAC,EAAE,kBAAkB,CAAC;CACpC;AAKD,QAAA,MAAM,OAAO,GAAI,6BAA2B,YAAY,gCAoBvD,CAAA;AAED,eAAe,OAAO,CAAC"}

package/Article/components/Article.js

@@ -3,8 +3,10 @@ import { Typography, Box, Container } from '@mui/material';
 import Balancer from "react-wrap-balancer";
 import MarkdownContent from "../../markdownComponents/MarkdownContent";
 import { formatLongDate } from "../../utils/formatLongDate";
-const Article = ({ article }) => {
-    return (_jsx(Container, { maxWidth: "md", children: _jsxs(Box, { pt: 6, children: [_jsxs(Box, { textAlign: "center", pb: 2, children: [_jsx(Box, { pb: 6, children: _jsx(Typography, { variant: "h3", children: _jsx(Balancer, { children: article.title }) }) }), _jsx(Box, { height: "1rem", borderRadius: "10px", bgcolor: "primary.main" }), _jsxs(Box, { pt: 1, display: "flex", justifyContent: "space-between", children: [_jsx(Typography, { variant: "h5", children: article.author }), _jsx(Typography, { variant: "h5", children: formatLongDate(article.date) })] })] }), _jsx(MarkdownContent, { children: article.content })] }) }));
+/* The body sits in a `maxWidth="md"` container, so 900px is its widest. */
+const BODY_IMAGE_SIZES = "(max-width: 900px) 100vw, 900px";
+const Article = ({ article, imageComponent }) => {
+    return (_jsx(Container, { maxWidth: "md", children: _jsxs(Box, { pt: 6, children: [_jsxs(Box, { textAlign: "center", pb: 2, children: [_jsx(Box, { pb: 6, children: _jsx(Typography, { variant: "h3", children: _jsx(Balancer, { children: article.title }) }) }), _jsx(Box, { height: "1rem", borderRadius: "10px", bgcolor: "primary.main" }), _jsxs(Box, { pt: 1, display: "flex", justifyContent: "space-between", children: [_jsx(Typography, { variant: "h5", children: article.author }), _jsx(Typography, { variant: "h5", children: formatLongDate(article.date) })] })] }), _jsx(MarkdownContent, { imageComponent: imageComponent, imageSizes: BODY_IMAGE_SIZES, children: article.content })] }) }));
 };
 export default Article;
 //# sourceMappingURL=Article.js.map

package/Article/components/Article.js.map

@@ -1 +1 @@
-{"version":3,"file":"Article.js","sourceRoot":"","sources":["../../../src/Article/components/Article.tsx"],"names":[],"mappings":";AAAA,OAAO,EAAC,UAAU,EAAE,GAAG,EAAE,SAAS,EAAC,MAAM,eAAe,CAAC;AACzD,OAAO,QAAQ,MAAM,qBAAqB,CAAC;AAG3C,OAAO,eAAe,MAAM,0CAA0C,CAAC;AACvE,OAAO,EAAC,cAAc,EAAC,MAAM,4BAA4B,CAAC;AAE1D,MAAM,OAAO,GAAG,CAAC,EAAC,OAAO,EAA4B,EAAE,EAAE;IACxD,OAAO,CACL,KAAC,SAAS,IAAC,QAAQ,EAAE,IAAI,YACxB,MAAC,GAAG,IAAC,EAAE,EAAE,CAAC,aACT,MAAC,GAAG,IAAC,SAAS,EAAE,QAAQ,EAAE,EAAE,EAAE,CAAC,aAC9B,KAAC,GAAG,IAAC,EAAE,EAAE,CAAC,YACT,KAAC,UAAU,IAAC,OAAO,EAAE,IAAI,YAAG,KAAC,QAAQ,cAAE,OAAO,CAAC,KAAK,GAAY,GAAa,GACxE,EACN,KAAC,GAAG,IAAC,MAAM,EAAE,MAAM,EAAE,YAAY,EAAE,MAAM,EAAE,OAAO,EAAE,cAAc,GAAQ,EAC1E,MAAC,GAAG,IAAC,EAAE,EAAE,CAAC,EAAE,OAAO,EAAE,MAAM,EAAE,cAAc,EAAE,eAAe,aAC3D,KAAC,UAAU,IAAC,OAAO,EAAE,IAAI,YAAG,OAAO,CAAC,MAAM,GAAc,EACxD,KAAC,UAAU,IAAC,OAAO,EAAE,IAAI,YAAG,cAAc,CAAC,OAAO,CAAC,IAAI,CAAC,GAAc,IACjE,IACD,EACN,KAAC,eAAe,cACd,OAAO,CAAC,OAAO,GACC,IACb,GACK,CACb,CAAA;AACF,CAAC,CAAA;AAED,eAAe,OAAO,CAAC"}
+{"version":3,"file":"Article.js","sourceRoot":"","sources":["../../../src/Article/components/Article.tsx"],"names":[],"mappings":";AAAA,OAAO,EAAC,UAAU,EAAE,GAAG,EAAE,SAAS,EAAC,MAAM,eAAe,CAAC;AACzD,OAAO,QAAQ,MAAM,qBAAqB,CAAC;AAG3C,OAAO,eAAe,MAAM,0CAA0C,CAAC;AACvE,OAAO,EAAC,cAAc,EAAC,MAAM,4BAA4B,CAAC;AAY1D,2EAA2E;AAC3E,MAAM,gBAAgB,GAAG,iCAAiC,CAAC;AAE3D,MAAM,OAAO,GAAG,CAAC,EAAC,OAAO,EAAE,cAAc,EAAe,EAAE,EAAE;IAC3D,OAAO,CACL,KAAC,SAAS,IAAC,QAAQ,EAAE,IAAI,YACxB,MAAC,GAAG,IAAC,EAAE,EAAE,CAAC,aACT,MAAC,GAAG,IAAC,SAAS,EAAE,QAAQ,EAAE,EAAE,EAAE,CAAC,aAC9B,KAAC,GAAG,IAAC,EAAE,EAAE,CAAC,YACT,KAAC,UAAU,IAAC,OAAO,EAAE,IAAI,YAAG,KAAC,QAAQ,cAAE,OAAO,CAAC,KAAK,GAAY,GAAa,GACxE,EACN,KAAC,GAAG,IAAC,MAAM,EAAE,MAAM,EAAE,YAAY,EAAE,MAAM,EAAE,OAAO,EAAE,cAAc,GAAQ,EAC1E,MAAC,GAAG,IAAC,EAAE,EAAE,CAAC,EAAE,OAAO,EAAE,MAAM,EAAE,cAAc,EAAE,eAAe,aAC3D,KAAC,UAAU,IAAC,OAAO,EAAE,IAAI,YAAG,OAAO,CAAC,MAAM,GAAc,EACxD,KAAC,UAAU,IAAC,OAAO,EAAE,IAAI,YAAG,cAAc,CAAC,OAAO,CAAC,IAAI,CAAC,GAAc,IACjE,IACD,EACN,KAAC,eAAe,IAAC,cAAc,EAAE,cAAc,EAAE,UAAU,EAAE,gBAAgB,YAC3E,OAAO,CAAC,OAAO,GACC,IACb,GACK,CACb,CAAA;AACF,CAAC,CAAA;AAED,eAAe,OAAO,CAAC"}

package/Article/components/ArticleCard.d.ts

@@ -1,4 +1,4 @@
 import { ArticleCardProps } from "../types";
-declare const ArticleCard: ({ href, article }: ArticleCardProps) => import("react").JSX.Element;
+declare const ArticleCard: ({ href, article, imageComponent: ImageComponent }: ArticleCardProps) => import("react").JSX.Element;
 export default ArticleCard;
 //# sourceMappingURL=ArticleCard.d.ts.map

package/Article/components/ArticleCard.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"ArticleCard.d.ts","sourceRoot":"","sources":["../../../src/Article/components/ArticleCard.tsx"],"names":[],"mappings":"AAEA,OAAO,EAAC,gBAAgB,EAAC,MAAM,UAAU,CAAC;AAM1C,QAAA,MAAM,WAAW,GAAI,mBAAkB,gBAAgB,gCA+BtD,CAAA;AAED,eAAe,WAAW,CAAC"}
+{"version":3,"file":"ArticleCard.d.ts","sourceRoot":"","sources":["../../../src/Article/components/ArticleCard.tsx"],"names":[],"mappings":"AAEA,OAAO,EAAC,gBAAgB,EAAC,MAAM,UAAU,CAAC;AAkB1C,QAAA,MAAM,WAAW,GAAI,mDAA0E,gBAAgB,gCAuC9G,CAAA;AAED,eAAe,WAAW,CAAC"}

package/Article/components/ArticleCard.js

@@ -5,13 +5,24 @@ import Link from "next/link";
 import TopStyledBlock from "../../TopStyledBlock";
 import MarkdownContent from "../../markdownComponents/MarkdownContent";
 import { linkedCardExcerptComponents } from "../../markdownComponents/excerptComponents";
-const ArticleCard = ({ href, article }) => {
+import DefaultImageComponent from "../../images/DefaultImageComponent";
+/*
+ * The card art is a 2:1 crop. The numbers below are the intrinsic size an
+ * optimizing image component needs to build a srcset — the rendered size comes
+ * from the CSS width below, and `sizes` tells the browser what that width will
+ * be before any layout has happened.
+ */
+const CARD_IMAGE_WIDTH = 1200;
+const CARD_IMAGE_HEIGHT = 600;
+/** One per row below `md`, two up to `lg`, then three in an `xl` container. */
+const CARD_IMAGE_SIZES = "(max-width: 900px) 100vw, (max-width: 1200px) 50vw, 500px";
+const ArticleCard = ({ href, article, imageComponent: ImageComponent = DefaultImageComponent }) => {
     const style = {
         transition: "box-shadow .2s",
         boxShadow: "grey 1px 1px 3px",
         "&:hover": { boxShadow: "grey 1px 1px 5px" },
     };
-    return (_jsx(Box, { borderRadius: 2, overflow: "hidden", sx: style, children: _jsxs(Box, { component: Link, href: href, sx: { color: "text.primary", textDecoration: "none" }, children: [_jsx(Box, { children: _jsx("img", { style: { objectFit: "cover", width: "100%", aspectRatio: 2 }, src: article.image.path, alt: article.image.alt }) }), _jsx(Box, { children: _jsxs(Box, { pl: 2, p: 2, children: [_jsx(Box, { py: 1, pt: 1, children: _jsx(TopStyledBlock, { height: ".25rem", width: "5rem", offset: "-.75rem", children: _jsx(Typography, { variant: "h6", sx: { fontWeight: "bold" }, children: _jsx(Balancer, { children: article.title }) }) }) }), _jsx(MarkdownContent, { components: linkedCardExcerptComponents, children: article.excerpt })] }) })] }) }));
+    return (_jsx(Box, { borderRadius: 2, overflow: "hidden", sx: style, children: _jsxs(Link, { href: href, style: { color: "inherit", textDecoration: "none" }, children: [_jsx(Box, { children: _jsx(ImageComponent, { src: article.image.path, alt: article.image.alt, width: CARD_IMAGE_WIDTH, height: CARD_IMAGE_HEIGHT, sizes: CARD_IMAGE_SIZES, style: { objectFit: "cover", width: "100%", height: "auto", aspectRatio: 2 } }) }), _jsx(Box, { children: _jsxs(Box, { pl: 2, p: 2, children: [_jsx(Box, { py: 1, pt: 1, children: _jsx(TopStyledBlock, { height: ".25rem", width: "5rem", offset: "-.75rem", children: _jsx(Typography, { variant: "h6", sx: { fontWeight: "bold" }, children: _jsx(Balancer, { children: article.title }) }) }) }), _jsx(MarkdownContent, { components: linkedCardExcerptComponents, children: article.excerpt })] }) })] }) }));
 };
 export default ArticleCard;
 //# sourceMappingURL=ArticleCard.js.map

package/Article/components/ArticleCard.js.map

@@ -1 +1 @@
-{"version":3,"file":"ArticleCard.js","sourceRoot":"","sources":["../../../src/Article/components/ArticleCard.tsx"],"names":[],"mappings":";AAAA,OAAO,EAAC,UAAU,EAAE,GAAG,EAAC,MAAM,eAAe,CAAC;AAC9C,OAAO,QAAQ,MAAM,qBAAqB,CAAC;AAE3C,OAAO,IAAI,MAAM,WAAW,CAAC;AAC7B,OAAO,cAAc,MAAM,sBAAsB,CAAC;AAClD,OAAO,eAAe,MAAM,0CAA0C,CAAC;AACvE,OAAO,EAAC,2BAA2B,EAAC,MAAM,4CAA4C,CAAC;AAEvF,MAAM,WAAW,GAAG,CAAC,EAAC,IAAI,EAAE,OAAO,EAAoB,EAAE,EAAE;IAE1D,MAAM,KAAK,GAAG;QACb,UAAU,EAAE,gBAAgB;QAC5B,SAAS,EAAE,kBAAkB;QAC7B,SAAS,EAAE,EAAC,SAAS,EAAE,kBAAkB,EAAC;KAC1C,CAAA;IAED,OAAO,CACL,KAAC,GAAG,IAAC,YAAY,EAAE,CAAC,EAAE,QAAQ,EAAE,QAAQ,EAAE,EAAE,EAAE,KAAK,YAGlD,MAAC,GAAG,IAAC,SAAS,EAAE,IAAI,EAAE,IAAI,EAAE,IAAI,EAAE,EAAE,EAAE,EAAC,KAAK,EAAE,cAAc,EAAE,cAAc,EAAE,MAAM,EAAC,aACpF,KAAC,GAAG,cACH,cAAK,KAAK,EAAE,EAAC,SAAS,EAAE,OAAO,EAAE,KAAK,EAAE,MAAM,EAAE,WAAW,EAAE,CAAC,EAAC,EAAE,GAAG,EAAE,OAAO,CAAC,KAAK,CAAC,IAAI,EAAE,GAAG,EAAE,OAAO,CAAC,KAAK,CAAC,GAAG,GAAI,GAC/G,EACN,KAAC,GAAG,cACH,MAAC,GAAG,IAAC,EAAE,EAAE,CAAC,EAAE,CAAC,EAAE,CAAC,aACf,KAAC,GAAG,IAAC,EAAE,EAAE,CAAC,EAAE,EAAE,EAAE,CAAC,YAChB,KAAC,cAAc,IAAC,MAAM,EAAE,QAAQ,EAAE,KAAK,EAAE,MAAM,EAAE,MAAM,EAAE,SAAS,YACjE,KAAC,UAAU,IAAC,OAAO,EAAE,IAAI,EAAE,EAAE,EAAE,EAAC,UAAU,EAAE,MAAM,EAAC,YAAE,KAAC,QAAQ,cAAE,OAAO,CAAC,KAAK,GAAY,GAAa,GACtF,GACZ,EACN,KAAC,eAAe,IAAC,UAAU,EAAE,2BAA2B,YACtD,OAAO,CAAC,OAAO,GACC,IACb,GACD,IACD,GACD,CACP,CAAA;AACF,CAAC,CAAA;AAED,eAAe,WAAW,CAAC"}
+{"version":3,"file":"ArticleCard.js","sourceRoot":"","sources":["../../../src/Article/components/ArticleCard.tsx"],"names":[],"mappings":";AAAA,OAAO,EAAC,UAAU,EAAE,GAAG,EAAC,MAAM,eAAe,CAAC;AAC9C,OAAO,QAAQ,MAAM,qBAAqB,CAAC;AAE3C,OAAO,IAAI,MAAM,WAAW,CAAC;AAC7B,OAAO,cAAc,MAAM,sBAAsB,CAAC;AAClD,OAAO,eAAe,MAAM,0CAA0C,CAAC;AACvE,OAAO,EAAC,2BAA2B,EAAC,MAAM,4CAA4C,CAAC;AACvF,OAAO,qBAAqB,MAAM,oCAAoC,CAAC;AAEvE;;;;;GAKG;AACH,MAAM,gBAAgB,GAAG,IAAI,CAAC;AAC9B,MAAM,iBAAiB,GAAG,GAAG,CAAC;AAC9B,+EAA+E;AAC/E,MAAM,gBAAgB,GAAG,2DAA2D,CAAC;AAErF,MAAM,WAAW,GAAG,CAAC,EAAC,IAAI,EAAE,OAAO,EAAE,cAAc,EAAE,cAAc,GAAG,qBAAqB,EAAoB,EAAE,EAAE;IAElH,MAAM,KAAK,GAAG;QACb,UAAU,EAAE,gBAAgB;QAC5B,SAAS,EAAE,kBAAkB;QAC7B,SAAS,EAAE,EAAC,SAAS,EAAE,kBAAkB,EAAC;KAC1C,CAAA;IAED,OAAO,CACL,KAAC,GAAG,IAAC,YAAY,EAAE,CAAC,EAAE,QAAQ,EAAE,QAAQ,EAAE,EAAE,EAAE,KAAK,YAIlD,MAAC,IAAI,IAAC,IAAI,EAAE,IAAI,EAAE,KAAK,EAAE,EAAC,KAAK,EAAE,SAAS,EAAE,cAAc,EAAE,MAAM,EAAC,aAClE,KAAC,GAAG,cACH,KAAC,cAAc,IACd,GAAG,EAAE,OAAO,CAAC,KAAK,CAAC,IAAI,EACvB,GAAG,EAAE,OAAO,CAAC,KAAK,CAAC,GAAG,EACtB,KAAK,EAAE,gBAAgB,EACvB,MAAM,EAAE,iBAAiB,EACzB,KAAK,EAAE,gBAAgB,EACvB,KAAK,EAAE,EAAC,SAAS,EAAE,OAAO,EAAE,KAAK,EAAE,MAAM,EAAE,MAAM,EAAE,MAAM,EAAE,WAAW,EAAE,CAAC,EAAC,GACzE,GACG,EACN,KAAC,GAAG,cACH,MAAC,GAAG,IAAC,EAAE,EAAE,CAAC,EAAE,CAAC,EAAE,CAAC,aACf,KAAC,GAAG,IAAC,EAAE,EAAE,CAAC,EAAE,EAAE,EAAE,CAAC,YAChB,KAAC,cAAc,IAAC,MAAM,EAAE,QAAQ,EAAE,KAAK,EAAE,MAAM,EAAE,MAAM,EAAE,SAAS,YACjE,KAAC,UAAU,IAAC,OAAO,EAAE,IAAI,EAAE,EAAE,EAAE,EAAC,UAAU,EAAE,MAAM,EAAC,YAAE,KAAC,QAAQ,cAAE,OAAO,CAAC,KAAK,GAAY,GAAa,GACtF,GACZ,EACN,KAAC,eAAe,IAAC,UAAU,EAAE,2BAA2B,YACtD,OAAO,CAAC,OAAO,GACC,IACb,GACD,IACA,GACF,CACP,CAAA;AACF,CAAC,CAAA;AAED,eAAe,WAAW,CAAC"}

package/Article/components/HorizontalArticleCard.d.ts

@@ -1,4 +1,4 @@
 import { ArticleCardProps } from "../types";
-declare const HorizontalArticleCard: ({ href, article }: ArticleCardProps) => import("react").JSX.Element;
+declare const HorizontalArticleCard: ({ href, article, imageComponent: ImageComponent }: ArticleCardProps) => import("react").JSX.Element;
 export default HorizontalArticleCard;
 //# sourceMappingURL=HorizontalArticleCard.d.ts.map

package/Article/components/HorizontalArticleCard.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"HorizontalArticleCard.d.ts","sourceRoot":"","sources":["../../../src/Article/components/HorizontalArticleCard.tsx"],"names":[],"mappings":"AAQA,OAAO,EAAC,gBAAgB,EAAC,MAAM,UAAU,CAAC;AAE1C,QAAA,MAAM,qBAAqB,GAAI,mBAAkB,gBAAgB,gCAkChE,CAAA;AAED,eAAe,qBAAqB,CAAC"}
+{"version":3,"file":"HorizontalArticleCard.d.ts","sourceRoot":"","sources":["../../../src/Article/components/HorizontalArticleCard.tsx"],"names":[],"mappings":"AAQA,OAAO,EAAC,gBAAgB,EAAC,MAAM,UAAU,CAAC;AAQ1C,QAAA,MAAM,qBAAqB,GAAI,mDAA0E,gBAAgB,gCAyCxH,CAAA;AAED,eAAe,qBAAqB,CAAC"}

package/Article/components/HorizontalArticleCard.js

@@ -6,8 +6,13 @@ import MarkdownContent from "../../markdownComponents/MarkdownContent";
 import excerptComponents from "../../markdownComponents/excerptComponents";
 import Link from "next/link";
 import { ArrowRight } from "@mui/icons-material";
-const HorizontalArticleCard = ({ href, article }) => {
-    return (_jsx(Box, { sx: { display: { xs: 'none', md: 'block' } }, children: _jsxs(Grid, { container: true, children: [_jsx(Grid, { size: 6, children: _jsx("img", { style: { objectFit: "cover", width: "100%", height: "100%", aspectRatio: 2 }, src: article.image.path, alt: article.image.alt }) }), _jsx(Grid, { size: 6, display: "flex", children: _jsxs(Box, { width: "100%", pl: 2, p: 3, display: "flex", flexDirection: "column", bgcolor: "#cfe4ff52", children: [_jsx(Box, { py: 1, children: _jsx(TopStyledBlock, { height: ".25rem", width: "5rem", offset: "-.75rem", children: _jsx(Typography, { variant: "h5", children: _jsx(Balancer, { children: article.title }) }) }) }), _jsx(MarkdownContent, { components: excerptComponents, children: article.excerpt }), _jsx(Box, { sx: { marginTop: "auto", paddingTop: "2rem", fontWeight: "300" }, children: _jsx(Box, { sx: { color: "#0885ff" }, children: _jsxs(Link, { href: href, style: { color: "inherit", textDecoration: "none" }, children: [_jsx(Typography, { variant: "body1", sx: { display: "inline", paddingRight: ".2rem" }, children: "Read More" }), _jsx(ArrowRight, { height: 18, width: 24, fill: "currentColor" })] }) }) })] }) })] }) }));
+import DefaultImageComponent from "../../images/DefaultImageComponent";
+/* Half the viewport, and only ever rendered at `md` and up. */
+const BANNER_IMAGE_WIDTH = 1600;
+const BANNER_IMAGE_HEIGHT = 800;
+const BANNER_IMAGE_SIZES = "50vw";
+const HorizontalArticleCard = ({ href, article, imageComponent: ImageComponent = DefaultImageComponent }) => {
+    return (_jsx(Box, { sx: { display: { xs: 'none', md: 'block' } }, children: _jsxs(Grid, { container: true, children: [_jsx(Grid, { size: 6, children: _jsx(ImageComponent, { src: article.image.path, alt: article.image.alt, width: BANNER_IMAGE_WIDTH, height: BANNER_IMAGE_HEIGHT, sizes: BANNER_IMAGE_SIZES, style: { objectFit: "cover", width: "100%", height: "100%", aspectRatio: 2 } }) }), _jsx(Grid, { size: 6, display: "flex", children: _jsxs(Box, { width: "100%", pl: 2, p: 3, display: "flex", flexDirection: "column", bgcolor: "#cfe4ff52", children: [_jsx(Box, { py: 1, children: _jsx(TopStyledBlock, { height: ".25rem", width: "5rem", offset: "-.75rem", children: _jsx(Typography, { variant: "h5", children: _jsx(Balancer, { children: article.title }) }) }) }), _jsx(MarkdownContent, { components: excerptComponents, children: article.excerpt }), _jsx(Box, { sx: { marginTop: "auto", paddingTop: "2rem", fontWeight: "300" }, children: _jsx(Box, { sx: { color: "#0885ff" }, children: _jsxs(Link, { href: href, style: { color: "inherit", textDecoration: "none" }, children: [_jsx(Typography, { variant: "body1", sx: { display: "inline", paddingRight: ".2rem" }, children: "Read More" }), _jsx(ArrowRight, { height: 18, width: 24, fill: "currentColor" })] }) }) })] }) })] }) }));
 };
 export default HorizontalArticleCard;
 //# sourceMappingURL=HorizontalArticleCard.js.map

package/Article/components/HorizontalArticleCard.js.map

@@ -1 +1 @@
-{"version":3,"file":"HorizontalArticleCard.js","sourceRoot":"","sources":["../../../src/Article/components/HorizontalArticleCard.tsx"],"names":[],"mappings":";AAAA,OAAO,EAAC,IAAI,EAAE,UAAU,EAAE,GAAG,EAAC,MAAM,eAAe,CAAC;AACpD,OAAO,QAAQ,MAAM,qBAAqB,CAAC;AAE3C,OAAO,cAAc,MAAM,sBAAsB,CAAC;AAClD,OAAO,eAAe,MAAM,0CAA0C,CAAC;AACvE,OAAO,iBAAiB,MAAM,4CAA4C,CAAC;AAC3E,OAAO,IAAI,MAAM,WAAW,CAAC;AAC7B,OAAO,EAAC,UAAU,EAAC,MAAM,qBAAqB,CAAC;AAG/C,MAAM,qBAAqB,GAAG,CAAC,EAAC,IAAI,EAAE,OAAO,EAAoB,EAAE,EAAE;IACpE,OAAO,CACL,KAAC,GAAG,IAAC,EAAE,EAAE,EAAE,OAAO,EAAE,EAAE,EAAE,EAAE,MAAM,EAAE,EAAE,EAAE,OAAO,EAAE,EAAE,YAChD,MAAC,IAAI,IAAC,SAAS,mBACd,KAAC,IAAI,IAAC,IAAI,EAAE,CAAC,YACZ,cAAK,KAAK,EAAE,EAAC,SAAS,EAAE,OAAO,EAAE,KAAK,EAAE,MAAM,EAAE,MAAM,EAAE,MAAM,EAAE,WAAW,EAAE,CAAC,EAAC,EAAE,GAAG,EAAE,OAAO,CAAC,KAAK,CAAC,IAAI,EAAE,GAAG,EAAE,OAAO,CAAC,KAAK,CAAC,GAAG,GAAI,GAC9H,EACP,KAAC,IAAI,IAAC,IAAI,EAAE,CAAC,EAAE,OAAO,EAAE,MAAM,YAC7B,MAAC,GAAG,IAAC,KAAK,EAAE,MAAM,EAAE,EAAE,EAAE,CAAC,EAAE,CAAC,EAAE,CAAC,EAAE,OAAO,EAAE,MAAM,EAAE,aAAa,EAAE,QAAQ,EAAE,OAAO,EAAE,WAAW,aAC9F,KAAC,GAAG,IAAC,EAAE,EAAE,CAAC,YACT,KAAC,cAAc,IAAC,MAAM,EAAE,QAAQ,EAAE,KAAK,EAAE,MAAM,EAAE,MAAM,EAAE,SAAS,YACjE,KAAC,UAAU,IAAC,OAAO,EAAE,IAAI,YAAE,KAAC,QAAQ,cAAE,OAAO,CAAC,KAAK,GAAY,GAAa,GAC5D,GACZ,EAGN,KAAC,eAAe,IAAC,UAAU,EAAE,iBAAiB,YAC5C,OAAO,CAAC,OAAO,GACC,EAClB,KAAC,GAAG,IAAC,EAAE,EAAE,EAAC,SAAS,EAAE,MAAM,EAAE,UAAU,EAAE,MAAM,EAAE,UAAU,EAAE,KAAK,EAAC,YAClE,KAAC,GAAG,IAAC,EAAE,EAAE,EAAC,KAAK,EAAE,SAAS,EAAC,YAC1B,MAAC,IAAI,IAAC,IAAI,EAAE,IAAI,EAAE,KAAK,EAAE,EAAC,KAAK,EAAE,SAAS,EAAE,cAAc,EAAE,MAAM,EAAC,aAClE,KAAC,UAAU,IAAC,OAAO,EAAE,OAAO,EAAE,EAAE,EAAE,EAAC,OAAO,EAAE,QAAQ,EAAE,YAAY,EAAE,OAAO,EAAC,0BAE/D,EACb,KAAC,UAAU,IAAC,MAAM,EAAE,EAAE,EAAE,KAAK,EAAE,EAAE,EAAE,IAAI,EAAE,cAAc,GAAG,IACpD,GACF,GACD,IACD,GACA,IACD,GACF,CACP,CAAA;AACF,CAAC,CAAA;AAED,eAAe,qBAAqB,CAAC"}
+{"version":3,"file":"HorizontalArticleCard.js","sourceRoot":"","sources":["../../../src/Article/components/HorizontalArticleCard.tsx"],"names":[],"mappings":";AAAA,OAAO,EAAC,IAAI,EAAE,UAAU,EAAE,GAAG,EAAC,MAAM,eAAe,CAAC;AACpD,OAAO,QAAQ,MAAM,qBAAqB,CAAC;AAE3C,OAAO,cAAc,MAAM,sBAAsB,CAAC;AAClD,OAAO,eAAe,MAAM,0CAA0C,CAAC;AACvE,OAAO,iBAAiB,MAAM,4CAA4C,CAAC;AAC3E,OAAO,IAAI,MAAM,WAAW,CAAC;AAC7B,OAAO,EAAC,UAAU,EAAC,MAAM,qBAAqB,CAAC;AAE/C,OAAO,qBAAqB,MAAM,oCAAoC,CAAC;AAEvE,+DAA+D;AAC/D,MAAM,kBAAkB,GAAG,IAAI,CAAC;AAChC,MAAM,mBAAmB,GAAG,GAAG,CAAC;AAChC,MAAM,kBAAkB,GAAG,MAAM,CAAC;AAElC,MAAM,qBAAqB,GAAG,CAAC,EAAC,IAAI,EAAE,OAAO,EAAE,cAAc,EAAE,cAAc,GAAG,qBAAqB,EAAoB,EAAE,EAAE;IAC5H,OAAO,CACL,KAAC,GAAG,IAAC,EAAE,EAAE,EAAE,OAAO,EAAE,EAAE,EAAE,EAAE,MAAM,EAAE,EAAE,EAAE,OAAO,EAAE,EAAE,YAChD,MAAC,IAAI,IAAC,SAAS,mBACd,KAAC,IAAI,IAAC,IAAI,EAAE,CAAC,YACZ,KAAC,cAAc,IACd,GAAG,EAAE,OAAO,CAAC,KAAK,CAAC,IAAI,EACvB,GAAG,EAAE,OAAO,CAAC,KAAK,CAAC,GAAG,EACtB,KAAK,EAAE,kBAAkB,EACzB,MAAM,EAAE,mBAAmB,EAC3B,KAAK,EAAE,kBAAkB,EACzB,KAAK,EAAE,EAAC,SAAS,EAAE,OAAO,EAAE,KAAK,EAAE,MAAM,EAAE,MAAM,EAAE,MAAM,EAAE,WAAW,EAAE,CAAC,EAAC,GACzE,GACI,EACP,KAAC,IAAI,IAAC,IAAI,EAAE,CAAC,EAAE,OAAO,EAAE,MAAM,YAC7B,MAAC,GAAG,IAAC,KAAK,EAAE,MAAM,EAAE,EAAE,EAAE,CAAC,EAAE,CAAC,EAAE,CAAC,EAAE,OAAO,EAAE,MAAM,EAAE,aAAa,EAAE,QAAQ,EAAE,OAAO,EAAE,WAAW,aAC9F,KAAC,GAAG,IAAC,EAAE,EAAE,CAAC,YACT,KAAC,cAAc,IAAC,MAAM,EAAE,QAAQ,EAAE,KAAK,EAAE,MAAM,EAAE,MAAM,EAAE,SAAS,YACjE,KAAC,UAAU,IAAC,OAAO,EAAE,IAAI,YAAE,KAAC,QAAQ,cAAE,OAAO,CAAC,KAAK,GAAY,GAAa,GAC5D,GACZ,EAGN,KAAC,eAAe,IAAC,UAAU,EAAE,iBAAiB,YAC5C,OAAO,CAAC,OAAO,GACC,EAClB,KAAC,GAAG,IAAC,EAAE,EAAE,EAAC,SAAS,EAAE,MAAM,EAAE,UAAU,EAAE,MAAM,EAAE,UAAU,EAAE,KAAK,EAAC,YAClE,KAAC,GAAG,IAAC,EAAE,EAAE,EAAC,KAAK,EAAE,SAAS,EAAC,YAC1B,MAAC,IAAI,IAAC,IAAI,EAAE,IAAI,EAAE,KAAK,EAAE,EAAC,KAAK,EAAE,SAAS,EAAE,cAAc,EAAE,MAAM,EAAC,aAClE,KAAC,UAAU,IAAC,OAAO,EAAE,OAAO,EAAE,EAAE,EAAE,EAAC,OAAO,EAAE,QAAQ,EAAE,YAAY,EAAE,OAAO,EAAC,0BAE/D,EACb,KAAC,UAAU,IAAC,MAAM,EAAE,EAAE,EAAE,KAAK,EAAE,EAAE,EAAE,IAAI,EAAE,cAAc,GAAG,IACpD,GACF,GACD,IACD,GACA,IACD,GACF,CACP,CAAA;AACF,CAAC,CAAA;AAED,eAAe,qBAAqB,CAAC"}

package/Article/types.d.ts

@@ -1,4 +1,5 @@
 import type { Website } from "../types";
+import type { SiteImageComponent } from "../images/types";
 export type ArticleTag = "chtc_featured_article";
 export type ArticleType = "news" | "user" | "tech-blog";
 export interface ArticleImage {
@@ -36,5 +37,10 @@ export interface BackendArticle extends ArticleData {
 export interface ArticleCardProps {
     href: string;
     article: BackendArticle;
+    /**
+     * Component rendered for the card's image. Defaults to a plain `<img>`;
+     * pass `next/image` or `ExportedImage` to have it optimized.
+     */
+    imageComponent?: SiteImageComponent;
 }
 //# sourceMappingURL=types.d.ts.map

package/Article/types.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"types.d.ts","sourceRoot":"","sources":["../../src/Article/types.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,OAAO,EAAE,MAAM,UAAU,CAAC;AAExC,MAAM,MAAM,UAAU,GAAG,uBAAuB,CAAC;AACjD,MAAM,MAAM,WAAW,GAAG,MAAM,GAAG,MAAM,GAAG,WAAW,CAAC;AAExD,MAAM,WAAW,YAAY;IAC3B,IAAI,EAAE,MAAM,CAAC;IACb,GAAG,EAAE,MAAM,CAAC;CACb;AAED;;;GAGG;AACH,MAAM,WAAW,WAAW;IAC1B,kDAAkD;IAClD,OAAO,EAAE,MAAM,CAAC;IAChB,KAAK,EAAE,MAAM,CAAC;IACd,MAAM,CAAC,EAAE,MAAM,CAAC;IAChB,6DAA6D;IAC7D,IAAI,EAAE,IAAI,CAAC;IACX,yGAAyG;IACzG,UAAU,EAAE,OAAO,EAAE,CAAC;IACtB,IAAI,EAAE,WAAW,CAAC;IAClB,oEAAoE;IACpE,GAAG,CAAC,EAAE,UAAU,EAAE,CAAC;IACnB,KAAK,EAAE,YAAY,CAAC;IACpB,OAAO,CAAC,EAAE,MAAM,CAAC;IACjB,UAAU,CAAC,EAAE,MAAM,CAAC;IACpB,UAAU,CAAC,EAAE,MAAM,CAAC;IACpB,wFAAwF;IACxF,aAAa,CAAC,EAAE,MAAM,CAAC;CACxB;AAED,8EAA8E;AAC9E,MAAM,WAAW,cAAe,SAAQ,WAAW;IACjD,IAAI,EAAE,MAAM,EAAE,CAAC;IACf,IAAI,EAAE,MAAM,CAAC;CACd;AAED,MAAM,WAAW,gBAAgB;IAC/B,IAAI,EAAE,MAAM,CAAC;IACb,OAAO,EAAE,cAAc,CAAC;CACzB"}
+{"version":3,"file":"types.d.ts","sourceRoot":"","sources":["../../src/Article/types.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,OAAO,EAAE,MAAM,UAAU,CAAC;AACxC,OAAO,KAAK,EAAE,kBAAkB,EAAE,MAAM,iBAAiB,CAAC;AAE1D,MAAM,MAAM,UAAU,GAAG,uBAAuB,CAAC;AACjD,MAAM,MAAM,WAAW,GAAG,MAAM,GAAG,MAAM,GAAG,WAAW,CAAC;AAExD,MAAM,WAAW,YAAY;IAC3B,IAAI,EAAE,MAAM,CAAC;IACb,GAAG,EAAE,MAAM,CAAC;CACb;AAED;;;GAGG;AACH,MAAM,WAAW,WAAW;IAC1B,kDAAkD;IAClD,OAAO,EAAE,MAAM,CAAC;IAChB,KAAK,EAAE,MAAM,CAAC;IACd,MAAM,CAAC,EAAE,MAAM,CAAC;IAChB,6DAA6D;IAC7D,IAAI,EAAE,IAAI,CAAC;IACX,yGAAyG;IACzG,UAAU,EAAE,OAAO,EAAE,CAAC;IACtB,IAAI,EAAE,WAAW,CAAC;IAClB,oEAAoE;IACpE,GAAG,CAAC,EAAE,UAAU,EAAE,CAAC;IACnB,KAAK,EAAE,YAAY,CAAC;IACpB,OAAO,CAAC,EAAE,MAAM,CAAC;IACjB,UAAU,CAAC,EAAE,MAAM,CAAC;IACpB,UAAU,CAAC,EAAE,MAAM,CAAC;IACpB,wFAAwF;IACxF,aAAa,CAAC,EAAE,MAAM,CAAC;CACxB;AAED,8EAA8E;AAC9E,MAAM,WAAW,cAAe,SAAQ,WAAW;IACjD,IAAI,EAAE,MAAM,EAAE,CAAC;IACf,IAAI,EAAE,MAAM,CAAC;CACd;AAED,MAAM,WAAW,gBAAgB;IAC/B,IAAI,EAAE,MAAM,CAAC;IACb,OAAO,EAAE,cAAc,CAAC;IACxB;;;OAGG;IACH,cAAc,CAAC,EAAE,kBAAkB,CAAC;CACrC"}

package/content/index.d.ts

@@ -2,8 +2,9 @@ export * from "../Article";
 export * from "../Presentation";
 export * from "../Staff";
 export { default as MarkdownContent } from "../markdownComponents/MarkdownContent";
-export { default as markdownComponents } from "../markdownComponents";
+export { default as markdownComponents, createMarkdownComponents, type MarkdownComponentOptions, } from "../markdownComponents/markdownComponents";
 export { default as excerptComponents, linkedCardExcerptComponents } from "../markdownComponents/excerptComponents";
 export type { Website } from "../types";
+export * from "../images";
 export * from "../utils";
 //# sourceMappingURL=index.d.ts.map

package/content/index.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../src/content/index.ts"],"names":[],"mappings":"AAEA,cAAc,YAAY,CAAC;AAC3B,cAAc,iBAAiB,CAAC;AAChC,cAAc,UAAU,CAAC;AAEzB,OAAO,EAAE,OAAO,IAAI,eAAe,EAAE,MAAM,uCAAuC,CAAC;AACnF,OAAO,EAAE,OAAO,IAAI,kBAAkB,EAAE,MAAM,uBAAuB,CAAC;AACtE,OAAO,EAAE,OAAO,IAAI,iBAAiB,EAAE,2BAA2B,EAAE,MAAM,yCAAyC,CAAC;AAEpH,YAAY,EAAE,OAAO,EAAE,MAAM,UAAU,CAAC;AACxC,cAAc,UAAU,CAAC"}
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../src/content/index.ts"],"names":[],"mappings":"AAEA,cAAc,YAAY,CAAC;AAC3B,cAAc,iBAAiB,CAAC;AAChC,cAAc,UAAU,CAAC;AAEzB,OAAO,EAAE,OAAO,IAAI,eAAe,EAAE,MAAM,uCAAuC,CAAC;AACnF,OAAO,EACL,OAAO,IAAI,kBAAkB,EAC7B,wBAAwB,EACxB,KAAK,wBAAwB,GAC9B,MAAM,0CAA0C,CAAC;AAClD,OAAO,EAAE,OAAO,IAAI,iBAAiB,EAAE,2BAA2B,EAAE,MAAM,yCAAyC,CAAC;AAEpH,YAAY,EAAE,OAAO,EAAE,MAAM,UAAU,CAAC;AACxC,cAAc,WAAW,CAAC;AAC1B,cAAc,UAAU,CAAC"}

package/content/index.js

@@ -4,7 +4,8 @@ export * from "../Article";
 export * from "../Presentation";
 export * from "../Staff";
 export { default as MarkdownContent } from "../markdownComponents/MarkdownContent";
-export { default as markdownComponents } from "../markdownComponents";
+export { default as markdownComponents, createMarkdownComponents, } from "../markdownComponents/markdownComponents";
 export { default as excerptComponents, linkedCardExcerptComponents } from "../markdownComponents/excerptComponents";
+export * from "../images";
 export * from "../utils";
 //# sourceMappingURL=index.js.map

package/content/index.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.js","sourceRoot":"","sources":["../../src/content/index.ts"],"names":[],"mappings":"AAAA,4EAA4E;AAC5E,mEAAmE;AACnE,cAAc,YAAY,CAAC;AAC3B,cAAc,iBAAiB,CAAC;AAChC,cAAc,UAAU,CAAC;AAEzB,OAAO,EAAE,OAAO,IAAI,eAAe,EAAE,MAAM,uCAAuC,CAAC;AACnF,OAAO,EAAE,OAAO,IAAI,kBAAkB,EAAE,MAAM,uBAAuB,CAAC;AACtE,OAAO,EAAE,OAAO,IAAI,iBAAiB,EAAE,2BAA2B,EAAE,MAAM,yCAAyC,CAAC;AAGpH,cAAc,UAAU,CAAC"}
+{"version":3,"file":"index.js","sourceRoot":"","sources":["../../src/content/index.ts"],"names":[],"mappings":"AAAA,4EAA4E;AAC5E,mEAAmE;AACnE,cAAc,YAAY,CAAC;AAC3B,cAAc,iBAAiB,CAAC;AAChC,cAAc,UAAU,CAAC;AAEzB,OAAO,EAAE,OAAO,IAAI,eAAe,EAAE,MAAM,uCAAuC,CAAC;AACnF,OAAO,EACL,OAAO,IAAI,kBAAkB,EAC7B,wBAAwB,GAEzB,MAAM,0CAA0C,CAAC;AAClD,OAAO,EAAE,OAAO,IAAI,iBAAiB,EAAE,2BAA2B,EAAE,MAAM,yCAAyC,CAAC;AAGpH,cAAc,WAAW,CAAC;AAC1B,cAAc,UAAU,CAAC"}

package/images/DefaultImageComponent.d.ts

@@ -0,0 +1,8 @@
+import type { SiteImageProps } from "./types";
+/**
+ * The plain `<img>` the library falls back to when a site has not supplied an
+ * `imageComponent`. Keeps the default behaviour of every consumer unchanged.
+ */
+declare const DefaultImageComponent: ({ sizes, ...props }: SiteImageProps) => import("react").JSX.Element;
+export default DefaultImageComponent;
+//# sourceMappingURL=DefaultImageComponent.d.ts.map

package/images/DefaultImageComponent.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"DefaultImageComponent.d.ts","sourceRoot":"","sources":["../../src/images/DefaultImageComponent.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,cAAc,EAAE,MAAM,SAAS,CAAC;AAE9C;;;GAGG;AACH,QAAA,MAAM,qBAAqB,GAAI,qBAAqB,cAAc,gCAKjE,CAAC;AAEF,eAAe,qBAAqB,CAAC"}

package/images/DefaultImageComponent.js

@@ -0,0 +1,12 @@
+import { jsx as _jsx } from "react/jsx-runtime";
+/**
+ * The plain `<img>` the library falls back to when a site has not supplied an
+ * `imageComponent`. Keeps the default behaviour of every consumer unchanged.
+ */
+const DefaultImageComponent = ({ sizes, ...props }) => (
+// `sizes` without a `srcset` means nothing to a plain <img>, so it is
+// dropped rather than emitted as a dead attribute.
+// eslint-disable-next-line @next/next/no-img-element
+_jsx("img", { ...props }));
+export default DefaultImageComponent;
+//# sourceMappingURL=DefaultImageComponent.js.map

package/images/DefaultImageComponent.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"DefaultImageComponent.js","sourceRoot":"","sources":["../../src/images/DefaultImageComponent.tsx"],"names":[],"mappings":";AAEA;;;GAGG;AACH,MAAM,qBAAqB,GAAG,CAAC,EAAE,KAAK,EAAE,GAAG,KAAK,EAAkB,EAAE,EAAE,CAAC;AACrE,sEAAsE;AACtE,mDAAmD;AACnD,qDAAqD;AACrD,iBAAS,KAAK,GAAI,CACnB,CAAC;AAEF,eAAe,qBAAqB,CAAC"}

package/images/index.d.ts

@@ -0,0 +1,3 @@
+export { default as DefaultImageComponent } from "./DefaultImageComponent";
+export type * from "./types";
+//# sourceMappingURL=index.d.ts.map

package/images/index.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../src/images/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,OAAO,IAAI,qBAAqB,EAAE,MAAM,yBAAyB,CAAC;AAC3E,mBAAmB,SAAS,CAAC"}

package/images/index.js

@@ -0,0 +1,2 @@
+export { default as DefaultImageComponent } from "./DefaultImageComponent";
+//# sourceMappingURL=index.js.map

package/images/index.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.js","sourceRoot":"","sources":["../../src/images/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,OAAO,IAAI,qBAAqB,EAAE,MAAM,yBAAyB,CAAC"}

package/images/types.d.ts

@@ -0,0 +1,28 @@
+import type { ComponentType, ImgHTMLAttributes } from "react";
+/**
+ * The props the library hands to whatever component renders its images.
+ *
+ * Deliberately the intersection of a plain `<img>` and `next/image`:
+ * `src`/`alt` plus intrinsic `width`/`height` as numbers and a `sizes` hint.
+ * A plain `<img>` treats the dimensions as the attributes they already are;
+ * `next/image` and `next-image-export-optimizer` use them to build a srcset.
+ */
+export type SiteImageProps = Omit<ImgHTMLAttributes<HTMLImageElement>, "src" | "alt" | "width" | "height"> & {
+    src: string;
+    alt: string;
+    /** Intrinsic width in pixels. Required by `next/image`-shaped components. */
+    width: number;
+    /** Intrinsic height in pixels. Required by `next/image`-shaped components. */
+    height: number;
+    /** Responsive-selection hint, e.g. `(max-width: 900px) 100vw, 400px`. */
+    sizes?: string;
+};
+/**
+ * A drop-in replacement for the `<img>` tags the library renders.
+ *
+ * Sites that optimize their images pass one in — `next/image`, or
+ * `next-image-export-optimizer`'s `ExportedImage` on a statically exported
+ * site. Everything else gets {@link DefaultImageComponent}.
+ */
+export type SiteImageComponent = ComponentType<SiteImageProps>;
+//# sourceMappingURL=types.d.ts.map

package/images/types.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"types.d.ts","sourceRoot":"","sources":["../../src/images/types.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,aAAa,EAAE,iBAAiB,EAAE,MAAM,OAAO,CAAC;AAE9D;;;;;;;GAOG;AACH,MAAM,MAAM,cAAc,GAAG,IAAI,CAC/B,iBAAiB,CAAC,gBAAgB,CAAC,EACnC,KAAK,GAAG,KAAK,GAAG,OAAO,GAAG,QAAQ,CACnC,GAAG;IACF,GAAG,EAAE,MAAM,CAAC;IACZ,GAAG,EAAE,MAAM,CAAC;IACZ,6EAA6E;IAC7E,KAAK,EAAE,MAAM,CAAC;IACd,8EAA8E;IAC9E,MAAM,EAAE,MAAM,CAAC;IACf,yEAAyE;IACzE,KAAK,CAAC,EAAE,MAAM,CAAC;CAChB,CAAC;AAEF;;;;;;GAMG;AACH,MAAM,MAAM,kBAAkB,GAAG,aAAa,CAAC,cAAc,CAAC,CAAC"}

package/images/types.js

@@ -0,0 +1,2 @@
+export {};
+//# sourceMappingURL=types.js.map

package/images/types.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"types.js","sourceRoot":"","sources":["../../src/images/types.ts"],"names":[],"mappings":""}

package/index.d.ts

@@ -6,7 +6,7 @@ export * from "./Security";
 export * from "./Milestone";
 export { githubFetch, GITHUB_REVALIDATE, getTree, getRepoPaths, getRawFile, getAllPages, type GitHubFetchOptions, type GitTree, type GitTreeItem, } from "./github";
 export { default as MarkdownContent } from "./markdownComponents/MarkdownContent";
-export { default as markdownComponents } from "./markdownComponents";
+export { default as markdownComponents, createMarkdownComponents, type MarkdownComponentOptions, } from "./markdownComponents/markdownComponents";
 export { default as excerptComponents, linkedCardExcerptComponents } from "./markdownComponents/excerptComponents";
 export { default as BigNumber, type BigNumberProps } from "./BigNumber";
 export { default as PieChart, type PieChartData } from "./PieChart";
@@ -18,6 +18,7 @@ export * from "./TimeBar";
 export { default as TopStyledBlock } from "./TopStyledBlock";
 export * from "./UW";
 export type { Website } from "./types";
+export * from "./images";
 export * from "./utils";
 export * from "./themes";
 //# sourceMappingURL=index.d.ts.map

package/index.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../src/index.ts"],"names":[],"mappings":"AACA,cAAc,WAAW,CAAC;AAC1B,cAAc,gBAAgB,CAAC;AAC/B,cAAc,SAAS,CAAC;AACxB,cAAc,WAAW,CAAC;AAC1B,cAAc,YAAY,CAAC;AAC3B,cAAc,aAAa,CAAC;AAG5B,OAAO,EACL,WAAW,EACX,iBAAiB,EACjB,OAAO,EACP,YAAY,EACZ,UAAU,EACV,WAAW,EACX,KAAK,kBAAkB,EACvB,KAAK,OAAO,EACZ,KAAK,WAAW,GACjB,MAAM,UAAU,CAAC;AAElB,OAAO,EAAE,OAAO,IAAI,eAAe,EAAE,MAAM,sCAAsC,CAAC;AAClF,OAAO,EAAE,OAAO,IAAI,kBAAkB,EAAE,MAAM,sBAAsB,CAAC;AACrE,OAAO,EAAE,OAAO,IAAI,iBAAiB,EAAE,2BAA2B,EAAE,MAAM,wCAAwC,CAAC;AAGnH,OAAO,EAAE,OAAO,IAAI,SAAS,EAAE,KAAK,cAAc,EAAE,MAAM,aAAa,CAAC;AACxE,OAAO,EAAE,OAAO,IAAI,QAAQ,EAAE,KAAK,YAAY,EAAE,MAAM,YAAY,CAAC;AACpE,OAAO,EAAE,OAAO,IAAI,QAAQ,EAAE,MAAM,YAAY,CAAC;AACjD,OAAO,EAAE,OAAO,IAAI,aAAa,EAAE,MAAM,iBAAiB,CAAC;AAC3D,OAAO,EAAE,OAAO,IAAI,KAAK,EAAE,KAAK,UAAU,EAAE,MAAM,SAAS,CAAC;AAC5D,OAAO,EAAE,OAAO,IAAI,OAAO,EAAE,MAAM,WAAW,CAAC;AAC/C,cAAc,WAAW,CAAC;AAC1B,OAAO,EAAE,OAAO,IAAI,cAAc,EAAE,MAAM,kBAAkB,CAAC;AAC7D,cAAc,MAAM,CAAC;AAErB,YAAY,EAAE,OAAO,EAAE,MAAM,SAAS,CAAC;AACvC,cAAc,SAAS,CAAC;AACxB,cAAc,UAAU,CAAC"}
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../src/index.ts"],"names":[],"mappings":"AACA,cAAc,WAAW,CAAC;AAC1B,cAAc,gBAAgB,CAAC;AAC/B,cAAc,SAAS,CAAC;AACxB,cAAc,WAAW,CAAC;AAC1B,cAAc,YAAY,CAAC;AAC3B,cAAc,aAAa,CAAC;AAG5B,OAAO,EACL,WAAW,EACX,iBAAiB,EACjB,OAAO,EACP,YAAY,EACZ,UAAU,EACV,WAAW,EACX,KAAK,kBAAkB,EACvB,KAAK,OAAO,EACZ,KAAK,WAAW,GACjB,MAAM,UAAU,CAAC;AAElB,OAAO,EAAE,OAAO,IAAI,eAAe,EAAE,MAAM,sCAAsC,CAAC;AAClF,OAAO,EACL,OAAO,IAAI,kBAAkB,EAC7B,wBAAwB,EACxB,KAAK,wBAAwB,GAC9B,MAAM,yCAAyC,CAAC;AACjD,OAAO,EAAE,OAAO,IAAI,iBAAiB,EAAE,2BAA2B,EAAE,MAAM,wCAAwC,CAAC;AAGnH,OAAO,EAAE,OAAO,IAAI,SAAS,EAAE,KAAK,cAAc,EAAE,MAAM,aAAa,CAAC;AACxE,OAAO,EAAE,OAAO,IAAI,QAAQ,EAAE,KAAK,YAAY,EAAE,MAAM,YAAY,CAAC;AACpE,OAAO,EAAE,OAAO,IAAI,QAAQ,EAAE,MAAM,YAAY,CAAC;AACjD,OAAO,EAAE,OAAO,IAAI,aAAa,EAAE,MAAM,iBAAiB,CAAC;AAC3D,OAAO,EAAE,OAAO,IAAI,KAAK,EAAE,KAAK,UAAU,EAAE,MAAM,SAAS,CAAC;AAC5D,OAAO,EAAE,OAAO,IAAI,OAAO,EAAE,MAAM,WAAW,CAAC;AAC/C,cAAc,WAAW,CAAC;AAC1B,OAAO,EAAE,OAAO,IAAI,cAAc,EAAE,MAAM,kBAAkB,CAAC;AAC7D,cAAc,MAAM,CAAC;AAErB,YAAY,EAAE,OAAO,EAAE,MAAM,SAAS,CAAC;AAGvC,cAAc,UAAU,CAAC;AACzB,cAAc,SAAS,CAAC;AACxB,cAAc,UAAU,CAAC"}

package/index.js

@@ -8,7 +8,7 @@ export * from "./Milestone";
 // Shared GitHub client the getters are built on.
 export { githubFetch, GITHUB_REVALIDATE, getTree, getRepoPaths, getRawFile, getAllPages, } from "./github";
 export { default as MarkdownContent } from "./markdownComponents/MarkdownContent";
-export { default as markdownComponents } from "./markdownComponents";
+export { default as markdownComponents, createMarkdownComponents, } from "./markdownComponents/markdownComponents";
 export { default as excerptComponents, linkedCardExcerptComponents } from "./markdownComponents/excerptComponents";
 // Standalone components.
 export { default as BigNumber } from "./BigNumber";
@@ -20,6 +20,8 @@ export { default as TimeBar } from "./TimeBar";
 export * from "./TimeBar";
 export { default as TopStyledBlock } from "./TopStyledBlock";
 export * from "./UW";
+// Pluggable image rendering.
+export * from "./images";
 export * from "./utils";
 export * from "./themes";
 //# sourceMappingURL=index.js.map

package/index.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.js","sourceRoot":"","sources":["../src/index.ts"],"names":[],"mappings":"AAAA,yEAAyE;AACzE,cAAc,WAAW,CAAC;AAC1B,cAAc,gBAAgB,CAAC;AAC/B,cAAc,SAAS,CAAC;AACxB,cAAc,WAAW,CAAC;AAC1B,cAAc,YAAY,CAAC;AAC3B,cAAc,aAAa,CAAC;AAE5B,iDAAiD;AACjD,OAAO,EACL,WAAW,EACX,iBAAiB,EACjB,OAAO,EACP,YAAY,EACZ,UAAU,EACV,WAAW,GAIZ,MAAM,UAAU,CAAC;AAElB,OAAO,EAAE,OAAO,IAAI,eAAe,EAAE,MAAM,sCAAsC,CAAC;AAClF,OAAO,EAAE,OAAO,IAAI,kBAAkB,EAAE,MAAM,sBAAsB,CAAC;AACrE,OAAO,EAAE,OAAO,IAAI,iBAAiB,EAAE,2BAA2B,EAAE,MAAM,wCAAwC,CAAC;AAEnH,yBAAyB;AACzB,OAAO,EAAE,OAAO,IAAI,SAAS,EAAuB,MAAM,aAAa,CAAC;AACxE,OAAO,EAAE,OAAO,IAAI,QAAQ,EAAqB,MAAM,YAAY,CAAC;AACpE,OAAO,EAAE,OAAO,IAAI,QAAQ,EAAE,MAAM,YAAY,CAAC;AACjD,OAAO,EAAE,OAAO,IAAI,aAAa,EAAE,MAAM,iBAAiB,CAAC;AAC3D,OAAO,EAAE,OAAO,IAAI,KAAK,EAAmB,MAAM,SAAS,CAAC;AAC5D,OAAO,EAAE,OAAO,IAAI,OAAO,EAAE,MAAM,WAAW,CAAC;AAC/C,cAAc,WAAW,CAAC;AAC1B,OAAO,EAAE,OAAO,IAAI,cAAc,EAAE,MAAM,kBAAkB,CAAC;AAC7D,cAAc,MAAM,CAAC;AAGrB,cAAc,SAAS,CAAC;AACxB,cAAc,UAAU,CAAC"}
+{"version":3,"file":"index.js","sourceRoot":"","sources":["../src/index.ts"],"names":[],"mappings":"AAAA,yEAAyE;AACzE,cAAc,WAAW,CAAC;AAC1B,cAAc,gBAAgB,CAAC;AAC/B,cAAc,SAAS,CAAC;AACxB,cAAc,WAAW,CAAC;AAC1B,cAAc,YAAY,CAAC;AAC3B,cAAc,aAAa,CAAC;AAE5B,iDAAiD;AACjD,OAAO,EACL,WAAW,EACX,iBAAiB,EACjB,OAAO,EACP,YAAY,EACZ,UAAU,EACV,WAAW,GAIZ,MAAM,UAAU,CAAC;AAElB,OAAO,EAAE,OAAO,IAAI,eAAe,EAAE,MAAM,sCAAsC,CAAC;AAClF,OAAO,EACL,OAAO,IAAI,kBAAkB,EAC7B,wBAAwB,GAEzB,MAAM,yCAAyC,CAAC;AACjD,OAAO,EAAE,OAAO,IAAI,iBAAiB,EAAE,2BAA2B,EAAE,MAAM,wCAAwC,CAAC;AAEnH,yBAAyB;AACzB,OAAO,EAAE,OAAO,IAAI,SAAS,EAAuB,MAAM,aAAa,CAAC;AACxE,OAAO,EAAE,OAAO,IAAI,QAAQ,EAAqB,MAAM,YAAY,CAAC;AACpE,OAAO,EAAE,OAAO,IAAI,QAAQ,EAAE,MAAM,YAAY,CAAC;AACjD,OAAO,EAAE,OAAO,IAAI,aAAa,EAAE,MAAM,iBAAiB,CAAC;AAC3D,OAAO,EAAE,OAAO,IAAI,KAAK,EAAmB,MAAM,SAAS,CAAC;AAC5D,OAAO,EAAE,OAAO,IAAI,OAAO,EAAE,MAAM,WAAW,CAAC;AAC/C,cAAc,WAAW,CAAC;AAC1B,OAAO,EAAE,OAAO,IAAI,cAAc,EAAE,MAAM,kBAAkB,CAAC;AAC7D,cAAc,MAAM,CAAC;AAIrB,6BAA6B;AAC7B,cAAc,UAAU,CAAC;AACzB,cAAc,SAAS,CAAC;AACxB,cAAc,UAAU,CAAC"}

package/markdownComponents/MarkdownContent.d.ts

@@ -1,14 +1,22 @@
 import { type Components } from "react-markdown";
+import type { SiteImageComponent } from "../images/types";
 interface MarkdownContentProps {
     children?: string | null;
     /** Override the component map; defaults to the shared markdownComponents. */
     components?: Components;
+    /**
+     * Component rendered for images in the markdown. Ignored when `components`
+     * is supplied, since that map already decides how images render.
+     */
+    imageComponent?: SiteImageComponent;
+    /** `sizes` hint forwarded to `imageComponent`. */
+    imageSizes?: string;
 }
 /**
  * Renders markdown with raw-HTML support and the library's component overrides.
  * Centralizes the `rehypeRaw` + components wiring shared across Article,
  * Presentation and PresentationCard.
  */
-declare const MarkdownContent: ({ children, components, }: MarkdownContentProps) => import("react").JSX.Element;
+declare const MarkdownContent: ({ children, components, imageComponent, imageSizes, }: MarkdownContentProps) => import("react").JSX.Element;
 export default MarkdownContent;
 //# sourceMappingURL=MarkdownContent.d.ts.map

package/markdownComponents/MarkdownContent.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"MarkdownContent.d.ts","sourceRoot":"","sources":["../../src/markdownComponents/MarkdownContent.tsx"],"names":[],"mappings":"AAAA,OAAiB,EAAE,KAAK,UAAU,EAAE,MAAM,gBAAgB,CAAC;AAI3D,UAAU,oBAAoB;IAC5B,QAAQ,CAAC,EAAE,MAAM,GAAG,IAAI,CAAC;IACzB,6EAA6E;IAC7E,UAAU,CAAC,EAAE,UAAU,CAAC;CACzB;AAED;;;;GAIG;AACH,QAAA,MAAM,eAAe,GAAI,2BAGtB,oBAAoB,gCAItB,CAAC;AAEF,eAAe,eAAe,CAAC"}
+{"version":3,"file":"MarkdownContent.d.ts","sourceRoot":"","sources":["../../src/markdownComponents/MarkdownContent.tsx"],"names":[],"mappings":"AAAA,OAAiB,EAAE,KAAK,UAAU,EAAE,MAAM,gBAAgB,CAAC;AAK3D,OAAO,KAAK,EAAE,kBAAkB,EAAE,MAAM,iBAAiB,CAAC;AAE1D,UAAU,oBAAoB;IAC5B,QAAQ,CAAC,EAAE,MAAM,GAAG,IAAI,CAAC;IACzB,6EAA6E;IAC7E,UAAU,CAAC,EAAE,UAAU,CAAC;IACxB;;;OAGG;IACH,cAAc,CAAC,EAAE,kBAAkB,CAAC;IACpC,kDAAkD;IAClD,UAAU,CAAC,EAAE,MAAM,CAAC;CACrB;AAED;;;;GAIG;AACH,QAAA,MAAM,eAAe,GAAI,uDAKtB,oBAAoB,gCAYtB,CAAC;AAEF,eAAe,eAAe,CAAC"}

package/markdownComponents/MarkdownContent.js

@@ -1,12 +1,17 @@
 import { jsx as _jsx } from "react/jsx-runtime";
 import Markdown from "react-markdown";
 import rehypeRaw from "rehype-raw";
-import markdownComponents from "./markdownComponents";
+import markdownComponents, { createMarkdownComponents, } from "./markdownComponents";
 /**
  * Renders markdown with raw-HTML support and the library's component overrides.
  * Centralizes the `rehypeRaw` + components wiring shared across Article,
  * Presentation and PresentationCard.
  */
-const MarkdownContent = ({ children, components = markdownComponents, }) => (_jsx(Markdown, { rehypePlugins: [rehypeRaw], components: components, children: children }));
+const MarkdownContent = ({ children, components, imageComponent, imageSizes, }) => {
+    const resolved = components !== null && components !== void 0 ? components : (imageComponent
+        ? createMarkdownComponents({ imageComponent, imageSizes })
+        : markdownComponents);
+    return (_jsx(Markdown, { rehypePlugins: [rehypeRaw], components: resolved, children: children }));
+};
 export default MarkdownContent;
 //# sourceMappingURL=MarkdownContent.js.map

package/markdownComponents/MarkdownContent.js.map

@@ -1 +1 @@
-{"version":3,"file":"MarkdownContent.js","sourceRoot":"","sources":["../../src/markdownComponents/MarkdownContent.tsx"],"names":[],"mappings":";AAAA,OAAO,QAA6B,MAAM,gBAAgB,CAAC;AAC3D,OAAO,SAAS,MAAM,YAAY,CAAC;AACnC,OAAO,kBAAkB,MAAM,sBAAsB,CAAC;AAQtD;;;;GAIG;AACH,MAAM,eAAe,GAAG,CAAC,EACvB,QAAQ,EACR,UAAU,GAAG,kBAAkB,GACV,EAAE,EAAE,CAAC,CAC1B,KAAC,QAAQ,IAAC,aAAa,EAAE,CAAC,SAAS,CAAC,EAAE,UAAU,EAAE,UAAU,YACzD,QAAQ,GACA,CACZ,CAAC;AAEF,eAAe,eAAe,CAAC"}
+{"version":3,"file":"MarkdownContent.js","sourceRoot":"","sources":["../../src/markdownComponents/MarkdownContent.tsx"],"names":[],"mappings":";AAAA,OAAO,QAA6B,MAAM,gBAAgB,CAAC;AAC3D,OAAO,SAAS,MAAM,YAAY,CAAC;AACnC,OAAO,kBAAkB,EAAE,EACzB,wBAAwB,GACzB,MAAM,sBAAsB,CAAC;AAgB9B;;;;GAIG;AACH,MAAM,eAAe,GAAG,CAAC,EACvB,QAAQ,EACR,UAAU,EACV,cAAc,EACd,UAAU,GACW,EAAE,EAAE;IACzB,MAAM,QAAQ,GACZ,UAAU,aAAV,UAAU,cAAV,UAAU,GACV,CAAC,cAAc;QACb,CAAC,CAAC,wBAAwB,CAAC,EAAE,cAAc,EAAE,UAAU,EAAE,CAAC;QAC1D,CAAC,CAAC,kBAAkB,CAAC,CAAC;IAE1B,OAAO,CACL,KAAC,QAAQ,IAAC,aAAa,EAAE,CAAC,SAAS,CAAC,EAAE,UAAU,EAAE,QAAQ,YACvD,QAAQ,GACA,CACZ,CAAC;AACJ,CAAC,CAAC;AAEF,eAAe,eAAe,CAAC"}

package/markdownComponents/index.d.ts

@@ -1,2 +1,3 @@
-export { default } from "./markdownComponents";
+export { default, createMarkdownComponents } from "./markdownComponents";
+export type { MarkdownComponentOptions } from "./markdownComponents";
 //# sourceMappingURL=index.d.ts.map

package/markdownComponents/index.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../src/markdownComponents/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAC,OAAO,EAAC,MAAM,sBAAsB,CAAC"}
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../src/markdownComponents/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,OAAO,EAAE,wBAAwB,EAAE,MAAM,sBAAsB,CAAC;AACzE,YAAY,EAAE,wBAAwB,EAAE,MAAM,sBAAsB,CAAC"}

package/markdownComponents/index.js

@@ -1,2 +1,2 @@
-export { default } from "./markdownComponents";
+export { default, createMarkdownComponents } from "./markdownComponents";
 //# sourceMappingURL=index.js.map

package/markdownComponents/index.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.js","sourceRoot":"","sources":["../../src/markdownComponents/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAC,OAAO,EAAC,MAAM,sBAAsB,CAAC"}
+{"version":3,"file":"index.js","sourceRoot":"","sources":["../../src/markdownComponents/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,OAAO,EAAE,wBAAwB,EAAE,MAAM,sBAAsB,CAAC"}

package/markdownComponents/markdownComponents.d.ts

@@ -1,4 +1,21 @@
 import type { Components } from "react-markdown";
-declare const markdownComponents: Components;
+import type { SiteImageComponent } from "../images/types";
+export interface MarkdownComponentOptions {
+    /**
+     * Component rendered for every image in the markdown. Defaults to a plain
+     * `<img>`; pass `next/image` or `ExportedImage` to have them optimized.
+     */
+    imageComponent?: SiteImageComponent;
+    /** `sizes` hint forwarded to {@link MarkdownComponentOptions.imageComponent}. */
+    imageSizes?: string;
+}
+/**
+ * Build the component map react-markdown renders with.
+ *
+ * Everything but images is fixed; images are pluggable because optimizing them
+ * needs a framework component the library cannot depend on.
+ */
+export declare const createMarkdownComponents: ({ imageComponent: ImageComponent, imageSizes, }?: MarkdownComponentOptions) => Components;
+declare const markdownComponents: import("node_modules/react-markdown/lib").Components;
 export default markdownComponents;
 //# sourceMappingURL=markdownComponents.d.ts.map

package/markdownComponents/markdownComponents.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"markdownComponents.d.ts","sourceRoot":"","sources":["../../src/markdownComponents/markdownComponents.tsx"],"names":[],"mappings":"AAGA,OAAO,KAAK,EAAE,UAAU,EAAE,MAAM,gBAAgB,CAAC;AAUjD,QAAA,MAAM,kBAAkB,EAAE,UA4IzB,CAAC;AAEF,eAAe,kBAAkB,CAAC"}
+{"version":3,"file":"markdownComponents.d.ts","sourceRoot":"","sources":["../../src/markdownComponents/markdownComponents.tsx"],"names":[],"mappings":"AAGA,OAAO,KAAK,EAAE,UAAU,EAAE,MAAM,gBAAgB,CAAC;AAEjD,OAAO,KAAK,EAAE,kBAAkB,EAAE,MAAM,iBAAiB,CAAC;AA2I1D,MAAM,WAAW,wBAAwB;IACvC;;;OAGG;IACH,cAAc,CAAC,EAAE,kBAAkB,CAAC;IACpC,iFAAiF;IACjF,UAAU,CAAC,EAAE,MAAM,CAAC;CACrB;AAoBD;;;;;GAKG;AACH,eAAO,MAAM,wBAAwB,GAAI,kDAGtC,wBAA6B,KAAG,UAgCjC,CAAC;AAEH,QAAA,MAAM,kBAAkB,sDAA6B,CAAC;AAEtD,eAAe,kBAAkB,CAAC"}

package/markdownComponents/markdownComponents.js

@@ -2,6 +2,7 @@ import { jsx as _jsx, Fragment as _Fragment, jsxs as _jsxs } from "react/jsx-run
 import Box from "@mui/material/Box";
 import MuiLink from "@mui/material/Link";
 import Typography from "@mui/material/Typography";
+import DefaultImageComponent from "../images/DefaultImageComponent";
 /*
  * react-markdown hands every component the mdast `node` it came from. It is
  * useful for inspecting the source tree, but it is not a DOM attribute, and
@@ -9,7 +10,7 @@ import Typography from "@mui/material/Typography";
  * stamps `node="[object Object]"` onto the rendered element. Every component
  * below drops it before spreading the rest.
  */
-const markdownComponents = {
+const baseComponents = {
     h1: ({ children, node, ...props }) => {
         return (_jsx(Typography, { component: "h1", variant: "h4", gutterBottom: true, ...props, children: children }));
     },
@@ -58,14 +59,50 @@ const markdownComponents = {
             overflow: "auto",
             mb: 2,
         }, ...props })),
-    img: ({ node, ...props }) => {
-        return (_jsx("img", { ...props, style: {
+};
+/*
+ * Markdown bodies come from the content repositories as raw HTML, and most of
+ * their `<img>` tags declare no dimensions. `next/image`-shaped components
+ * require both, and use them only for the aspect ratio of the placeholder and
+ * to cap the srcset — the rendered size comes from the CSS below. So an
+ * assumed landscape ratio is safe: a wrong guess costs a little layout shift
+ * on load, not a wrongly sized image.
+ */
+const FALLBACK_IMAGE_WIDTH = 1200;
+const FALLBACK_IMAGE_HEIGHT = 800;
+/** Parse an HTML dimension attribute, which arrives as a string. */
+const toPixels = (value) => {
+    const parsed = typeof value === "number" ? value : Number.parseInt(String(value !== null && value !== void 0 ? value : ""), 10);
+    return Number.isFinite(parsed) && parsed > 0 ? parsed : undefined;
+};
+/**
+ * Build the component map react-markdown renders with.
+ *
+ * Everything but images is fixed; images are pluggable because optimizing them
+ * needs a framework component the library cannot depend on.
+ */
+export const createMarkdownComponents = ({ imageComponent: ImageComponent = DefaultImageComponent, imageSizes, } = {}) => ({
+    ...baseComponents,
+    img: ({ node, src, alt, width, height, style, ...props }) => {
+        // A missing or non-string src is not something an image component can be
+        // handed; drop the image rather than render a broken one.
+        if (typeof src !== "string" || src === "")
+            return null;
+        const declaredWidth = toPixels(width);
+        const declaredHeight = toPixels(height);
+        return (_jsx(ImageComponent, { ...props, src: src, alt: alt !== null && alt !== void 0 ? alt : "", width: declaredWidth !== null && declaredWidth !== void 0 ? declaredWidth : FALLBACK_IMAGE_WIDTH, height: declaredHeight !== null && declaredHeight !== void 0 ? declaredHeight : FALLBACK_IMAGE_HEIGHT, sizes: imageSizes, style: {
                 maxWidth: "100%",
+                // Both dimensions are set, so a component that warns about a
+                // half-constrained image stays quiet, and the intrinsic ratio above
+                // never overrides the real one.
+                width: declaredWidth ? `${declaredWidth}px` : undefined,
                 height: "auto",
                 marginTop: 2,
                 marginBottom: 2,
+                ...style,
             } }));
     },
-};
+});
+const markdownComponents = createMarkdownComponents();
 export default markdownComponents;
 //# sourceMappingURL=markdownComponents.js.map

package/markdownComponents/markdownComponents.js.map

@@ -1 +1 @@
-{"version":3,"file":"markdownComponents.js","sourceRoot":"","sources":["../../src/markdownComponents/markdownComponents.tsx"],"names":[],"mappings":"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"}
+{"version":3,"file":"markdownComponents.js","sourceRoot":"","sources":["../../src/markdownComponents/markdownComponents.tsx"],"names":[],"mappings":"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"}

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@chtc/web-components",
-  "version": "2.0.6",
+  "version": "2.0.8",
   "homepage": "https://path-cc.io/web-components/",
   "repository": {
     "type": "git",