@royaloperahouse/harmonic 1.0.3 → 1.0.5-a

package/dist/harmonic.esm.js

@@ -228,6 +228,26 @@ styleInject(css_248z);
 var _excluded = ["children", "size", "em", "color", "serif", "hierarchy", "tag", "className"],
   _excluded2 = ["children", "size", "color", "className", "bold", "tag"],
   _excluded3 = ["children", "size", "color", "className"];
+/* ~~~ Display - (use case) ~~~ */
+var DisplayHeader = function DisplayHeader(_ref) {
+  var children = _ref.children,
+    size = _ref.size,
+    em = _ref.em,
+    _ref$color = _ref.color,
+    color = _ref$color === void 0 ? 'inherit' : _ref$color,
+    serif = _ref.serif,
+    className = _ref.className;
+  var classNames = createClassNames('display', {
+    size: size,
+    color: color,
+    serif: serif,
+    em: em,
+    className: className
+  }, typographyStyles);
+  return /*#__PURE__*/React__default.createElement("h1", {
+    className: classNames
+  }, children);
+};
 /* ~~~ Headers - size and hierarchy set separately ~~~ */
 var HarmonicHeader = function HarmonicHeader(_ref2) {
   var _ref3;
@@ -6846,7 +6866,6 @@ var Swipe = /*#__PURE__*/forwardRef(function (_ref, ref) {
 });
 Swipe.displayName = 'Swipe';
 
-var _excluded$i = ["name", "image", "onClick"];
 var CastFilters = function CastFilters(_ref) {
   var cast = _ref.cast,
     headingText = _ref.headingText,
@@ -6985,23 +7004,26 @@ var CastFilters = function CastFilters(_ref) {
       var name = person.name,
         image = person.image,
         _onClick = person.onClick,
-        rest = _objectWithoutPropertiesLoose(person, _excluded$i);
+        ariaLabel = person['aria-label'];
       var isSelected = selectedIndices.includes(index);
       var personImage = image || placeholderImage || defaultPlaceholderImage;
       return /*#__PURE__*/React__default.createElement(PersonWrapper, {
         key: index,
         "aria-selected": isSelected,
+        "aria-label": ariaLabel || (isSelected ? 'Deselect' : 'Select') + " " + name,
+        "aria-posinset": index + 1,
+        "aria-setsize": cast.length,
         role: "option",
         tabIndex: 0,
         onKeyDown: function onKeyDown(e) {
           return handlePersonKeydown(e, index, _onClick);
         }
-      }, /*#__PURE__*/React__default.createElement(PersonToggle, Object.assign({
+      }, /*#__PURE__*/React__default.createElement(PersonToggle, {
         isSelected: isSelected,
         onClick: function onClick() {
           return handleClick(index, _onClick);
         }
-      }, rest), /*#__PURE__*/React__default.createElement(PersonImage, {
+      }, /*#__PURE__*/React__default.createElement(PersonImage, {
         src: personImage,
         alt: image ? name : "Placeholder image for " + name,
         draggable: false,
@@ -7039,7 +7061,6 @@ var CastFilters = function CastFilters(_ref) {
     ref: castWrapperRef,
     role: "listbox",
     "aria-roledescription": listRoleDescription != null ? listRoleDescription : 'filter list',
-    "aria-label": "filter list",
     "aria-multiselectable": true,
     onMouseDown: handleMouseDown,
     onMouseMove: handleMouseMove,
@@ -7308,7 +7329,7 @@ var HotFiltersWrapper = /*#__PURE__*/styled.div(_templateObject$O || (_templateO
 var HotFilterOptionsWrapper = /*#__PURE__*/styled.div(_templateObject2$B || (_templateObject2$B = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  display: flex;\n  flex-direction: row;\n  width: fit-content;\n  min-width: 400px;\n  justify-content: space-between;\n  gap: 16px;\n  font-family: var(--font-family-sans);\n\n  @media ", " {\n    gap: 10px;\n  }\n"])), devices.mobile);
 var StyledHotFiltersButton = /*#__PURE__*/styled(PrimaryButton)(_templateObject3$o || (_templateObject3$o = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  border: 1px solid var(--color-base-black);\n  min-width: fit-content;\n\n  :hover {\n    color: var(--color-base-white);\n  }\n"])));
 
-var _excluded$j = ["text", "onClick"];
+var _excluded$i = ["text", "onClick"];
 var HotFilters = function HotFilters(_ref) {
   var items = _ref.items,
     className = _ref.className,
@@ -7324,7 +7345,7 @@ var HotFilters = function HotFilters(_ref) {
   }, /*#__PURE__*/React__default.createElement(HotFilterOptionsWrapper, null, items.map(function (item, index) {
     var text = item.text,
       _onClick = item.onClick,
-      rest = _objectWithoutPropertiesLoose(item, _excluded$j);
+      rest = _objectWithoutPropertiesLoose(item, _excluded$i);
     var isSelected = index === selectedIndex;
     return /*#__PURE__*/React__default.createElement(StyledHotFiltersButton, Object.assign({
       key: index,
@@ -7777,7 +7798,7 @@ var VideoControlsImpact = function VideoControlsImpact(_ref) {
   })))));
 };
 
-var _excluded$k = ["text"];
+var _excluded$j = ["text"];
 var CHAR_LIMIT = 100;
 var useResponsiveVideo = function useResponsiveVideo(video, poster) {
   var mobileVideo = video.mobile || video.desktop;
@@ -7899,7 +7920,7 @@ var PageHeadingImpact = function PageHeadingImpact(_ref4) {
   var truncatedText = text && text.length > CHAR_LIMIT ? text.slice(0, CHAR_LIMIT).trimEnd() + "\u2026" : text;
   var _ref5 = link || {},
     linkText = _ref5.text,
-    restLink = _objectWithoutPropertiesLoose(_ref5, _excluded$k);
+    restLink = _objectWithoutPropertiesLoose(_ref5, _excluded$j);
   var video = {
     elementId: 'impact-header-video',
     desktop: videoUrlDesktop,
@@ -8376,7 +8397,7 @@ var CompactHeaderBranding = function CompactHeaderBranding(_ref) {
   return /*#__PURE__*/React__default.createElement(CompactHeaderLogoWrapper, null, renderBranding(brandingStyle, invert, brandingText, brandingLink));
 };
 
-var _excluded$l = ["text"];
+var _excluded$k = ["text"];
 var useResponsiveVideo$1 = function useResponsiveVideo(video, poster) {
   var mobileVideo = video.mobile || video.desktop;
   var desktopVideo = video.desktop || video.mobile;
@@ -8481,7 +8502,7 @@ var PageHeadingCompact = function PageHeadingCompact(_ref4) {
     showCopy = _ref4$showCopy === void 0 ? true : _ref4$showCopy;
   var _ref5 = link || {},
     linkText = _ref5.text,
-    restLink = _objectWithoutPropertiesLoose(_ref5, _excluded$l);
+    restLink = _objectWithoutPropertiesLoose(_ref5, _excluded$k);
   // const titleSize = title && title.length > 20 ? 4 : 3;
   var video = {
     elementId: 'compact-header-video',
@@ -9065,7 +9086,7 @@ var HarmonicHeaderWithWrapper = /*#__PURE__*/styled(HarmonicHeader)(_templateObj
 var BodyCopyHarmonicWithWrapper$1 = /*#__PURE__*/styled(BodyCopyHarmonic)(_templateObject16 || (_templateObject16 = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  padding: 0;\n  margin: 0;\n  margin-bottom: 32px;\n  whiete-space: break-spaces;\n  overflow-wrap: break-word;\n\n  a {\n    text-decoration: underline;\n    cursor: pointer;\n\n    &[href^='tel:'] {\n      text-decoration: none;\n    }\n\n    &:link {\n      color: var(--color-primary-black);\n    }\n\n    &:visited {\n      color: var(--color-base-dark-grey);\n    }\n\n    &:hover {\n      color: var(--color-primary-red);\n    }\n  }\n  @media ", " {\n    margin-bottom: 24px;\n  }\n"])), devices.mobile);
 var HarmonicSubtitleWithWrapper = /*#__PURE__*/styled(HarmonicSubtitle)(_templateObject17 || (_templateObject17 = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  overflow-wrap: break-word;\n  margin-bottom: 16px;\n"])));
 
-var _excluded$m = ["text"],
+var _excluded$l = ["text"],
   _excluded2$2 = ["text"],
   _excluded3$1 = ["text"];
 var _buttonTypeToButton$1;
@@ -9133,7 +9154,7 @@ var PromoWithTags = function PromoWithTags(_ref) {
   var _ref2 = firstButton || {},
     _ref2$text = _ref2.text,
     firstButtonText = _ref2$text === void 0 ? '' : _ref2$text,
-    restFirstButton = _objectWithoutPropertiesLoose(_ref2, _excluded$m);
+    restFirstButton = _objectWithoutPropertiesLoose(_ref2, _excluded$l);
   var primaryButtonTextTruncate = truncate(firstButtonText, LENGTH_TEXT$1);
   var secondButton = links == null ? void 0 : links[1];
   var _ref3 = secondButton || {},
@@ -9417,7 +9438,7 @@ var PromoChild = function PromoChild(_ref) {
   }));
 };
 
-var _excluded$n = ["text"],
+var _excluded$m = ["text"],
   _excluded2$3 = ["text"];
 var LENGTH_TEXT$3 = 28;
 var PromoWithTitle = function PromoWithTitle(_ref) {
@@ -9444,7 +9465,7 @@ var PromoWithTitle = function PromoWithTitle(_ref) {
   var _ref2 = primaryButton || {},
     _ref2$text = _ref2.text,
     primaryButtonText = _ref2$text === void 0 ? '' : _ref2$text,
-    restPrimaryButton = _objectWithoutPropertiesLoose(_ref2, _excluded$n);
+    restPrimaryButton = _objectWithoutPropertiesLoose(_ref2, _excluded$m);
   var primaryButtonTextTruncate = truncate(primaryButtonText, LENGTH_TEXT$3);
   var tertiaryButton = links == null ? void 0 : links[1];
   var _ref3 = tertiaryButton || {},
@@ -9883,7 +9904,7 @@ var ErrorLabel$5 = /*#__PURE__*/styled.div(_templateObject4$y || (_templateObjec
   return "var(--color-state-error)";
 });
 
-var _excluded$o = ["label", "error", "width", "darkMode", "isSearchable", "components", "className"];
+var _excluded$n = ["label", "error", "width", "darkMode", "isSearchable", "components", "className"];
 var DropdownIndicator = function DropdownIndicator(props) {
   return /*#__PURE__*/React__default.createElement(components.DropdownIndicator, Object.assign({}, props), /*#__PURE__*/React__default.createElement(Icon, {
     iconName: "DropdownArrow"
@@ -9938,7 +9959,7 @@ var SelectComponent = function SelectComponent(_ref2) {
     isSearchable = _ref2$isSearchable === void 0 ? false : _ref2$isSearchable,
     components = _ref2.components,
     className = _ref2.className,
-    selectProps = _objectWithoutPropertiesLoose(_ref2, _excluded$o);
+    selectProps = _objectWithoutPropertiesLoose(_ref2, _excluded$n);
   return /*#__PURE__*/React__default.createElement(WrapperComponent, {
     label: label,
     error: error,
@@ -9957,7 +9978,7 @@ var SelectComponent = function SelectComponent(_ref2) {
   })));
 };
 
-var _excluded$p = ["label", "error", "width", "darkMode", "components"];
+var _excluded$o = ["label", "error", "width", "darkMode", "components"];
 /**
  * The Select2Async component is similar to Select 2, but uses react-select async
  * component for select instead of regular react-select component. This can be used
@@ -9979,7 +10000,7 @@ var SelectComponent$1 = function SelectComponent(_ref) {
     _ref$darkMode = _ref.darkMode,
     darkMode = _ref$darkMode === void 0 ? false : _ref$darkMode,
     components = _ref.components,
-    selectProps = _objectWithoutPropertiesLoose(_ref, _excluded$p);
+    selectProps = _objectWithoutPropertiesLoose(_ref, _excluded$o);
   return /*#__PURE__*/React__default.createElement(WrapperComponent, {
     label: label,
     error: error,
@@ -10251,7 +10272,7 @@ var Wrapper$6 = /*#__PURE__*/styled.figure(_templateObject$1d || (_templateObjec
 var CaptionWrapper = /*#__PURE__*/styled.figcaption(_templateObject2$W || (_templateObject2$W = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  display: table-caption;\n  caption-side: bottom;\n  margin-top: var(--carousel-image-caption-margin);\n"])));
 var CaptionContext = /*#__PURE__*/styled(Caption)(_templateObject3$J || (_templateObject3$J = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  display: -webkit-box;\n  -webkit-box-orient: vertical;\n  -webkit-line-clamp: 2;\n  overflow: hidden;\n  text-overflow: ellipsis;\n  line-clamp: 2;\n  max-height: 46px;\n  white-space: normal;\n  word-break: break-word;\n  font-feature-settings: var(--font-feature-settings-body);\n  text-transform: var(--text-transform-body);\n"])));
 
-var _excluded$q = ["caption", "altText", "src", "srcSet", "sizes", "loading", "aspectRatio", "className"];
+var _excluded$p = ["caption", "altText", "src", "srcSet", "sizes", "loading", "aspectRatio", "className"];
 var ImageWithCaption = function ImageWithCaption(_ref) {
   var caption = _ref.caption,
     altText = _ref.altText,
@@ -10261,7 +10282,7 @@ var ImageWithCaption = function ImageWithCaption(_ref) {
     loading = _ref.loading,
     aspectRatio = _ref.aspectRatio,
     className = _ref.className,
-    restProps = _objectWithoutPropertiesLoose(_ref, _excluded$q);
+    restProps = _objectWithoutPropertiesLoose(_ref, _excluded$p);
   return /*#__PURE__*/React__default.createElement(Wrapper$6, Object.assign({
     aspectRatio: aspectRatio,
     className: className
@@ -11858,7 +11879,7 @@ var ArrowWrapper = /*#__PURE__*/styled.div(_templateObject0$8 || (_templateObjec
   return disabled ? 'var(--color-state-disabled)' : 'var(--button-anchor-tab-color)';
 });
 
-var _excluded$r = ["id", "text"];
+var _excluded$q = ["id", "text"];
 var AnchorTabBar = function AnchorTabBar(_ref) {
   var tabs = _ref.tabs,
     onTabClick = _ref.onTabClick,
@@ -12069,7 +12090,7 @@ var AnchorTabBar = function AnchorTabBar(_ref) {
   }, tabs.map(function (_ref4) {
     var id = _ref4.id,
       text = _ref4.text,
-      rest = _objectWithoutPropertiesLoose(_ref4, _excluded$r);
+      rest = _objectWithoutPropertiesLoose(_ref4, _excluded$q);
     return /*#__PURE__*/React__default.createElement("li", {
       key: id
     }, /*#__PURE__*/React__default.createElement(TabLink, Object.assign({
@@ -12131,7 +12152,7 @@ var PrimaryButtonReverse = /*#__PURE__*/styled(PrimaryButton)(_templateObject8$g
 var MessageWrapper$1 = /*#__PURE__*/styled.div(_templateObject9$a || (_templateObject9$a = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  display: flex;\n  align-items: center;\n  margin-right: var(--grid-outer-margin);\n  height: var(--button-height);\n\n  h6 {\n    margin: 0;\n    padding: 0;\n  }\n\n  @media ", " {\n    & {\n      margin-right: var(--grid-margin);\n    }\n  }\n\n  @media ", " {\n    & {\n      display: none;\n    }\n  }\n"])), devices.tablet, devices.mobile);
 var MessageWrapperMobile = /*#__PURE__*/styled.div(_templateObject0$9 || (_templateObject0$9 = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  h6 {\n    margin: 0;\n    padding: 0;\n  }\n  display: none;\n\n  @media ", " {\n    & {\n      display: flex;\n      align-items: center;\n      margin-left: var(--grid-margin);\n      padding: 12px 0;\n    }\n  }\n"])), devices.mobile);
 
-var _excluded$s = ["text"],
+var _excluded$r = ["text"],
   _excluded2$4 = ["text"];
 var TitleWithCTA = function TitleWithCTA(_ref) {
   var title = _ref.title,
@@ -12141,7 +12162,7 @@ var TitleWithCTA = function TitleWithCTA(_ref) {
     message = _ref.message;
   var _ref2 = (links == null ? void 0 : links[0]) || {},
     primaryButtonText = _ref2.text,
-    primaryButtonProps = _objectWithoutPropertiesLoose(_ref2, _excluded$s);
+    primaryButtonProps = _objectWithoutPropertiesLoose(_ref2, _excluded$r);
   var _ref3 = (links == null ? void 0 : links[1]) || {},
     secondaryButtonText = _ref3.text,
     secondaryButtonProps = _objectWithoutPropertiesLoose(_ref3, _excluded2$4);
@@ -12249,7 +12270,7 @@ var CloseButton = /*#__PURE__*/styled.button(_templateObject2$19 || (_templateOb
 var ContentWrapper$3 = /*#__PURE__*/styled.div(_templateObject3$V || (_templateObject3$V = /*#__PURE__*/_taggedTemplateLiteralLoose([""])));
 var Overlay = /*#__PURE__*/styled(Grid)(_templateObject4$N || (_templateObject4$N = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  position: fixed;\n  top: 0;\n  left: 0;\n  width: 100%;\n  height: 100vh;\n  align-content: center;\n  background-color: rgba(0, 0, 0, 0.4);\n"])));
 
-var _excluded$t = ["isOpen", "setIsOpen", "children", "appElementId"];
+var _excluded$s = ["isOpen", "setIsOpen", "children", "appElementId"];
 var MAX_Z_INDEX = 9999999999;
 if (Modal.defaultStyles.content) {
   Modal.defaultStyles.content.position = 'static';
@@ -12323,7 +12344,7 @@ var ModalWindow = function ModalWindow(_ref) {
     setIsOpen = _ref.setIsOpen,
     children = _ref.children,
     appElementId = _ref.appElementId,
-    modalProps = _objectWithoutPropertiesLoose(_ref, _excluded$t);
+    modalProps = _objectWithoutPropertiesLoose(_ref, _excluded$s);
   var isMobile = useMobile();
   var customStyles = {
     overlay: {
@@ -12741,7 +12762,7 @@ var VideoWithControlsWrapper = /*#__PURE__*/styled.div(_templateObject15$1 || (_
 }, devices.mobile);
 var ProgressContainer$1 = /*#__PURE__*/styled.div(_templateObject16$1 || (_templateObject16$1 = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  margin-top: 32px;\n\n  p {\n    margin-bottom: 16px;\n  }\n\n  @media ", " {\n    margin-top: 20px;\n\n    p {\n      margin-bottom: 12px;\n    }\n  }\n"])), devices.mobileAndTablet);
 
-var _excluded$u = ["text"],
+var _excluded$t = ["text"],
   _excluded2$5 = ["text"];
 var _buttonTypeToButton$2;
 var buttonTypeToButton$2 = (_buttonTypeToButton$2 = {}, _buttonTypeToButton$2[ButtonType.Primary] = PrimaryButton, _buttonTypeToButton$2[ButtonType.Secondary] = SecondaryButton, _buttonTypeToButton$2[ButtonType.Tertiary] = TertiaryButton, _buttonTypeToButton$2);
@@ -12752,7 +12773,7 @@ var Buttons = function Buttons(_ref) {
   var _ref2 = firstButton || {},
     _ref2$text = _ref2.text,
     firstButtonText = _ref2$text === void 0 ? '' : _ref2$text,
-    restFirstButton = _objectWithoutPropertiesLoose(_ref2, _excluded$u);
+    restFirstButton = _objectWithoutPropertiesLoose(_ref2, _excluded$t);
   var secondButton = links == null ? void 0 : links[1];
   var _ref3 = secondButton || {},
     _ref3$text = _ref3.text,
@@ -12989,11 +13010,11 @@ var HighlightsCarousel = function HighlightsCarousel(_ref) {
   })));
 };
 
-var _excluded$v = ["logo", "slides"];
+var _excluded$u = ["logo", "slides"];
 var HighlightsCinema = function HighlightsCinema(_ref) {
   var logo = _ref.logo,
     slides = _ref.slides,
-    rest = _objectWithoutPropertiesLoose(_ref, _excluded$v);
+    rest = _objectWithoutPropertiesLoose(_ref, _excluded$u);
   var slidesWithLinks = slides.map(function (slide) {
     var links = processSlideLinks(slide.links);
     return _extends({}, slide, {
@@ -13010,10 +13031,10 @@ var HighlightsCinema = function HighlightsCinema(_ref) {
   })));
 };
 
-var _excluded$w = ["slides"];
+var _excluded$v = ["slides"];
 var HighlightsCore = function HighlightsCore(_ref) {
   var slides = _ref.slides,
-    rest = _objectWithoutPropertiesLoose(_ref, _excluded$w);
+    rest = _objectWithoutPropertiesLoose(_ref, _excluded$v);
   var slidesWithLinks = slides.map(function (slide) {
     var links = processSlideLinks(slide.links);
     return _extends({}, slide, {
@@ -13027,11 +13048,11 @@ var HighlightsCore = function HighlightsCore(_ref) {
   })));
 };
 
-var _excluded$x = ["logo", "slides"];
+var _excluded$w = ["logo", "slides"];
 var HighlightsStream = function HighlightsStream(_ref) {
   var logo = _ref.logo,
     slides = _ref.slides,
-    rest = _objectWithoutPropertiesLoose(_ref, _excluded$x);
+    rest = _objectWithoutPropertiesLoose(_ref, _excluded$w);
   var slidesWithLinks = slides.map(function (slide) {
     var links = processSlideLinks(slide.links);
     return _extends({}, slide, {
@@ -14593,5 +14614,5 @@ var GlobalStyles = /*#__PURE__*/createGlobalStyle(_templateObject$1y || (_templa
   return theme.footer.tablet.paddingBottom;
 }, devices.desktop, devices.largeDesktop);
 
-export { Accordion, Accordions, Account, AltHeader, AnchorBar, AnchorTabBar, AnnouncementBanner, AspectRatio, AuxiliaryButton, AuxiliaryNav, Basket$1 as Basket, BodyContent, BodyCopyHarmonic, BodyText, ButtonText, ButtonType, Caption, Card, Cards, Carousel, CarouselType, CastFilters as CastFilter, CinemaBadge, Colors, ContactCard, ContactNewsletter, ContentSummary, ControlledDropdown, CreditListing, Dropdown, Editorial, Footer, GlobalStyles, Grid, GridItem, HarmonicHeader, HarmonicOverline, HarmonicSize, HarmonicSubtitle, HarmonicThemeProvider, Header, HighlightsCarousel, HighlightsCinema as HighlightsCarouselCinema, HighlightsCore as HighlightsCarouselCore, HighlightsStream as HighlightsCarouselStream, HotFilters, Icon, ImageAspectRatioWrapper, ImageWithCaption, Information, Logo, MiniCard, MinimalCarousel, ModalWindow, NavTop, Navigation, NavigationText, Overline, PageHeading, PageHeadingCompact, PageHeadingHighlight, PageHeadingHighlightCarousel, PageHeadingImpact, PageHeadingPanel, PageHeadingPromo, Pagination, PasswordStrength, Paywall, PeopleListing, Person, PersonCard, PersonDetails, PolicyLinks, PrimaryButton, Progress, PromoWithTags, PromoWithTitle, Quote, Radio2, RadioGroup2, ReadMore, RotatorButtons, Search$1 as Search, SearchBar, SecondaryButton, SecondaryLogo, SectionSplitter, SectionTitle, SelectComponent as Select2, SelectComponent$1 as Select2Async, SignUpFormComponent as SignUpForm, SocialLinks, Sponsorship, StatusBanner, Component as Stepper, StickyBar, StreamBadge, Subtitle, Swipe, Tab, TabLink, Table, Tabs, TertiaryButton, TextArea, TextField, TextFieldLegacy, TextLink, ThemeColor, Theme as ThemeProvider, ThemeType, Tickbox, Tickbox2, TickboxMode, Timer, TitleWithCTA, TypeTags, UpsellCard, UpsellCards, UpsellSection, VideoControls, VideoWithControls$2 as VideoWithControls, breakpoints, devices, useHarmonicTheme, zIndexes };
+export { Accordion, Accordions, Account, AltHeader, AnchorBar, AnchorTabBar, AnnouncementBanner, AspectRatio, AuxiliaryButton, AuxiliaryNav, Basket$1 as Basket, BodyContent, BodyCopyHarmonic, BodyText, ButtonText, ButtonType, Caption, Card, Cards, Carousel, CarouselType, CastFilters as CastFilter, CinemaBadge, Colors, ContactCard, ContactNewsletter, ContentSummary, ControlledDropdown, CreditListing, DisplayHeader, Dropdown, Editorial, Footer, GlobalStyles, Grid, GridItem, HarmonicHeader, HarmonicOverline, HarmonicSize, HarmonicSubtitle, HarmonicThemeProvider, Header, HighlightsCarousel, HighlightsCinema as HighlightsCarouselCinema, HighlightsCore as HighlightsCarouselCore, HighlightsStream as HighlightsCarouselStream, HotFilters, Icon, ImageAspectRatioWrapper, ImageWithCaption, Information, Logo, MiniCard, MinimalCarousel, ModalWindow, NavTop, Navigation, NavigationText, Overline, PageHeading, PageHeadingCompact, PageHeadingHighlight, PageHeadingHighlightCarousel, PageHeadingImpact, PageHeadingPanel, PageHeadingPromo, Pagination, PasswordStrength, Paywall, PeopleListing, Person, PersonCard, PersonDetails, PolicyLinks, PrimaryButton, Progress, PromoWithTags, PromoWithTitle, Quote, Radio2, RadioGroup2, ReadMore, RotatorButtons, Search$1 as Search, SearchBar, SecondaryButton, SecondaryLogo, SectionSplitter, SectionTitle, SelectComponent as Select2, SelectComponent$1 as Select2Async, SignUpFormComponent as SignUpForm, SocialLinks, Sponsorship, StatusBanner, Component as Stepper, StickyBar, StreamBadge, Subtitle, Swipe, Tab, TabLink, Table, Tabs, TertiaryButton, TextArea, TextField, TextFieldLegacy, TextLink, ThemeColor, Theme as ThemeProvider, ThemeType, Tickbox, Tickbox2, TickboxMode, Timer, TitleWithCTA, TypeTags, UpsellCard, UpsellCards, UpsellSection, VideoControls, VideoWithControls$2 as VideoWithControls, breakpoints, devices, useHarmonicTheme, zIndexes };
 //# sourceMappingURL=harmonic.esm.js.map