@arc-ui/community-components 3.8.1 → 3.9.0

package/lib/index.d.cts

@@ -203,7 +203,14 @@ interface CopyLeadProps {
 
 declare const DownloadList: React$1.FC<DownloadListProps>;
 interface DownloadListProps extends Omit<SectionHeadingProps, "isPadded"> {
+    /**
+     * Set the list of `Download` components.
+     */
     downloads: DownloadProps[];
+    /**
+     * Align the `Download` list below or to the right of the `SectionHeading`.
+     */
+    alignment?: "below" | "right";
 }
 
 declare const FAQs: React$1.FC<FAQsProps>;
@@ -764,16 +771,19 @@ interface BentoMediaCard extends Omit<MediaCardProps, "isContained" | "buttonIco
  * Content structure for the bento grid layout within each tab.
  * - card1 & card2: Can be either information or media cards
  * - card3: Optional information card
- * - card4: Typography card with label and url
+ * - card4: Typography card with label, heading and url
  */
 type BentoGridContent = {
     card1: BentoInformationCard | BentoMediaCard;
     card2: BentoInformationCard | BentoMediaCard;
     card3?: BentoInformationCard;
     card4: {
-        url: string;
-        label?: string;
+        url: TypographyCardProps["url"];
+        label?: TypographyCardProps["label"];
+        /** Overrides the default heading if provided and is not falsey. */
+        heading?: string;
         text?: TypographyCardProps["text"];
+        onClick?: TypographyCardProps["onClick"];
     };
 };
 

package/lib/index.d.mts

@@ -203,7 +203,14 @@ interface CopyLeadProps {
 
 declare const DownloadList: React$1.FC<DownloadListProps>;
 interface DownloadListProps extends Omit<SectionHeadingProps, "isPadded"> {
+    /**
+     * Set the list of `Download` components.
+     */
     downloads: DownloadProps[];
+    /**
+     * Align the `Download` list below or to the right of the `SectionHeading`.
+     */
+    alignment?: "below" | "right";
 }
 
 declare const FAQs: React$1.FC<FAQsProps>;
@@ -764,16 +771,19 @@ interface BentoMediaCard extends Omit<MediaCardProps, "isContained" | "buttonIco
  * Content structure for the bento grid layout within each tab.
  * - card1 & card2: Can be either information or media cards
  * - card3: Optional information card
- * - card4: Typography card with label and url
+ * - card4: Typography card with label, heading and url
  */
 type BentoGridContent = {
     card1: BentoInformationCard | BentoMediaCard;
     card2: BentoInformationCard | BentoMediaCard;
     card3?: BentoInformationCard;
     card4: {
-        url: string;
-        label?: string;
+        url: TypographyCardProps["url"];
+        label?: TypographyCardProps["label"];
+        /** Overrides the default heading if provided and is not falsey. */
+        heading?: string;
         text?: TypographyCardProps["text"];
+        onClick?: TypographyCardProps["onClick"];
     };
 };
 

package/lib/index.mjs

@@ -5,11 +5,11 @@ import { VerticalSpace } from '@arc-ui/components/VerticalSpace';
 import { Image as Image$2 } from '@arc-ui/components/Image';
 import { Disclosure } from '@arc-ui/components/Disclosure';
 import { Carousel } from '@arc-ui/components/Carousel';
+import { Columns, ColumnsCol } from '@arc-ui/components/Columns';
 import { MediaCard } from '@arc-ui/components/MediaCard';
 import { useMediaQuery } from '@arc-ui/components/use-media-query';
 import { Grid, GridRow, GridCol } from '@arc-ui/components/Grid';
 import { Avatar } from '@arc-ui/components/Avatar';
-import { Columns, ColumnsCol } from '@arc-ui/components/Columns';
 import { Icon } from '@arc-ui/components/Icon';
 import { ButtonV2 } from '@arc-ui/components/ButtonV2';
 import { Download } from '@arc-ui/components/Download';
@@ -940,28 +940,30 @@ function requireDebounce () {
 var debounceExports = requireDebounce();
 var debounce = /*@__PURE__*/getDefaultExportFromCjs(debounceExports);
 
-var styles$r = {"section-header":"SectionHeading-module_section-header__iB07I","section-header--hasImage":"SectionHeading-module_section-header--hasImage__Ka3T7","section-header--isCentered":"SectionHeading-module_section-header--isCentered__pz0V9","section-header--padded":"SectionHeading-module_section-header--padded__0FXP2"};
+var styles$r = {"sectionHeading--hasImage":"SectionHeading-module_sectionHeading--hasImage__qaz6n","sectionHeading--isCentered":"SectionHeading-module_sectionHeading--isCentered__i0fR8","sectionHeading-content":"SectionHeading-module_sectionHeading-content__ufB6w"};
 
 var SectionHeading = function (_a) {
     var _b, _c;
     var heading = _a.heading, content = _a.content, id = _a.id, image = _a.image, isHeadingWordWrap = _a.isHeadingWordWrap, _d = _a.isPadded, isPadded = _d === void 0 ? false : _d, _e = _a.headingLevel, headingLevel = _e === void 0 ? "2" : _e, _f = _a.isCentered, isCentered = _f === void 0 ? false : _f, props = __rest(_a, ["heading", "content", "id", "image", "isHeadingWordWrap", "isPadded", "headingLevel", "isCentered"]);
-    return (React.createElement("div", __assign({ className: classNames((_b = {},
-            _b[styles$r["section-header"]] = true,
-            _b[styles$r["section-header--padded"]] = isPadded,
-            _b[styles$r["section-header--isCentered"]] = isCentered,
-            _b)) }, filterAttrs(props)),
-        React.createElement("div", { className: classNames((_c = {}, _c[styles$r["section-header--hasImage"]] = image, _c)) },
-            image && (React.createElement("div", null,
-                React.createElement(Image$2, __assign({}, image, { width: 68, fit: "cover" })))),
-            React.createElement(Heading, { level: headingLevel, id: id, size: "xl", isWordWrap: isHeadingWordWrap }, heading)),
-        content && (React.createElement(React.Fragment, null,
-            React.createElement(VerticalSpace, { size: "24" }),
-            React.createElement(Text, { size: "l", elementType: "p" }, content)))));
+    return (React.createElement(Columns, null,
+        React.createElement(ColumnsCol, { spanM: isPadded ? 9 : 12 },
+            React.createElement("div", __assign({ className: classNames((_b = {},
+                    _b[styles$r["sectionHeading--isCentered"]] = isCentered,
+                    _b)) }, filterAttrs(props)),
+                React.createElement("div", { className: classNames((_c = {},
+                        _c[styles$r["sectionHeading--hasImage"]] = image,
+                        _c)) },
+                    image && React.createElement(Image$2, __assign({}, image, { width: 68, fit: "cover" })),
+                    React.createElement(Heading, { level: headingLevel, id: id, size: "xl", isWordWrap: isHeadingWordWrap }, heading)),
+                content && (React.createElement("div", { className: styles$r["sectionHeading-content"] },
+                    React.createElement(VerticalSpace, { size: "24" }),
+                    React.createElement(Text, { size: "l", elementType: "p" }, content))),
+                React.createElement(VerticalSpace, { size: "40" })))));
 };
 
 /**
  * Do not edit directly
- * Generated on Wed, 13 May 2026 07:47:26 GMT
+ * Generated on Thu, 21 May 2026 15:46:02 GMT
  */
 var ArcSizeBreakpointsXs = "320px";
 var ArcSizeBreakpointsS = "636px";
@@ -1174,17 +1176,19 @@ var CopyLead = function (_a) {
     return null;
 };
 
-var styles$n = {"headingContainer":"DownloadList-module_headingContainer__PNio8"};
+var styles$n = {"downloadList-below":"DownloadList-module_downloadList-below__21q6i","downloadList-right":"DownloadList-module_downloadList-right__mHYHL"};
 
 var DownloadList = function (_a) {
-    var heading = _a.heading, id = _a.id, _b = _a.headingLevel, headingLevel = _b === void 0 ? "2" : _b, isHeadingWordWrap = _a.isHeadingWordWrap, content = _a.content, downloads = _a.downloads, props = __rest(_a, ["heading", "id", "headingLevel", "isHeadingWordWrap", "content", "downloads"]);
+    var heading = _a.heading, id = _a.id, _b = _a.headingLevel, headingLevel = _b === void 0 ? "2" : _b, isHeadingWordWrap = _a.isHeadingWordWrap, content = _a.content, downloads = _a.downloads, _c = _a.alignment, alignment = _c === void 0 ? "below" : _c, props = __rest(_a, ["heading", "id", "headingLevel", "isHeadingWordWrap", "content", "downloads", "alignment"]);
     return (React.createElement("div", __assign({}, filterAttrs(props)),
-        React.createElement("div", { className: styles$n.headingContainer },
-            React.createElement(SectionHeading, { id: id, heading: heading, isHeadingWordWrap: isHeadingWordWrap, headingLevel: headingLevel, content: content })),
-        React.createElement(VerticalSpace, { size: "40" }),
-        downloads.map(function (downloadProps, i) { return (React.createElement(React.Fragment, { key: "download-".concat(i) },
-            React.createElement(Download, __assign({}, downloadProps)),
-            i !== downloads.length - 1 && React.createElement(VerticalSpace, { size: "16" }))); })));
+        React.createElement(Columns, null,
+            React.createElement(ColumnsCol, { spanL: alignment === "right" ? 6 : 9, spanM: 9, span: 12 },
+                " ",
+                React.createElement(SectionHeading, { id: id, heading: heading, isHeadingWordWrap: isHeadingWordWrap, headingLevel: headingLevel, content: content })),
+            React.createElement(ColumnsCol, { spanL: alignment === "right" ? 6 : 8, spanM: 9, spanS: 12 },
+                React.createElement("div", { className: styles$n["downloadList-".concat(alignment)] }, downloads.map(function (downloadProps, i) { return (React.createElement(React.Fragment, { key: "download-".concat(i, "-").concat(downloadProps.name) },
+                    React.createElement(Download, __assign({}, downloadProps)),
+                    i !== downloads.length - 1 && React.createElement(VerticalSpace, { size: "16" }))); }))))));
 };
 
 var styles$m = {"FAQs":"FAQs-module_FAQs__FtQr4","linkListSection":"FAQs-module_linkListSection__RdQkU","linkListTitle":"FAQs-module_linkListTitle__RVni3","linkList":"FAQs-module_linkList__dPyXj","linkListItem":"FAQs-module_linkListItem__S83CL","linkList--padded":"FAQs-module_linkList--padded__8Paxc"};
@@ -3555,7 +3559,7 @@ var Highlights = function (_a) {
                     : undefined, iconPosition: (_d = cta.iconPosition) !== null && _d !== void 0 ? _d : "beforeText" })))));
 };
 
