@arc-ui/community-components 3.3.0 → 3.5.0

package/lib/Summary/Summary.mjs

@@ -1,28 +1,29 @@
-import { _ as __rest, a as __assign, f as filterAttrs } from '../_shared/esm/filter-attrs-D-1kWaCP.mjs';
-import React from 'react';
-import { b as ArcSizeBreakpointsM } from '../_shared/esm/index.es-Bfdys5__.mjs';
+import { _ as __rest, a as __assign } from '../_shared/esm/tslib.es6-BVXMhEem.mjs';
+import React__default from 'react';
+import { b as ArcSizeBreakpointsM } from '../_shared/esm/index.es-DraZ-qKh.mjs';
 import { Heading } from '@arc-ui/components/Heading';
 import { Text } from '@arc-ui/components/Text';
 import { Box } from '@arc-ui/components/Box';
 import { Rule } from '@arc-ui/components/Rule';
 import { VerticalSpace } from '@arc-ui/components/VerticalSpace';
 import { useMediaQuery } from '@arc-ui/components/use-media-query';
+import { f as filterAttrs } from '../_shared/esm/filter-attrs-DZ7RCEZm.mjs';
 
 var styles = {"ruleContainer":"Summary-module_ruleContainer__ydWlG","row":"Summary-module_row__SKV--"};
 
 var Summary = function (_a) {
     var content = _a.content, _b = _a.noBorder, noBorder = _b === void 0 ? false : _b, _c = _a.headingLevel, headingLevel = _c === void 0 ? "3" : _c, props = __rest(_a, ["content", "noBorder", "headingLevel"]);
     var isMinWidthArcBreakpointM = useMediaQuery("(min-width: ".concat(ArcSizeBreakpointsM, ")"));
-    return (React.createElement(Box, __assign({ isBorderRadius: true }, (!noBorder ? { borderWidth: "thin" } : { elevationLevel: "1" }), { padding: "24" }, filterAttrs(props)),
-        React.createElement("div", { className: styles.row }, content.map(function (_a, i) {
+    return (React__default.createElement(Box, __assign({ isBorderRadius: true }, (!noBorder ? { borderWidth: "thin" } : { elevationLevel: "1" }), { padding: "24" }, filterAttrs(props)),
+        React__default.createElement("div", { className: styles.row }, content.map(function (_a, i) {
             var heading = _a.heading, text = _a.text;
-            return (React.createElement(React.Fragment, null,
-                React.createElement("div", { className: styles.col },
-                    React.createElement(Heading, { size: "s", level: headingLevel }, heading),
-                    React.createElement(VerticalSpace, { size: "8" }),
-                    React.createElement(Text, { size: "s" }, text)),
-                i !== content.length - 1 && (React.createElement("div", { className: styles.ruleContainer },
-                    React.createElement(Rule, { orientation: isMinWidthArcBreakpointM ? "vertical" : "horizontal" })))));
+            return (React__default.createElement(React__default.Fragment, null,
+                React__default.createElement("div", { className: styles.col },
+                    React__default.createElement(Heading, { size: "s", level: headingLevel }, heading),
+                    React__default.createElement(VerticalSpace, { size: "8" }),
+                    React__default.createElement(Text, { size: "s" }, text)),
+                i !== content.length - 1 && (React__default.createElement("div", { className: styles.ruleContainer },
+                    React__default.createElement(Rule, { orientation: isMinWidthArcBreakpointM ? "vertical" : "horizontal" })))));
         }))));
 };
 

package/lib/ThumbnailSignpost/ThumbnailSignpost.cjs

@@ -1,9 +1,10 @@
 'use strict';
 
-var ThumbnailSignpost = require('../_shared/cjs/ThumbnailSignpost-SBnrGooA.cjs');
-require('../_shared/cjs/filter-attrs-C26zOt4_.cjs');
+var ThumbnailSignpost = require('../_shared/cjs/ThumbnailSignpost-GkOiwt-Z.cjs');
+require('../_shared/cjs/tslib.es6-BxB9I209.cjs');
 require('react');
 require('../_shared/cjs/index-Bp6Dd2i1.cjs');
+require('../_shared/cjs/filter-attrs-BizjMsy0.cjs');
 require('../_shared/cjs/BtIconArrowRightFill-BVCZv7Lm.cjs');
 require('@arc-ui/components/Image');
 require('@arc-ui/components/VerticalSpace');

package/lib/ThumbnailSignpost/ThumbnailSignpost.mjs

@@ -1,7 +1,8 @@
-export { T as ThumbnailSignpost } from '../_shared/esm/ThumbnailSignpost-DaZByYIH.mjs';
-import '../_shared/esm/filter-attrs-D-1kWaCP.mjs';
+export { T as ThumbnailSignpost } from '../_shared/esm/ThumbnailSignpost-BtaHAB0h.mjs';
+import '../_shared/esm/tslib.es6-BVXMhEem.mjs';
 import 'react';
 import '../_shared/esm/index-BfTCfPZ1.mjs';
+import '../_shared/esm/filter-attrs-DZ7RCEZm.mjs';
 import '../_shared/esm/BtIconArrowRightFill-D0zKgk3B.mjs';
 import '@arc-ui/components/Image';
 import '@arc-ui/components/VerticalSpace';

package/lib/VideoHeroCard/VideoHeroCard.cjs

@@ -0,0 +1,77 @@
+'use strict';
+
+var tslib_es6 = require('../_shared/cjs/tslib.es6-BxB9I209.cjs');
+var React = require('react');
+var Visible = require('@arc-ui/components/Visible');
+var Spacing = require('@arc-ui/components/Spacing');
+var VideoCardThumbnail = require('../_shared/cjs/VideoCardThumbnail-N5iC-cAU.cjs');
+var Heading = require('@arc-ui/components/Heading');
+var Icon = require('@arc-ui/components/Icon');
+var Text = require('@arc-ui/components/Text');
+var VerticalSpace = require('@arc-ui/components/VerticalSpace');
+var index = require('../_shared/cjs/index-Bp6Dd2i1.cjs');
+require('../_shared/cjs/filter-attrs-BizjMsy0.cjs');
+
+/**
+ * Do not edit directly
+ * Generated file
+ */
+
+const BtIconCalendar =
+  "data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 32 32'%3e%3cpath fill='currentColor' d='M27 7h-2V4.5a.5.5 0 0 0-1 0V7H8V4.5a.5.5 0 0 0-1 0V7H5a1.003 1.003 0 0 0-1 1v19a1.003 1.003 0 0 0 1 1h22a1.003 1.003 0 0 0 1-1V8a1.003 1.003 0 0 0-1-1M7 8v.5a.5.5 0 0 0 1 0V8h16v.5a.5.5 0 0 0 1 0V8h2v4H5V8ZM5 27V13h22v14Z'/%3e%3c/svg%3e";
+
+/**
+ * Do not edit directly
+ * Generated file
+ */
+
+const BtIconChatMessage =
+  "data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 32 32'%3e%3cpath d='M16 7c7.168 0 13 4.037 13 9a7.79 7.79 0 0 1-3.59 6.184l-.41.3v4.511l-4.535-2.308-.316-.16-.346.073A18.3 18.3 0 0 1 16 25c-7.168 0-13-4.037-13-9s5.832-9 13-9m0-1C8.268 6 2 10.477 2 16s6.268 10 14 10a19.2 19.2 0 0 0 4.012-.422l4.613 2.348A.998.998 0 0 0 26 27v-4.007A8.79 8.79 0 0 0 30 16c0-5.523-6.268-10-14-10'/%3e%3cpath d='M23.5 12h-15a.5.5 0 0 1 0-1h15a.5.5 0 0 1 0 1M25.5 15h-19a.5.5 0 0 1 0-1h19a.5.5 0 0 1 0 1M25.5 18h-19a.5.5 0 0 1 0-1h19a.5.5 0 0 1 0 1M15.5 21h-7a.5.5 0 0 1 0-1h7a.5.5 0 0 1 0 1'/%3e%3c/svg%3e";
+
+/**
+ * Do not edit directly
+ * Generated file
+ */
+
+const BtIconClock =
+  "data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 32 32'%3e%3cpath d='M16 29.984A13.984 13.984 0 1 1 29.984 16 14 14 0 0 1 16 29.984m0-26.968A12.984 12.984 0 1 0 28.984 16 13 13 0 0 0 16 3.016'/%3e%3cpath d='M21.594 15.511h-5.081V8.518a.5.5 0 0 0-1 0v7.993h6.08a.5.5 0 0 0 0-1'/%3e%3c/svg%3e";
+
+var styles = {"mainText--lightBackground":"VideoHeroCardContent-module_mainText--lightBackground__nGl6W","statContainer--lightBackground":"VideoHeroCardContent-module_statContainer--lightBackground__7hXAf","statContainer--darkBackground":"VideoHeroCardContent-module_statContainer--darkBackground__X3-r2","mainText--darkBackground":"VideoHeroCardContent-module_mainText--darkBackground__Pfizt","statContainer":"VideoHeroCardContent-module_statContainer__q21g9","stat":"VideoHeroCardContent-module_stat__iIcoq"};
+
+var VideoHeroCardContent = function (_a) {
+    var title = _a.title, label = _a.label, description = _a.description, videoDate = _a.videoDate, duration = _a.duration, background = _a.background, subtitleAvailabilityText = _a.subtitleAvailabilityText;
+    var id = React.useId();
+    var metaItems = [
+        { icon: BtIconCalendar, text: videoDate },
+        { icon: BtIconClock, text: duration },
+        {
+            icon: BtIconChatMessage,
+            text: subtitleAvailabilityText,
+        },
+    ];
+    var hasMeta = metaItems.some(function (meta) { return Boolean(meta.text); });
+    return (React.createElement("div", { className: styles["".concat(background, "Background")] },
+        React.createElement("div", { className: index.classNames(styles.mainText, styles["mainText--".concat(background, "Background")]) },
+            React.createElement(Heading.Heading, { fontStyle: "overline" }, label),
+            React.createElement(VerticalSpace.VerticalSpace, { size: "8", sizeM: "4" }),
+            React.createElement(Heading.Heading, { level: "3", isWordWrap: false, size: "xl" }, title),
+            React.createElement(VerticalSpace.VerticalSpace, { size: "16" }),
+            React.createElement(Text.Text, null, description)),
+        hasMeta && (React.createElement(React.Fragment, null,
+            React.createElement(VerticalSpace.VerticalSpace, { size: "32", sizeS: "16" }),
+            React.createElement("div", { className: index.classNames(styles.statContainer, styles["statContainer--".concat(background, "Background")]) }, metaItems.map(function (meta, i) {
+                return meta.text && (React.createElement("div", { key: "".concat(id, "-stat-").concat(i), className: styles.stat },
+                    React.createElement(Icon.Icon, { icon: meta.icon, size: 20 }),
+                    React.createElement(Text.Text, { size: "xs" }, meta.text)));
+            }))))));
+};
+
+var VideoHeroCard = function (_a) {
+    var content = _a.content, thumbnailImg = _a.thumbnailImg, player = _a.player, props = tslib_es6.__rest(_a, ["content", "thumbnailImg", "player"]);
+    return (React.createElement(VideoCardThumbnail.VideoCardPlayer, tslib_es6.__assign({ thumbnail: React.createElement(VideoCardThumbnail.VideoCardThumbnail, { src: thumbnailImg, orientation: "landscape", contentVisibility: { l: true, xl: true, xxl: true } },
+            React.createElement(VideoHeroCardContent, tslib_es6.__assign({}, content, { background: "dark" }))), orientation: "landscape", playIconSize: "l", player: player }, props), content && (React.createElement(Visible.Visible, { xs: true, s: true, m: true },
+        React.createElement(Spacing.Spacing, { all: { xs: "16", s: "32" } },
+            React.createElement(VideoHeroCardContent, tslib_es6.__assign({}, content, { background: "light" })))))));
+};
+
+exports.VideoHeroCard = VideoHeroCard;

package/lib/VideoHeroCard/VideoHeroCard.mjs

@@ -0,0 +1,75 @@
+import { _ as __rest, a as __assign } from '../_shared/esm/tslib.es6-BVXMhEem.mjs';
+import React__default, { useId } from 'react';
+import { Visible } from '@arc-ui/components/Visible';
+import { Spacing } from '@arc-ui/components/Spacing';
+import { V as VideoCardPlayer, a as VideoCardThumbnail } from '../_shared/esm/VideoCardThumbnail-Tbh7Xi-X.mjs';
+import { Heading } from '@arc-ui/components/Heading';
+import { Icon } from '@arc-ui/components/Icon';
+import { Text } from '@arc-ui/components/Text';
+import { VerticalSpace } from '@arc-ui/components/VerticalSpace';
+import { c as classNames } from '../_shared/esm/index-BfTCfPZ1.mjs';
+import '../_shared/esm/filter-attrs-DZ7RCEZm.mjs';
+
+/**
+ * Do not edit directly
+ * Generated file
+ */
+
+const BtIconCalendar =
+  "data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 32 32'%3e%3cpath fill='currentColor' d='M27 7h-2V4.5a.5.5 0 0 0-1 0V7H8V4.5a.5.5 0 0 0-1 0V7H5a1.003 1.003 0 0 0-1 1v19a1.003 1.003 0 0 0 1 1h22a1.003 1.003 0 0 0 1-1V8a1.003 1.003 0 0 0-1-1M7 8v.5a.5.5 0 0 0 1 0V8h16v.5a.5.5 0 0 0 1 0V8h2v4H5V8ZM5 27V13h22v14Z'/%3e%3c/svg%3e";
+
+/**
+ * Do not edit directly
+ * Generated file
+ */
+
+const BtIconChatMessage =
+  "data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 32 32'%3e%3cpath d='M16 7c7.168 0 13 4.037 13 9a7.79 7.79 0 0 1-3.59 6.184l-.41.3v4.511l-4.535-2.308-.316-.16-.346.073A18.3 18.3 0 0 1 16 25c-7.168 0-13-4.037-13-9s5.832-9 13-9m0-1C8.268 6 2 10.477 2 16s6.268 10 14 10a19.2 19.2 0 0 0 4.012-.422l4.613 2.348A.998.998 0 0 0 26 27v-4.007A8.79 8.79 0 0 0 30 16c0-5.523-6.268-10-14-10'/%3e%3cpath d='M23.5 12h-15a.5.5 0 0 1 0-1h15a.5.5 0 0 1 0 1M25.5 15h-19a.5.5 0 0 1 0-1h19a.5.5 0 0 1 0 1M25.5 18h-19a.5.5 0 0 1 0-1h19a.5.5 0 0 1 0 1M15.5 21h-7a.5.5 0 0 1 0-1h7a.5.5 0 0 1 0 1'/%3e%3c/svg%3e";
+
+/**
+ * Do not edit directly
+ * Generated file
+ */
+
+const BtIconClock =
+  "data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 32 32'%3e%3cpath d='M16 29.984A13.984 13.984 0 1 1 29.984 16 14 14 0 0 1 16 29.984m0-26.968A12.984 12.984 0 1 0 28.984 16 13 13 0 0 0 16 3.016'/%3e%3cpath d='M21.594 15.511h-5.081V8.518a.5.5 0 0 0-1 0v7.993h6.08a.5.5 0 0 0 0-1'/%3e%3c/svg%3e";
+
+var styles = {"mainText--lightBackground":"VideoHeroCardContent-module_mainText--lightBackground__nGl6W","statContainer--lightBackground":"VideoHeroCardContent-module_statContainer--lightBackground__7hXAf","statContainer--darkBackground":"VideoHeroCardContent-module_statContainer--darkBackground__X3-r2","mainText--darkBackground":"VideoHeroCardContent-module_mainText--darkBackground__Pfizt","statContainer":"VideoHeroCardContent-module_statContainer__q21g9","stat":"VideoHeroCardContent-module_stat__iIcoq"};
+
+var VideoHeroCardContent = function (_a) {
+    var title = _a.title, label = _a.label, description = _a.description, videoDate = _a.videoDate, duration = _a.duration, background = _a.background, subtitleAvailabilityText = _a.subtitleAvailabilityText;
+    var id = useId();
+    var metaItems = [
+        { icon: BtIconCalendar, text: videoDate },
+        { icon: BtIconClock, text: duration },
+        {
+            icon: BtIconChatMessage,
+            text: subtitleAvailabilityText,
+        },
+    ];
+    var hasMeta = metaItems.some(function (meta) { return Boolean(meta.text); });
+    return (React__default.createElement("div", { className: styles["".concat(background, "Background")] },
+        React__default.createElement("div", { className: classNames(styles.mainText, styles["mainText--".concat(background, "Background")]) },
+            React__default.createElement(Heading, { fontStyle: "overline" }, label),
+            React__default.createElement(VerticalSpace, { size: "8", sizeM: "4" }),
+            React__default.createElement(Heading, { level: "3", isWordWrap: false, size: "xl" }, title),
+            React__default.createElement(VerticalSpace, { size: "16" }),
+            React__default.createElement(Text, null, description)),
+        hasMeta && (React__default.createElement(React__default.Fragment, null,
+            React__default.createElement(VerticalSpace, { size: "32", sizeS: "16" }),
+            React__default.createElement("div", { className: classNames(styles.statContainer, styles["statContainer--".concat(background, "Background")]) }, metaItems.map(function (meta, i) {
+                return meta.text && (React__default.createElement("div", { key: "".concat(id, "-stat-").concat(i), className: styles.stat },
+                    React__default.createElement(Icon, { icon: meta.icon, size: 20 }),
+                    React__default.createElement(Text, { size: "xs" }, meta.text)));
+            }))))));
+};
+
+var VideoHeroCard = function (_a) {
+    var content = _a.content, thumbnailImg = _a.thumbnailImg, player = _a.player, props = __rest(_a, ["content", "thumbnailImg", "player"]);
+    return (React__default.createElement(VideoCardPlayer, __assign({ thumbnail: React__default.createElement(VideoCardThumbnail, { src: thumbnailImg, orientation: "landscape", contentVisibility: { l: true, xl: true, xxl: true } },
+            React__default.createElement(VideoHeroCardContent, __assign({}, content, { background: "dark" }))), orientation: "landscape", playIconSize: "l", player: player }, props), content && (React__default.createElement(Visible, { xs: true, s: true, m: true },
+        React__default.createElement(Spacing, { all: { xs: "16", s: "32" } },
+            React__default.createElement(VideoHeroCardContent, __assign({}, content, { background: "light" })))))));
+};
+
+export { VideoHeroCard };

package/lib/VideoPortraitCard/VideoPortraitCard.cjs

@@ -0,0 +1,23 @@
+'use strict';
+
+var tslib_es6 = require('../_shared/cjs/tslib.es6-BxB9I209.cjs');
+var React = require('react');
+var Heading = require('@arc-ui/components/Heading');
+var Surface = require('@arc-ui/components/Surface');
+var VerticalSpace = require('@arc-ui/components/VerticalSpace');
+var VideoCardThumbnail = require('../_shared/cjs/VideoCardThumbnail-N5iC-cAU.cjs');
+require('../_shared/cjs/index-Bp6Dd2i1.cjs');
+require('../_shared/cjs/filter-attrs-BizjMsy0.cjs');
+require('@arc-ui/components/Icon');
+require('@arc-ui/components/Visible');
+
+var VideoPortraitCard = function (_a) {
+    var thumbnail = _a.thumbnail, player = _a.player, props = tslib_es6.__rest(_a, ["thumbnail", "player"]);
+    return (React.createElement(VideoCardThumbnail.VideoCardPlayer, tslib_es6.__assign({ thumbnail: thumbnail && (React.createElement(VideoCardThumbnail.VideoCardThumbnail, { orientation: "portrait", src: thumbnail.img },
+            React.createElement(Surface.Surface, { isTransparent: true, background: "dark-black" },
+                React.createElement(Heading.Heading, { fontStyle: "overline" }, thumbnail.label),
+                React.createElement(VerticalSpace.VerticalSpace, { size: "8" }),
+                React.createElement(Heading.Heading, { level: "3", isWordWrap: false, size: "xs" }, thumbnail.title)))), orientation: "portrait", player: player, playIconSize: "s" }, props)));
+};
+
+exports.VideoPortraitCard = VideoPortraitCard;

package/lib/VideoPortraitCard/VideoPortraitCard.mjs

@@ -0,0 +1,21 @@
+import { _ as __rest, a as __assign } from '../_shared/esm/tslib.es6-BVXMhEem.mjs';
+import React__default from 'react';
+import { Heading } from '@arc-ui/components/Heading';
+import { Surface } from '@arc-ui/components/Surface';
+import { VerticalSpace } from '@arc-ui/components/VerticalSpace';
+import { V as VideoCardPlayer, a as VideoCardThumbnail } from '../_shared/esm/VideoCardThumbnail-Tbh7Xi-X.mjs';
+import '../_shared/esm/index-BfTCfPZ1.mjs';
+import '../_shared/esm/filter-attrs-DZ7RCEZm.mjs';
+import '@arc-ui/components/Icon';
+import '@arc-ui/components/Visible';
+
+var VideoPortraitCard = function (_a) {
+    var thumbnail = _a.thumbnail, player = _a.player, props = __rest(_a, ["thumbnail", "player"]);
+    return (React__default.createElement(VideoCardPlayer, __assign({ thumbnail: thumbnail && (React__default.createElement(VideoCardThumbnail, { orientation: "portrait", src: thumbnail.img },
+            React__default.createElement(Surface, { isTransparent: true, background: "dark-black" },
+                React__default.createElement(Heading, { fontStyle: "overline" }, thumbnail.label),
+                React__default.createElement(VerticalSpace, { size: "8" }),
+                React__default.createElement(Heading, { level: "3", isWordWrap: false, size: "xs" }, thumbnail.title)))), orientation: "portrait", player: player, playIconSize: "s" }, props)));
+};
+
+export { VideoPortraitCard };

package/lib/_shared/cjs/{Accordion-QqDoB3pY.cjs → Accordion-DfNGOjTm.cjs}

@@ -1,7 +1,8 @@
 'use strict';
 
-var filterAttrs = require('./filter-attrs-C26zOt4_.cjs');
+var tslib_es6 = require('./tslib.es6-BxB9I209.cjs');
 var React = require('react');
+var filterAttrs = require('./filter-attrs-BizjMsy0.cjs');
 var index = require('./index-Bp6Dd2i1.cjs');
 var Heading = require('@arc-ui/components/Heading');
 var Text = require('@arc-ui/components/Text');
@@ -13,15 +14,15 @@ var styles$2 = {"accordion-header":"AccordionHeading-module_accordion-header__8s
 
 var AccordionHeading = function (_a) {
     var _b, _c;
-    var heading = _a.heading, content = _a.content, id = _a.id, _d = _a.isPadded, isPadded = _d === void 0 ? false : _d, _e = _a.headingLevel, headingLevel = _e === void 0 ? "2" : _e, _f = _a.headingSize, headingSize = _f === void 0 ? "xl" : _f, image = _a.image, props = filterAttrs.__rest(_a, ["heading", "content", "id", "isPadded", "headingLevel", "headingSize", "image"]);
-    return (React.createElement("div", filterAttrs.__assign({ className: index.classNames((_b = {},
+    var heading = _a.heading, content = _a.content, id = _a.id, _d = _a.isPadded, isPadded = _d === void 0 ? false : _d, _e = _a.headingLevel, headingLevel = _e === void 0 ? "2" : _e, _f = _a.headingSize, headingSize = _f === void 0 ? "xl" : _f, image = _a.image, props = tslib_es6.__rest(_a, ["heading", "content", "id", "isPadded", "headingLevel", "headingSize", "image"]);
+    return (React.createElement("div", tslib_es6.__assign({ className: index.classNames((_b = {},
             _b[styles$2["accordion-header"]] = true,
             _b[styles$2["accordion-header--padded"]] = isPadded,
             _b[styles$2["accordion-header--headingSizeM"]] = headingSize === "m",
             _b)) }, filterAttrs.filterAttrs(props)),
         React.createElement("div", { className: index.classNames((_c = {}, _c[styles$2["accordion-header--hasImage"]] = image, _c)) },
             image && (React.createElement("div", null,
-                React.createElement(Image.Image, filterAttrs.__assign({}, image, { width: 68, fit: "cover" })))),
+                React.createElement(Image.Image, tslib_es6.__assign({}, image, { width: 68, fit: "cover" })))),
             React.createElement(Heading.Heading, { level: headingLevel, id: id, size: headingSize }, heading)),
         content && (React.createElement(React.Fragment, null,
             headingSize === "xl" ? (React.createElement(VerticalSpace.VerticalSpace, { size: "24" })) : (React.createElement(VerticalSpace.VerticalSpace, { size: "8", sizeL: "12", sizeXL: "16" })),
@@ -33,9 +34,9 @@ var styles$1 = {"AccordionDisclosureListItem":"AccordionDisclosureList-module_Ac
 var AccordionDisclosureList = function (_a) {
     var disclosureList = _a.disclosureList;
     return (React.createElement("ul", null, disclosureList.map(function (_a) {
-        var children = _a.children, summary = _a.summary, _b = _a.isOpen, isOpen = _b === void 0 ? false : _b, _c = _a.indentDetails, indentDetails = _c === void 0 ? false : _c, headingLevel = _a.headingLevel, id = _a.id, props = filterAttrs.__rest(_a, ["children", "summary", "isOpen", "indentDetails", "headingLevel", "id"]);
+        var children = _a.children, summary = _a.summary, _b = _a.isOpen, isOpen = _b === void 0 ? false : _b, _c = _a.indentDetails, indentDetails = _c === void 0 ? false : _c, headingLevel = _a.headingLevel, id = _a.id, props = tslib_es6.__rest(_a, ["children", "summary", "isOpen", "indentDetails", "headingLevel", "id"]);
         return (React.createElement("li", { key: id, className: styles$1.AccordionDisclosureListItem, id: id },
-            React.createElement(Disclosure.Disclosure, filterAttrs.__assign({ summary: summary, isOpen: isOpen, indentDetails: indentDetails, headingLevel: headingLevel }, filterAttrs.filterAttrs(props)), children)));
+            React.createElement(Disclosure.Disclosure, tslib_es6.__assign({ summary: summary, isOpen: isOpen, indentDetails: indentDetails, headingLevel: headingLevel }, filterAttrs.filterAttrs(props)), children)));
     })));
 };
 
@@ -45,8 +46,8 @@ var styles = {"Accordion":"Accordion-module_Accordion__LsXTU"};
  * Use the `Accordion` component to package together a title, content and a number of disclosure components into one section (maximum 10).
  */
 var Accordion = function (_a) {
-    var heading = _a.heading, headingLevel = _a.headingLevel, headingSize = _a.headingSize, content = _a.content, id = _a.id, disclosureList = _a.disclosureList, props = filterAttrs.__rest(_a, ["heading", "headingLevel", "headingSize", "content", "id", "disclosureList"]);
-    return (React.createElement("div", filterAttrs.__assign({ className: styles.Accordion }, filterAttrs.filterAttrs(props)),
+    var heading = _a.heading, headingLevel = _a.headingLevel, headingSize = _a.headingSize, content = _a.content, id = _a.id, disclosureList = _a.disclosureList, props = tslib_es6.__rest(_a, ["heading", "headingLevel", "headingSize", "content", "id", "disclosureList"]);
+    return (React.createElement("div", tslib_es6.__assign({ className: styles.Accordion }, filterAttrs.filterAttrs(props)),
         React.createElement(AccordionHeading, { isPadded: true, id: id, "data-testid": "Accordion-header", heading: heading, headingLevel: headingLevel, headingSize: headingSize, content: content }),
         React.createElement(AccordionDisclosureList, { disclosureList: disclosureList })));
 };

package/lib/_shared/cjs/{Author-aL8YXi7C.cjs → Author-D4dKNQem.cjs}

@@ -1,7 +1,8 @@
 'use strict';
 
-var filterAttrs = require('./filter-attrs-C26zOt4_.cjs');
+var tslib_es6 = require('./tslib.es6-BxB9I209.cjs');
 var React = require('react');
+var filterAttrs = require('./filter-attrs-BizjMsy0.cjs');
 var Grid = require('@arc-ui/components/Grid');
 var Avatar = require('@arc-ui/components/Avatar');
 var Heading = require('@arc-ui/components/Heading');
@@ -10,16 +11,16 @@ var Text = require('@arc-ui/components/Text');
 var styles = {"authorContent":"Author-module_authorContent__TBY7b","largeAvatar":"Author-module_largeAvatar__Vco03"};
 
 var Author = function (_a) {
-    var name = _a.name, title = _a.title, _b = _a.avatar, avatar = _b === void 0 ? {} : _b, props = filterAttrs.__rest(_a, ["name", "title", "avatar"]);
+    var name = _a.name, title = _a.title, _b = _a.avatar, avatar = _b === void 0 ? {} : _b, props = tslib_es6.__rest(_a, ["name", "title", "avatar"]);
     var avatarSizes = ["s", "m", "l", "xl"];
     avatar.size = avatarSizes.includes(avatar.size || "") ? avatar.size : "m";
     var isLargeAvatar = avatar.size === "l" || avatar.size === "xl";
-    return (React.createElement("div", filterAttrs.__assign({}, filterAttrs.filterAttrs(props)),
+    return (React.createElement("div", tslib_es6.__assign({}, filterAttrs.filterAttrs(props)),
         React.createElement(Grid.Grid, { isFluid: true, isGutterless: true },
             React.createElement(Grid.GridRow, { align: "center" },
                 React.createElement(Grid.GridCol, { xs: isLargeAvatar ? 12 : "auto" },
                     React.createElement("div", { className: isLargeAvatar ? styles.largeAvatar : undefined },
-                        React.createElement(Avatar.Avatar, filterAttrs.__assign({}, avatar)))),
+                        React.createElement(Avatar.Avatar, tslib_es6.__assign({}, avatar)))),
                 React.createElement(Grid.GridCol, null,
                     React.createElement("div", { className: "".concat(!isLargeAvatar && styles.authorContent), "data-testid": "authorContent" },
                         React.createElement(Heading.Heading, { size: "xs" }, name),

package/lib/_shared/cjs/Preview-Dx1kCzJ1.cjs

@@ -0,0 +1,102 @@
+'use strict';
+
+var React = require('react');
+
+const ICON_SIZE = "64px";
+const cache = {};
+const Preview = ({
+  src,
+  light,
+  oEmbedUrl,
+  onClickPreview,
+  playIcon,
+  previewTabIndex,
+  previewAriaLabel
+}) => {
+  const [image, setImage] = React.useState(null);
+  React.useEffect(() => {
+    if (!src || !light || !oEmbedUrl) return;
+    fetchImage({ src, light, oEmbedUrl });
+  }, [src, light, oEmbedUrl]);
+  const fetchImage = async ({
+    src: src2,
+    light: light2,
+    oEmbedUrl: oEmbedUrl2
+  }) => {
+    if (React.isValidElement(light2)) {
+      return;
+    }
+    if (typeof light2 === "string") {
+      setImage(light2);
+      return;
+    }
+    if (cache[src2]) {
+      setImage(cache[src2]);
+      return;
+    }
+    setImage(null);
+    const response = await fetch(oEmbedUrl2.replace("{url}", src2));
+    const data = await response.json();
+    if (data.thumbnail_url) {
+      const fetchedImage = data.thumbnail_url.replace("height=100", "height=480").replace("-d_295x166", "-d_640");
+      setImage(fetchedImage);
+      cache[src2] = fetchedImage;
+    }
+  };
+  const handleKeyPress = (e) => {
+    if (e.key === "Enter" || e.key === " ") {
+      onClickPreview == null ? void 0 : onClickPreview(e);
+    }
+  };
+  const handleClick = (e) => {
+    onClickPreview == null ? void 0 : onClickPreview(e);
+  };
+  const isElement = React.isValidElement(light);
+  const flexCenter = {
+    display: "flex",
+    alignItems: "center",
+    justifyContent: "center"
+  };
+  const styles = {
+    preview: {
+      width: "100%",
+      height: "100%",
+      backgroundImage: image && !isElement ? `url(${image})` : void 0,
+      backgroundSize: "cover",
+      backgroundPosition: "center",
+      cursor: "pointer",
+      ...flexCenter
+    },
+    shadow: {
+      background: "radial-gradient(rgb(0, 0, 0, 0.3), rgba(0, 0, 0, 0) 60%)",
+      borderRadius: ICON_SIZE,
+      width: ICON_SIZE,
+      height: ICON_SIZE,
+      position: isElement ? "absolute" : void 0,
+      ...flexCenter
+    },
+    playIcon: {
+      borderStyle: "solid",
+      borderWidth: "16px 0 16px 26px",
+      borderColor: "transparent transparent transparent white",
+      marginLeft: "7px"
+    }
+  };
+  const defaultPlayIcon = /* @__PURE__ */ React.createElement("div", { style: styles.shadow, className: "react-player__shadow" }, /* @__PURE__ */ React.createElement("div", { style: styles.playIcon, className: "react-player__play-icon" }));
+  return /* @__PURE__ */ React.createElement(
+    "div",
+    {
+      style: styles.preview,
+      className: "react-player__preview",
+      tabIndex: previewTabIndex,
+      onClick: handleClick,
+      onKeyDown: handleKeyPress,
+      ...previewAriaLabel ? { "aria-label": previewAriaLabel } : {}
+    },
+    isElement ? light : null,
+    playIcon || defaultPlayIcon
+  );
+};
+var Preview_default = Preview;
+
+exports.default = Preview_default;

package/lib/_shared/cjs/{SectionHeading-Dj-dJfv3.cjs → SectionHeading-DeSFM0HV.cjs}

@@ -1,8 +1,9 @@
 'use strict';
 
-var filterAttrs = require('./filter-attrs-C26zOt4_.cjs');
+var tslib_es6 = require('./tslib.es6-BxB9I209.cjs');
 var React = require('react');
 var index = require('./index-Bp6Dd2i1.cjs');
+var filterAttrs = require('./filter-attrs-BizjMsy0.cjs');
 var Text = require('@arc-ui/components/Text');
 var VerticalSpace = require('@arc-ui/components/VerticalSpace');
 var Image = require('@arc-ui/components/Image');
@@ -12,14 +13,14 @@ var styles = {"section-header":"SectionHeading-module_section-header__iB07I","se
 
 var SectionHeading = function (_a) {
     var _b, _c;
-    var heading = _a.heading, content = _a.content, id = _a.id, image = _a.image, isHeadingWordWrap = _a.isHeadingWordWrap, _d = _a.isPadded, isPadded = _d === void 0 ? false : _d, _e = _a.headingLevel, headingLevel = _e === void 0 ? "2" : _e, props = filterAttrs.__rest(_a, ["heading", "content", "id", "image", "isHeadingWordWrap", "isPadded", "headingLevel"]);
-    return (React.createElement("div", filterAttrs.__assign({ className: index.classNames((_b = {},
+    var heading = _a.heading, content = _a.content, id = _a.id, image = _a.image, isHeadingWordWrap = _a.isHeadingWordWrap, _d = _a.isPadded, isPadded = _d === void 0 ? false : _d, _e = _a.headingLevel, headingLevel = _e === void 0 ? "2" : _e, props = tslib_es6.__rest(_a, ["heading", "content", "id", "image", "isHeadingWordWrap", "isPadded", "headingLevel"]);
+    return (React.createElement("div", tslib_es6.__assign({ className: index.classNames((_b = {},
             _b[styles["section-header"]] = true,
             _b[styles["section-header--padded"]] = isPadded,
             _b)) }, filterAttrs.filterAttrs(props)),
         React.createElement("div", { className: index.classNames((_c = {}, _c[styles["section-header--hasImage"]] = image, _c)) },
             image && (React.createElement("div", null,
-                React.createElement(Image.Image, filterAttrs.__assign({}, image, { width: 68, fit: "cover" })))),
+                React.createElement(Image.Image, tslib_es6.__assign({}, image, { width: 68, fit: "cover" })))),
             React.createElement(Heading.Heading, { level: headingLevel, id: id, size: "xl", isWordWrap: isHeadingWordWrap }, heading)),
         content && (React.createElement(React.Fragment, null,
             React.createElement(VerticalSpace.VerticalSpace, { size: "24" }),

package/lib/_shared/cjs/{ThumbnailSignpost-SBnrGooA.cjs → ThumbnailSignpost-GkOiwt-Z.cjs}

@@ -1,8 +1,9 @@
 'use strict';
 
-var filterAttrs = require('./filter-attrs-C26zOt4_.cjs');
+var tslib_es6 = require('./tslib.es6-BxB9I209.cjs');
 var React = require('react');
 var index = require('./index-Bp6Dd2i1.cjs');
+var filterAttrs = require('./filter-attrs-BizjMsy0.cjs');
 var BtIconArrowRightFill = require('./BtIconArrowRightFill-BVCZv7Lm.cjs');
 var Image = require('@arc-ui/components/Image');
 var VerticalSpace = require('@arc-ui/components/VerticalSpace');
@@ -13,12 +14,12 @@ var styles = {"thumbnailSignpost":"ThumbnailSignpost-module_thumbnailSignpost__Y
 /** Use `ThumbnailSignpost` to highlight key information or navigation points with an accompanying thumbnail image or icon. */
 var ThumbnailSignpost = function (_a) {
     var _b;
-    var text = _a.text, title = _a.title, img = _a.img, onClick = _a.onClick, buttonLabel = _a.buttonLabel, props = filterAttrs.__rest(_a, ["text", "title", "img", "onClick", "buttonLabel"]);
-    return (React.createElement("div", filterAttrs.__assign({ className: index.classNames(styles.thumbnailSignpost, (_b = {},
+    var text = _a.text, title = _a.title, img = _a.img, onClick = _a.onClick, buttonLabel = _a.buttonLabel, props = tslib_es6.__rest(_a, ["text", "title", "img", "onClick", "buttonLabel"]);
+    return (React.createElement("div", tslib_es6.__assign({ className: index.classNames(styles.thumbnailSignpost, (_b = {},
             _b[styles.isLink] = onClick,
             _b)), onClick: onClick, "aria-label": title, tabIndex: onClick ? 0 : -1 }, (onClick && { role: "button" }), filterAttrs.filterAttrs(props)),
         img && (React.createElement("div", { className: styles.image },
-            React.createElement(Image.Image, filterAttrs.__assign({}, img)))),
+            React.createElement(Image.Image, tslib_es6.__assign({}, img)))),
         React.createElement("div", { className: styles.content },
             React.createElement("span", { className: styles.heading }, title),
             React.createElement(VerticalSpace.VerticalSpace, { size: "8" }),