@arc-ui/components 11.21.1 → 11.22.0

package/dist/Filter/Filter.cjs.js

@@ -2,7 +2,7 @@
 
 Object.defineProperty(exports, '__esModule', { value: true });
 
-var Filter = require('../_shared/cjs/Filter-1bde635c.js');
+var Filter = require('../_shared/cjs/Filter-f4b73f5d.js');
 require('../_shared/cjs/filter-data-attrs-1c9a530c.js');
 require('react');
 require('../_shared/cjs/Surface-038db6e1.js');

package/dist/Filter/Filter.esm.js

@@ -1,4 +1,4 @@
-export { F as Filter } from '../_shared/esm/Filter-58a42358.js';
+export { F as Filter } from '../_shared/esm/Filter-ad254e3d.js';
 import '../_shared/esm/filter-data-attrs-ea8f4ed4.js';
 import 'react';
 import '../_shared/esm/Surface-0ca6817d.js';

package/dist/ImpactCard/ImpactCard.cjs.js

@@ -0,0 +1,41 @@
+'use strict';
+
+Object.defineProperty(exports, '__esModule', { value: true });
+
+var filterDataAttrs = require('../_shared/cjs/filter-data-attrs-1c9a530c.js');
+var React = require('react');
+var index = require('../_shared/cjs/index-9947ac13.js');
+var BtIconArrowRight_esm = require('../_shared/cjs/BtIconArrowRight.esm-50d96943.js');
+var CardFooter = require('../_shared/cjs/CardFooter-ff015d7d.js');
+var Image = require('../_shared/cjs/Image-e873b8fc.js');
+var Surface = require('../_shared/cjs/Surface-038db6e1.js');
+require('../_shared/cjs/suffix-modifier-64dcd338.js');
+require('../_shared/cjs/BtIconArrowRightFill.esm-435cf4bd.js');
+require('../_shared/cjs/Icon-b46897a3.js');
+
+function _interopDefaultLegacy (e) { return e && typeof e === 'object' && 'default' in e ? e : { 'default': e }; }
+
+var React__default = /*#__PURE__*/_interopDefaultLegacy(React);
+
+var ImpactCard = function (_a) {
+    var url = _a.url, onClick = _a.onClick, heading = _a.heading, img = _a.img, label = _a.label, minHeight = _a.minHeight, _b = _a.linkData, linkData = _b === void 0 ? {} : _b, _c = _a.pathway, pathway = _c === void 0 ? "light" : _c, _d = _a.headingLevel, headingLevel = _d === void 0 ? "2" : _d, _e = _a.buttonIcon, buttonIcon = _e === void 0 ? "arrow" : _e, props = filterDataAttrs.__rest(_a, ["url", "onClick", "heading", "img", "label", "minHeight", "linkData", "pathway", "headingLevel", "buttonIcon"]);
+    var _f = React.useState(false), showHoverState = _f[0], setShowHoverState = _f[1];
+    var surface = React.useContext(Surface.Context).surface;
+    var handleShowHoverState = function (show) { return function () { return setShowHoverState(show); }; };
+    var isDarkPathway = pathway === "dark";
+    return (React__default["default"].createElement("div", filterDataAttrs.__assign({ style: { minHeight: minHeight }, className: index.classNames("arc-ImpactCard", {
+            "arc-ImpactCard--darkPathway": isDarkPathway,
+            "arc-ImpactCard--outlined": url && showHoverState,
+            "arc-ImpactCard--isHovered": showHoverState,
+            "arc-ImpactCard--onDarkSurface": surface === "dark"
+        }) }, filterDataAttrs.filterDataAttrs(props)),
+        React__default["default"].createElement("div", { className: "arc-ImpactCard-backgroundImageContainer" },
+            React__default["default"].createElement(Image.Image, filterDataAttrs.__assign({ fit: "cover", alt: "" }, img))),
+        React__default["default"].createElement("div", { className: "arc-ImpactCard-contentContainer" },
+            label && (React__default["default"].createElement("div", { className: "arc-ImpactCard-labelContainer" },
+                React__default["default"].createElement(BtIconArrowRight_esm.CardLabel, { isDarkPathway: isDarkPathway, color: "supporting", isBold: true, text: label }))),
+            React__default["default"].createElement(BtIconArrowRight_esm.CardHeading, { heading: heading, headingLevel: headingLevel, linkData: linkData, href: url, onClick: onClick, onMouseEnter: handleShowHoverState(true), onMouseLeave: handleShowHoverState(false), onFocus: handleShowHoverState(true), onBlur: handleShowHoverState(false) })),
+        React__default["default"].createElement(CardFooter.CardFooter, { buttonIcon: buttonIcon, showButton: true, isDarkPathway: isDarkPathway, isHovered: showHoverState })));
+};
+
+exports.ImpactCard = ImpactCard;

package/dist/ImpactCard/ImpactCard.esm.js

