@arc-ui/community-components 3.3.0 → 3.5.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 +135 -15
- package/CHANGELOG.md +22 -0
- package/lib/Accordion/Accordion.cjs +3 -2
- package/lib/Accordion/Accordion.mjs +3 -2
- package/lib/ActionTile/ActionTile.cjs +7 -5
- package/lib/ActionTile/ActionTile.mjs +13 -11
- package/lib/ActionTile/styles.css +1 -1
- package/lib/ArticleSidebar/ArticleSidebar.cjs +10 -9
- package/lib/ArticleSidebar/ArticleSidebar.mjs +46 -45
- package/lib/Author/Author.cjs +3 -2
- package/lib/Author/Author.mjs +3 -2
- package/lib/BannerWithTabs/BannerWithTabs.cjs +5 -4
- package/lib/BannerWithTabs/BannerWithTabs.mjs +8 -7
- package/lib/BusinessSegmentSwitcher/BusinessSegmentSwitcher.cjs +81 -0
- package/lib/BusinessSegmentSwitcher/BusinessSegmentSwitcher.mjs +79 -0
- package/lib/BusinessSegmentSwitcher/styles.css +1 -0
- package/lib/ContentInfoWidget/ContentInfoWidget.cjs +4 -3
- package/lib/ContentInfoWidget/ContentInfoWidget.mjs +8 -7
- package/lib/CopyLead/CopyLead.cjs +33 -22
- package/lib/CopyLead/CopyLead.mjs +61 -50
- package/lib/DownloadList/DownloadList.cjs +6 -5
- package/lib/DownloadList/DownloadList.mjs +11 -10
- package/lib/FAQs/FAQs.cjs +6 -5
- package/lib/FAQs/FAQs.mjs +23 -22
- package/lib/FeaturePost/FeaturePost.cjs +13 -12
- package/lib/FeaturePost/FeaturePost.mjs +55 -54
- package/lib/Highlights/Highlights.cjs +11 -10
- package/lib/Highlights/Highlights.mjs +21 -20
- package/lib/InlineLinkGroup/InlineLinkGroup.cjs +4 -3
- package/lib/InlineLinkGroup/InlineLinkGroup.mjs +12 -11
- package/lib/LinkTile/LinkTile.cjs +3 -3
- package/lib/LinkTile/LinkTile.mjs +6 -6
- package/lib/LinkTile/styles.css +1 -1
- package/lib/ProductNavigation/ProductNavigation.cjs +7 -6
- package/lib/ProductNavigation/ProductNavigation.mjs +19 -18
- package/lib/PromoListing/PromoListing.cjs +8 -7
- package/lib/PromoListing/PromoListing.mjs +17 -16
- package/lib/PromoListingThumbnailSignpost/PromoListingThumbnailSignpost.cjs +8 -7
- package/lib/PromoListingThumbnailSignpost/PromoListingThumbnailSignpost.mjs +10 -9
- package/lib/Quote/Quote.cjs +6 -5
- package/lib/Quote/Quote.mjs +10 -9
- package/lib/SectionHeading/SectionHeading.cjs +3 -2
- package/lib/SectionHeading/SectionHeading.mjs +3 -2
- package/lib/Statistics/Statistics.cjs +6 -5
- package/lib/Statistics/Statistics.mjs +33 -32
- package/lib/Summary/Summary.cjs +5 -4
- package/lib/Summary/Summary.mjs +13 -12
- package/lib/ThumbnailSignpost/ThumbnailSignpost.cjs +3 -2
- package/lib/ThumbnailSignpost/ThumbnailSignpost.mjs +3 -2
- package/lib/VideoHeroCard/VideoHeroCard.cjs +77 -0
- package/lib/VideoHeroCard/VideoHeroCard.mjs +75 -0
- package/lib/VideoPortraitCard/VideoPortraitCard.cjs +23 -0
- package/lib/VideoPortraitCard/VideoPortraitCard.mjs +21 -0
- package/lib/_shared/cjs/{Accordion-QqDoB3pY.cjs → Accordion-DfNGOjTm.cjs} +9 -8
- package/lib/_shared/cjs/{Author-aL8YXi7C.cjs → Author-D4dKNQem.cjs} +5 -4
- package/lib/_shared/cjs/Preview-Dx1kCzJ1.cjs +102 -0
- package/lib/_shared/cjs/{SectionHeading-Dj-dJfv3.cjs → SectionHeading-DeSFM0HV.cjs} +5 -4
- package/lib/_shared/cjs/{ThumbnailSignpost-SBnrGooA.cjs → ThumbnailSignpost-GkOiwt-Z.cjs} +5 -4
- package/lib/_shared/cjs/VideoCardThumbnail-N5iC-cAU.cjs +441 -0
- package/lib/_shared/cjs/dash.all.min-BPXzla24.cjs +6 -0
- package/lib/_shared/cjs/filter-attrs-BizjMsy0.cjs +27 -0
- package/lib/_shared/cjs/hls-Ckhp5fVA.cjs +36628 -0
- package/lib/_shared/cjs/index-DjiIVIaV.cjs +96 -0
- package/lib/_shared/cjs/index-oGP6D6gL.cjs +14826 -0
- package/lib/_shared/cjs/{index.es-Dq8bYrbW.cjs → index.es-B0J3cvrY.cjs} +1 -1
- package/lib/_shared/cjs/mixin-BFwaXKGB.cjs +1027 -0
- package/lib/_shared/cjs/react-CEvhi3LL.cjs +737 -0
- package/lib/_shared/cjs/react-CqsEClV0.cjs +466 -0
- package/lib/_shared/cjs/react-DE6M3seI.cjs +496 -0
- package/lib/_shared/cjs/react-Dri2yjKm.cjs +554 -0
- package/lib/_shared/cjs/react-DxToimBj.cjs +4239 -0
- package/lib/_shared/cjs/react-JTfV8OSA.cjs +325 -0
- package/lib/_shared/cjs/react-caXJFZ8W.cjs +400 -0
- package/lib/_shared/cjs/react-fep2ei7j.cjs +727 -0
- package/lib/_shared/cjs/{filter-attrs-C26zOt4_.cjs → tslib.es6-BxB9I209.cjs} +0 -25
- package/lib/_shared/esm/{Accordion-DrOTh90S.mjs → Accordion-DSRlkcXi.mjs} +17 -16
- package/lib/_shared/esm/Author-CLMgH9ES.mjs +28 -0
- package/lib/_shared/esm/Preview-CmbKOgEO.mjs +100 -0
- package/lib/_shared/esm/{SectionHeading-DZOg_gYi.mjs → SectionHeading-DSwsdNSp.mjs} +11 -10
- package/lib/_shared/esm/{ThumbnailSignpost-DaZByYIH.mjs → ThumbnailSignpost-BtaHAB0h.mjs} +14 -13
- package/lib/_shared/esm/VideoCardThumbnail-Tbh7Xi-X.mjs +438 -0
- package/lib/_shared/esm/dash.all.min-CbWI_8dN.mjs +4 -0
- package/lib/_shared/esm/filter-attrs-DZ7RCEZm.mjs +25 -0
- package/lib/_shared/esm/hls-AFbJDS9D.mjs +36625 -0
- package/lib/_shared/esm/index-CrcIrdjn.mjs +14799 -0
- package/lib/_shared/esm/index-DYnuIO1L.mjs +94 -0
- package/lib/_shared/esm/{index.es-Bfdys5__.mjs → index.es-DraZ-qKh.mjs} +1 -1
- package/lib/_shared/esm/mixin-BGGG8VrM.mjs +1024 -0
- package/lib/_shared/esm/react-BGimq-TB.mjs +4237 -0
- package/lib/_shared/esm/react-BHT4t_eQ.mjs +494 -0
- package/lib/_shared/esm/react-BSd0sGcO.mjs +464 -0
- package/lib/_shared/esm/react-CSr43fZV.mjs +552 -0
- package/lib/_shared/esm/react-Ca6E7Fr-.mjs +398 -0
- package/lib/_shared/esm/react-DG070IvZ.mjs +725 -0
- package/lib/_shared/esm/react-DZyqy7W7.mjs +735 -0
- package/lib/_shared/esm/react-WW_9iHcl.mjs +323 -0
- package/lib/_shared/esm/{filter-attrs-D-1kWaCP.mjs → tslib.es6-BVXMhEem.mjs} +1 -25
- package/lib/index.cjs +323 -125
- package/lib/index.cjs.map +1 -1
- package/lib/index.d.cts +114 -3
- package/lib/index.d.mts +114 -3
- package/lib/index.mjs +321 -126
- package/lib/index.mjs.map +1 -1
- package/lib/styles.css +1 -1
- package/package.json +16 -13
- package/rollup.config.js +1 -1
- package/src/components/ActionTile/ActionTile.module.css +1 -0
- package/src/components/ActionTile/ActionTile.tsx +11 -3
- package/src/components/BusinessSegmentSwitcher/BusinessSegmentSwitcher.module.css +92 -0
- package/src/components/BusinessSegmentSwitcher/BusinessSegmentSwitcher.tsx +119 -0
- package/src/components/BusinessSegmentSwitcher/helpers/renderBusinessSegmentSwitcherCarousel.tsx +45 -0
- package/src/components/BusinessSegmentSwitcher/helpers/renderCard.tsx +17 -0
- package/src/components/BusinessSegmentSwitcher/index.ts +9 -0
- package/src/components/BusinessSegmentSwitcher/types/types.ts +45 -0
- package/src/components/CopyLead/components/MediaContent/MediaContent.tsx +7 -6
- package/src/components/CopyLead/templates/Content/Content.tsx +5 -3
- package/src/components/CopyLead/templates/Media/Media.tsx +5 -6
- package/src/components/LinkTile/LinkTile.module.css +8 -4
- package/src/components/LinkTile/LinkTile.tsx +1 -2
- package/src/components/PromoListingThumbnailSignpost/PromoListingThumbnailSignpost.tsx +2 -0
- package/src/components/VideoHeroCard/VideoHeroCard.tsx +63 -0
- package/src/components/VideoHeroCard/components/VideoHeroCardContent/VideoHeroCardContent.module.css +32 -0
- package/src/components/VideoHeroCard/components/VideoHeroCardContent/VideoHeroCardContent.tsx +97 -0
- package/src/components/VideoHeroCard/components/VideoHeroCardContent/index.ts +4 -0
- package/src/components/VideoHeroCard/index.ts +1 -0
- package/src/components/VideoPortraitCard/VideoPortraitCard.tsx +54 -0
- package/src/components/VideoPortraitCard/index.ts +4 -0
- package/src/components/index.ts +3 -0
- package/src/internal/MultiLineText/MultiLineText.tsx +25 -0
- package/src/internal/MultiLineText/index.ts +1 -0
- package/src/internal/VideoCardPlayer/VideoCardPlayer.module.css +54 -0
- package/src/internal/VideoCardPlayer/VideoCardPlayer.tsx +62 -0
- package/src/internal/VideoCardPlayer/components/VideoCardPlayIcon/VideoCardPlayIcon.module.css +41 -0
- package/src/internal/VideoCardPlayer/components/VideoCardPlayIcon/VideoCardPlayIcon.tsx +28 -0
- package/src/internal/VideoCardPlayer/components/VideoCardPlayIcon/index.ts +1 -0
- package/src/internal/VideoCardPlayer/components/VideoCardThumbnail/VideoCardThumbnail.module.css +58 -0
- package/src/internal/VideoCardPlayer/components/VideoCardThumbnail/VideoCardThumbnail.tsx +38 -0
- package/src/internal/VideoCardPlayer/components/VideoCardThumbnail/index.ts +1 -0
- package/src/internal/VideoCardPlayer/index.ts +2 -0
- package/src/internal/VideoCardPlayer/types/player-props.ts +6 -0
- package/versions.json +1 -1
- package/lib/_shared/esm/Author-BVCRPgkl.mjs +0 -27
|
@@ -1,5 +1,5 @@
|
|
|
1
|
-
import { _ as __rest, a as __assign
|
|
2
|
-
import
|
|
1
|
+
import { _ as __rest, a as __assign } from '../_shared/esm/tslib.es6-BVXMhEem.mjs';
|
|
2
|
+
import React__default from 'react';
|
|
3
3
|
import { c as classNames } from '../_shared/esm/index-BfTCfPZ1.mjs';
|
|
4
4
|
import { Icon } from '@arc-ui/components/Icon';
|
|
5
5
|
import { B as BtIconArrowAltRight } from '../_shared/esm/BtIconArrowAltRight-VH6RTTnL.mjs';
|
|
@@ -10,10 +10,10 @@ var LinkTile = function (_a) {
|
|
|
10
10
|
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"]);
|
|
11
11
|
var Component = href ? "a" : "div";
|
|
12
12
|
var linkProps = href ? { href: href } : {};
|
|
13
|
-
return (
|
|
14
|
-
|
|
15
|
-
showIcon && (
|
|
16
|
-
|
|
13
|
+
return (React__default.createElement(Component, __assign({ className: classNames(styles["link-tile"], className) }, linkProps, props), text && (React__default.createElement("div", { className: styles["link-tile-content"] },
|
|
14
|
+
React__default.createElement("span", { className: styles["link-tile-text"] }, text),
|
|
15
|
+
showIcon && (React__default.createElement("span", { className: styles["link-tile-icon"] },
|
|
16
|
+
React__default.createElement(Icon, { icon: BtIconArrowAltRight, size: 32 })))))));
|
|
17
17
|
};
|
|
18
18
|
|
|
19
19
|
export { LinkTile };
|
package/lib/LinkTile/styles.css
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
.LinkTile-module_link-tile__xVUP3{box-sizing:border-box;display:flex;flex-direction:column;justify-content:center;align-items:center;width:306px;height:
|
|
1
|
+
.LinkTile-module_link-tile__xVUP3{box-sizing:border-box;display:flex;flex-direction:column;justify-content:center;align-items:center;width:100%;max-width:306px;height:144px;min-height:144px;max-height:144px;border:var(--sem-border-width-xxs) solid var(--sem-color-border-secondary-light-minimal);border-radius:var(--sem-border-radius-xl);padding:var(--sem-space-padding-110) var(--sem-space-padding-70) var(--sem-space-padding-110) var(--sem-space-padding-110);background:var(--sem-color-bg-secondary-light-default);text-decoration:none;cursor:pointer;transition:border-color 0.2s ease;flex:none;align-self:stretch;position:relative;overflow:hidden;flex-grow:1}.LinkTile-module_link-tile-content__H-QN8{display:flex;flex-direction:row;justify-content:center;align-items:center;gap:var(--sem-space-padding-40);width:100%;min-height:48px;flex:none;align-self:stretch}.LinkTile-module_link-tile-icon__kTMfH{display:flex;width:32px;height:32px;color:var(--sem-color-fg-primary-light-default);transition:color 0.2s ease;flex:none;flex-shrink:0;order:1}.LinkTile-module_link-tile-text__0K6zf{font-family:var(--sem-font-family-heading);font-size:var(--sem-font-size-100);font-weight:var(--sem-font-weight-semi);line-height:var(--sem-line-height-base-scale-xs);letter-spacing:0;color:var(--sem-color-fg-primary-light-default);transition:color 0.2s ease;flex:1;order:0}.LinkTile-module_link-tile-icon__kTMfH svg,.LinkTile-module_link-tile__xVUP3 .LinkTile-module_link-tile-content__H-QN8 svg{color:inherit;transition:color 0.2s ease}.LinkTile-module_link-tile__xVUP3[\:not-has\(svg\)]{padding:var(--sem-space-padding-110)}.LinkTile-module_link-tile__xVUP3:not(:has(svg)){padding:var(--sem-space-padding-110)}.LinkTile-module_link-tile__xVUP3:active{border-radius:var(--sem-border-radius-xl)}@media (min-width:1024px){.LinkTile-module_link-tile__xVUP3{padding:var(--sem-space-padding-110) var(--sem-space-padding-70) var(--sem-space-padding-110) var(--sem-space-padding-110)}}.LinkTile-module_link-tile__xVUP3:hover{border-color:transparent;box-shadow:inset 0 0 0 2px var(--button-v2-colors-light-text-hover)}.LinkTile-module_link-tile__xVUP3:hover .LinkTile-module_link-tile-text__0K6zf{color:var(--button-v2-colors-light-text-hover)}.LinkTile-module_link-tile__xVUP3:hover .LinkTile-module_link-tile-icon__kTMfH{color:var(--button-v2-colors-light-text-hover)}
|
|
@@ -1,11 +1,12 @@
|
|
|
1
1
|
'use strict';
|
|
2
2
|
|
|
3
|
-
var
|
|
3
|
+
var tslib_es6 = require('../_shared/cjs/tslib.es6-BxB9I209.cjs');
|
|
4
4
|
var React = require('react');
|
|
5
5
|
var index = require('../_shared/cjs/index-Bp6Dd2i1.cjs');
|
|
6
|
+
var filterAttrs = require('../_shared/cjs/filter-attrs-BizjMsy0.cjs');
|
|
6
7
|
var useMediaQuery = require('@arc-ui/components/use-media-query');
|
|
7
|
-
var index_es = require('../_shared/cjs/index.es-
|
|
8
|
-
var SectionHeading = require('../_shared/cjs/SectionHeading-
|
|
8
|
+
var index_es = require('../_shared/cjs/index.es-B0J3cvrY.cjs');
|
|
9
|
+
var SectionHeading = require('../_shared/cjs/SectionHeading-DeSFM0HV.cjs');
|
|
9
10
|
var ButtonV2 = require('@arc-ui/components/ButtonV2');
|
|
10
11
|
var InformationCard = require('@arc-ui/components/InformationCard');
|
|
11
12
|
var VerticalSpace = require('@arc-ui/components/VerticalSpace');
|
|
@@ -20,7 +21,7 @@ var styles = {"product-navigation-grid":"ProductNavigation-module_product-naviga
|
|
|
20
21
|
* Use `ProductNavigation` to give a collection of product information cards collected within a grid that has optional show/hide capability
|
|
21
22
|
*/
|
|
22
23
|
var ProductNavigation = function (_a) {
|
|
23
|
-
var heading = _a.heading, id = _a.id, headingLevel = _a.headingLevel, isHeadingWordWrap = _a.isHeadingWordWrap, content = _a.content, _b = _a.hideButton, hideButton = _b === void 0 ? false : _b, productList = _a.productList, _c = _a.defaultExpanded, defaultExpanded = _c === void 0 ? false : _c, minHeight = _a.minHeight, _d = _a.cardsToDisplay, cardsToDisplay = _d === void 0 ? 3 : _d, _e = _a.listIncrement, listIncrement = _e === void 0 ? 6 : _e, onClickMore = _a.onClickMore, onClickLess = _a.onClickLess, _f = _a.hideShowLess, hideShowLess = _f === void 0 ? false : _f, isLoading = _a.isLoading, image = _a.image, props =
|
|
24
|
+
var heading = _a.heading, id = _a.id, headingLevel = _a.headingLevel, isHeadingWordWrap = _a.isHeadingWordWrap, content = _a.content, _b = _a.hideButton, hideButton = _b === void 0 ? false : _b, productList = _a.productList, _c = _a.defaultExpanded, defaultExpanded = _c === void 0 ? false : _c, minHeight = _a.minHeight, _d = _a.cardsToDisplay, cardsToDisplay = _d === void 0 ? 3 : _d, _e = _a.listIncrement, listIncrement = _e === void 0 ? 6 : _e, onClickMore = _a.onClickMore, onClickLess = _a.onClickLess, _f = _a.hideShowLess, hideShowLess = _f === void 0 ? false : _f, isLoading = _a.isLoading, image = _a.image, props = tslib_es6.__rest(_a, ["heading", "id", "headingLevel", "isHeadingWordWrap", "content", "hideButton", "productList", "defaultExpanded", "minHeight", "cardsToDisplay", "listIncrement", "onClickMore", "onClickLess", "hideShowLess", "isLoading", "image"]);
|
|
24
25
|
var _g = React.useState(false), hideLessButton = _g[0], setHideLessButton = _g[1];
|
|
25
26
|
var _h = React.useState(cardsToDisplay), skipLinkCard = _h[0], setSkipLinkCard = _h[1];
|
|
26
27
|
var _j = React.useState(productList.slice(0, cardsToDisplay)), displayList = _j[0], setDisplayList = _j[1];
|
|
@@ -56,12 +57,12 @@ var ProductNavigation = function (_a) {
|
|
|
56
57
|
}
|
|
57
58
|
};
|
|
58
59
|
var isMinWidthArcBreakpointS = useMediaQuery.useMediaQuery("(min-width: ".concat(index_es.ArcSizeBreakpointsS, ")"));
|
|
59
|
-
return (React.createElement("div",
|
|
60
|
+
return (React.createElement("div", tslib_es6.__assign({}, filterAttrs.filterAttrs(props)),
|
|
60
61
|
React.createElement(SectionHeading.SectionHeading, { isPadded: true, id: id, "data-testid": "ProductNavigation-header", heading: heading, headingLevel: headingLevel, isHeadingWordWrap: isHeadingWordWrap, content: content, image: image }),
|
|
61
62
|
React.createElement("ul", { className: index.classNames(styles["product-navigation-grid"]) }, displayList === null || displayList === void 0 ? void 0 : displayList.map(function (cardProps, i) {
|
|
62
63
|
var _a;
|
|
63
64
|
return (React.createElement("li", { key: "displayList-".concat(i), tabIndex: -1, ref: i === skipLinkCard ? cardRef : undefined, "data-cy": "list-item-".concat(i) },
|
|
64
|
-
React.createElement(InformationCard.InformationCard,
|
|
65
|
+
React.createElement(InformationCard.InformationCard, tslib_es6.__assign({}, cardProps, { minHeight: minHeight !== null && minHeight !== void 0 ? minHeight : cardProps.minHeight, headingLevel: (_a = cardProps.headingLevel) !== null && _a !== void 0 ? _a : "2" }))));
|
|
65
66
|
})),
|
|
66
67
|
React.createElement(VerticalSpace.VerticalSpace, { size: "40" }),
|
|
67
68
|
React.createElement("div", { style: { display: "flex" } },
|
|
@@ -1,9 +1,10 @@
|
|
|
1
|
-
import { _ as __rest, a as __assign
|
|
2
|
-
import
|
|
1
|
+
import { _ as __rest, a as __assign } from '../_shared/esm/tslib.es6-BVXMhEem.mjs';
|
|
2
|
+
import React__default, { useState, useRef, useEffect } from 'react';
|
|
3
3
|
import { c as classNames } from '../_shared/esm/index-BfTCfPZ1.mjs';
|
|
4
|
+
import { f as filterAttrs } from '../_shared/esm/filter-attrs-DZ7RCEZm.mjs';
|
|
4
5
|
import { useMediaQuery } from '@arc-ui/components/use-media-query';
|
|
5
|
-
import { A as ArcSizeBreakpointsS } from '../_shared/esm/index.es-
|
|
6
|
-
import { S as SectionHeading } from '../_shared/esm/SectionHeading-
|
|
6
|
+
import { A as ArcSizeBreakpointsS } from '../_shared/esm/index.es-DraZ-qKh.mjs';
|
|
7
|
+
import { S as SectionHeading } from '../_shared/esm/SectionHeading-DSwsdNSp.mjs';
|
|
7
8
|
import { ButtonV2 } from '@arc-ui/components/ButtonV2';
|
|
8
9
|
import { InformationCard } from '@arc-ui/components/InformationCard';
|
|
9
10
|
import { VerticalSpace } from '@arc-ui/components/VerticalSpace';
|
|
@@ -54,24 +55,24 @@ var ProductNavigation = function (_a) {
|
|
|
54
55
|
}
|
|
55
56
|
};
|
|
56
57
|
var isMinWidthArcBreakpointS = useMediaQuery("(min-width: ".concat(ArcSizeBreakpointsS, ")"));
|
|
57
|
-
return (
|
|
58
|
-
|
|
59
|
-
|
|
58
|
+
return (React__default.createElement("div", __assign({}, filterAttrs(props)),
|
|
59
|
+
React__default.createElement(SectionHeading, { isPadded: true, id: id, "data-testid": "ProductNavigation-header", heading: heading, headingLevel: headingLevel, isHeadingWordWrap: isHeadingWordWrap, content: content, image: image }),
|
|
60
|
+
React__default.createElement("ul", { className: classNames(styles["product-navigation-grid"]) }, displayList === null || displayList === void 0 ? void 0 : displayList.map(function (cardProps, i) {
|
|
60
61
|
var _a;
|
|
61
|
-
return (
|
|
62
|
-
|
|
62
|
+
return (React__default.createElement("li", { key: "displayList-".concat(i), tabIndex: -1, ref: i === skipLinkCard ? cardRef : undefined, "data-cy": "list-item-".concat(i) },
|
|
63
|
+
React__default.createElement(InformationCard, __assign({}, cardProps, { minHeight: minHeight !== null && minHeight !== void 0 ? minHeight : cardProps.minHeight, headingLevel: (_a = cardProps.headingLevel) !== null && _a !== void 0 ? _a : "2" }))));
|
|
63
64
|
})),
|
|
64
|
-
|
|
65
|
-
|
|
66
|
-
!hideButton && !hideLessButton && (
|
|
65
|
+
React__default.createElement(VerticalSpace, { size: "40" }),
|
|
66
|
+
React__default.createElement("div", { style: { display: "flex" } },
|
|
67
|
+
!hideButton && !hideLessButton && (React__default.createElement(ButtonV2, { label: displayList.length < productList.length
|
|
67
68
|
? "Show more"
|
|
68
69
|
: "Show less", buttonStyle: "secondary", onClick: clickController, isFullWidth: isMinWidthArcBreakpointS ? false : true, isLoading: isLoading })),
|
|
69
|
-
displayList.length > cardsToDisplay && (
|
|
70
|
-
|
|
71
|
-
|
|
72
|
-
|
|
73
|
-
|
|
74
|
-
|
|
70
|
+
displayList.length > cardsToDisplay && (React__default.createElement(React__default.Fragment, null,
|
|
71
|
+
React__default.createElement("div", { id: "skip-link", className: classNames(styles["productNavigation-skipLink"]), tabIndex: -1 },
|
|
72
|
+
React__default.createElement(ButtonV2, { label: "Move to first new card", buttonStyle: "primary", onClick: moveFocus, isFullWidth: isMinWidthArcBreakpointS ? false : true })))),
|
|
73
|
+
React__default.createElement(VisuallyHidden, null,
|
|
74
|
+
React__default.createElement("div", { "aria-live": "polite", id: "aria-live-region", "aria-atomic": true },
|
|
75
|
+
React__default.createElement("p", null,
|
|
75
76
|
"Total products listed ",
|
|
76
77
|
displayList.length,
|
|
77
78
|
". Total products hidden",
|
|
@@ -1,14 +1,15 @@
|
|
|
1
1
|
'use strict';
|
|
2
2
|
|
|
3
|
-
var
|
|
3
|
+
var tslib_es6 = require('../_shared/cjs/tslib.es6-BxB9I209.cjs');
|
|
4
4
|
var React = require('react');
|
|
5
5
|
var index = require('../_shared/cjs/index-Bp6Dd2i1.cjs');
|
|
6
|
-
var index_es = require('../_shared/cjs/index.es-
|
|
6
|
+
var index_es = require('../_shared/cjs/index.es-B0J3cvrY.cjs');
|
|
7
7
|
var Carousel = require('@arc-ui/components/Carousel');
|
|
8
8
|
var Heading = require('@arc-ui/components/Heading');
|
|
9
9
|
var useMediaQuery = require('@arc-ui/components/use-media-query');
|
|
10
|
-
var SectionHeading = require('../_shared/cjs/SectionHeading-
|
|
10
|
+
var SectionHeading = require('../_shared/cjs/SectionHeading-DeSFM0HV.cjs');
|
|
11
11
|
var MediaCard = require('@arc-ui/components/MediaCard');
|
|
12
|
+
var filterAttrs = require('../_shared/cjs/filter-attrs-BizjMsy0.cjs');
|
|
12
13
|
var ImpactCard = require('@arc-ui/components/ImpactCard');
|
|
13
14
|
var InformationCard = require('@arc-ui/components/InformationCard');
|
|
14
15
|
var TypographyCard = require('@arc-ui/components/TypographyCard');
|
|
@@ -24,7 +25,7 @@ var styles = {"PromoListing":"PromoListing-module_PromoListing__6ensv","carousel
|
|
|
24
25
|
* Use `PromoListing` to give supporting information about a page or proposition in the form of the card components (`ImpactCard`, `InformationCard`, `MediaCard` and `TypographyCard`).
|
|
25
26
|
*/
|
|
26
27
|
var PromoListing = function (_a) {
|
|
27
|
-
var heading = _a.heading, content = _a.content, id = _a.id, _b = _a.isCarousel, isCarousel = _b === void 0 ? false : _b, cards = _a.cards, headingLevel = _a.headingLevel, isHeadingWordWrap = _a.isHeadingWordWrap, _c = _a.columns, columns = _c === void 0 ? "2" : _c, _d = _a.button, button = _d === void 0 ? { buttonStyle: "secondary" } : _d, overlineHeadingLevel = _a.overlineHeadingLevel, overlineLabel = _a.overlineLabel, props =
|
|
28
|
+
var heading = _a.heading, content = _a.content, id = _a.id, _b = _a.isCarousel, isCarousel = _b === void 0 ? false : _b, cards = _a.cards, headingLevel = _a.headingLevel, isHeadingWordWrap = _a.isHeadingWordWrap, _c = _a.columns, columns = _c === void 0 ? "2" : _c, _d = _a.button, button = _d === void 0 ? { buttonStyle: "secondary" } : _d, overlineHeadingLevel = _a.overlineHeadingLevel, overlineLabel = _a.overlineLabel, props = tslib_es6.__rest(_a, ["heading", "content", "id", "isCarousel", "cards", "headingLevel", "isHeadingWordWrap", "columns", "button", "overlineHeadingLevel", "overlineLabel"]);
|
|
28
29
|
var componentId = React.useId();
|
|
29
30
|
var isMinWidthArcBreakpointL = useMediaQuery.useMediaQuery("(min-width: ".concat(index_es.ArcSizeBreakpointsL, ")"));
|
|
30
31
|
var isMinWidthArcBreakpointM = useMediaQuery.useMediaQuery("(min-width: ".concat(index_es.ArcSizeBreakpointsM, ")"));
|
|
@@ -54,15 +55,15 @@ var PromoListing = function (_a) {
|
|
|
54
55
|
};
|
|
55
56
|
var getCard = function (card) {
|
|
56
57
|
var CardComponent = CARD_COMPONENTS[card.type];
|
|
57
|
-
return React.createElement(CardComponent,
|
|
58
|
+
return React.createElement(CardComponent, tslib_es6.__assign({}, card, commonProps));
|
|
58
59
|
};
|
|
59
|
-
return (React.createElement("div",
|
|
60
|
+
return (React.createElement("div", tslib_es6.__assign({ className: styles.PromoListing }, filterAttrs.filterAttrs(props)),
|
|
60
61
|
overlineLabel && (React.createElement(React.Fragment, null,
|
|
61
62
|
React.createElement(Heading.Heading, { level: overlineHeadingLevel, fontStyle: "overline" }, overlineLabel),
|
|
62
63
|
React.createElement(VerticalSpace.VerticalSpace, { size: "12" }))),
|
|
63
64
|
React.createElement(SectionHeading.SectionHeading, { isPadded: true, id: id, "data-testid": "PromoListing-header", heading: heading, isHeadingWordWrap: isHeadingWordWrap, headingLevel: headingLevel, content: content }),
|
|
64
65
|
button.label && (React.createElement(React.Fragment, null,
|
|
65
|
-
React.createElement(ButtonV2.ButtonV2,
|
|
66
|
+
React.createElement(ButtonV2.ButtonV2, tslib_es6.__assign({}, button, { icon: button.buttonStyle == "compact" ? BtIconArrowRightFill.BtIconArrowRightFill : undefined, size: "m" })),
|
|
66
67
|
React.createElement(VerticalSpace.VerticalSpace, { size: "40" }))),
|
|
67
68
|
isCarousel && !isMinWidthArcBreakpointL ? (React.createElement("div", { className: styles.promolistingCarouselWrapper },
|
|
68
69
|
React.createElement(Carousel.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.cardWrapperCarousel) }, getCard(card))); })))) : (React.createElement("ul", { className: index.classNames(styles.cardGrid, styles["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) },
|
|
@@ -1,12 +1,13 @@
|
|
|
1
|
-
import { _ as __rest, a as __assign
|
|
2
|
-
import
|
|
1
|
+
import { _ as __rest, a as __assign } from '../_shared/esm/tslib.es6-BVXMhEem.mjs';
|
|
2
|
+
import React__default, { useId } from 'react';
|
|
3
3
|
import { c as classNames } from '../_shared/esm/index-BfTCfPZ1.mjs';
|
|
4
|
-
import { a as ArcSizeBreakpointsL, b as ArcSizeBreakpointsM } from '../_shared/esm/index.es-
|
|
4
|
+
import { a as ArcSizeBreakpointsL, b as ArcSizeBreakpointsM } from '../_shared/esm/index.es-DraZ-qKh.mjs';
|
|
5
5
|
import { Carousel } from '@arc-ui/components/Carousel';
|
|
6
6
|
import { Heading } from '@arc-ui/components/Heading';
|
|
7
7
|
import { useMediaQuery } from '@arc-ui/components/use-media-query';
|
|
8
|
-
import { S as SectionHeading } from '../_shared/esm/SectionHeading-
|
|
8
|
+
import { S as SectionHeading } from '../_shared/esm/SectionHeading-DSwsdNSp.mjs';
|
|
9
9
|
import { MediaCard } from '@arc-ui/components/MediaCard';
|
|
10
|
+
import { f as filterAttrs } from '../_shared/esm/filter-attrs-DZ7RCEZm.mjs';
|
|
10
11
|
import { ImpactCard } from '@arc-ui/components/ImpactCard';
|
|
11
12
|
import { InformationCard } from '@arc-ui/components/InformationCard';
|
|
12
13
|
import { TypographyCard } from '@arc-ui/components/TypographyCard';
|
|
@@ -52,19 +53,19 @@ var PromoListing = function (_a) {
|
|
|
52
53
|
};
|
|
53
54
|
var getCard = function (card) {
|
|
54
55
|
var CardComponent = CARD_COMPONENTS[card.type];
|
|
55
|
-
return
|
|
56
|
+
return React__default.createElement(CardComponent, __assign({}, card, commonProps));
|
|
56
57
|
};
|
|
57
|
-
return (
|
|
58
|
-
overlineLabel && (
|
|
59
|
-
|
|
60
|
-
|
|
61
|
-
|
|
62
|
-
button.label && (
|
|
63
|
-
|
|
64
|
-
|
|
65
|
-
isCarousel && !isMinWidthArcBreakpointL ? (
|
|
66
|
-
|
|
67
|
-
|
|
58
|
+
return (React__default.createElement("div", __assign({ className: styles.PromoListing }, filterAttrs(props)),
|
|
59
|
+
overlineLabel && (React__default.createElement(React__default.Fragment, null,
|
|
60
|
+
React__default.createElement(Heading, { level: overlineHeadingLevel, fontStyle: "overline" }, overlineLabel),
|
|
61
|
+
React__default.createElement(VerticalSpace, { size: "12" }))),
|
|
62
|
+
React__default.createElement(SectionHeading, { isPadded: true, id: id, "data-testid": "PromoListing-header", heading: heading, isHeadingWordWrap: isHeadingWordWrap, headingLevel: headingLevel, content: content }),
|
|
63
|
+
button.label && (React__default.createElement(React__default.Fragment, null,
|
|
64
|
+
React__default.createElement(ButtonV2, __assign({}, button, { icon: button.buttonStyle == "compact" ? BtIconArrowRightFill : undefined, size: "m" })),
|
|
65
|
+
React__default.createElement(VerticalSpace, { size: "40" }))),
|
|
66
|
+
isCarousel && !isMinWidthArcBreakpointL ? (React__default.createElement("div", { className: styles.promolistingCarouselWrapper },
|
|
67
|
+
React__default.createElement(Carousel, { overflow: "visible", itemsPerSlide: 1, behavior: "adaptive", withGutter: false }, cards === null || cards === void 0 ? void 0 : cards.map(function (card, i) { return (React__default.createElement("div", { key: "promolist-carousel-card-".concat(componentId, "-").concat(i), className: (styles.cardWrapperCarousel) }, getCard(card))); })))) : (React__default.createElement("ul", { className: classNames(styles.cardGrid, styles["columns-".concat(columns)]) }, cards === null || cards === void 0 ? void 0 : cards.map(function (card, index) { return (React__default.createElement("li", { key: "promolist-card--".concat(componentId, "-").concat(index) },
|
|
68
|
+
React__default.createElement("div", { "data-testid": "promoList-card".concat(index), className: styles.cardWrapper }, getCard(card)))); })))));
|
|
68
69
|
};
|
|
69
70
|
|
|
70
71
|
export { PromoListing };
|
|
@@ -1,9 +1,10 @@
|
|
|
1
1
|
'use strict';
|
|
2
2
|
|
|
3
|
-
var
|
|
3
|
+
var tslib_es6 = require('../_shared/cjs/tslib.es6-BxB9I209.cjs');
|
|
4
4
|
var React = require('react');
|
|
5
|
-
var SectionHeading = require('../_shared/cjs/SectionHeading-
|
|
6
|
-
var
|
|
5
|
+
var SectionHeading = require('../_shared/cjs/SectionHeading-DeSFM0HV.cjs');
|
|
6
|
+
var filterAttrs = require('../_shared/cjs/filter-attrs-BizjMsy0.cjs');
|
|
7
|
+
var ThumbnailSignpost = require('../_shared/cjs/ThumbnailSignpost-GkOiwt-Z.cjs');
|
|
7
8
|
require('../_shared/cjs/index-Bp6Dd2i1.cjs');
|
|
8
9
|
require('@arc-ui/components/Text');
|
|
9
10
|
require('@arc-ui/components/VerticalSpace');
|
|
@@ -17,11 +18,11 @@ var styles = {"PromoListingThumbnailSignpost":"PromoListingThumbnailSignpost-mod
|
|
|
17
18
|
* Use `PromoListingThumbnailSignpost` to give supporting information about a page or proposition in the form of the ThumbnailSignposts components.
|
|
18
19
|
*/
|
|
19
20
|
var PromoListingThumbnailSignpost = function (_a) {
|
|
20
|
-
var _b = _a.isPadded, isPadded = _b === void 0 ? true : _b, heading = _a.heading, content = _a.content, headingLevel = _a.headingLevel, thumbnailList = _a.thumbnailList, props =
|
|
21
|
-
return (React.createElement("div",
|
|
22
|
-
React.createElement(SectionHeading.SectionHeading, { isPadded: isPadded, "data-testid": "PromoListingThumbnailSignpost-header", heading: heading, headingLevel: headingLevel, content: content }),
|
|
21
|
+
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 = tslib_es6.__rest(_a, ["isPadded", "heading", "content", "headingLevel", "thumbnailList", "isHeadingWordWrap"]);
|
|
22
|
+
return (React.createElement("div", tslib_es6.__assign({ className: styles.PromoListingThumbnailSignpost }, filterAttrs.filterAttrs(props)),
|
|
23
|
+
React.createElement(SectionHeading.SectionHeading, { isPadded: isPadded, "data-testid": "PromoListingThumbnailSignpost-header", heading: heading, headingLevel: headingLevel, content: content, isHeadingWordWrap: isHeadingWordWrap }),
|
|
23
24
|
React.createElement("ul", { className: styles.list }, thumbnailList.map(function (thumbnail, index) { return (React.createElement("li", { key: index },
|
|
24
|
-
React.createElement(ThumbnailSignpost.ThumbnailSignpost,
|
|
25
|
+
React.createElement(ThumbnailSignpost.ThumbnailSignpost, tslib_es6.__assign({}, thumbnail)))); }))));
|
|
25
26
|
};
|
|
26
27
|
|
|
27
28
|
exports.PromoListingThumbnailSignpost = PromoListingThumbnailSignpost;
|
|
@@ -1,7 +1,8 @@
|
|
|
1
|
-
import { _ as __rest, a as __assign
|
|
2
|
-
import
|
|
3
|
-
import { S as SectionHeading } from '../_shared/esm/SectionHeading-
|
|
4
|
-
import {
|
|
1
|
+
import { _ as __rest, a as __assign } from '../_shared/esm/tslib.es6-BVXMhEem.mjs';
|
|
2
|
+
import React__default from 'react';
|
|
3
|
+
import { S as SectionHeading } from '../_shared/esm/SectionHeading-DSwsdNSp.mjs';
|
|
4
|
+
import { f as filterAttrs } from '../_shared/esm/filter-attrs-DZ7RCEZm.mjs';
|
|
5
|
+
import { T as ThumbnailSignpost } from '../_shared/esm/ThumbnailSignpost-BtaHAB0h.mjs';
|
|
5
6
|
import '../_shared/esm/index-BfTCfPZ1.mjs';
|
|
6
7
|
import '@arc-ui/components/Text';
|
|
7
8
|
import '@arc-ui/components/VerticalSpace';
|
|
@@ -15,11 +16,11 @@ var styles = {"PromoListingThumbnailSignpost":"PromoListingThumbnailSignpost-mod
|
|
|
15
16
|
* Use `PromoListingThumbnailSignpost` to give supporting information about a page or proposition in the form of the ThumbnailSignposts components.
|
|
16
17
|
*/
|
|
17
18
|
var PromoListingThumbnailSignpost = function (_a) {
|
|
18
|
-
var _b = _a.isPadded, isPadded = _b === void 0 ? true : _b, heading = _a.heading, content = _a.content, headingLevel = _a.headingLevel, thumbnailList = _a.thumbnailList, props = __rest(_a, ["isPadded", "heading", "content", "headingLevel", "thumbnailList"]);
|
|
19
|
-
return (
|
|
20
|
-
|
|
21
|
-
|
|
22
|
-
|
|
19
|
+
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"]);
|
|
20
|
+
return (React__default.createElement("div", __assign({ className: styles.PromoListingThumbnailSignpost }, filterAttrs(props)),
|
|
21
|
+
React__default.createElement(SectionHeading, { isPadded: isPadded, "data-testid": "PromoListingThumbnailSignpost-header", heading: heading, headingLevel: headingLevel, content: content, isHeadingWordWrap: isHeadingWordWrap }),
|
|
22
|
+
React__default.createElement("ul", { className: styles.list }, thumbnailList.map(function (thumbnail, index) { return (React__default.createElement("li", { key: index },
|
|
23
|
+
React__default.createElement(ThumbnailSignpost, __assign({}, thumbnail)))); }))));
|
|
23
24
|
};
|
|
24
25
|
|
|
25
26
|
export { PromoListingThumbnailSignpost };
|
package/lib/Quote/Quote.cjs
CHANGED
|
@@ -1,9 +1,10 @@
|
|
|
1
1
|
'use strict';
|
|
2
2
|
|
|
3
|
-
var
|
|
3
|
+
var tslib_es6 = require('../_shared/cjs/tslib.es6-BxB9I209.cjs');
|
|
4
4
|
var React = require('react');
|
|
5
5
|
var index = require('../_shared/cjs/index-Bp6Dd2i1.cjs');
|
|
6
|
-
var
|
|
6
|
+
var filterAttrs = require('../_shared/cjs/filter-attrs-BizjMsy0.cjs');
|
|
7
|
+
var Author = require('../_shared/cjs/Author-D4dKNQem.cjs');
|
|
7
8
|
require('@arc-ui/components/Grid');
|
|
8
9
|
require('@arc-ui/components/Avatar');
|
|
9
10
|
require('@arc-ui/components/Heading');
|
|
@@ -14,13 +15,13 @@ var styles = {"blockQuote":"Quote-module_blockQuote__STj-z","quoteContent":"Quot
|
|
|
14
15
|
/**
|
|
15
16
|
* 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.*/
|
|
16
17
|
var Quote = function (_a) {
|
|
17
|
-
var author = _a.author, _b = _a.styling, styling = _b === void 0 ? "Default" : _b, content = _a.content, citeUrl = _a.citeUrl, props =
|
|
18
|
-
return (React.createElement("div",
|
|
18
|
+
var author = _a.author, _b = _a.styling, styling = _b === void 0 ? "Default" : _b, content = _a.content, citeUrl = _a.citeUrl, props = tslib_es6.__rest(_a, ["author", "styling", "content", "citeUrl"]);
|
|
19
|
+
return (React.createElement("div", tslib_es6.__assign({ className: "community-component--quote", "data-testid": "quote-test" }, filterAttrs.filterAttrs(props)),
|
|
19
20
|
React.createElement("blockquote", { "data-testid": "style-test", className: index.classNames(styles.blockQuote, styles["quote".concat(styling)]), cite: citeUrl },
|
|
20
21
|
React.createElement("svg", { xmlns: "http://www.w3.org/2000/svg", viewBox: "0 0 100 77", className: styles.quoteIcon, "aria-hidden": "true" },
|
|
21
22
|
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" })),
|
|
22
23
|
React.createElement("p", { className: styles.quoteContent }, content)),
|
|
23
|
-
author && React.createElement(Author.Author,
|
|
24
|
+
author && React.createElement(Author.Author, tslib_es6.__assign({}, author))));
|
|
24
25
|
};
|
|
25
26
|
|
|
26
27
|
exports.Quote = Quote;
|
package/lib/Quote/Quote.mjs
CHANGED
|
@@ -1,7 +1,8 @@
|
|
|
1
|
-
import { _ as __rest, a as __assign
|
|
2
|
-
import
|
|
1
|
+
import { _ as __rest, a as __assign } from '../_shared/esm/tslib.es6-BVXMhEem.mjs';
|
|
2
|
+
import React__default from 'react';
|
|
3
3
|
import { c as classNames } from '../_shared/esm/index-BfTCfPZ1.mjs';
|
|
4
|
-
import {
|
|
4
|
+
import { f as filterAttrs } from '../_shared/esm/filter-attrs-DZ7RCEZm.mjs';
|
|
5
|
+
import { A as Author } from '../_shared/esm/Author-CLMgH9ES.mjs';
|
|
5
6
|
import '@arc-ui/components/Grid';
|
|
6
7
|
import '@arc-ui/components/Avatar';
|
|
7
8
|
import '@arc-ui/components/Heading';
|
|
@@ -13,12 +14,12 @@ var styles = {"blockQuote":"Quote-module_blockQuote__STj-z","quoteContent":"Quot
|
|
|
13
14
|
* 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.*/
|
|
14
15
|
var Quote = function (_a) {
|
|
15
16
|
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"]);
|
|
16
|
-
return (
|
|
17
|
-
|
|
18
|
-
|
|
19
|
-
|
|
20
|
-
|
|
21
|
-
author &&
|
|
17
|
+
return (React__default.createElement("div", __assign({ className: "community-component--quote", "data-testid": "quote-test" }, filterAttrs(props)),
|
|
18
|
+
React__default.createElement("blockquote", { "data-testid": "style-test", className: classNames(styles.blockQuote, styles["quote".concat(styling)]), cite: citeUrl },
|
|
19
|
+
React__default.createElement("svg", { xmlns: "http://www.w3.org/2000/svg", viewBox: "0 0 100 77", className: styles.quoteIcon, "aria-hidden": "true" },
|
|
20
|
+
React__default.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" })),
|
|
21
|
+
React__default.createElement("p", { className: styles.quoteContent }, content)),
|
|
22
|
+
author && React__default.createElement(Author, __assign({}, author))));
|
|
22
23
|
};
|
|
23
24
|
|
|
24
25
|
export { Quote };
|
|
@@ -1,9 +1,10 @@
|
|
|
1
1
|
'use strict';
|
|
2
2
|
|
|
3
|
-
var SectionHeading = require('../_shared/cjs/SectionHeading-
|
|
4
|
-
require('../_shared/cjs/
|
|
3
|
+
var SectionHeading = require('../_shared/cjs/SectionHeading-DeSFM0HV.cjs');
|
|
4
|
+
require('../_shared/cjs/tslib.es6-BxB9I209.cjs');
|
|
5
5
|
require('react');
|
|
6
6
|
require('../_shared/cjs/index-Bp6Dd2i1.cjs');
|
|
7
|
+
require('../_shared/cjs/filter-attrs-BizjMsy0.cjs');
|
|
7
8
|
require('@arc-ui/components/Text');
|
|
8
9
|
require('@arc-ui/components/VerticalSpace');
|
|
9
10
|
require('@arc-ui/components/Image');
|
|
@@ -1,7 +1,8 @@
|
|
|
1
|
-
export { S as SectionHeading } from '../_shared/esm/SectionHeading-
|
|
2
|
-
import '../_shared/esm/
|
|
1
|
+
export { S as SectionHeading } from '../_shared/esm/SectionHeading-DSwsdNSp.mjs';
|
|
2
|
+
import '../_shared/esm/tslib.es6-BVXMhEem.mjs';
|
|
3
3
|
import 'react';
|
|
4
4
|
import '../_shared/esm/index-BfTCfPZ1.mjs';
|
|
5
|
+
import '../_shared/esm/filter-attrs-DZ7RCEZm.mjs';
|
|
5
6
|
import '@arc-ui/components/Text';
|
|
6
7
|
import '@arc-ui/components/VerticalSpace';
|
|
7
8
|
import '@arc-ui/components/Image';
|
|
@@ -1,7 +1,8 @@
|
|
|
1
1
|
'use strict';
|
|
2
2
|
|
|
3
|
-
var
|
|
3
|
+
var tslib_es6 = require('../_shared/cjs/tslib.es6-BxB9I209.cjs');
|
|
4
4
|
var React = require('react');
|
|
5
|
+
var filterAttrs = require('../_shared/cjs/filter-attrs-BizjMsy0.cjs');
|
|
5
6
|
var Columns = require('@arc-ui/components/Columns');
|
|
6
7
|
var Rule = require('@arc-ui/components/Rule');
|
|
7
8
|
var Text = require('@arc-ui/components/Text');
|
|
@@ -9,7 +10,7 @@ var Align = require('@arc-ui/components/Align');
|
|
|
9
10
|
var Heading = require('@arc-ui/components/Heading');
|
|
10
11
|
var VerticalSpace = require('@arc-ui/components/VerticalSpace');
|
|
11
12
|
var Hidden = require('@arc-ui/components/Hidden');
|
|
12
|
-
var SectionHeading = require('../_shared/cjs/SectionHeading-
|
|
13
|
+
var SectionHeading = require('../_shared/cjs/SectionHeading-DeSFM0HV.cjs');
|
|
13
14
|
require('../_shared/cjs/index-Bp6Dd2i1.cjs');
|
|
14
15
|
require('@arc-ui/components/Image');
|
|
15
16
|
|
|
@@ -25,9 +26,9 @@ var getLinkProps = function (link) {
|
|
|
25
26
|
};
|
|
26
27
|
|
|
27
28
|
var Statistics = function (_a) {
|
|
28
|
-
var id = _a.id, isHeadingWordWrap = _a.isHeadingWordWrap, headingLevel = _a.headingLevel, heading = _a.heading, content = _a.content, statistics = _a.statistics, props =
|
|
29
|
+
var id = _a.id, isHeadingWordWrap = _a.isHeadingWordWrap, headingLevel = _a.headingLevel, heading = _a.heading, content = _a.content, statistics = _a.statistics, props = tslib_es6.__rest(_a, ["id", "isHeadingWordWrap", "headingLevel", "heading", "content", "statistics"]);
|
|
29
30
|
var componentId = React.useId();
|
|
30
|
-
return (React.createElement(Columns.Columns,
|
|
31
|
+
return (React.createElement(Columns.Columns, tslib_es6.__assign({ isGutterless: true }, filterAttrs.filterAttrs(props)),
|
|
31
32
|
React.createElement(Columns.ColumnsCol, { spanM: 9 },
|
|
32
33
|
React.createElement(SectionHeading.SectionHeading, { id: id, heading: heading, isHeadingWordWrap: isHeadingWordWrap, headingLevel: headingLevel, content: content })),
|
|
33
34
|
React.createElement(Columns.ColumnsCol, { spanL: 9 },
|
|
@@ -50,7 +51,7 @@ var Statistics = function (_a) {
|
|
|
50
51
|
React.createElement(Text.Text, null, copy),
|
|
51
52
|
link && (React.createElement(React.Fragment, null,
|
|
52
53
|
React.createElement(VerticalSpace.VerticalSpace, { size: "12" }),
|
|
53
|
-
React.createElement("a",
|
|
54
|
+
React.createElement("a", tslib_es6.__assign({ href: link.href, "aria-label": link.ariaLabel }, getLinkProps(link)), link.text))),
|
|
54
55
|
source && (React.createElement(React.Fragment, null,
|
|
55
56
|
React.createElement(VerticalSpace.VerticalSpace, { size: "12" }),
|
|
56
57
|
React.createElement(Text.Text, { size: "xs" },
|
|
@@ -1,5 +1,6 @@
|
|
|
1
|
-
import { _ as __rest, a as __assign
|
|
2
|
-
import
|
|
1
|
+
import { _ as __rest, a as __assign } from '../_shared/esm/tslib.es6-BVXMhEem.mjs';
|
|
2
|
+
import React__default, { useId } from 'react';
|
|
3
|
+
import { f as filterAttrs } from '../_shared/esm/filter-attrs-DZ7RCEZm.mjs';
|
|
3
4
|
import { Columns, ColumnsCol } from '@arc-ui/components/Columns';
|
|
4
5
|
import { Rule } from '@arc-ui/components/Rule';
|
|
5
6
|
import { Text } from '@arc-ui/components/Text';
|
|
@@ -7,7 +8,7 @@ import { Align } from '@arc-ui/components/Align';
|
|
|
7
8
|
import { Heading } from '@arc-ui/components/Heading';
|
|
8
9
|
import { VerticalSpace } from '@arc-ui/components/VerticalSpace';
|
|
9
10
|
import { Hidden } from '@arc-ui/components/Hidden';
|
|
10
|
-
import { S as SectionHeading } from '../_shared/esm/SectionHeading-
|
|
11
|
+
import { S as SectionHeading } from '../_shared/esm/SectionHeading-DSwsdNSp.mjs';
|
|
11
12
|
import '../_shared/esm/index-BfTCfPZ1.mjs';
|
|
12
13
|
import '@arc-ui/components/Image';
|
|
13
14
|
|
|
@@ -25,36 +26,36 @@ var getLinkProps = function (link) {
|
|
|
25
26
|
var Statistics = function (_a) {
|
|
26
27
|
var id = _a.id, isHeadingWordWrap = _a.isHeadingWordWrap, headingLevel = _a.headingLevel, heading = _a.heading, content = _a.content, statistics = _a.statistics, props = __rest(_a, ["id", "isHeadingWordWrap", "headingLevel", "heading", "content", "statistics"]);
|
|
27
28
|
var componentId = useId();
|
|
28
|
-
return (
|
|
29
|
-
|
|
30
|
-
|
|
31
|
-
|
|
32
|
-
|
|
29
|
+
return (React__default.createElement(Columns, __assign({ isGutterless: true }, filterAttrs(props)),
|
|
30
|
+
React__default.createElement(ColumnsCol, { spanM: 9 },
|
|
31
|
+
React__default.createElement(SectionHeading, { id: id, heading: heading, isHeadingWordWrap: isHeadingWordWrap, headingLevel: headingLevel, content: content })),
|
|
32
|
+
React__default.createElement(ColumnsCol, { spanL: 9 },
|
|
33
|
+
React__default.createElement("ul", { className: styles.list }, statistics.map(function (_a, i) {
|
|
33
34
|
var stat = _a.stat, copy = _a.copy, link = _a.link, source = _a.source, sourceUrl = _a.sourceUrl;
|
|
34
|
-
return (
|
|
35
|
-
i !== 0 && (
|
|
36
|
-
|
|
37
|
-
|
|
38
|
-
|
|
39
|
-
|
|
40
|
-
|
|
41
|
-
|
|
42
|
-
|
|
43
|
-
|
|
44
|
-
|
|
45
|
-
|
|
46
|
-
|
|
47
|
-
|
|
48
|
-
|
|
49
|
-
link && (
|
|
50
|
-
|
|
51
|
-
|
|
52
|
-
source && (
|
|
53
|
-
|
|
54
|
-
|
|
55
|
-
|
|
56
|
-
sourceUrl && (
|
|
57
|
-
|
|
35
|
+
return (React__default.createElement("li", { key: "statistic-".concat(componentId, "-").concat(i) },
|
|
36
|
+
i !== 0 && (React__default.createElement(React__default.Fragment, null,
|
|
37
|
+
React__default.createElement(VerticalSpace, { size: "24", sizeS: "32", sizeXL: "40" }),
|
|
38
|
+
React__default.createElement(Rule, null),
|
|
39
|
+
React__default.createElement(VerticalSpace, { size: "24", sizeS: "32", sizeXL: "40" }))),
|
|
40
|
+
React__default.createElement(Columns, null,
|
|
41
|
+
React__default.createElement(ColumnsCol, { spanS: 6, spanM: 8 },
|
|
42
|
+
React__default.createElement(Align, { vertical: "center" },
|
|
43
|
+
React__default.createElement("div", { className: styles.statWrapper },
|
|
44
|
+
React__default.createElement(Heading, { color: "brand", size: "xxl" }, stat),
|
|
45
|
+
React__default.createElement(Hidden, { s: true, m: true, l: true, xl: true, xxl: true },
|
|
46
|
+
React__default.createElement(VerticalSpace, { size: "12" }))))),
|
|
47
|
+
React__default.createElement(ColumnsCol, { spanS: 6, spanM: 4 },
|
|
48
|
+
React__default.createElement(Align, { vertical: "center" },
|
|
49
|
+
React__default.createElement(Text, null, copy),
|
|
50
|
+
link && (React__default.createElement(React__default.Fragment, null,
|
|
51
|
+
React__default.createElement(VerticalSpace, { size: "12" }),
|
|
52
|
+
React__default.createElement("a", __assign({ href: link.href, "aria-label": link.ariaLabel }, getLinkProps(link)), link.text))),
|
|
53
|
+
source && (React__default.createElement(React__default.Fragment, null,
|
|
54
|
+
React__default.createElement(VerticalSpace, { size: "12" }),
|
|
55
|
+
React__default.createElement(Text, { size: "xs" },
|
|
56
|
+
React__default.createElement("span", { className: styles.mutedText }, source)))),
|
|
57
|
+
sourceUrl && (React__default.createElement(Text, { size: "xs" },
|
|
58
|
+
React__default.createElement("a", { className: styles.mutedText, href: sourceUrl }, sourceUrl))))))));
|
|
58
59
|
})))));
|
|
59
60
|
};
|
|
60
61
|
|
package/lib/Summary/Summary.cjs
CHANGED
|
@@ -1,21 +1,22 @@
|
|
|
1
1
|
'use strict';
|
|
2
2
|
|
|
3
|
-
var
|
|
3
|
+
var tslib_es6 = require('../_shared/cjs/tslib.es6-BxB9I209.cjs');
|
|
4
4
|
var React = require('react');
|
|
5
|
-
var index_es = require('../_shared/cjs/index.es-
|
|
5
|
+
var index_es = require('../_shared/cjs/index.es-B0J3cvrY.cjs');
|
|
6
6
|
var Heading = require('@arc-ui/components/Heading');
|
|
7
7
|
var Text = require('@arc-ui/components/Text');
|
|
8
8
|
var Box = require('@arc-ui/components/Box');
|
|
9
9
|
var Rule = require('@arc-ui/components/Rule');
|
|
10
10
|
var VerticalSpace = require('@arc-ui/components/VerticalSpace');
|
|
11
11
|
var useMediaQuery = require('@arc-ui/components/use-media-query');
|
|
12
|
+
var filterAttrs = require('../_shared/cjs/filter-attrs-BizjMsy0.cjs');
|
|
12
13
|
|
|
13
14
|
var styles = {"ruleContainer":"Summary-module_ruleContainer__ydWlG","row":"Summary-module_row__SKV--"};
|
|
14
15
|
|
|
15
16
|
var Summary = function (_a) {
|
|
16
|
-
var content = _a.content, _b = _a.noBorder, noBorder = _b === void 0 ? false : _b, _c = _a.headingLevel, headingLevel = _c === void 0 ? "3" : _c, props =
|
|
17
|
+
var content = _a.content, _b = _a.noBorder, noBorder = _b === void 0 ? false : _b, _c = _a.headingLevel, headingLevel = _c === void 0 ? "3" : _c, props = tslib_es6.__rest(_a, ["content", "noBorder", "headingLevel"]);
|
|
17
18
|
var isMinWidthArcBreakpointM = useMediaQuery.useMediaQuery("(min-width: ".concat(index_es.ArcSizeBreakpointsM, ")"));
|
|
18
|
-
return (React.createElement(Box.Box,
|
|
19
|
+
return (React.createElement(Box.Box, tslib_es6.__assign({ isBorderRadius: true }, (!noBorder ? { borderWidth: "thin" } : { elevationLevel: "1" }), { padding: "24" }, filterAttrs.filterAttrs(props)),
|
|
19
20
|
React.createElement("div", { className: styles.row }, content.map(function (_a, i) {
|
|
20
21
|
var heading = _a.heading, text = _a.text;
|
|
21
22
|
return (React.createElement(React.Fragment, null,
|