@arc-ui/community-components 3.7.0 → 3.8.0
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/.turbo/turbo-build.log +13 -12
- package/CHANGELOG.md +13 -0
- package/lib/ArticleCarousel/ArticleCarousel.cjs +1 -1
- package/lib/ArticleCarousel/ArticleCarousel.mjs +1 -1
- package/lib/BusinessSegmentSwitcher/styles.css +1 -1
- package/lib/CopyLead/CopyLead.cjs +1 -1
- package/lib/CopyLead/CopyLead.mjs +1 -1
- package/lib/FeaturePost/FeaturePost.cjs +1 -1
- package/lib/FeaturePost/FeaturePost.mjs +1 -1
- package/lib/PartnerBrandLogos/PartnerBrandLogos.cjs +57 -0
- package/lib/PartnerBrandLogos/PartnerBrandLogos.mjs +55 -0
- package/lib/PartnerBrandLogos/styles.css +1 -0
- package/lib/ProductNavigation/ProductNavigation.cjs +1 -1
- package/lib/ProductNavigation/ProductNavigation.mjs +1 -1
- package/lib/PromoListing/PromoListing.cjs +1 -1
- package/lib/PromoListing/PromoListing.mjs +1 -1
- package/lib/Summary/Summary.cjs +1 -1
- package/lib/Summary/Summary.mjs +1 -1
- package/lib/_shared/cjs/{index.es-wrFG9PCg.cjs → index.es-Dg_lyAyh.cjs} +1 -1
- package/lib/_shared/esm/{index.es-B3fdEoEm.mjs → index.es-DtCgfyRV.mjs} +1 -1
- package/lib/index.cjs +194 -148
- package/lib/index.cjs.map +1 -1
- package/lib/index.d.cts +72 -3
- package/lib/index.d.mts +72 -3
- package/lib/index.mjs +194 -149
- package/lib/index.mjs.map +1 -1
- package/lib/styles.css +1 -1
- package/package.json +14 -14
- package/src/components/BusinessSegmentSwitcher/BusinessSegmentSwitcher.module.css +1 -1
- package/src/components/PartnerBrandLogos/PartnerBrandLogos.module.css +8 -0
- package/src/components/PartnerBrandLogos/PartnerBrandLogos.tsx +141 -0
- package/src/components/PartnerBrandLogos/components/PartnerLogoSubgroup/PartnerLogoSubgroup.module.css +45 -0
- package/src/components/PartnerBrandLogos/components/PartnerLogoSubgroup/PartnerLogoSubgroup.tsx +98 -0
- package/src/components/PartnerBrandLogos/components/PartnerLogoSubgroup/index.ts +6 -0
- package/src/components/PartnerBrandLogos/index.ts +9 -0
- package/src/components/index.ts +1 -0
- package/versions.json +1 -1
package/lib/index.mjs
CHANGED
|
@@ -244,17 +244,17 @@ function requireClassnames () {
|
|
|
244
244
|
var classnamesExports = requireClassnames();
|
|
245
245
|
var classNames = /*@__PURE__*/getDefaultExportFromCjs(classnamesExports);
|
|
246
246
|
|
|
247
|
-
var styles$
|
|
247
|
+
var styles$u = {"accordion-header":"AccordionHeading-module_accordion-header__8s12f","accordion-header--hasImage":"AccordionHeading-module_accordion-header--hasImage__wbDjW","accordion-header--padded":"AccordionHeading-module_accordion-header--padded__me1JY","accordion-header--headingSizeM":"AccordionHeading-module_accordion-header--headingSizeM__amLfy"};
|
|
248
248
|
|
|
249
249
|
var AccordionHeading = function (_a) {
|
|
250
250
|
var _b, _c;
|
|
251
251
|
var heading = _a.heading, content = _a.content, id = _a.id, _d = _a.isPadded, isPadded = _d === void 0 ? false : _d, _e = _a.headingLevel, headingLevel = _e === void 0 ? "2" : _e, _f = _a.headingSize, headingSize = _f === void 0 ? "xl" : _f, image = _a.image, props = __rest(_a, ["heading", "content", "id", "isPadded", "headingLevel", "headingSize", "image"]);
|
|
252
252
|
return (React.createElement("div", __assign({ className: classNames((_b = {},
|
|
253
|
-
_b[styles$
|
|
254
|
-
_b[styles$
|
|
255
|
-
_b[styles$
|
|
253
|
+
_b[styles$u["accordion-header"]] = true,
|
|
254
|
+
_b[styles$u["accordion-header--padded"]] = isPadded,
|
|
255
|
+
_b[styles$u["accordion-header--headingSizeM"]] = headingSize === "m",
|
|
256
256
|
_b)) }, filterAttrs(props)),
|
|
257
|
-
React.createElement("div", { className: classNames((_c = {}, _c[styles$
|
|
257
|
+
React.createElement("div", { className: classNames((_c = {}, _c[styles$u["accordion-header--hasImage"]] = image, _c)) },
|
|
258
258
|
image && (React.createElement("div", null,
|
|
259
259
|
React.createElement(Image$2, __assign({}, image, { width: 68, fit: "cover" })))),
|
|
260
260
|
React.createElement(Heading, { level: headingLevel, id: id, size: headingSize }, heading)),
|
|
@@ -263,25 +263,25 @@ var AccordionHeading = function (_a) {
|
|
|
263
263
|
React.createElement(Text, { size: "l", elementType: "p" }, content)))));
|
|
264
264
|
};
|
|
265
265
|
|
|
266
|
-
var styles$
|
|
266
|
+
var styles$t = {"AccordionDisclosureListItem":"AccordionDisclosureList-module_AccordionDisclosureListItem__p8LIT"};
|
|
267
267
|
|
|
268
268
|
var AccordionDisclosureList = function (_a) {
|
|
269
269
|
var disclosureList = _a.disclosureList;
|
|
270
270
|
return (React.createElement("ul", null, disclosureList.map(function (_a) {
|
|
271
271
|
var children = _a.children, summary = _a.summary, _b = _a.isOpen, isOpen = _b === void 0 ? false : _b, _c = _a.indentDetails, indentDetails = _c === void 0 ? false : _c, headingLevel = _a.headingLevel, id = _a.id, props = __rest(_a, ["children", "summary", "isOpen", "indentDetails", "headingLevel", "id"]);
|
|
272
|
-
return (React.createElement("li", { key: id, className: styles$
|
|
272
|
+
return (React.createElement("li", { key: id, className: styles$t.AccordionDisclosureListItem, id: id },
|
|
273
273
|
React.createElement(Disclosure, __assign({ summary: summary, isOpen: isOpen, indentDetails: indentDetails, headingLevel: headingLevel }, filterAttrs(props)), children)));
|
|
274
274
|
})));
|
|
275
275
|
};
|
|
276
276
|
|
|
277
|
-
var styles$
|
|
277
|
+
var styles$s = {"Accordion":"Accordion-module_Accordion__LsXTU"};
|
|
278
278
|
|
|
279
279
|
/**
|
|
280
280
|
* Use the `Accordion` component to package together a title, content and a number of disclosure components into one section (maximum 10).
|
|
281
281
|
*/
|
|
282
282
|
var Accordion = function (_a) {
|
|
283
283
|
var heading = _a.heading, headingLevel = _a.headingLevel, headingSize = _a.headingSize, content = _a.content, id = _a.id, disclosureList = _a.disclosureList, props = __rest(_a, ["heading", "headingLevel", "headingSize", "content", "id", "disclosureList"]);
|
|
284
|
-
return (React.createElement("div", __assign({ className: styles$
|
|
284
|
+
return (React.createElement("div", __assign({ className: styles$s.Accordion }, filterAttrs(props)),
|
|
285
285
|
React.createElement(AccordionHeading, { isPadded: true, id: id, "data-testid": "Accordion-header", heading: heading, headingLevel: headingLevel, headingSize: headingSize, content: content }),
|
|
286
286
|
React.createElement(AccordionDisclosureList, { disclosureList: disclosureList })));
|
|
287
287
|
};
|
|
@@ -940,17 +940,17 @@ function requireDebounce () {
|
|
|
940
940
|
var debounceExports = requireDebounce();
|
|
941
941
|
var debounce = /*@__PURE__*/getDefaultExportFromCjs(debounceExports);
|
|
942
942
|
|
|
943
|
-
var styles$
|
|
943
|
+
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"};
|
|
944
944
|
|
|
945
945
|
var SectionHeading = function (_a) {
|
|
946
946
|
var _b, _c;
|
|
947
947
|
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"]);
|
|
948
948
|
return (React.createElement("div", __assign({ className: classNames((_b = {},
|
|
949
|
-
_b[styles$
|
|
950
|
-
_b[styles$
|
|
951
|
-
_b[styles$
|
|
949
|
+
_b[styles$r["section-header"]] = true,
|
|
950
|
+
_b[styles$r["section-header--padded"]] = isPadded,
|
|
951
|
+
_b[styles$r["section-header--isCentered"]] = isCentered,
|
|
952
952
|
_b)) }, filterAttrs(props)),
|
|
953
|
-
React.createElement("div", { className: classNames((_c = {}, _c[styles$
|
|
953
|
+
React.createElement("div", { className: classNames((_c = {}, _c[styles$r["section-header--hasImage"]] = image, _c)) },
|
|
954
954
|
image && (React.createElement("div", null,
|
|
955
955
|
React.createElement(Image$2, __assign({}, image, { width: 68, fit: "cover" })))),
|
|
956
956
|
React.createElement(Heading, { level: headingLevel, id: id, size: "xl", isWordWrap: isHeadingWordWrap }, heading)),
|
|
@@ -961,7 +961,7 @@ var SectionHeading = function (_a) {
|
|
|
961
961
|
|
|
962
962
|
/**
|
|
963
963
|
* Do not edit directly
|
|
964
|
-
* Generated on
|
|
964
|
+
* Generated on Tue, 21 Apr 2026 10:23:52 GMT
|
|
965
965
|
*/
|
|
966
966
|
var ArcSizeBreakpointsXs = "320px";
|
|
967
967
|
var ArcSizeBreakpointsS = "636px";
|
|
@@ -988,7 +988,7 @@ var ArcBreakpoints = {
|
|
|
988
988
|
xs: parseInt(ArcSizeBreakpointsXs, 10),
|
|
989
989
|
};
|
|
990
990
|
|
|
991
|
-
var styles$
|
|
991
|
+
var styles$q = {"carouselWrapper":"ArticleCarousel-module_carouselWrapper__3mmGu","cardWrapperCarousel":"ArticleCarousel-module_cardWrapperCarousel__v3jv1","lastCard":"ArticleCarousel-module_lastCard__my93x"};
|
|
992
992
|
|
|
993
993
|
/**
|
|
994
994
|
* Use `ArticleCarousel` to give supporting information about a page or proposition in the form of the `Carousel` containing only `MediaCard` components.
|
|
@@ -1018,17 +1018,17 @@ var ArticleCarousel = function (_a) {
|
|
|
1018
1018
|
}, [minHeights, checkMinHeight]);
|
|
1019
1019
|
return (React.createElement("div", __assign({}, filterAttrs(props)),
|
|
1020
1020
|
React.createElement(SectionHeading, { isPadded: isPadded, id: id, "data-testid": "ArticleCarousel-header", heading: heading, isHeadingWordWrap: isHeadingWordWrap, headingLevel: headingLevel, content: content, isCentered: isCentered }),
|
|
1021
|
-
React.createElement("div", { className: styles$
|
|
1021
|
+
React.createElement("div", { className: styles$q.carouselWrapper },
|
|
1022
1022
|
React.createElement(Carousel, { overflow: isMinWidthArcBreakpointL ? "hidden" : "visible", itemsPerSlide: isMinWidthArcBreakpointL ? 3 : 1, itemsToScroll: isMinWidthArcBreakpointL ? 3 : 1, behavior: isMinWidthArcBreakpointL ? "default" : "adaptive", withGutter: isMinWidthArcBreakpointL ? true : false }, cards.map(function (card, i) {
|
|
1023
1023
|
var _a;
|
|
1024
|
-
return (React.createElement("div", { key: "".concat(componentId), className: classNames(styles$
|
|
1025
|
-
_a[styles$
|
|
1024
|
+
return (React.createElement("div", { key: "".concat(componentId), className: classNames(styles$q.carouselSlide, styles$q.cardWrapperCarousel, (_a = {},
|
|
1025
|
+
_a[styles$q.lastCard] = i === cards.length - 1,
|
|
1026
1026
|
_a)) },
|
|
1027
1027
|
React.createElement(MediaCard, __assign({ isContained: cardsContained, minHeight: minimumHeight }, card))));
|
|
1028
1028
|
})))));
|
|
1029
1029
|
};
|
|
1030
1030
|
|
|
1031
|
-
var styles$
|
|
1031
|
+
var styles$p = {"authorContent":"Author-module_authorContent__TBY7b","largeAvatar":"Author-module_largeAvatar__Vco03"};
|
|
1032
1032
|
|
|
1033
1033
|
var Author = function (_a) {
|
|
1034
1034
|
var name = _a.name, title = _a.title, _b = _a.avatar, avatar = _b === void 0 ? {} : _b, props = __rest(_a, ["name", "title", "avatar"]);
|
|
@@ -1039,10 +1039,10 @@ var Author = function (_a) {
|
|
|
1039
1039
|
React.createElement(Grid, { isFluid: true, isGutterless: true },
|
|
1040
1040
|
React.createElement(GridRow, { align: "center" },
|
|
1041
1041
|
React.createElement(GridCol, { xs: isLargeAvatar ? 12 : "auto" },
|
|
1042
|
-
React.createElement("div", { className: isLargeAvatar ? styles$
|
|
1042
|
+
React.createElement("div", { className: isLargeAvatar ? styles$p.largeAvatar : undefined },
|
|
1043
1043
|
React.createElement(Avatar, __assign({}, avatar)))),
|
|
1044
1044
|
React.createElement(GridCol, null,
|
|
1045
|
-
React.createElement("div", { className: "".concat(!isLargeAvatar && styles$
|
|
1045
|
+
React.createElement("div", { className: "".concat(!isLargeAvatar && styles$p.authorContent), "data-testid": "authorContent" },
|
|
1046
1046
|
React.createElement(Heading, { size: "xs" }, name),
|
|
1047
1047
|
React.createElement(Text, { size: "s" }, title)))))));
|
|
1048
1048
|
};
|
|
@@ -1057,35 +1057,35 @@ var MultiLineText = function (_a) {
|
|
|
1057
1057
|
React.createElement(Text, __assign({}, textProps), paragraph))); })));
|
|
1058
1058
|
};
|
|
1059
1059
|
|
|
1060
|
-
var styles$
|
|
1060
|
+
var styles$o = {"buttonContainer":"CopyLead-module_buttonContainer__3OaRG","col":"CopyLead-module_col__0Da5H","container":"CopyLead-module_container__I91ym","container--content":"CopyLead-module_container--content__e8LxG","container--media":"CopyLead-module_container--media__QcMWi","container--align-center":"CopyLead-module_container--align-center__Fh1Sd","container--align-top":"CopyLead-module_container--align-top__UIXOZ","list":"CopyLead-module_list__arnJd","listItem":"CopyLead-module_listItem__NscHE","listItemCentered":"CopyLead-module_listItemCentered__Kwdab","listItemIconContainer":"CopyLead-module_listItemIconContainer__dgnhJ","listItemTextContainer":"CopyLead-module_listItemTextContainer__Dl9lw","imgWrapper":"CopyLead-module_imgWrapper__HYP3w","mediaContainer":"CopyLead-module_mediaContainer__PxTnm","content":"CopyLead-module_content__Bja1D","container--reverse":"CopyLead-module_container--reverse__Gq9u8"};
|
|
1061
1061
|
|
|
1062
1062
|
var MediaContent$1 = function (_a) {
|
|
1063
1063
|
var heading = _a.heading, id = _a.id, headingLevel = _a.headingLevel, isHeadingWordWrap = _a.isHeadingWordWrap, content = _a.content;
|
|
1064
|
-
return (React.createElement("div", { className: styles$
|
|
1064
|
+
return (React.createElement("div", { className: styles$o.mediaContainer },
|
|
1065
1065
|
React.createElement(Heading, { id: id, level: headingLevel, isWordWrap: isHeadingWordWrap, size: "xl" }, heading),
|
|
1066
|
-
content && (React.createElement("div", { className: styles$
|
|
1066
|
+
content && (React.createElement("div", { className: styles$o.content },
|
|
1067
1067
|
React.createElement(VerticalSpace, { size: "24" }),
|
|
1068
1068
|
React.createElement(MultiLineText, { text: content, size: "l" })))));
|
|
1069
1069
|
};
|
|
1070
1070
|
|
|
1071
1071
|
var Image$1 = function (_a) {
|
|
1072
1072
|
var sources = _a.sources, props = __rest(_a, ["sources"]);
|
|
1073
|
-
return (React.createElement("div", { className: styles$
|
|
1073
|
+
return (React.createElement("div", { className: styles$o.imgWrapper },
|
|
1074
1074
|
React.createElement(Image$2, __assign({ fadeOnLoad: true }, props), sources &&
|
|
1075
1075
|
sources.map(function (source) { return React.createElement("source", __assign({ key: source.srcSet }, source)); }))));
|
|
1076
1076
|
};
|
|
1077
1077
|
|
|
1078
1078
|
var IconList = function (_a) {
|
|
1079
1079
|
var listItems = _a.listItems, isLgScreen = _a.isLgScreen, _b = _a.headingLevel, headingLevel = _b === void 0 ? "3" : _b;
|
|
1080
|
-
return (React.createElement("ul", { className: styles$
|
|
1080
|
+
return (React.createElement("ul", { className: styles$o.list }, listItems.map(function (_a) {
|
|
1081
1081
|
var _b;
|
|
1082
1082
|
var icon = _a.icon, heading = _a.heading, text = _a.text;
|
|
1083
|
-
return (React.createElement("li", { key: heading, className: classNames(styles$
|
|
1084
|
-
_b[styles$
|
|
1083
|
+
return (React.createElement("li", { key: heading, className: classNames(styles$o.listItem, (_b = {},
|
|
1084
|
+
_b[styles$o.listItemCentered] = !text,
|
|
1085
1085
|
_b)) },
|
|
1086
|
-
React.createElement("div", { className: styles$
|
|
1086
|
+
React.createElement("div", { className: styles$o.listItemIconContainer },
|
|
1087
1087
|
React.createElement(Icon, { color: "brand", icon: icon, size: isLgScreen ? 64 : 48 })),
|
|
1088
|
-
React.createElement("div", { className: styles$
|
|
1088
|
+
React.createElement("div", { className: styles$o.listItemTextContainer },
|
|
1089
1089
|
React.createElement(Heading, { level: headingLevel, size: "s" }, heading),
|
|
1090
1090
|
text && (React.createElement(React.Fragment, null,
|
|
1091
1091
|
React.createElement(VerticalSpace, { size: "8", sizeL: "16" }),
|
|
@@ -1093,20 +1093,20 @@ var IconList = function (_a) {
|
|
|
1093
1093
|
})));
|
|
1094
1094
|
};
|
|
1095
1095
|
|
|
1096
|
-
var Button = function (props) { return (React.createElement("div", { className: styles$
|
|
1096
|
+
var Button = function (props) { return (React.createElement("div", { className: styles$o.buttonContainer },
|
|
1097
1097
|
React.createElement(ButtonV2, __assign({ isFullWidth: true, buttonStyle: "secondary" }, props)))); };
|
|
1098
1098
|
|
|
1099
1099
|
var Container = function (_a) {
|
|
1100
1100
|
var _b;
|
|
1101
1101
|
var children = _a.children, isReverseOrder = _a.isReverseOrder, type = _a.type, alignment = _a.alignment;
|
|
1102
|
-
return (React.createElement("div", { "data-testid": "copy-lead-container", className: classNames(styles$
|
|
1103
|
-
_b[styles$
|
|
1102
|
+
return (React.createElement("div", { "data-testid": "copy-lead-container", className: classNames(styles$o.container, styles$o["container--".concat(type)], styles$o["container--align-".concat(alignment)], (_b = {},
|
|
1103
|
+
_b[styles$o["container--reverse"]] = isReverseOrder,
|
|
1104
1104
|
_b)) }, children));
|
|
1105
1105
|
};
|
|
1106
1106
|
|
|
1107
1107
|
var Column = function (_a) {
|
|
1108
1108
|
var children = _a.children;
|
|
1109
|
-
return (React.createElement("div", { className: styles$
|
|
1109
|
+
return (React.createElement("div", { className: styles$o.col }, children));
|
|
1110
1110
|
};
|
|
1111
1111
|
|
|
1112
1112
|
var getListHeadingLevel$1 = function (level) {
|
|
@@ -1174,12 +1174,12 @@ var CopyLead = function (_a) {
|
|
|
1174
1174
|
return null;
|
|
1175
1175
|
};
|
|
1176
1176
|
|
|
1177
|
-
var styles$
|
|
1177
|
+
var styles$n = {"headingContainer":"DownloadList-module_headingContainer__PNio8"};
|
|
1178
1178
|
|
|
1179
1179
|
var DownloadList = function (_a) {
|
|
1180
1180
|
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"]);
|
|
1181
1181
|
return (React.createElement("div", __assign({}, filterAttrs(props)),
|
|
1182
|
-
React.createElement("div", { className: styles$
|
|
1182
|
+
React.createElement("div", { className: styles$n.headingContainer },
|
|
1183
1183
|
React.createElement(SectionHeading, { id: id, heading: heading, isHeadingWordWrap: isHeadingWordWrap, headingLevel: headingLevel, content: content })),
|
|
1184
1184
|
React.createElement(VerticalSpace, { size: "40" }),
|
|
1185
1185
|
downloads.map(function (downloadProps, i) { return (React.createElement(React.Fragment, { key: "download-".concat(i) },
|
|
@@ -1187,7 +1187,7 @@ var DownloadList = function (_a) {
|
|
|
1187
1187
|
i !== downloads.length - 1 && React.createElement(VerticalSpace, { size: "16" }))); })));
|
|
1188
1188
|
};
|
|
1189
1189
|
|
|
1190
|
-
var styles$
|
|
1190
|
+
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"};
|
|
1191
1191
|
|
|
1192
1192
|
var scrollToSectionFocusFirstElement = function (item) {
|
|
1193
1193
|
var _a, _b, _c, _d, _e;
|
|
@@ -1201,23 +1201,23 @@ var scrollToSectionFocusFirstElement = function (item) {
|
|
|
1201
1201
|
var FAQs = function (_a) {
|
|
1202
1202
|
var _b;
|
|
1203
1203
|
var heading = _a.heading, isHeadingWordWrap = _a.isHeadingWordWrap, content = _a.content, id = _a.id, _c = _a.isPadded, isPadded = _c === void 0 ? false : _c, _d = _a.headingLevel, headingLevel = _d === void 0 ? "2" : _d, image = _a.image, type = _a.type, _e = _a.linkListHeading, linkListHeading = _e === void 0 ? "Skip to section" : _e, accordionData = _a.accordionData, props = __rest(_a, ["heading", "isHeadingWordWrap", "content", "id", "isPadded", "headingLevel", "image", "type", "linkListHeading", "accordionData"]);
|
|
1204
|
-
return (React.createElement("div", __assign({ className: styles$
|
|
1204
|
+
return (React.createElement("div", __assign({ className: styles$m.FAQs }, filterAttrs(props)),
|
|
1205
1205
|
React.createElement(SectionHeading, { id: id, isHeadingWordWrap: isHeadingWordWrap, heading: heading, content: content, image: image, headingLevel: headingLevel, isPadded: isPadded }),
|
|
1206
|
-
type === "listWithLinks" && (React.createElement("div", { className: styles$
|
|
1207
|
-
React.createElement("div", { className: styles$
|
|
1206
|
+
type === "listWithLinks" && (React.createElement("div", { className: styles$m.linkListSection },
|
|
1207
|
+
React.createElement("div", { className: styles$m.linkListTitle },
|
|
1208
1208
|
React.createElement(Heading, { size: "xs" }, linkListHeading)),
|
|
1209
1209
|
React.createElement("ul", { className: classNames((_b = {},
|
|
1210
|
-
_b[styles$
|
|
1211
|
-
_b[styles$
|
|
1210
|
+
_b[styles$m.linkList] = true,
|
|
1211
|
+
_b[styles$m["linkList--padded"]] = isPadded,
|
|
1212
1212
|
_b)) }, accordionData.map(function (item) {
|
|
1213
1213
|
var _a;
|
|
1214
|
-
return (React.createElement("li", { className: styles$
|
|
1214
|
+
return (React.createElement("li", { className: styles$m.linkListItem, key: item.heading },
|
|
1215
1215
|
React.createElement(Link, { title: item.heading, href: "#".concat(item.id), onClick: function (e) {
|
|
1216
1216
|
e.preventDefault();
|
|
1217
1217
|
scrollToSectionFocusFirstElement(item);
|
|
1218
1218
|
} }, (_a = item.altLinkTitle) !== null && _a !== void 0 ? _a : item.heading)));
|
|
1219
1219
|
})))),
|
|
1220
|
-
type !== "tabs" && accordionData && (React.createElement("ul", { className: styles$
|
|
1220
|
+
type !== "tabs" && accordionData && (React.createElement("ul", { className: styles$m.accordionList }, accordionData.map(function (item) { return (React.createElement("li", { className: styles$m.accordionListItem, key: item.id },
|
|
1221
1221
|
React.createElement(Accordion, { id: item.id, heading: item.heading, headingLevel: item.headingLevel, content: item.content, disclosureList: item.disclosureList, headingSize: "m" }),
|
|
1222
1222
|
React.createElement(VerticalSpace, { size: "48", sizeL: "64" }))); }))),
|
|
1223
1223
|
type === "tabs" && (React.createElement(Tabs, { defaultValue: accordionData[0].heading },
|
|
@@ -3414,12 +3414,12 @@ function cleanEscapedString(input) {
|
|
|
3414
3414
|
return matched[1].replace(doubleQuoteRegExp, "'");
|
|
3415
3415
|
}
|
|
3416
3416
|
|
|
3417
|
-
var styles$
|
|
3417
|
+
var styles$l = {"labelDate":"FeaturePost-module_labelDate__NXOgY","googlePlayButtonWrapper":"FeaturePost-module_googlePlayButtonWrapper__GI-ag","imgWrapper":"FeaturePost-module_imgWrapper__r6omd","featurePost":"FeaturePost-module_featurePost__9jY21","featurePostReversed":"FeaturePost-module_featurePostReversed__WQRXm","contentContainer":"FeaturePost-module_contentContainer__kdus7","col":"FeaturePost-module_col__eW8gY"};
|
|
3418
3418
|
|
|
3419
3419
|
var Image = function (_a) {
|
|
3420
3420
|
var sources = _a.sources, title = _a.title, description = _a.description, props = __rest(_a, ["sources", "title", "description"]);
|
|
3421
3421
|
return (React.createElement(React.Fragment, null,
|
|
3422
|
-
React.createElement("div", { className: styles$
|
|
3422
|
+
React.createElement("div", { className: styles$l.imgWrapper },
|
|
3423
3423
|
React.createElement(Image$2, __assign({ fadeOnLoad: true }, props), sources &&
|
|
3424
3424
|
sources.map(function (source) { return React.createElement("source", __assign({ key: source.srcSet }, source)); }))),
|
|
3425
3425
|
title && (React.createElement(React.Fragment, null,
|
|
@@ -3457,17 +3457,17 @@ var FeaturePost = function (_a) {
|
|
|
3457
3457
|
var _b;
|
|
3458
3458
|
var heading = _a.heading, id = _a.id, _c = _a.headingLevel, headingLevel = _c === void 0 ? "2" : _c, label = _a.label, image = _a.image, content = _a.content, footer = _a.footer, video = _a.video, isHeadingWordWrap = _a.isHeadingWordWrap, _d = _a.isReverseOrder, isReverseOrder = _d === void 0 ? false : _d, props = __rest(_a, ["heading", "id", "headingLevel", "label", "image", "content", "footer", "video", "isHeadingWordWrap", "isReverseOrder"]);
|
|
3459
3459
|
var isMinWidthArcBreakpointM = useMediaQuery("(min-width: ".concat(ArcSizeBreakpointsM, ")"));
|
|
3460
|
-
return (React.createElement("div", __assign({ "data-testid": "feature-post", className: classNames(styles$
|
|
3461
|
-
_b[styles$
|
|
3460
|
+
return (React.createElement("div", __assign({ "data-testid": "feature-post", className: classNames(styles$l.featurePost, (_b = {},
|
|
3461
|
+
_b[styles$l.featurePostReversed] = isReverseOrder,
|
|
3462
3462
|
_b)) }, filterAttrs(props)),
|
|
3463
|
-
React.createElement("div", { className: styles$
|
|
3464
|
-
React.createElement("div", { className: styles$
|
|
3463
|
+
React.createElement("div", { className: styles$l.col },
|
|
3464
|
+
React.createElement("div", { className: styles$l.contentContainer },
|
|
3465
3465
|
label && (React.createElement(Grid, { isGutterless: true, isFluid: true },
|
|
3466
3466
|
React.createElement(GridRow, { align: "baseline" },
|
|
3467
3467
|
React.createElement(GridCol, { xs: 12, m: "auto" },
|
|
3468
3468
|
React.createElement(Heading, { size: "xxs", fontStyle: "overline" }, label.text)),
|
|
3469
3469
|
React.createElement(GridCol, { xs: 12, m: "auto" },
|
|
3470
|
-
React.createElement("div", { className: styles$
|
|
3470
|
+
React.createElement("div", { className: styles$l.labelDate },
|
|
3471
3471
|
React.createElement(Text, { size: "xs", tone: "muted" }, isDate(label.date) ? (React.createElement("time", { dateTime: format(label.date, "yyyy-MM-dd") }, format(label.date, "d MMMM yyyy"))) : (React.createElement("span", null, label.date)))))),
|
|
3472
3472
|
React.createElement(VerticalSpace, { size: "24" }))),
|
|
3473
3473
|
React.createElement(Heading, { id: id, level: headingLevel, isWordWrap: isHeadingWordWrap, size: "xl" }, heading),
|
|
@@ -3489,10 +3489,10 @@ var FeaturePost = function (_a) {
|
|
|
3489
3489
|
footer.appStore && (React.createElement(GridCol, { xs: 12, s: "auto" },
|
|
3490
3490
|
React.createElement(AppButton, { type: "apple-app-store", screenReaderText: footer.appStore.screenReaderText, url: footer.appStore.url }))),
|
|
3491
3491
|
footer.googlePlay && (React.createElement(GridCol, { xs: 12, s: "auto" },
|
|
3492
|
-
React.createElement("div", { className: styles$
|
|
3492
|
+
React.createElement("div", { className: styles$l.googlePlayButtonWrapper },
|
|
3493
3493
|
React.createElement(AppButton, { type: "google-play", screenReaderText: footer.googlePlay.screenReaderText, url: footer.googlePlay.url })))))))))),
|
|
3494
|
-
isMinWidthArcBreakpointM && (React.createElement("div", { className: styles$
|
|
3495
|
-
React.createElement("div", { "data-testid": "desktop-img", className: styles$
|
|
3494
|
+
isMinWidthArcBreakpointM && (React.createElement("div", { className: styles$l.col },
|
|
3495
|
+
React.createElement("div", { "data-testid": "desktop-img", className: styles$l.imgContainer },
|
|
3496
3496
|
React.createElement(MediaContent, { image: image, video: video }))))));
|
|
3497
3497
|
};
|
|
3498
3498
|
|
|
@@ -3504,7 +3504,7 @@ var FeaturePost = function (_a) {
|
|
|
3504
3504
|
const BtIconArrowRightFill =
|
|
3505
3505
|
"data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 32 32'%3e%3cpath fill='currentColor' d='M2 16A14 14 0 1 0 16 2 14 14 0 0 0 2 16m16.854-4.354L23.207 16l-4.354 4.354a.5.5 0 0 1-.707-.707l3.147-3.147H9.5a.5.5 0 0 1 0-1h11.793l-3.146-3.146a.5.5 0 0 1 .707-.707'/%3e%3c/svg%3e";
|
|
3506
3506
|
|
|
3507
|
-
var styles$
|
|
3507
|
+
var styles$k = {"highlights":"Highlights-module_highlights__Hf7Zq","highlightItem":"Highlights-module_highlightItem__-N6le","highlights2Column":"Highlights-module_highlights2Column__6qIuI","highlights3Column":"Highlights-module_highlights3Column__qsCMP"};
|
|
3508
3508
|
|
|
3509
3509
|
var getListHeadingLevel = function (level) {
|
|
3510
3510
|
var nextLevel = Math.min(parseInt(level) + 1, 6);
|
|
@@ -3514,8 +3514,8 @@ var getListHeadingLevel = function (level) {
|
|
|
3514
3514
|
var HighlightItem = function (_a) {
|
|
3515
3515
|
var icon = _a.icon, heading = _a.heading, text = _a.text, link = _a.link, isSmallIcon = _a.isSmallIcon, headingLevel = _a.headingLevel, props = __rest(_a, ["icon", "heading", "text", "link", "isSmallIcon", "headingLevel"]);
|
|
3516
3516
|
var listHeadingLevel = getListHeadingLevel(headingLevel || "2");
|
|
3517
|
-
return (React.createElement("div", __assign({ "data-testid": "highlight-item-container", className: styles$
|
|
3518
|
-
icon && (React.createElement("div", { className: styles$
|
|
3517
|
+
return (React.createElement("div", __assign({ "data-testid": "highlight-item-container", className: styles$k.highlightItem }, filterAttrs(props)),
|
|
3518
|
+
icon && (React.createElement("div", { className: styles$k.Icon },
|
|
3519
3519
|
React.createElement(Icon, { "data-testid": "highlight-icon", color: "brand", icon: icon, size: isSmallIcon ? 64 : 76 }))),
|
|
3520
3520
|
React.createElement(VerticalSpace, { size: "16" }),
|
|
3521
3521
|
React.createElement(Heading, { level: listHeadingLevel, size: "m" }, heading),
|
|
@@ -3528,7 +3528,7 @@ var HighlightItem = function (_a) {
|
|
|
3528
3528
|
var HighlightList = function (_a) {
|
|
3529
3529
|
var listItems = _a.listItems, columns = _a.columns, isSmallIcon = _a.isSmallIcon, headingLevel = _a.headingLevel, props = __rest(_a, ["listItems", "columns", "isSmallIcon", "headingLevel"]);
|
|
3530
3530
|
var id = useId();
|
|
3531
|
-
return (React.createElement("div", __assign({ "data-testid": "highlights-list", className: classNames(styles$
|
|
3531
|
+
return (React.createElement("div", __assign({ "data-testid": "highlights-list", className: classNames(styles$k.highlights, styles$k["highlights".concat(columns, "Column")]) }, filterAttrs(props)), listItems.map(function (_a, i) {
|
|
3532
3532
|
var icon = _a.icon, heading = _a.heading, text = _a.text, link = _a.link, itemProps = __rest(_a, ["icon", "heading", "text", "link"]);
|
|
3533
3533
|
return (React.createElement(HighlightItem, __assign({ key: "highlight-".concat(id, "-").concat(i), icon: icon, heading: heading, text: text, link: link, isSmallIcon: isSmallIcon, headingLevel: headingLevel }, itemProps)));
|
|
3534
3534
|
})));
|
|
@@ -3555,7 +3555,7 @@ var Highlights = function (_a) {
|
|
|
3555
3555
|
: undefined, iconPosition: (_d = cta.iconPosition) !== null && _d !== void 0 ? _d : "beforeText" })))));
|
|
3556
3556
|
};
|
|
3557
3557
|
|
|
3558
|
-
var styles$
|
|
3558
|
+
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"};
|
|
3559
3559
|
|
|
3560
3560
|
/**
|
|
3561
3561
|
* Do not edit directly
|
|
@@ -3673,7 +3673,7 @@ var PromoListing = function (_a) {
|
|
|
3673
3673
|
var CardComponent = CARD_COMPONENTS[card.type];
|
|
3674
3674
|
return React.createElement(CardComponent, __assign({}, card, commonProps));
|
|
3675
3675
|
};
|
|
3676
|
-
return (React.createElement("div", __assign({ className: styles$
|
|
3676
|
+
return (React.createElement("div", __assign({ className: styles$j.PromoListing }, filterAttrs(props)),
|
|
3677
3677
|
overlineLabel && (React.createElement(React.Fragment, null,
|
|
3678
3678
|
React.createElement(Heading, { level: overlineHeadingLevel, fontStyle: "overline" }, overlineLabel),
|
|
3679
3679
|
React.createElement(VerticalSpace, { size: "12" }))),
|
|
@@ -3681,44 +3681,44 @@ var PromoListing = function (_a) {
|
|
|
3681
3681
|
button.label && (React.createElement(React.Fragment, null,
|
|
3682
3682
|
React.createElement(ButtonV2, __assign({}, button, { icon: button.buttonStyle == "compact" ? BtIconArrowRightFill : undefined, size: "m" })),
|
|
3683
3683
|
React.createElement(VerticalSpace, { size: "40" }))),
|
|
3684
|
-
isCarousel && !isMinWidthArcBreakpointL ? (React.createElement("div", { className: styles$
|
|
3685
|
-
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$
|
|
3686
|
-
React.createElement("div", { "data-testid": "promoList-card".concat(index), className: styles$
|
|
3684
|
+
isCarousel && !isMinWidthArcBreakpointL ? (React.createElement("div", { className: styles$j.promolistingCarouselWrapper },
|
|
3685
|
+
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) },
|
|
3686
|
+
React.createElement("div", { "data-testid": "promoList-card".concat(index), className: styles$j.cardWrapper }, getCard(card)))); })))));
|
|
3687
3687
|
};
|
|
3688
3688
|
|
|
3689
|
-
var styles$
|
|
3689
|
+
var styles$i = {"blockQuote":"Quote-module_blockQuote__STj-z","quoteContent":"Quote-module_quoteContent__kWc51","quoteDefault":"Quote-module_quoteDefault__tU5db","quoteSecondary":"Quote-module_quoteSecondary__3Rk3f","quoteIcon":"Quote-module_quoteIcon__HK1TV"};
|
|
3690
3690
|
|
|
3691
3691
|
/**
|
|
3692
3692
|
* Use `Quote` where a quote or testimonial from an existing customer or stakeholder would help build trust and credibility with potential new customers. It's commonly used on product pages where customers would learn about a product or service that we offer.*/
|
|
3693
3693
|
var Quote = function (_a) {
|
|
3694
3694
|
var author = _a.author, _b = _a.styling, styling = _b === void 0 ? "Default" : _b, content = _a.content, citeUrl = _a.citeUrl, props = __rest(_a, ["author", "styling", "content", "citeUrl"]);
|
|
3695
3695
|
return (React.createElement("div", __assign({ className: "community-component--quote", "data-testid": "quote-test" }, filterAttrs(props)),
|
|
3696
|
-
React.createElement("blockquote", { "data-testid": "style-test", className: classNames(styles$
|
|
3697
|
-
React.createElement("svg", { xmlns: "http://www.w3.org/2000/svg", viewBox: "0 0 100 77", className: styles$
|
|
3696
|
+
React.createElement("blockquote", { "data-testid": "style-test", className: classNames(styles$i.blockQuote, styles$i["quote".concat(styling)]), cite: citeUrl },
|
|
3697
|
+
React.createElement("svg", { xmlns: "http://www.w3.org/2000/svg", viewBox: "0 0 100 77", className: styles$i.quoteIcon, "aria-hidden": "true" },
|
|
3698
3698
|
React.createElement("path", { d: "M21.8085 76.4706C15.9574 76.4706 10.8156 74.2732 6.38298 69.8783C2.12766 65.4834 0 58.979 0 50.3651C0 40.5206 3.10284 31.1156 9.30851 22.1501C15.6915 13.1846 25.3546 5.80122 38.2979 0L44.1489 11.3387C37.4113 14.3272 31.7376 18.0189 27.1277 22.4138C22.5177 26.6329 19.6809 31.4672 18.617 36.9168C19.8582 36.741 21.0106 36.6531 22.0745 36.6531C27.7482 36.6531 32.4468 38.499 36.1702 42.1907C40.0709 45.8824 42.0213 50.7167 42.0213 56.6937C42.0213 62.4949 39.9823 67.2414 35.9043 70.9331C32.0035 74.6247 27.305 76.4706 21.8085 76.4706ZM77.6596 76.4706C71.8085 76.4706 66.6667 74.2732 62.234 69.8783C57.9787 65.4834 55.8511 58.979 55.8511 50.3651C55.8511 40.5206 58.9539 31.1156 65.1596 22.1501C71.5425 13.1846 81.2057 5.80122 94.1489 0L100 11.3387C93.2624 14.3272 87.5886 18.0189 82.9787 22.4138C78.3688 26.6329 75.5319 31.4672 74.4681 36.9168C75.7092 36.741 76.8617 36.6531 77.9255 36.6531C83.5993 36.6531 88.2979 38.499 92.0213 42.1907C95.922 45.8824 97.8723 50.7167 97.8723 56.6937C97.8723 62.4949 95.8333 67.2414 91.7553 70.9331C87.8546 74.6247 83.156 76.4706 77.6596 76.4706Z" })),
|
|
3699
|
-
React.createElement("p", { className: styles$
|
|
3699
|
+
React.createElement("p", { className: styles$i.quoteContent }, content)),
|
|
3700
3700
|
author && React.createElement(Author, __assign({}, author))));
|
|
3701
3701
|
};
|
|
3702
3702
|
|
|
3703
|
-
var styles$
|
|
3703
|
+
var styles$h = {"ruleContainer":"Summary-module_ruleContainer__ydWlG","row":"Summary-module_row__SKV--"};
|
|
3704
3704
|
|
|
3705
3705
|
var Summary = function (_a) {
|
|
3706
3706
|
var content = _a.content, _b = _a.noBorder, noBorder = _b === void 0 ? false : _b, _c = _a.headingLevel, headingLevel = _c === void 0 ? "3" : _c, props = __rest(_a, ["content", "noBorder", "headingLevel"]);
|
|
3707
3707
|
var isMinWidthArcBreakpointM = useMediaQuery("(min-width: ".concat(ArcSizeBreakpointsM, ")"));
|
|
3708
3708
|
return (React.createElement(Box, __assign({ isBorderRadius: true }, (!noBorder ? { borderWidth: "thin" } : { elevationLevel: "1" }), { padding: "24" }, filterAttrs(props)),
|
|
3709
|
-
React.createElement("div", { className: styles$
|
|
3709
|
+
React.createElement("div", { className: styles$h.row }, content.map(function (_a, i) {
|
|
3710
3710
|
var heading = _a.heading, text = _a.text;
|
|
3711
3711
|
return (React.createElement(React.Fragment, null,
|
|
3712
|
-
React.createElement("div", { className: styles$
|
|
3712
|
+
React.createElement("div", { className: styles$h.col },
|
|
3713
3713
|
React.createElement(Heading, { size: "s", level: headingLevel }, heading),
|
|
3714
3714
|
React.createElement(VerticalSpace, { size: "8" }),
|
|
3715
3715
|
React.createElement(Text, { size: "s" }, text)),
|
|
3716
|
-
i !== content.length - 1 && (React.createElement("div", { className: styles$
|
|
3716
|
+
i !== content.length - 1 && (React.createElement("div", { className: styles$h.ruleContainer },
|
|
3717
3717
|
React.createElement(Rule, { orientation: isMinWidthArcBreakpointM ? "vertical" : "horizontal" })))));
|
|
3718
3718
|
}))));
|
|
3719
3719
|
};
|
|
3720
3720
|
|
|
3721
|
-
var styles$
|
|
3721
|
+
var styles$g = {"list":"Statistics-module_list__BI-eQ","mutedText":"Statistics-module_mutedText__MR1JM"};
|
|
3722
3722
|
|
|
3723
3723
|
var getLinkProps = function (link) {
|
|
3724
3724
|
return link.openInNewTab
|
|
@@ -3736,7 +3736,7 @@ var Statistics = function (_a) {
|
|
|
3736
3736
|
React.createElement(ColumnsCol, { spanM: 9 },
|
|
3737
3737
|
React.createElement(SectionHeading, { id: id, heading: heading, isHeadingWordWrap: isHeadingWordWrap, headingLevel: headingLevel, content: content })),
|
|
3738
3738
|
React.createElement(ColumnsCol, { spanL: 9 },
|
|
3739
|
-
React.createElement("ul", { className: styles$
|
|
3739
|
+
React.createElement("ul", { className: styles$g.list }, statistics.map(function (_a, i) {
|
|
3740
3740
|
var stat = _a.stat, copy = _a.copy, link = _a.link, source = _a.source, sourceUrl = _a.sourceUrl;
|
|
3741
3741
|
return (React.createElement("li", { key: "statistic-".concat(componentId, "-").concat(i) },
|
|
3742
3742
|
i !== 0 && (React.createElement(React.Fragment, null,
|
|
@@ -3746,7 +3746,7 @@ var Statistics = function (_a) {
|
|
|
3746
3746
|
React.createElement(Columns, null,
|
|
3747
3747
|
React.createElement(ColumnsCol, { spanS: 6, spanM: 8 },
|
|
3748
3748
|
React.createElement(Align, { vertical: "center" },
|
|
3749
|
-
React.createElement("div", { className: styles$
|
|
3749
|
+
React.createElement("div", { className: styles$g.statWrapper },
|
|
3750
3750
|
React.createElement(Heading, { color: "brand", size: "xxl" }, stat),
|
|
3751
3751
|
React.createElement(Hidden, { s: true, m: true, l: true, xl: true, xxl: true },
|
|
3752
3752
|
React.createElement(VerticalSpace, { size: "12" }))))),
|
|
@@ -3759,26 +3759,26 @@ var Statistics = function (_a) {
|
|
|
3759
3759
|
source && (React.createElement(React.Fragment, null,
|
|
3760
3760
|
React.createElement(VerticalSpace, { size: "12" }),
|
|
3761
3761
|
React.createElement(Text, { size: "xs" },
|
|
3762
|
-
React.createElement("span", { className: styles$
|
|
3762
|
+
React.createElement("span", { className: styles$g.mutedText }, source)))),
|
|
3763
3763
|
sourceUrl && (React.createElement(Text, { size: "xs" },
|
|
3764
|
-
React.createElement("a", { className: styles$
|
|
3764
|
+
React.createElement("a", { className: styles$g.mutedText, href: sourceUrl }, sourceUrl))))))));
|
|
3765
3765
|
})))));
|
|
3766
3766
|
};
|
|
3767
3767
|
|
|
3768
|
-
var styles$
|
|
3768
|
+
var styles$f = {"bannerWithTabsHeadingCentered":"BannerWithTabs-module_bannerWithTabsHeadingCentered__upqEO"};
|
|
3769
3769
|
|
|
3770
3770
|
var BannerWithTabs = function (_a) {
|
|
3771
3771
|
var _b;
|
|
3772
3772
|
var tabs = _a.tabs, defaultValue = _a.defaultValue, heading = _a.heading, headingLevel = _a.headingLevel, content = _a.content, id = _a.id, isHeadingWordWrap = _a.isHeadingWordWrap, _c = _a.alignTypography, alignTypography = _c === void 0 ? "left" : _c, minHeight = _a.minHeight, minHeightM = _a.minHeightM, props = __rest(_a, ["tabs", "defaultValue", "heading", "headingLevel", "content", "id", "isHeadingWordWrap", "alignTypography", "minHeight", "minHeightM"]);
|
|
3773
3773
|
return (React.createElement("div", __assign({}, filterAttrs(props)),
|
|
3774
3774
|
React.createElement("div", { className: classNames((_b = {},
|
|
3775
|
-
_b[styles$
|
|
3775
|
+
_b[styles$f.bannerWithTabsHeadingCentered] = alignTypography === "center",
|
|
3776
3776
|
_b)) },
|
|
3777
3777
|
React.createElement(SectionHeading, { id: id, isHeadingWordWrap: isHeadingWordWrap, heading: heading, headingLevel: headingLevel, content: content, isPadded: alignTypography === "left" ? true : false })),
|
|
3778
3778
|
React.createElement(TabbedBanner, { minHeight: minHeight, minHeightM: minHeightM, tabs: tabs, defaultValue: defaultValue })));
|
|
3779
3779
|
};
|
|
3780
3780
|
|
|
3781
|
-
var styles$
|
|
3781
|
+
var styles$e = {"tagGroup":"ArticleSidebar-module_tagGroup__rIPQc","textContent":"ArticleSidebar-module_textContent__3nCfG","additionalContentContainer":"ArticleSidebar-module_additionalContentContainer__91L4n","shareButtonContainer":"ArticleSidebar-module_shareButtonContainer__iAfHL","shareButton":"ArticleSidebar-module_shareButton__rb-1E"};
|
|
3782
3782
|
|
|
3783
3783
|
/**
|
|
3784
3784
|
* Use `ArticleSidebar` to provide additional information about the article.
|
|
@@ -3834,7 +3834,7 @@ var ArticleSidebar = function (_a) {
|
|
|
3834
3834
|
var hasBottomContent = Boolean(linkSection || topics || share);
|
|
3835
3835
|
return (React.createElement("div", __assign({}, filterAttrs(props)),
|
|
3836
3836
|
React.createElement("div", { className: classNames((_b = {},
|
|
3837
|
-
_b[styles$
|
|
3837
|
+
_b[styles$e.textContent] = hasTopContent,
|
|
3838
3838
|
_b)) },
|
|
3839
3839
|
author && (React.createElement(React.Fragment, null,
|
|
3840
3840
|
React.createElement(Author, __assign({}, author, { avatar: __assign(__assign({}, author.avatar), { size: "xl" }) })))),
|
|
@@ -3845,7 +3845,7 @@ var ArticleSidebar = function (_a) {
|
|
|
3845
3845
|
React.createElement(Text, { size: "s" }, aboutSection.content))),
|
|
3846
3846
|
additionalContent && (React.createElement(React.Fragment, null,
|
|
3847
3847
|
(author || aboutSection) && React.createElement(VerticalSpace, { size: "16" }),
|
|
3848
|
-
React.createElement("div", { className: styles$
|
|
3848
|
+
React.createElement("div", { className: styles$e.additionalContentContainer }, additionalContent.map(function (_a) {
|
|
3849
3849
|
var heading = _a.heading, headingLevel = _a.headingLevel, content = _a.content;
|
|
3850
3850
|
return (React.createElement("div", { key: "".concat(id, "-").concat(heading) },
|
|
3851
3851
|
React.createElement(Heading, { level: headingLevel, size: "xxs" }, heading),
|
|
@@ -3868,7 +3868,7 @@ var ArticleSidebar = function (_a) {
|
|
|
3868
3868
|
linkSection && React.createElement(VerticalSpace, { size: "32" }),
|
|
3869
3869
|
React.createElement(Heading, { level: topics.headingLevel }, topics.heading),
|
|
3870
3870
|
React.createElement(VerticalSpace, { size: "16" }),
|
|
3871
|
-
React.createElement("div", { className: styles$
|
|
3871
|
+
React.createElement("div", { className: styles$e.tagGroup }, topics.tags.map(function (tag) { return (React.createElement(Tag, __assign({ key: "".concat(id, "-").concat(tag.title) }, tag))); })))),
|
|
3872
3872
|
share && (React.createElement(React.Fragment, null,
|
|
3873
3873
|
(linkSection || topics) && (React.createElement("div", { "data-testid": "links-topics-content-rule" },
|
|
3874
3874
|
React.createElement(VerticalSpace, { size: "32" }),
|
|
@@ -3876,16 +3876,16 @@ var ArticleSidebar = function (_a) {
|
|
|
3876
3876
|
React.createElement(VerticalSpace, { size: "32" }))),
|
|
3877
3877
|
React.createElement(Heading, { level: share.headingLevel }, share.heading),
|
|
3878
3878
|
React.createElement(VerticalSpace, { size: "16" }),
|
|
3879
|
-
React.createElement("div", { className: styles$
|
|
3879
|
+
React.createElement("div", { className: styles$e.shareButtonContainer }, shareButtons.map(function (_a) {
|
|
3880
3880
|
var isButton = _a.isButton, ariaLabel = _a.ariaLabel, href = _a.href, icon = _a.icon, onClick = _a.onClick;
|
|
3881
|
-
return (React.createElement("a", { key: "".concat(id, "-").concat(ariaLabel), role: isButton ? "button" : undefined, target: "_blank", rel: "noreferrer", className: styles$
|
|
3881
|
+
return (React.createElement("a", { key: "".concat(id, "-").concat(ariaLabel), role: isButton ? "button" : undefined, target: "_blank", rel: "noreferrer", className: styles$e.shareButton, "aria-label": ariaLabel, href: href, onClick: isButton ? onClick : undefined },
|
|
3882
3882
|
React.createElement(Icon, { icon: icon, size: 24 })));
|
|
3883
3883
|
})))),
|
|
3884
3884
|
React.createElement(Toast, null,
|
|
3885
3885
|
React.createElement(ToastNotification, { status: "success", title: "Copied to clipboard", isOpen: showToast, onOpenChange: function () { return setShowToast(false); } }))));
|
|
3886
3886
|
};
|
|
3887
3887
|
|
|
3888
|
-
var styles$
|
|
3888
|
+
var styles$d = {"product-navigation-grid":"ProductNavigation-module_product-navigation-grid__RzFq8","productNavigation-skipLink":"ProductNavigation-module_productNavigation-skipLink__fy8ZJ"};
|
|
3889
3889
|
|
|
3890
3890
|
/**
|
|
3891
3891
|
* Use `ProductNavigation` to give a collection of product information cards collected within a grid that has optional show/hide capability
|
|
@@ -3929,7 +3929,7 @@ var ProductNavigation = function (_a) {
|
|
|
3929
3929
|
var isMinWidthArcBreakpointS = useMediaQuery("(min-width: ".concat(ArcSizeBreakpointsS, ")"));
|
|
3930
3930
|
return (React.createElement("div", __assign({}, filterAttrs(props)),
|
|
3931
3931
|
React.createElement(SectionHeading, { isPadded: true, id: id, "data-testid": "ProductNavigation-header", heading: heading, headingLevel: headingLevel, isHeadingWordWrap: isHeadingWordWrap, content: content, image: image }),
|
|
3932
|
-
React.createElement("ul", { className: classNames(styles$
|
|
3932
|
+
React.createElement("ul", { className: classNames(styles$d["product-navigation-grid"]) }, displayList === null || displayList === void 0 ? void 0 : displayList.map(function (cardProps, i) {
|
|
3933
3933
|
var _a;
|
|
3934
3934
|
return (React.createElement("li", { key: "displayList-".concat(i), tabIndex: -1, ref: i === skipLinkCard ? cardRef : undefined, "data-cy": "list-item-".concat(i) },
|
|
3935
3935
|
React.createElement(InformationCard, __assign({}, cardProps, { minHeight: minHeight !== null && minHeight !== void 0 ? minHeight : cardProps.minHeight, headingLevel: (_a = cardProps.headingLevel) !== null && _a !== void 0 ? _a : "2" }))));
|
|
@@ -3940,7 +3940,7 @@ var ProductNavigation = function (_a) {
|
|
|
3940
3940
|
? "Show more"
|
|
3941
3941
|
: "Show less", buttonStyle: "secondary", onClick: clickController, isFullWidth: isMinWidthArcBreakpointS ? false : true, isLoading: isLoading })),
|
|
3942
3942
|
displayList.length > cardsToDisplay && (React.createElement(React.Fragment, null,
|
|
3943
|
-
React.createElement("div", { id: "skip-link", className: classNames(styles$
|
|
3943
|
+
React.createElement("div", { id: "skip-link", className: classNames(styles$d["productNavigation-skipLink"]), tabIndex: -1 },
|
|
3944
3944
|
React.createElement(ButtonV2, { label: "Move to first new card", buttonStyle: "primary", onClick: moveFocus, isFullWidth: isMinWidthArcBreakpointS ? false : true })))),
|
|
3945
3945
|
React.createElement(VisuallyHidden, null,
|
|
3946
3946
|
React.createElement("div", { "aria-live": "polite", id: "aria-live-region", "aria-atomic": true },
|
|
@@ -3953,82 +3953,82 @@ var ProductNavigation = function (_a) {
|
|
|
3953
3953
|
"."))))));
|
|
3954
3954
|
};
|
|
3955
3955
|
|
|
3956
|
-
var styles$
|
|
3956
|
+
var styles$c = {"container":"ContentInfoWidget-module_container__yaS-8","text":"ContentInfoWidget-module_text__O1BdZ","icon":"ContentInfoWidget-module_icon__LEww1"};
|
|
3957
3957
|
|
|
3958
3958
|
var ContentInfoWidget = function (_a) {
|
|
3959
3959
|
var text = _a.text, icon = _a.icon, props = __rest(_a, ["text", "icon"]);
|
|
3960
|
-
return (React.createElement("div", __assign({ className: styles$
|
|
3961
|
-
React.createElement("div", { className: styles$
|
|
3960
|
+
return (React.createElement("div", __assign({ className: styles$c.container }, filterAttrs(props)),
|
|
3961
|
+
React.createElement("div", { className: styles$c.icon },
|
|
3962
3962
|
React.createElement(Icon, { size: 20, icon: icon })),
|
|
3963
|
-
React.createElement("div", { className: styles$
|
|
3963
|
+
React.createElement("div", { className: styles$c.text },
|
|
3964
3964
|
React.createElement(Text, { size: "xs", tone: "muted" }, text))));
|
|
3965
3965
|
};
|
|
3966
3966
|
|
|
3967
|
-
var styles$
|
|
3967
|
+
var styles$b = {"action-tile":"ActionTile-module_action-tile__JPwGb","action-tile-content":"ActionTile-module_action-tile-content__ZkgHc","action-tile-icon":"ActionTile-module_action-tile-icon__PY1EN","action-tile-heading":"ActionTile-module_action-tile-heading__Uxdu9","action-tile--active":"ActionTile-module_action-tile--active__-aWze","action-tile-tick":"ActionTile-module_action-tile-tick__vhsJE"};
|
|
3968
3968
|
|
|
3969
3969
|
var ActionTile = function (_a) {
|
|
3970
3970
|
var _b;
|
|
3971
3971
|
var icon = _a.icon, activeIcon = _a.activeIcon, heading = _a.heading, _c = _a.isActive, isActive = _c === void 0 ? false : _c, onClick = _a.onClick, className = _a.className, props = __rest(_a, ["icon", "activeIcon", "heading", "isActive", "onClick", "className"]);
|
|
3972
|
-
var tileClasses = classNames(styles$
|
|
3973
|
-
_b[styles$
|
|
3972
|
+
var tileClasses = classNames(styles$b["action-tile"], (_b = {},
|
|
3973
|
+
_b[styles$b["action-tile--active"]] = isActive,
|
|
3974
3974
|
_b), className);
|
|
3975
3975
|
var displayIcon = isActive && activeIcon ? activeIcon : icon;
|
|
3976
3976
|
var content = (React.createElement(React.Fragment, null,
|
|
3977
|
-
React.createElement("div", { className: styles$
|
|
3978
|
-
displayIcon && (React.createElement("div", { className: styles$
|
|
3977
|
+
React.createElement("div", { className: styles$b["action-tile-content"] },
|
|
3978
|
+
displayIcon && (React.createElement("div", { className: styles$b["action-tile-icon"] },
|
|
3979
3979
|
React.createElement(Icon, { icon: displayIcon, size: 48 }))),
|
|
3980
|
-
React.createElement("h3", { className: styles$
|
|
3981
|
-
isActive && (React.createElement("div", { className: styles$
|
|
3980
|
+
React.createElement("h3", { className: styles$b["action-tile-heading"] }, heading)),
|
|
3981
|
+
isActive && (React.createElement("div", { className: styles$b["action-tile-tick"] },
|
|
3982
3982
|
React.createElement(Icon, { icon: BtIconTickAlt2Px, size: 28 })))));
|
|
3983
3983
|
return (React.createElement("div", __assign({ className: tileClasses, onClick: onClick }, filterAttrs(props)), content));
|
|
3984
3984
|
};
|
|
3985
3985
|
|
|
3986
|
-
var styles$
|
|
3986
|
+
var styles$a = {"link-tile":"LinkTile-module_link-tile__xVUP3","link-tile-content":"LinkTile-module_link-tile-content__H-QN8","link-tile-icon":"LinkTile-module_link-tile-icon__kTMfH","link-tile-text":"LinkTile-module_link-tile-text__0K6zf"};
|
|
3987
3987
|
|
|
3988
3988
|
var LinkTile = function (_a) {
|
|
3989
3989
|
var text = _a.text, href = _a.href, _b = _a.showIcon, showIcon = _b === void 0 ? true : _b, className = _a.className, props = __rest(_a, ["text", "href", "showIcon", "className"]);
|
|
3990
3990
|
var Component = href ? "a" : "div";
|
|
3991
3991
|
var linkProps = href ? { href: href } : {};
|
|
3992
|
-
return (React.createElement(Component, __assign({ className: classNames(styles$
|
|
3993
|
-
React.createElement("span", { className: styles$
|
|
3994
|
-
showIcon && (React.createElement("span", { className: styles$
|
|
3992
|
+
return (React.createElement(Component, __assign({ className: classNames(styles$a["link-tile"], className) }, linkProps, props), text && (React.createElement("div", { className: styles$a["link-tile-content"] },
|
|
3993
|
+
React.createElement("span", { className: styles$a["link-tile-text"] }, text),
|
|
3994
|
+
showIcon && (React.createElement("span", { className: styles$a["link-tile-icon"] },
|
|
3995
3995
|
React.createElement(Icon, { icon: BtIconArrowAltRight, size: 32 })))))));
|
|
3996
3996
|
};
|
|
3997
3997
|
|
|
3998
|
-
var styles$
|
|
3998
|
+
var styles$9 = {"quick-help":"InlineLinkGroup-module_quick-help__cMTpB","quick-help-label":"InlineLinkGroup-module_quick-help-label__VLKen","quick-help-container":"InlineLinkGroup-module_quick-help-container__IStTk","quick-help-item":"InlineLinkGroup-module_quick-help-item__QTIMl","quick-help-separator":"InlineLinkGroup-module_quick-help-separator__qJE0q","quick-help-separator-line":"InlineLinkGroup-module_quick-help-separator-line__VbCVI"};
|
|
3999
3999
|
|
|
4000
4000
|
var InlineLinkGroup = function (_a) {
|
|
4001
4001
|
var label = _a.label, links = _a.links, props = __rest(_a, ["label", "links"]);
|
|
4002
|
-
return (React.createElement("div", __assign({ className: styles$
|
|
4003
|
-
label && (React.createElement("div", { className: styles$
|
|
4002
|
+
return (React.createElement("div", __assign({ className: styles$9["quick-help"] }, filterAttrs(props)),
|
|
4003
|
+
label && (React.createElement("div", { className: styles$9["quick-help-label"] },
|
|
4004
4004
|
React.createElement(Heading, { size: "xxs", fontStyle: "overline" }, label))),
|
|
4005
|
-
React.createElement("ul", { className: styles$
|
|
4006
|
-
React.createElement("li", { className: styles$
|
|
4005
|
+
React.createElement("ul", { className: styles$9["quick-help-container"] }, links.map(function (link, index) { return (React.createElement(React.Fragment, { key: index },
|
|
4006
|
+
React.createElement("li", { className: styles$9["quick-help-item"] },
|
|
4007
4007
|
React.createElement(Link, { href: link.href, onClick: link.onClick, "aria-label": link.ariaLabel }, link.label),
|
|
4008
4008
|
React.createElement(Icon, { icon: BtIconArrowAltRight, size: 24, color: "brand" })),
|
|
4009
|
-
index < links.length - 1 && (React.createElement("li", { className: styles$
|
|
4010
|
-
React.createElement("div", { className: styles$
|
|
4009
|
+
index < links.length - 1 && (React.createElement("li", { className: styles$9["quick-help-separator"], "aria-hidden": "true" },
|
|
4010
|
+
React.createElement("div", { className: styles$9["quick-help-separator-line"] }))))); }))));
|
|
4011
4011
|
};
|
|
4012
4012
|
|
|
4013
|
-
var styles$
|
|
4013
|
+
var styles$8 = {"thumbnailSignpost":"ThumbnailSignpost-module_thumbnailSignpost__Yf26b","isLink":"ThumbnailSignpost-module_isLink__FucdG","content":"ThumbnailSignpost-module_content__XG9oj","heading":"ThumbnailSignpost-module_heading__mTrpJ","image":"ThumbnailSignpost-module_image__syGZj","thumbnailButton":"ThumbnailSignpost-module_thumbnailButton__Nn-NR","buttonIcon":"ThumbnailSignpost-module_buttonIcon__ydmza"};
|
|
4014
4014
|
|
|
4015
4015
|
/** Use `ThumbnailSignpost` to highlight key information or navigation points with an accompanying thumbnail image or icon. */
|
|
4016
4016
|
var ThumbnailSignpost = function (_a) {
|
|
4017
4017
|
var _b;
|
|
4018
4018
|
var text = _a.text, title = _a.title, img = _a.img, onClick = _a.onClick, buttonLabel = _a.buttonLabel, props = __rest(_a, ["text", "title", "img", "onClick", "buttonLabel"]);
|
|
4019
|
-
return (React.createElement("div", __assign({ className: classNames(styles$
|
|
4020
|
-
_b[styles$
|
|
4019
|
+
return (React.createElement("div", __assign({ className: classNames(styles$8.thumbnailSignpost, (_b = {},
|
|
4020
|
+
_b[styles$8.isLink] = onClick,
|
|
4021
4021
|
_b)), onClick: onClick, "aria-label": title, tabIndex: onClick ? 0 : -1 }, (onClick && { role: "button" }), filterAttrs(props)),
|
|
4022
|
-
img && (React.createElement("div", { className: styles$
|
|
4022
|
+
img && (React.createElement("div", { className: styles$8.image },
|
|
4023
4023
|
React.createElement(Image$2, __assign({}, img)))),
|
|
4024
|
-
React.createElement("div", { className: styles$
|
|
4025
|
-
React.createElement("span", { className: styles$
|
|
4024
|
+
React.createElement("div", { className: styles$8.content },
|
|
4025
|
+
React.createElement("span", { className: styles$8.heading }, title),
|
|
4026
4026
|
React.createElement(VerticalSpace, { size: "8" }),
|
|
4027
4027
|
text,
|
|
4028
4028
|
buttonLabel && onClick && (React.createElement(React.Fragment, null,
|
|
4029
4029
|
React.createElement(VerticalSpace, { size: "8" }),
|
|
4030
|
-
React.createElement("div", { className: styles$
|
|
4031
|
-
React.createElement("span", { className: styles$
|
|
4030
|
+
React.createElement("div", { className: styles$8.thumbnailButton },
|
|
4031
|
+
React.createElement("span", { className: styles$8.buttonIcon, role: "img", style: {
|
|
4032
4032
|
height: 24,
|
|
4033
4033
|
width: 24,
|
|
4034
4034
|
maskImage: "url(\"".concat(BtIconArrowRightFill, "\")"),
|
|
@@ -4037,29 +4037,29 @@ var ThumbnailSignpost = function (_a) {
|
|
|
4037
4037
|
React.createElement(Heading, { size: "xxs" }, buttonLabel)))))));
|
|
4038
4038
|
};
|
|
4039
4039
|
|
|
4040
|
-
var styles$
|
|
4040
|
+
var styles$7 = {"PromoListingThumbnailSignpost":"PromoListingThumbnailSignpost-module_PromoListingThumbnailSignpost__0HTPV","list":"PromoListingThumbnailSignpost-module_list__E9l0E"};
|
|
4041
4041
|
|
|
4042
4042
|
/**
|
|
4043
4043
|
* Use `PromoListingThumbnailSignpost` to give supporting information about a page or proposition in the form of the ThumbnailSignposts components.
|
|
4044
4044
|
*/
|
|
4045
4045
|
var PromoListingThumbnailSignpost = function (_a) {
|
|
4046
4046
|
var _b = _a.isPadded, isPadded = _b === void 0 ? true : _b, heading = _a.heading, content = _a.content, headingLevel = _a.headingLevel, thumbnailList = _a.thumbnailList, isHeadingWordWrap = _a.isHeadingWordWrap, props = __rest(_a, ["isPadded", "heading", "content", "headingLevel", "thumbnailList", "isHeadingWordWrap"]);
|
|
4047
|
-
return (React.createElement("div", __assign({ className: styles$
|
|
4047
|
+
return (React.createElement("div", __assign({ className: styles$7.PromoListingThumbnailSignpost }, filterAttrs(props)),
|
|
4048
4048
|
React.createElement(SectionHeading, { isPadded: isPadded, "data-testid": "PromoListingThumbnailSignpost-header", heading: heading, headingLevel: headingLevel, content: content, isHeadingWordWrap: isHeadingWordWrap }),
|
|
4049
|
-
React.createElement("ul", { className: styles$
|
|
4049
|
+
React.createElement("ul", { className: styles$7.list }, thumbnailList.map(function (thumbnail, index) { return (React.createElement("li", { key: index },
|
|
4050
4050
|
React.createElement(ThumbnailSignpost, __assign({}, thumbnail)))); }))));
|
|
4051
4051
|
};
|
|
4052
4052
|
|
|
4053
|
-
var styles$
|
|
4053
|
+
var styles$6 = {"playIconContainer":"VideoCardPlayIcon-module_playIconContainer__ZqZP3","playIconContainer--s":"VideoCardPlayIcon-module_playIconContainer--s__ETbOZ","playIconContainer--l":"VideoCardPlayIcon-module_playIconContainer--l__OGccg","playIcon":"VideoCardPlayIcon-module_playIcon__kzito"};
|
|
4054
4054
|
|
|
4055
4055
|
var VideoCardPlayIcon = function (_a) {
|
|
4056
4056
|
var _b = _a.size, size = _b === void 0 ? "l" : _b;
|
|
4057
|
-
return (React.createElement("div", { className: classNames(styles$
|
|
4058
|
-
React.createElement("div", { className: styles$
|
|
4057
|
+
return (React.createElement("div", { className: classNames(styles$6.playIconContainer, styles$6["playIconContainer--".concat(size)]) },
|
|
4058
|
+
React.createElement("div", { className: styles$6.playIcon },
|
|
4059
4059
|
React.createElement(Icon, { icon: ArcIconPlay }))));
|
|
4060
4060
|
};
|
|
4061
4061
|
|
|
4062
|
-
var styles$
|
|
4062
|
+
var styles$5 = {"container":"VideoCardPlayer-module_container__G-Uta","player":"VideoCardPlayer-module_player__BgueT","playerWrapper":"VideoCardPlayer-module_playerWrapper__UcH1q","playerWrapper--landscape":"VideoCardPlayer-module_playerWrapper--landscape__shKv-","playerWrapper--portrait":"VideoCardPlayer-module_playerWrapper--portrait__7bKAr"};
|
|
4063
4063
|
|
|
4064
4064
|
var VideoCardPlayer = function (_a) {
|
|
4065
4065
|
var thumbnail = _a.thumbnail, playIconSize = _a.playIconSize, orientation = _a.orientation, children = _a.children, player = _a.player, props = __rest(_a, ["thumbnail", "playIconSize", "orientation", "children", "player"]);
|
|
@@ -4067,21 +4067,21 @@ var VideoCardPlayer = function (_a) {
|
|
|
4067
4067
|
useEffect(function () {
|
|
4068
4068
|
setIsClient(true);
|
|
4069
4069
|
}, []);
|
|
4070
|
-
var playerProps = __assign(__assign({}, player), { light: thumbnail, playIcon: React.createElement(VideoCardPlayIcon, { size: playIconSize }), muted: !thumbnail, playing: true, controls: true, className: styles$
|
|
4071
|
-
return (React.createElement("div", __assign({ className: styles$
|
|
4072
|
-
React.createElement("div", { "data-testid": "arc-video-card", className: classNames(styles$
|
|
4070
|
+
var playerProps = __assign(__assign({}, player), { light: thumbnail, playIcon: React.createElement(VideoCardPlayIcon, { size: playIconSize }), muted: !thumbnail, playing: true, controls: true, className: styles$5.player, width: "100%", height: "100%" });
|
|
4071
|
+
return (React.createElement("div", __assign({ className: styles$5.container }, filterAttrs(props)),
|
|
4072
|
+
React.createElement("div", { "data-testid": "arc-video-card", className: classNames(styles$5.playerWrapper, styles$5["playerWrapper--".concat(orientation)]) }, isClient && React.createElement(ReactPlayer, __assign({}, playerProps))),
|
|
4073
4073
|
children));
|
|
4074
4074
|
};
|
|
4075
4075
|
|
|
4076
|
-
var styles$
|
|
4076
|
+
var styles$4 = {"thumbnail":"VideoCardThumbnail-module_thumbnail__Yamk0","thumbnail--landscape":"VideoCardThumbnail-module_thumbnail--landscape__FmnLk","thumbnail--portrait":"VideoCardThumbnail-module_thumbnail--portrait__FZS93","thumbnailContent":"VideoCardThumbnail-module_thumbnailContent__cHham"};
|
|
4077
4077
|
|
|
4078
4078
|
var VideoCardThumbnail = function (_a) {
|
|
4079
4079
|
var orientation = _a.orientation, contentVisibility = _a.contentVisibility, src = _a.src, children = _a.children;
|
|
4080
|
-
var content = React.createElement("div", { className: styles$
|
|
4081
|
-
return (React.createElement("div", { className: classNames(styles$
|
|
4080
|
+
var content = React.createElement("div", { className: styles$4.thumbnailContent }, children);
|
|
4081
|
+
return (React.createElement("div", { className: classNames(styles$4.thumbnail, styles$4["thumbnail--".concat(orientation)]), style: { backgroundImage: "url(".concat(src, ")") } }, contentVisibility ? (React.createElement(Visible, __assign({}, contentVisibility), content)) : (content)));
|
|
4082
4082
|
};
|
|
4083
4083
|
|
|
4084
|
-
var styles$
|
|
4084
|
+
var styles$3 = {"mainText--lightBackground":"VideoHeroCardContent-module_mainText--lightBackground__nGl6W","statContainer--lightBackground":"VideoHeroCardContent-module_statContainer--lightBackground__7hXAf","statContainer--darkBackground":"VideoHeroCardContent-module_statContainer--darkBackground__X3-r2","mainText--darkBackground":"VideoHeroCardContent-module_mainText--darkBackground__Pfizt","statContainer":"VideoHeroCardContent-module_statContainer__q21g9","stat":"VideoHeroCardContent-module_stat__iIcoq"};
|
|
4085
4085
|
|
|
4086
4086
|
var VideoHeroCardContent = function (_a) {
|
|
4087
4087
|
var title = _a.title, label = _a.label, description = _a.description, videoDate = _a.videoDate, duration = _a.duration, background = _a.background, subtitleAvailabilityText = _a.subtitleAvailabilityText;
|
|
@@ -4095,8 +4095,8 @@ var VideoHeroCardContent = function (_a) {
|
|
|
4095
4095
|
},
|
|
4096
4096
|
];
|
|
4097
4097
|
var hasMeta = metaItems.some(function (meta) { return Boolean(meta.text); });
|
|
4098
|
-
return (React.createElement("div", { className: styles$
|
|
4099
|
-
React.createElement("div", { className: classNames(styles$
|
|
4098
|
+
return (React.createElement("div", { className: styles$3["".concat(background, "Background")] },
|
|
4099
|
+
React.createElement("div", { className: classNames(styles$3.mainText, styles$3["mainText--".concat(background, "Background")]) },
|
|
4100
4100
|
React.createElement(Heading, { fontStyle: "overline" }, label),
|
|
4101
4101
|
React.createElement(VerticalSpace, { size: "8", sizeM: "4" }),
|
|
4102
4102
|
React.createElement(Heading, { level: "3", isWordWrap: false, size: "xl" }, title),
|
|
@@ -4104,8 +4104,8 @@ var VideoHeroCardContent = function (_a) {
|
|
|
4104
4104
|
React.createElement(Text, null, description)),
|
|
4105
4105
|
hasMeta && (React.createElement(React.Fragment, null,
|
|
4106
4106
|
React.createElement(VerticalSpace, { size: "32", sizeS: "16" }),
|
|
4107
|
-
React.createElement("div", { className: classNames(styles$
|
|
4108
|
-
return meta.text && (React.createElement("div", { key: "".concat(id, "-stat-").concat(i), className: styles$
|
|
4107
|
+
React.createElement("div", { className: classNames(styles$3.statContainer, styles$3["statContainer--".concat(background, "Background")]) }, metaItems.map(function (meta, i) {
|
|
4108
|
+
return meta.text && (React.createElement("div", { key: "".concat(id, "-stat-").concat(i), className: styles$3.stat },
|
|
4109
4109
|
React.createElement(Icon, { icon: meta.icon, size: 20 }),
|
|
4110
4110
|
React.createElement(Text, { size: "xs" }, meta.text)));
|
|
4111
4111
|
}))))));
|
|
@@ -4128,7 +4128,7 @@ var VideoPortraitCard = function (_a) {
|
|
|
4128
4128
|
React.createElement(Heading, { level: "3", isWordWrap: false, size: "xs" }, thumbnail.title)))), orientation: "portrait", player: player, playIconSize: "s" }, props)));
|
|
4129
4129
|
};
|
|
4130
4130
|
|
|
4131
|
-
var styles = {"contentWrapper":"BusinessSegmentSwitcher-module_contentWrapper__YKEjS","cardWrapper":"BusinessSegmentSwitcher-module_cardWrapper__eGDJ-","cardCol":"BusinessSegmentSwitcher-module_cardCol__jsySH","businessSegmentSwitcherDesktop":"BusinessSegmentSwitcher-module_businessSegmentSwitcherDesktop__oBvzS","businessSegmentSwitcher":"BusinessSegmentSwitcher-module_businessSegmentSwitcher__Sae5K","desktopCarousel":"BusinessSegmentSwitcher-module_desktopCarousel__xW3HN","businessSegmentSwitcherMobile":"BusinessSegmentSwitcher-module_businessSegmentSwitcherMobile__PSFyi"};
|
|
4131
|
+
var styles$2 = {"contentWrapper":"BusinessSegmentSwitcher-module_contentWrapper__YKEjS","cardWrapper":"BusinessSegmentSwitcher-module_cardWrapper__eGDJ-","cardCol":"BusinessSegmentSwitcher-module_cardCol__jsySH","businessSegmentSwitcherDesktop":"BusinessSegmentSwitcher-module_businessSegmentSwitcherDesktop__oBvzS","businessSegmentSwitcher":"BusinessSegmentSwitcher-module_businessSegmentSwitcher__Sae5K","desktopCarousel":"BusinessSegmentSwitcher-module_desktopCarousel__xW3HN","businessSegmentSwitcherMobile":"BusinessSegmentSwitcher-module_businessSegmentSwitcherMobile__PSFyi"};
|
|
4132
4132
|
|
|
4133
4133
|
/**
|
|
4134
4134
|
* Renders either an InformationCard or a contained MediaCard based on the card type.
|
|
@@ -4152,11 +4152,11 @@ var renderBusinessSegmentSwitcherCarousel = function (_a) {
|
|
|
4152
4152
|
xs: { itemsPerSlide: 1 },
|
|
4153
4153
|
s: { itemsPerSlide: 2 },
|
|
4154
4154
|
} },
|
|
4155
|
-
React.createElement("div", { className: styles.cardWrapper }, renderCard(content.card1)),
|
|
4156
|
-
React.createElement("div", { className: styles.cardWrapper }, renderCard(content.card2)),
|
|
4157
|
-
content.card3 && (React.createElement("div", { className: styles.cardWrapper },
|
|
4155
|
+
React.createElement("div", { className: styles$2.cardWrapper }, renderCard(content.card1)),
|
|
4156
|
+
React.createElement("div", { className: styles$2.cardWrapper }, renderCard(content.card2)),
|
|
4157
|
+
content.card3 && (React.createElement("div", { className: styles$2.cardWrapper },
|
|
4158
4158
|
React.createElement(InformationCard, __assign({}, content.card3)))),
|
|
4159
|
-
React.createElement("div", { className: styles.cardWrapper },
|
|
4159
|
+
React.createElement("div", { className: styles$2.cardWrapper },
|
|
4160
4160
|
React.createElement(TypographyCard, { heading: "All ".concat(label, " solutions"), label: content.card4.label, url: content.card4.url }))));
|
|
4161
4161
|
};
|
|
4162
4162
|
|
|
@@ -4169,8 +4169,8 @@ var BusinessSegmentSwitcher = function (_a) {
|
|
|
4169
4169
|
var tabs = _a.tabs, defaultValue = _a.defaultValue, props = __rest(_a, ["tabs", "defaultValue"]);
|
|
4170
4170
|
var initialTab = (_c = defaultValue !== null && defaultValue !== void 0 ? defaultValue : (_b = tabs[0]) === null || _b === void 0 ? void 0 : _b.value) !== null && _c !== void 0 ? _c : "";
|
|
4171
4171
|
var _d = useState(initialTab), selectedTab = _d[0], setSelectedTab = _d[1];
|
|
4172
|
-
return (React.createElement("div", __assign({ className: styles.businessSegmentSwitcher }, filterAttrs(props)),
|
|
4173
|
-
React.createElement("div", { className: styles.businessSegmentSwitcherDesktop },
|
|
4172
|
+
return (React.createElement("div", __assign({ className: styles$2.businessSegmentSwitcher }, filterAttrs(props)),
|
|
4173
|
+
React.createElement("div", { className: styles$2.businessSegmentSwitcherDesktop },
|
|
4174
4174
|
React.createElement(ContentSwitcher, { value: selectedTab, onValueChange: function (value) { return setSelectedTab(value); } },
|
|
4175
4175
|
React.createElement(ContentSwitcherList, { isInset: true }, tabs.map(function (_a, index) {
|
|
4176
4176
|
var label = _a.label, value = _a.value;
|
|
@@ -4179,22 +4179,67 @@ var BusinessSegmentSwitcher = function (_a) {
|
|
|
4179
4179
|
tabs.map(function (_a, index) {
|
|
4180
4180
|
var value = _a.value, content = _a.content, label = _a.label;
|
|
4181
4181
|
return (React.createElement(ContentSwitcherContent, { value: value, key: "".concat(index, "-").concat(value), hidden: value !== selectedTab },
|
|
4182
|
-
React.createElement("div", { className: styles.contentWrapper },
|
|
4183
|
-
React.createElement("div", { className: styles.desktopCarousel }, renderBusinessSegmentSwitcherCarousel({ content: content, label: label })),
|
|
4182
|
+
React.createElement("div", { className: styles$2.contentWrapper },
|
|
4183
|
+
React.createElement("div", { className: styles$2.desktopCarousel }, renderBusinessSegmentSwitcherCarousel({ content: content, label: label })),
|
|
4184
4184
|
renderCard(content.card1),
|
|
4185
4185
|
renderCard(content.card2),
|
|
4186
|
-
React.createElement("div", { className: styles.cardCol },
|
|
4186
|
+
React.createElement("div", { className: styles$2.cardCol },
|
|
4187
4187
|
content.card3 && React.createElement(InformationCard, __assign({}, content.card3)),
|
|
4188
4188
|
React.createElement("div", null,
|
|
4189
4189
|
React.createElement(TypographyCard, { heading: "All ".concat(label.toLowerCase(), " solutions"), text: content.card4.text, label: content.card4.label, url: content.card4.url }))))));
|
|
4190
4190
|
}))),
|
|
4191
|
-
React.createElement("div", { className: styles.businessSegmentSwitcherMobile },
|
|
4191
|
+
React.createElement("div", { className: styles$2.businessSegmentSwitcherMobile },
|
|
4192
4192
|
React.createElement(ContentSwitcherDropdown, { isInset: true, value: selectedTab, tabs: tabs, isFluid: true, onValueChange: function (value) { return setSelectedTab(value); } }, tabs.map(function (_a, index) {
|
|
4193
4193
|
var value = _a.value, content = _a.content, label = _a.label;
|
|
4194
4194
|
return (React.createElement(ContentSwitcherDropdownContent, { value: value, key: "".concat(index, "-").concat(value) },
|
|
4195
|
-
React.createElement("div", { className: styles.contentWrapper }, renderBusinessSegmentSwitcherCarousel({ content: content, label: label }))));
|
|
4195
|
+
React.createElement("div", { className: styles$2.contentWrapper }, renderBusinessSegmentSwitcherCarousel({ content: content, label: label }))));
|
|
4196
4196
|
})))));
|
|
4197
4197
|
};
|
|
4198
4198
|
|
|
4199
|
-
|
|
4199
|
+
var styles$1 = {"subgroupHeader":"PartnerLogoSubgroup-module_subgroupHeader__rXAai","logoGroup":"PartnerLogoSubgroup-module_logoGroup__RYsTN","logoWrapper":"PartnerLogoSubgroup-module_logoWrapper__tyxVI","logoImage":"PartnerLogoSubgroup-module_logoImage__h7DJd"};
|
|
4200
|
+
|
|
4201
|
+
var PartnerLogoSubgroup = function (_a) {
|
|
4202
|
+
var subheading = _a.subheading, text = _a.text, headingLevel = _a.headingLevel, logos = _a.logos, _b = _a.tileHeight, tileHeight = _b === void 0 ? 72 : _b;
|
|
4203
|
+
var hasHeader = subheading || text;
|
|
4204
|
+
var id = useId();
|
|
4205
|
+
return (React.createElement(React.Fragment, null,
|
|
4206
|
+
hasHeader && (React.createElement("div", { className: styles$1.subgroupHeader },
|
|
4207
|
+
React.createElement(Columns, { isGutterless: true },
|
|
4208
|
+
React.createElement(ColumnsCol, { spanL: 9, spanXL: 8 },
|
|
4209
|
+
subheading && (React.createElement(Heading, { level: headingLevel, size: "s", isResponsive: false }, subheading)),
|
|
4210
|
+
subheading && text && React.createElement(VerticalSpace, { size: "8" }),
|
|
4211
|
+
text && (React.createElement(Text, { size: "m", tone: "supporting" }, text)))))),
|
|
4212
|
+
React.createElement("div", { className: styles$1.logoGroup }, logos.map(function (logo, j) { return (React.createElement("div", { key: "".concat(id, "-logo-").concat(j), className: styles$1.logoWrapper, style: { height: tileHeight } },
|
|
4213
|
+
React.createElement("img", { src: logo.src, alt: logo.alt, className: styles$1.logoImage }))); }))));
|
|
4214
|
+
};
|
|
4215
|
+
|
|
4216
|
+
var styles = {"subgroupList":"PartnerBrandLogos-module_subgroupList__4e1kv"};
|
|
4217
|
+
|
|
4218
|
+
var getSubheadingLevel = function (parentLevel, subLevel) {
|
|
4219
|
+
return subLevel !== null && subLevel !== void 0 ? subLevel : String(Math.min(Number(parentLevel) + 1, 6));
|
|
4220
|
+
};
|
|
4221
|
+
var PartnerBrandLogos = function (_a) {
|
|
4222
|
+
var heading = _a.heading, headingProps = _a.headingProps, _b = _a.headingLevel, headingLevel = _b === void 0 ? "2" : _b, content = _a.content, id = _a.id, _c = _a.rulerTopPadding, rulerTopPadding = _c === void 0 ? { size: "32" } : _c, _d = _a.rulerBottomPadding, rulerBottomPadding = _d === void 0 ? { size: "32" } : _d, subgroups = _a.subgroups, props = __rest(_a, ["heading", "headingProps", "headingLevel", "content", "id", "rulerTopPadding", "rulerBottomPadding", "subgroups"]);
|
|
4223
|
+
var componentId = useId();
|
|
4224
|
+
var _e = headingProps !== null && headingProps !== void 0 ? headingProps : {}, _f = _e.size, headingSize = _f === void 0 ? "l" : _f, _g = _e.isResponsive, headingIsResponsive = _g === void 0 ? true : _g, restHeadingProps = __rest(_e, ["size", "isResponsive"]);
|
|
4225
|
+
return (React.createElement("div", __assign({}, filterAttrs(props)),
|
|
4226
|
+
React.createElement(Columns, { isGutterless: true },
|
|
4227
|
+
React.createElement(ColumnsCol, { spanL: 9, spanXL: 8 },
|
|
4228
|
+
React.createElement(Heading, __assign({ level: headingLevel, id: id, size: headingSize, isResponsive: headingIsResponsive }, restHeadingProps), heading),
|
|
4229
|
+
content && (React.createElement(React.Fragment, null,
|
|
4230
|
+
React.createElement(VerticalSpace, { size: "16" }),
|
|
4231
|
+
content
|
|
4232
|
+
.split(/\\n|\n/)
|
|
4233
|
+
.filter(function (p) { return p.trim(); })
|
|
4234
|
+
.map(function (paragraph, i) { return (React.createElement(React.Fragment, { key: "content-".concat(componentId, "-").concat(i) },
|
|
4235
|
+
i > 0 && React.createElement(VerticalSpace, { size: "8" }),
|
|
4236
|
+
React.createElement(Text, { size: "m", elementType: "p" }, paragraph))); }))))),
|
|
4237
|
+
React.createElement(VerticalSpace, __assign({}, rulerTopPadding)),
|
|
4238
|
+
React.createElement(Rule, null),
|
|
4239
|
+
React.createElement(VerticalSpace, __assign({}, rulerBottomPadding)),
|
|
4240
|
+
React.createElement("ul", { className: styles.subgroupList }, subgroups.map(function (subgroup, i) { return (React.createElement("li", { key: "subgroup-".concat(componentId, "-").concat(i) },
|
|
4241
|
+
React.createElement(PartnerLogoSubgroup, { subheading: subgroup.subheading, text: subgroup.text, headingLevel: getSubheadingLevel(headingLevel, subgroup.subheadingLevel), logos: subgroup.logos, tileHeight: subgroup.tileHeight }))); }))));
|
|
4242
|
+
};
|
|
4243
|
+
|
|
4244
|
+
export { Accordion, ActionTile, ArticleCarousel, ArticleSidebar, Author, BannerWithTabs, BusinessSegmentSwitcher, ContentInfoWidget, CopyLead, DownloadList, FAQs, FeaturePost, Highlights, InlineLinkGroup, LinkTile, PartnerBrandLogos, ProductNavigation, PromoListing, PromoListingThumbnailSignpost, Quote, SectionHeading, Statistics, Summary, ThumbnailSignpost, VideoHeroCard, VideoPortraitCard };
|
|
4200
4245
|
//# sourceMappingURL=index.mjs.map
|