@@ -0,0 +1,33 @@
+import { _ as __rest, a as __assign, f as filterDataAttrs } from '../_shared/esm/filter-data-attrs-ea8f4ed4.js';
+import React__default, { useState, useContext } from 'react';
+import { c as classNames } from '../_shared/esm/index-2e73c2e9.js';
+import { C as CardLabel, a as CardHeading } from '../_shared/esm/BtIconArrowRight.esm-9b181878.js';
+import { C as CardFooter } from '../_shared/esm/CardFooter-e13f77b0.js';
+import { I as Image } from '../_shared/esm/Image-12fbd327.js';
+import { C as Context } from '../_shared/esm/Surface-0ca6817d.js';
+import '../_shared/esm/suffix-modifier-3d548e45.js';
+import '../_shared/esm/BtIconArrowRightFill.esm-99019d1a.js';
+import '../_shared/esm/Icon-15799695.js';
+
+var ImpactCard = function (_a) {
+    var url = _a.url, onClick = _a.onClick, heading = _a.heading, img = _a.img, label = _a.label, minHeight = _a.minHeight, _b = _a.linkData, linkData = _b === void 0 ? {} : _b, _c = _a.pathway, pathway = _c === void 0 ? "light" : _c, _d = _a.headingLevel, headingLevel = _d === void 0 ? "2" : _d, _e = _a.buttonIcon, buttonIcon = _e === void 0 ? "arrow" : _e, props = __rest(_a, ["url", "onClick", "heading", "img", "label", "minHeight", "linkData", "pathway", "headingLevel", "buttonIcon"]);
+    var _f = useState(false), showHoverState = _f[0], setShowHoverState = _f[1];
+    var surface = useContext(Context).surface;
+    var handleShowHoverState = function (show) { return function () { return setShowHoverState(show); }; };
+    var isDarkPathway = pathway === "dark";
+    return (React__default.createElement("div", __assign({ style: { minHeight: minHeight }, className: classNames("arc-ImpactCard", {
+            "arc-ImpactCard--darkPathway": isDarkPathway,
+            "arc-ImpactCard--outlined": url && showHoverState,
+            "arc-ImpactCard--isHovered": showHoverState,
+            "arc-ImpactCard--onDarkSurface": surface === "dark"
+        }) }, filterDataAttrs(props)),
+        React__default.createElement("div", { className: "arc-ImpactCard-backgroundImageContainer" },
+            React__default.createElement(Image, __assign({ fit: "cover", alt: "" }, img))),
+        React__default.createElement("div", { className: "arc-ImpactCard-contentContainer" },
+            label && (React__default.createElement("div", { className: "arc-ImpactCard-labelContainer" },
+                React__default.createElement(CardLabel, { isDarkPathway: isDarkPathway, color: "supporting", isBold: true, text: label }))),
+            React__default.createElement(CardHeading, { heading: heading, headingLevel: headingLevel, linkData: linkData, href: url, onClick: onClick, onMouseEnter: handleShowHoverState(true), onMouseLeave: handleShowHoverState(false), onFocus: handleShowHoverState(true), onBlur: handleShowHoverState(false) })),
+        React__default.createElement(CardFooter, { buttonIcon: buttonIcon, showButton: true, isDarkPathway: isDarkPathway, isHovered: showHoverState })));
+};
+
+export { ImpactCard };

package/dist/ImpactCard/package.json

@@ -0,0 +1,7 @@
+{
+  "name": "@arc-ui/impactcard",
+  "types": "../types/components/ImpactCard/index.d.ts",
+  "main": "./ImpactCard.cjs.js",
+  "module": "./ImpactCard.esm.js",
+  "private": true
+}

package/dist/InformationCard/InformationCard.cjs.js