-var styles$j = {"PromoListing":"PromoListing-module_PromoListing__6ensv","carouselSlide":"PromoListing-module_carouselSlide__AMTPF","cardGrid":"PromoListing-module_cardGrid__llf73","cardWrapper":"PromoListing-module_cardWrapper__I4iwh","cardWrapperCarousel":"PromoListing-module_cardWrapperCarousel__t-2qM","columns-3":"PromoListing-module_columns-3__y6jWS","columns-2":"PromoListing-module_columns-2__GRFxb"};
+var styles$j = {"PromoListing":"PromoListing-module_PromoListing__6ensv","CarouselWrapper":"PromoListing-module_CarouselWrapper__iYwWp","carouselSlide":"PromoListing-module_carouselSlide__AMTPF","cardGrid":"PromoListing-module_cardGrid__llf73","cardWrapper":"PromoListing-module_cardWrapper__I4iwh","cardWrapperCarousel":"PromoListing-module_cardWrapperCarousel__t-2qM","columns-3":"PromoListing-module_columns-3__y6jWS","columns-2":"PromoListing-module_columns-2__GRFxb"};
 
 /**
  * Do not edit directly
@@ -3681,7 +3685,7 @@ var PromoListing = function (_a) {
         button.label && (React.createElement(React.Fragment, null,
             React.createElement(ButtonV2, __assign({}, button, { icon: button.buttonStyle == "compact" ? BtIconArrowRightFill : undefined, size: "m" })),
             React.createElement(VerticalSpace, { size: "40" }))),
-        isCarousel && !isMinWidthArcBreakpointL ? (React.createElement("div", { className: styles$j.promolistingCarouselWrapper },
+        isCarousel && !isMinWidthArcBreakpointL ? (React.createElement("div", { className: styles$j.CarouselWrapper },
             React.createElement(Carousel, { overflow: "visible", itemsPerSlide: 1, behavior: "adaptive", withGutter: false }, cards === null || cards === void 0 ? void 0 : cards.map(function (card, i) { return (React.createElement("div", { key: "promolist-carousel-card-".concat(componentId, "-").concat(i), className: (styles$j.cardWrapperCarousel) }, getCard(card))); })))) : (React.createElement("ul", { className: classNames(styles$j.cardGrid, styles$j["columns-".concat(columns)]) }, cards === null || cards === void 0 ? void 0 : cards.map(function (card, index) { return (React.createElement("li", { key: "promolist-card--".concat(componentId, "-").concat(index) },
             React.createElement("div", { "data-testid": "promoList-card".concat(index), className: styles$j.cardWrapper }, getCard(card)))); })))));
 };
@@ -4191,7 +4195,8 @@ var BusinessSegmentSwitcher = function (_a) {
                             React.createElement("div", { className: styles$2.cardCol },
                                 content.card3 && React.createElement(InformationCard, __assign({}, content.card3)),
                                 React.createElement("div", null,
-                                    React.createElement(TypographyCard, { heading: "All ".concat(label.toLowerCase(), " solutions"), text: content.card4.text, label: content.card4.label, url: content.card4.url }))))));
+                                    React.createElement(TypographyCard, { heading: content.card4.heading ||
+                                            "All ".concat(label.toLowerCase(), " solutions"), text: content.card4.text, label: content.card4.label, url: content.card4.url, onClick: content.card4.onClick }))))));
                 }))),
         React.createElement("div", { className: styles$2.businessSegmentSwitcherMobile },
             React.createElement(ContentSwitcherDropdown, { isInset: true, value: selectedTab, tabs: tabs, isFluid: true, onValueChange: function (value) { return setSelectedTab(value); } }, tabs.map(function (_a, index) {