@@ -23,7 +23,8 @@ function _interopDefaultLegacy (e) { return e && typeof e === 'object' && 'defau
 var React__default = /*#__PURE__*/_interopDefaultLegacy(React);
 
 var InformationCard = function (_a) {
-    var cardUrl = _a.cardUrl, onClick = _a.onClick, heading = _a.heading, text = _a.text, label = _a.label, footerLogo = _a.footerLogo, button = _a.button, image = _a.image, tags = _a.tags, icon = _a.icon, _b = _a.headingLevel, headingLevel = _b === void 0 ? "2" : _b, props = filterDataAttrs.__rest(_a, ["cardUrl", "onClick", "heading", "text", "label", "footerLogo", "button", "image", "tags", "icon", "headingLevel"]);
+    var cardUrl = _a.cardUrl, onClick = _a.onClick, heading = _a.heading, text = _a.text, label = _a.label, footerLogo = _a.footerLogo, button = _a.button, image = _a.image, tags = _a.tags, icon = _a.icon, minHeight = _a.minHeight, _b = _a.headingLevel, headingLevel = _b === void 0 ? "2" : _b, props = filterDataAttrs.__rest(_a, ["cardUrl", "onClick", "heading", "text", "label", "footerLogo", "button", "image", "tags", "icon", "minHeight", "headingLevel"]);
+    var surface = React.useContext(Surface.Context).surface;
     var isMinWidthArcBreakpointS = useMediaQuery.useMediaQuery("(min-width: ".concat(useMediaQuery.ArcBreakpointS, "px)"));
     var isMinWidthArcBreakpointM = useMediaQuery.useMediaQuery("(min-width: ".concat(useMediaQuery.ArcBreakpointM, "px)"));
     var _c = React.useState(false), showHoverState = _c[0], setShowHoverState = _c[1];
@@ -31,8 +32,10 @@ var InformationCard = function (_a) {
     var assetSpacing = isMinWidthArcBreakpointM ? "24" : "20";
     var containerSpacing = isMinWidthArcBreakpointS ? "32" : "24";
     var handleShowHoverState = function (show) { return function () { return setShowHoverState(show); }; };
-    return (React__default["default"].createElement("div", filterDataAttrs.__assign({ className: index.classNames("arc-InformationCard", {
-            "arc-InformationCard--outlined": cardUrl && showHoverState
+    return (React__default["default"].createElement("div", filterDataAttrs.__assign({ style: { minHeight: minHeight }, className: index.classNames("arc-InformationCard", {
+            "arc-InformationCard--isALink": cardUrl,
+            "arc-InformationCard--outlined": cardUrl && showHoverState,
+            "arc-InformationCard--onDarkSurface": surface === "dark"
         }) }, filterDataAttrs.filterDataAttrs(props)),
         React__default["default"].createElement(Surface.Surface, { growVertically: true, padding: containerSpacing, background: "white" },
             React__default["default"].createElement("div", null,

package/dist/InformationCard/InformationCard.esm.js

@@ -1,5 +1,5 @@
 import { _ as __rest, a as __assign, f as filterDataAttrs } from '../_shared/esm/filter-data-attrs-ea8f4ed4.js';
-import React__default, { useState } from 'react';
+import React__default, { useContext, useState } from 'react';
 import { u as useMediaQuery, a as ArcBreakpointS, A as ArcBreakpointM } from '../_shared/esm/use-media-query-4c807227.js';
 import { C as CardLabel, a as CardHeading, B as BtIconArrowRight } from '../_shared/esm/BtIconArrowRight.esm-9b181878.js';
 import { I as Icon } from '../_shared/esm/Icon-15799695.js';
@@ -9,13 +9,14 @@ import { T as Text } from '../_shared/esm/Text-14f586ac.js';
 import { B as Button } from '../_shared/esm/Button-3f294e64.js';
 import { V as VerticalSpace } from '../_shared/esm/VerticalSpace-43cd9138.js';
 import { c as classNames } from '../_shared/esm/index-2e73c2e9.js';
-import { S as Surface } from '../_shared/esm/Surface-0ca6817d.js';
+import { C as Context, S as Surface } from '../_shared/esm/Surface-0ca6817d.js';
 import '../_shared/esm/suffix-modifier-3d548e45.js';
 import '../_shared/esm/BtIconChevronLeftMid.esm-1ed8330b.js';
 import '../_shared/esm/BtIconChevronRightMid.esm-32268f1a.js';
 
 var InformationCard = function (_a) {
-    var cardUrl = _a.cardUrl, onClick = _a.onClick, heading = _a.heading, text = _a.text, label = _a.label, footerLogo = _a.footerLogo, button = _a.button, image = _a.image, tags = _a.tags, icon = _a.icon, _b = _a.headingLevel, headingLevel = _b === void 0 ? "2" : _b, props = __rest(_a, ["cardUrl", "onClick", "heading", "text", "label", "footerLogo", "button", "image", "tags", "icon", "headingLevel"]);
+    var cardUrl = _a.cardUrl, onClick = _a.onClick, heading = _a.heading, text = _a.text, label = _a.label, footerLogo = _a.footerLogo, button = _a.button, image = _a.image, tags = _a.tags, icon = _a.icon, minHeight = _a.minHeight, _b = _a.headingLevel, headingLevel = _b === void 0 ? "2" : _b, props = __rest(_a, ["cardUrl", "onClick", "heading", "text", "label", "footerLogo", "button", "image", "tags", "icon", "minHeight", "headingLevel"]);
+    var surface = useContext(Context).surface;
     var isMinWidthArcBreakpointS = useMediaQuery("(min-width: ".concat(ArcBreakpointS, "px)"));
     var isMinWidthArcBreakpointM = useMediaQuery("(min-width: ".concat(ArcBreakpointM, "px)"));
     var _c = useState(false), showHoverState = _c[0], setShowHoverState = _c[1];
@@ -23,8 +24,10 @@ var InformationCard = function (_a) {
     var assetSpacing = isMinWidthArcBreakpointM ? "24" : "20";
     var containerSpacing = isMinWidthArcBreakpointS ? "32" : "24";
     var handleShowHoverState = function (show) { return function () { return setShowHoverState(show); }; };
-    return (React__default.createElement("div", __assign({ className: classNames("arc-InformationCard", {
-            "arc-InformationCard--outlined": cardUrl && showHoverState
+    return (React__default.createElement("div", __assign({ style: { minHeight: minHeight }, className: classNames("arc-InformationCard", {
+            "arc-InformationCard--isALink": cardUrl,
+            "arc-InformationCard--outlined": cardUrl && showHoverState,
+            "arc-InformationCard--onDarkSurface": surface === "dark"
         }) }, filterDataAttrs(props)),
         React__default.createElement(Surface, { growVertically: true, padding: containerSpacing, background: "white" },
             React__default.createElement("div", null,

package/dist/MediaCard/MediaCard.cjs.js

@@ -7,7 +7,7 @@ var React = require('react');
 var index = require('../_shared/cjs/index-9947ac13.js');
 var useMediaQuery = require('../_shared/cjs/use-media-query-e61881d8.js');
 var BtIconArrowRight_esm = require('../_shared/cjs/BtIconArrowRight.esm-50d96943.js');
-var CardFooter = require('../_shared/cjs/CardFooter-4a68a862.js');
+var CardFooter = require('../_shared/cjs/CardFooter-ff015d7d.js');
 var ConditionalWrapper = require('../_shared/cjs/ConditionalWrapper-be3b2625.js');
 var Image = require('../_shared/cjs/Image-e873b8fc.js');
 var Surface = require('../_shared/cjs/Surface-038db6e1.js');
@@ -25,14 +25,16 @@ var React__default = /*#__PURE__*/_interopDefaultLegacy(React);
  * Use `MediaCard` to contain content and an image about a single subject.
  */
 var MediaCard = function (_a) {
-    var img = _a.img, url = _a.url, onClick = _a.onClick, heading = _a.heading, label = _a.label, text = _a.text, metaText = _a.metaText, _b = _a.buttonIcon, buttonIcon = _b === void 0 ? "arrow" : _b, _c = _a.isContained, isContained = _c === void 0 ? true : _c, _d = _a.headingLevel, headingLevel = _d === void 0 ? "2" : _d, props = filterDataAttrs.__rest(_a, ["img", "url", "onClick", "heading", "label", "text", "metaText", "buttonIcon", "isContained", "headingLevel"]);
+    var img = _a.img, url = _a.url, onClick = _a.onClick, heading = _a.heading, label = _a.label, text = _a.text, metaText = _a.metaText, minHeight = _a.minHeight, _b = _a.buttonIcon, buttonIcon = _b === void 0 ? "arrow" : _b, _c = _a.isContained, isContained = _c === void 0 ? true : _c, _d = _a.headingLevel, headingLevel = _d === void 0 ? "2" : _d, props = filterDataAttrs.__rest(_a, ["img", "url", "onClick", "heading", "label", "text", "metaText", "minHeight", "buttonIcon", "isContained", "headingLevel"]);
+    var surface = React.useContext(Surface.Context).surface;
     var _e = React.useState(false), showHoverState = _e[0], setShowHoverState = _e[1];
     var isMinWidthArcBreakpointS = useMediaQuery.useMediaQuery("(min-width: ".concat(useMediaQuery.ArcBreakpointS, "px)"));
     var headingSpacing = isMinWidthArcBreakpointS ? "16" : "8";
     var handleShowHoverState = function (show) { return function () { return setShowHoverState(show); }; };
-    return (React__default["default"].createElement("div", filterDataAttrs.__assign({ className: index.classNames("arc-MediaCard", {
+    return (React__default["default"].createElement("div", filterDataAttrs.__assign({ style: { minHeight: minHeight }, className: index.classNames("arc-MediaCard", {
             "arc-MediaCard--outlined": url && isContained && showHoverState,
-            "arc-MediaCard--contained": isContained
+            "arc-MediaCard--contained": isContained,
+            "arc-MediaCard--onDarkSurface": surface === "dark"
         }) }, filterDataAttrs.filterDataAttrs(props)),
         React__default["default"].createElement(ConditionalWrapper.ConditionalWrapper, { condition: isContained, wrapper: function (children) { return (React__default["default"].createElement(Surface.Surface, { growVertically: true, background: "white" }, children)); } },
             React__default["default"].createElement("div", { className: "arc-MediaCard-imgContainer" },
@@ -46,7 +48,7 @@ var MediaCard = function (_a) {
                     React__default["default"].createElement(VerticalSpace.VerticalSpace, { size: headingSpacing }),
                     React__default["default"].createElement(Text.Text, null, text),
                     (url || metaText) && React__default["default"].createElement(VerticalSpace.VerticalSpace, { size: "24" })))),
-                React__default["default"].createElement(CardFooter.CardFooter, { showFilledIcon: showHoverState, buttonIcon: buttonIcon, metaText: metaText, showButton: Boolean(url) })))));
+                React__default["default"].createElement(CardFooter.CardFooter, { buttonIcon: buttonIcon, metaText: metaText, showButton: Boolean(url), isHovered: showHoverState })))));
 };
 
 exports.MediaCard = MediaCard;

package/dist/MediaCard/MediaCard.esm.js

@@ -1,12 +1,12 @@
 import { _ as __rest, a as __assign, f as filterDataAttrs } from '../_shared/esm/filter-data-attrs-ea8f4ed4.js';
-import React__default, { useState } from 'react';
+import React__default, { useContext, useState } from 'react';
 import { c as classNames } from '../_shared/esm/index-2e73c2e9.js';
 import { u as useMediaQuery, a as ArcBreakpointS } from '../_shared/esm/use-media-query-4c807227.js';
 import { C as CardLabel, a as CardHeading } from '../_shared/esm/BtIconArrowRight.esm-9b181878.js';
-import { C as CardFooter } from '../_shared/esm/CardFooter-a08b70ee.js';
+import { C as CardFooter } from '../_shared/esm/CardFooter-e13f77b0.js';
 import { C as ConditionalWrapper } from '../_shared/esm/ConditionalWrapper-59be8f35.js';
 import { I as Image } from '../_shared/esm/Image-12fbd327.js';
-import { S as Surface } from '../_shared/esm/Surface-0ca6817d.js';
+import { C as Context, S as Surface } from '../_shared/esm/Surface-0ca6817d.js';
 import { T as Text } from '../_shared/esm/Text-14f586ac.js';
 import { V as VerticalSpace } from '../_shared/esm/VerticalSpace-43cd9138.js';
 import '../_shared/esm/suffix-modifier-3d548e45.js';
@@ -17,14 +17,16 @@ import '../_shared/esm/Icon-15799695.js';
  * Use `MediaCard` to contain content and an image about a single subject.
  */
 var MediaCard = function (_a) {
-    var img = _a.img, url = _a.url, onClick = _a.onClick, heading = _a.heading, label = _a.label, text = _a.text, metaText = _a.metaText, _b = _a.buttonIcon, buttonIcon = _b === void 0 ? "arrow" : _b, _c = _a.isContained, isContained = _c === void 0 ? true : _c, _d = _a.headingLevel, headingLevel = _d === void 0 ? "2" : _d, props = __rest(_a, ["img", "url", "onClick", "heading", "label", "text", "metaText", "buttonIcon", "isContained", "headingLevel"]);
+    var img = _a.img, url = _a.url, onClick = _a.onClick, heading = _a.heading, label = _a.label, text = _a.text, metaText = _a.metaText, minHeight = _a.minHeight, _b = _a.buttonIcon, buttonIcon = _b === void 0 ? "arrow" : _b, _c = _a.isContained, isContained = _c === void 0 ? true : _c, _d = _a.headingLevel, headingLevel = _d === void 0 ? "2" : _d, props = __rest(_a, ["img", "url", "onClick", "heading", "label", "text", "metaText", "minHeight", "buttonIcon", "isContained", "headingLevel"]);
+    var surface = useContext(Context).surface;
     var _e = useState(false), showHoverState = _e[0], setShowHoverState = _e[1];
     var isMinWidthArcBreakpointS = useMediaQuery("(min-width: ".concat(ArcBreakpointS, "px)"));
     var headingSpacing = isMinWidthArcBreakpointS ? "16" : "8";
     var handleShowHoverState = function (show) { return function () { return setShowHoverState(show); }; };
-    return (React__default.createElement("div", __assign({ className: classNames("arc-MediaCard", {
+    return (React__default.createElement("div", __assign({ style: { minHeight: minHeight }, className: classNames("arc-MediaCard", {
             "arc-MediaCard--outlined": url && isContained && showHoverState,
-            "arc-MediaCard--contained": isContained
+            "arc-MediaCard--contained": isContained,
+            "arc-MediaCard--onDarkSurface": surface === "dark"
         }) }, filterDataAttrs(props)),
         React__default.createElement(ConditionalWrapper, { condition: isContained, wrapper: function (children) { return (React__default.createElement(Surface, { growVertically: true, background: "white" }, children)); } },
             React__default.createElement("div", { className: "arc-MediaCard-imgContainer" },
@@ -38,7 +40,7 @@ var MediaCard = function (_a) {
                     React__default.createElement(VerticalSpace, { size: headingSpacing }),
                     React__default.createElement(Text, null, text),
                     (url || metaText) && React__default.createElement(VerticalSpace, { size: "24" })))),
-                React__default.createElement(CardFooter, { showFilledIcon: showHoverState, buttonIcon: buttonIcon, metaText: metaText, showButton: Boolean(url) })))));
+                React__default.createElement(CardFooter, { buttonIcon: buttonIcon, metaText: metaText, showButton: Boolean(url), isHovered: showHoverState })))));
 };
 
 export { MediaCard };

package/dist/SiteHeaderV2/SiteHeaderV2.cjs.js

@@ -2,7 +2,7 @@
 
 Object.defineProperty(exports, '__esModule', { value: true });
 
-var SiteHeaderV2 = require('../_shared/cjs/SiteHeaderV2-b41fdb49.js');
+var SiteHeaderV2 = require('../_shared/cjs/SiteHeaderV2-e0735a9d.js');
 require('../_shared/cjs/filter-data-attrs-1c9a530c.js');
 require('../_shared/cjs/use-media-query-e61881d8.js');
 require('react');
@@ -12,6 +12,7 @@ require('../_shared/cjs/suffix-modifier-64dcd338.js');
 require('../_shared/cjs/Surface-038db6e1.js');
 require('../_shared/cjs/handle-link-click-17a44cf4.js');
 require('../_shared/cjs/BtIconChevronRightMid.esm-d01ebbd4.js');
+require('../_shared/cjs/ConditionalWrapper-be3b2625.js');
 require('../_shared/cjs/BtIconChevronRight2Px.esm-dbf8cbee.js');
 require('../_shared/cjs/Button-84533dc8.js');
 require('../_shared/cjs/BtIconChevronLeftMid.esm-0aaa6770.js');

package/dist/SiteHeaderV2/SiteHeaderV2.esm.js

@@ -1,4 +1,4 @@
-export { S as SiteHeaderV2 } from '../_shared/esm/SiteHeaderV2-f06ac085.js';
+export { S as SiteHeaderV2 } from '../_shared/esm/SiteHeaderV2-c74b811b.js';
 import '../_shared/esm/filter-data-attrs-ea8f4ed4.js';
 import '../_shared/esm/use-media-query-4c807227.js';
 import 'react';
@@ -8,6 +8,7 @@ import '../_shared/esm/suffix-modifier-3d548e45.js';
 import '../_shared/esm/Surface-0ca6817d.js';
 import '../_shared/esm/handle-link-click-f64f55a2.js';
 import '../_shared/esm/BtIconChevronRightMid.esm-32268f1a.js';
+import '../_shared/esm/ConditionalWrapper-59be8f35.js';
 import '../_shared/esm/BtIconChevronRight2Px.esm-75e92636.js';
 import '../_shared/esm/Button-3f294e64.js';
 import '../_shared/esm/BtIconChevronLeftMid.esm-1ed8330b.js';

package/dist/TextArea/TextArea.cjs.js

@@ -15,7 +15,7 @@ require('../_shared/cjs/Button-84533dc8.js');
 require('../_shared/cjs/Card-5b19cabc.js');
 require('../_shared/cjs/Checkbox-8915fcd9.js');
 require('../_shared/cjs/Columns-ae4f8cef.js');
-require('../_shared/cjs/Filter-1bde635c.js');
+require('../_shared/cjs/Filter-f4b73f5d.js');
 var FormControl = require('../_shared/cjs/FormControl-5f3b6ce4.js');
 require('../_shared/cjs/Group-0429741a.js');
 require('../_shared/cjs/Poster-9b48fd61.js');
@@ -24,7 +24,7 @@ require('../_shared/cjs/RadioGroup-07bb155e.js');
 require('../_shared/cjs/debounce-123468fb.js');
 require('../_shared/cjs/SiteFooter-65b6360c.js');
 require('../_shared/cjs/SiteHeader.rehydrator-ea49f8d5.js');
-require('../_shared/cjs/SiteHeaderV2-b41fdb49.js');
+require('../_shared/cjs/SiteHeaderV2-e0735a9d.js');
 require('../_shared/cjs/Tabs-24e6f45b.js');
 require('../_shared/cjs/TextInput-5da70ec2.js');
 require('../_shared/cjs/Toast-7a20d1b9.js');
@@ -44,6 +44,7 @@ require('../_shared/cjs/use-media-query-e61881d8.js');
 require('../_shared/cjs/BrandLogo-aea340c8.js');
 require('../_shared/cjs/Curve-d038052b.js');
 require('../_shared/cjs/Section-59804166.js');
+require('../_shared/cjs/ConditionalWrapper-be3b2625.js');
 require('../_shared/cjs/extends-8c5e4b48.js');
 require('../_shared/cjs/index-dd1d18ea.js');
 require('react-dom');

package/dist/TextArea/TextArea.esm.js

@@ -11,7 +11,7 @@ import '../_shared/esm/Button-3f294e64.js';
 import '../_shared/esm/Card-7fc6c9b4.js';
 import '../_shared/esm/Checkbox-0e051546.js';
 import '../_shared/esm/Columns-d96b7425.js';
-import '../_shared/esm/Filter-58a42358.js';
+import '../_shared/esm/Filter-ad254e3d.js';
 import { F as FormControl } from '../_shared/esm/FormControl-cc99cde0.js';
 import '../_shared/esm/Group-73fdb896.js';
 import '../_shared/esm/Poster-4ec2f679.js';
@@ -20,7 +20,7 @@ import '../_shared/esm/RadioGroup-362be63f.js';
 import '../_shared/esm/debounce-6fed6b84.js';
 import '../_shared/esm/SiteFooter-38ee1536.js';
 import '../_shared/esm/SiteHeader.rehydrator-65c8cf71.js';
-import '../_shared/esm/SiteHeaderV2-f06ac085.js';
+import '../_shared/esm/SiteHeaderV2-c74b811b.js';
 import '../_shared/esm/Tabs-a85af483.js';
 import '../_shared/esm/TextInput-1d1c5fd6.js';
 import '../_shared/esm/Toast-7a232e15.js';
@@ -40,6 +40,7 @@ import '../_shared/esm/use-media-query-4c807227.js';
 import '../_shared/esm/BrandLogo-1af78f76.js';
 import '../_shared/esm/Curve-d8679dde.js';
 import '../_shared/esm/Section-73781b56.js';
+import '../_shared/esm/ConditionalWrapper-59be8f35.js';
 import '../_shared/esm/extends-8cc61aad.js';
 import '../_shared/esm/index-7b531fa7.js';
 import 'react-dom';

package/dist/TypographyCard/TypographyCard.cjs.js

@@ -6,31 +6,33 @@ var filterDataAttrs = require('../_shared/cjs/filter-data-attrs-1c9a530c.js');
 var React = require('react');
 var index = require('../_shared/cjs/index-9947ac13.js');
 var BtIconArrowRight_esm = require('../_shared/cjs/BtIconArrowRight.esm-50d96943.js');
-var CardFooter = require('../_shared/cjs/CardFooter-4a68a862.js');
+var CardFooter = require('../_shared/cjs/CardFooter-ff015d7d.js');
+var Surface = require('../_shared/cjs/Surface-038db6e1.js');
 require('../_shared/cjs/suffix-modifier-64dcd338.js');
 require('../_shared/cjs/BtIconArrowRightFill.esm-435cf4bd.js');
 require('../_shared/cjs/Icon-b46897a3.js');
-require('../_shared/cjs/Surface-038db6e1.js');
 
 function _interopDefaultLegacy (e) { return e && typeof e === 'object' && 'default' in e ? e : { 'default': e }; }
 
 var React__default = /*#__PURE__*/_interopDefaultLegacy(React);
 
 var TypographyCard = function (_a) {
-    var url = _a.url, onClick = _a.onClick, heading = _a.heading, metaText = _a.metaText, label = _a.label, _b = _a.linkData, linkData = _b === void 0 ? {} : _b, _c = _a.pathway, pathway = _c === void 0 ? "light" : _c, _d = _a.buttonIcon, buttonIcon = _d === void 0 ? "arrow" : _d, _e = _a.headingLevel, headingLevel = _e === void 0 ? "2" : _e, props = filterDataAttrs.__rest(_a, ["url", "onClick", "heading", "metaText", "label", "linkData", "pathway", "buttonIcon", "headingLevel"]);
+    var url = _a.url, onClick = _a.onClick, heading = _a.heading, metaText = _a.metaText, label = _a.label, minHeight = _a.minHeight, _b = _a.linkData, linkData = _b === void 0 ? {} : _b, _c = _a.pathway, pathway = _c === void 0 ? "light" : _c, _d = _a.buttonIcon, buttonIcon = _d === void 0 ? "arrow" : _d, _e = _a.headingLevel, headingLevel = _e === void 0 ? "2" : _e, props = filterDataAttrs.__rest(_a, ["url", "onClick", "heading", "metaText", "label", "minHeight", "linkData", "pathway", "buttonIcon", "headingLevel"]);
+    var surface = React.useContext(Surface.Context).surface;
     var _f = React.useState(false), showHoverState = _f[0], setShowHoverState = _f[1];
     var handleShowHoverState = function (show) { return function () { return setShowHoverState(show); }; };
     var isDarkPathway = pathway === "dark";
-    return (React__default["default"].createElement("div", filterDataAttrs.__assign({ className: index.classNames("arc-TypographyCard", {
+    return (React__default["default"].createElement("div", filterDataAttrs.__assign({ style: { minHeight: minHeight }, className: index.classNames("arc-TypographyCard", {
             "arc-TypographyCard--outlined": showHoverState,
             "arc-TypographyCard--darkPathway": isDarkPathway,
-            "arc-TypographyCard--lightPathway": !isDarkPathway
+            "arc-TypographyCard--lightPathway": !isDarkPathway,
+            "arc-TypographyCard--onDarkSurface": surface === "dark"
         }) }, filterDataAttrs.filterDataAttrs(props)),
         React__default["default"].createElement("div", { className: "arc-TypographyCard-contentContainer" },
             label && (React__default["default"].createElement("div", { className: "arc-TypographyCard-labelContainer" },
-                React__default["default"].createElement(BtIconArrowRight_esm.CardLabel, { isDarkPathway: isDarkPathway, isBold: false, text: label }))),
+                React__default["default"].createElement(BtIconArrowRight_esm.CardLabel, { isDarkPathway: isDarkPathway, isBold: true, text: label }))),
             React__default["default"].createElement(BtIconArrowRight_esm.CardHeading, { size: "m", linkData: linkData, heading: heading, headingLevel: headingLevel, href: url, onClick: onClick, isDarkPathway: isDarkPathway, onMouseEnter: handleShowHoverState(true), onMouseLeave: handleShowHoverState(false), onFocus: handleShowHoverState(true), onBlur: handleShowHoverState(false) })),
-        React__default["default"].createElement(CardFooter.CardFooter, { showButton: true, isDarkPathway: isDarkPathway, showFilledIcon: showHoverState, buttonIcon: buttonIcon, metaText: metaText })));
+        React__default["default"].createElement(CardFooter.CardFooter, { showButton: true, isDarkPathway: isDarkPathway, buttonIcon: buttonIcon, metaText: metaText, isHovered: showHoverState })));
 };
 
 exports.TypographyCard = TypographyCard;

package/dist/TypographyCard/TypographyCard.esm.js

@@ -1,28 +1,30 @@
 import { _ as __rest, a as __assign, f as filterDataAttrs } from '../_shared/esm/filter-data-attrs-ea8f4ed4.js';
-import React__default, { useState } from 'react';
+import React__default, { useContext, useState } from 'react';
 import { c as classNames } from '../_shared/esm/index-2e73c2e9.js';
 import { C as CardLabel, a as CardHeading } from '../_shared/esm/BtIconArrowRight.esm-9b181878.js';
-import { C as CardFooter } from '../_shared/esm/CardFooter-a08b70ee.js';
+import { C as CardFooter } from '../_shared/esm/CardFooter-e13f77b0.js';
+import { C as Context } from '../_shared/esm/Surface-0ca6817d.js';
 import '../_shared/esm/suffix-modifier-3d548e45.js';
 import '../_shared/esm/BtIconArrowRightFill.esm-99019d1a.js';
 import '../_shared/esm/Icon-15799695.js';
-import '../_shared/esm/Surface-0ca6817d.js';
 
 var TypographyCard = function (_a) {
-    var url = _a.url, onClick = _a.onClick, heading = _a.heading, metaText = _a.metaText, label = _a.label, _b = _a.linkData, linkData = _b === void 0 ? {} : _b, _c = _a.pathway, pathway = _c === void 0 ? "light" : _c, _d = _a.buttonIcon, buttonIcon = _d === void 0 ? "arrow" : _d, _e = _a.headingLevel, headingLevel = _e === void 0 ? "2" : _e, props = __rest(_a, ["url", "onClick", "heading", "metaText", "label", "linkData", "pathway", "buttonIcon", "headingLevel"]);
+    var url = _a.url, onClick = _a.onClick, heading = _a.heading, metaText = _a.metaText, label = _a.label, minHeight = _a.minHeight, _b = _a.linkData, linkData = _b === void 0 ? {} : _b, _c = _a.pathway, pathway = _c === void 0 ? "light" : _c, _d = _a.buttonIcon, buttonIcon = _d === void 0 ? "arrow" : _d, _e = _a.headingLevel, headingLevel = _e === void 0 ? "2" : _e, props = __rest(_a, ["url", "onClick", "heading", "metaText", "label", "minHeight", "linkData", "pathway", "buttonIcon", "headingLevel"]);
+    var surface = useContext(Context).surface;
     var _f = useState(false), showHoverState = _f[0], setShowHoverState = _f[1];
     var handleShowHoverState = function (show) { return function () { return setShowHoverState(show); }; };
     var isDarkPathway = pathway === "dark";
-    return (React__default.createElement("div", __assign({ className: classNames("arc-TypographyCard", {
+    return (React__default.createElement("div", __assign({ style: { minHeight: minHeight }, className: classNames("arc-TypographyCard", {
             "arc-TypographyCard--outlined": showHoverState,
             "arc-TypographyCard--darkPathway": isDarkPathway,
-            "arc-TypographyCard--lightPathway": !isDarkPathway
+            "arc-TypographyCard--lightPathway": !isDarkPathway,
+            "arc-TypographyCard--onDarkSurface": surface === "dark"
         }) }, filterDataAttrs(props)),
         React__default.createElement("div", { className: "arc-TypographyCard-contentContainer" },
             label && (React__default.createElement("div", { className: "arc-TypographyCard-labelContainer" },
-                React__default.createElement(CardLabel, { isDarkPathway: isDarkPathway, isBold: false, text: label }))),
+                React__default.createElement(CardLabel, { isDarkPathway: isDarkPathway, isBold: true, text: label }))),
             React__default.createElement(CardHeading, { size: "m", linkData: linkData, heading: heading, headingLevel: headingLevel, href: url, onClick: onClick, isDarkPathway: isDarkPathway, onMouseEnter: handleShowHoverState(true), onMouseLeave: handleShowHoverState(false), onFocus: handleShowHoverState(true), onBlur: handleShowHoverState(false) })),
-        React__default.createElement(CardFooter, { showButton: true, isDarkPathway: isDarkPathway, showFilledIcon: showHoverState, buttonIcon: buttonIcon, metaText: metaText })));
+        React__default.createElement(CardFooter, { showButton: true, isDarkPathway: isDarkPathway, buttonIcon: buttonIcon, metaText: metaText, isHovered: showHoverState })));
 };
 
 export { TypographyCard };

package/dist/_shared/cjs/{CardFooter-4a68a862.js → CardFooter-ff015d7d.js}

@@ -53,7 +53,7 @@ const BtIconPlayFill = (props) =>
   );
 
 var CardFooter = function (_a) {
-    var metaText = _a.metaText, _b = _a.buttonIcon, buttonIcon = _b === void 0 ? "arrow" : _b, _c = _a.isDarkPathway, isDarkPathway = _c === void 0 ? false : _c, _d = _a.showButton, showButton = _d === void 0 ? true : _d, _e = _a.showFilledIcon, showFilledIcon = _e === void 0 ? false : _e;
+    var metaText = _a.metaText, _b = _a.buttonIcon, buttonIcon = _b === void 0 ? "arrow" : _b, _c = _a.isDarkPathway, isDarkPathway = _c === void 0 ? false : _c, _d = _a.showButton, showButton = _d === void 0 ? true : _d, _e = _a.isHovered, isHovered = _e === void 0 ? false : _e;
     var icons = {
         arrow: {
             regular: BtIconArrowRight_esm.BtIconArrowRight,
@@ -65,16 +65,18 @@ var CardFooter = function (_a) {
         }
     };
     return (React__default["default"].createElement("div", { className: index.classNames("arc-CardFooter", {
-            "arc-CardFooter--darkPathway": isDarkPathway,
-            "arc-CardFooter--showFilledIcon": showFilledIcon
+            "arc-CardFooter--darkPathway": isDarkPathway
         }) },
         React__default["default"].createElement("div", { className: "arc-CardFooter-metaTextContainer" }, metaText && (React__default["default"].createElement("span", { className: "arc-CardFooter-metaText" }, metaText))),
         showButton && (React__default["default"].createElement("div", null,
             React__default["default"].createElement("div", { className: "arc-CardFooter-button" },
-                React__default["default"].createElement("div", { className: index.classNames("arc-CardFooter-buttonIcon", "arc-CardFooter-buttonIcon--regular") },
-                    React__default["default"].createElement(Icon.Icon, { icon: icons[buttonIcon].regular, size: 40 })),
-                React__default["default"].createElement("div", { className: "arc-CardFooter-buttonIcon arc-CardFooter-buttonIcon--filled" },
-                    React__default["default"].createElement(Icon.Icon, { icon: icons[buttonIcon].filled, size: 40 })))))));
+                React__default["default"].createElement("div", { className: "arc-CardFooter-buttonIcon" },
+                    React__default["default"].createElement("div", { className: index.classNames("arc-CardFooter-buttonIconRight", {
+                            "arc-CardFooter-buttonIconRight--isHovered": isHovered
+                        }) },
+                        React__default["default"].createElement(Icon.Icon, { icon: icons[buttonIcon].regular, size: 40 })),
+                    React__default["default"].createElement("div", { className: "arc-CardFooter-buttonIconLeft" },
+                        React__default["default"].createElement(Icon.Icon, { icon: icons[buttonIcon].regular, size: 40 }))))))));
 };
 
 exports.CardFooter = CardFooter;

package/dist/_shared/cjs/{Filter-1bde635c.js → Filter-f4b73f5d.js}

@@ -20,7 +20,7 @@ var FilterControl = function (_a) {
     return (React__default["default"].createElement("button", { className: index.classNames("arc-FilterControl", {
             "arc-FilterControl--onDarkSurface": surface === "dark",
             "arc-FilterControl--selected": selected
-        }), onClick: onClickHandler, tabIndex: 0 },
+        }), onClick: onClickHandler, tabIndex: 0, "aria-pressed": selected },
         React__default["default"].createElement("div", { className: "arc-FilterControl-text" }, children)));
 };
 
@@ -38,16 +38,20 @@ var FilterItem = function (_a) {
 };
 
 var FilterItems = function (_a) {
-    var children = _a.children, _b = _a.displayType, displayType = _b === void 0 ? "grid" : _b, props = filterDataAttrs.__rest(_a, ["children", "displayType"]);
-    return (React__default["default"].createElement("div", filterDataAttrs.__assign({ className: index.classNames("arc-FilterItems", {
-            "arc-FilterItems--list": displayType === "list",
-            "arc-FilterItems--grid": displayType === "grid"
-        }) }, filterDataAttrs.filterDataAttrs(props)), displayType === "list"
-        ? React__default["default"].Children.toArray(children).map(function (child, index, array) { return (React__default["default"].createElement(React__default["default"].Fragment, { key: index },
-            child,
-            index !== array.length - 1 && (React__default["default"].createElement(React__default["default"].Fragment, null,
-                React__default["default"].createElement("div", { className: "arc-FilterItems-separator", "data-testid": "arc-FilterItems-separator" }))))); })
-        : children));
+    var children = _a.children, error = _a.error, _b = _a.displayType, displayType = _b === void 0 ? "grid" : _b, props = filterDataAttrs.__rest(_a, ["children", "error", "displayType"]);
+    return React__default["default"].Children.toArray(children).length > 0 ? (React__default["default"].createElement("div", null,
+        React__default["default"].createElement("div", { className: "arc-FilterItems-offscreen", "aria-live": "assertive" }, React__default["default"].Children.toArray(children).length > 0
+            ? "".concat(React__default["default"].Children.toArray(children).length, " records listed.")
+            : null),
+        React__default["default"].createElement("div", filterDataAttrs.__assign({ className: index.classNames("arc-FilterItems", {
+                "arc-FilterItems--list": displayType === "list",
+                "arc-FilterItems--grid": displayType === "grid"
+            }) }, filterDataAttrs.filterDataAttrs(props)), displayType === "list"
+            ? React__default["default"].Children.toArray(children).map(function (child, index, array) { return (React__default["default"].createElement(React__default["default"].Fragment, { key: index },
+                child,
+                index !== array.length - 1 && (React__default["default"].createElement(React__default["default"].Fragment, null,
+                    React__default["default"].createElement("div", { className: "arc-FilterItems-separator", "data-testid": "arc-FilterItems-separator" }))))); })
+            : children))) : (React__default["default"].createElement("div", { "aria-live": "assertive" }, error));
 };
 
 /** use `Filter` for interactive elements that filter and categorise page content. */
@@ -107,7 +111,7 @@ var Filter = function (_a) {
         React__default["default"].createElement(FilterControls, { controlsAlignment: controlsAlignment }, controls &&
             React__default["default"].isValidElement(controls) &&
             React__default["default"].Children.map(controls.props.children, function (control, index) { return (React__default["default"].createElement(FilterControl, { key: index, onClick: function () { return handleControlClick(control.props.children); }, isSelected: control.props.isSelected }, control.props.children)); })),
-        filteredItems.length === 0 ? (React__default["default"].createElement(React__default["default"].Fragment, null, error)) : (React__default["default"].createElement(FilterItems, { displayType: displayType }, filteredItems.map(function (item) { return item.props.children; })))));
+        React__default["default"].createElement(FilterItems, { displayType: displayType, error: error }, filteredItems.map(function (item) { return item.props.children; }))));
 };
 Filter.Controls = FilterControls;
 Filter.Control = FilterControl;