@royaloperahouse/harmonic 0.18.3-o → 0.18.4-a

package/CHANGELOG.md

@@ -1,3 +1,13 @@
+## [0.18.7]
+- Carousel, Typography, HighlightCarousels added font changed prop
+
+
+## [0.18.5]
+- PeopleListing, PersonCard: Added person-headshot-grayscale class to display headshots in grayscale
+
+## [0.18.4]
+- Access Icons: Add Captioned, Family Friendly, and Touch Tour icons
+
 ## [0.18.3]
 - CastFilter: Added arrows to CastFilter component
 

package/README.md

@@ -22,7 +22,7 @@ The Storybook for the latest version of the library is hosted at [Storybook - Ha
 
   * You can find these values at:
   
-    *AWS 'Your Applications' page -> 'Royal Opera House' -> 'Developer Access' -> 'Command line or programmatic access'*
+    *AWS access portal/ Accounts tab -> 'Royal Opera House' -> 'Access keys' -> 'Option 2: Add a profile to your AWS credentials file'*
 
 * **To deploy a preview** for demo / QA you will need:
 
@@ -151,8 +151,7 @@ To publish a snapshot use:
 ```bash
 NPM_ROH_TOKEN={NPM_TOKEN} RELEASE_VERSION={RELEASE_VERSION} yarn publish-snapshot
 ```
-
-The version published to NPM will be named, e.g. `1.42.0-a-harmonic-development`, use this to install the snapshot package in the frontend repos.
+Use the version name to install the package in a frontend repo.
 
 ### **2. To release a stable version**
 

package/dist/components/molecules/PeopleListing/CreditListing/CreditListing.style.d.ts

@@ -1,5 +1,7 @@
 export declare const ReplacementWrapper: import("styled-components").StyledComponent<"div", any, {}, never>;
 export declare const CreditListingWrapper: import("styled-components").StyledComponent<"div", any, {
+    $largeDesktopColumns?: 3 | 4 | undefined;
+} & {
     columnCount: number;
 }, never>;
 export declare const DescriptionWrapper: import("styled-components").StyledComponent<"div", any, {}, never>;

package/dist/components/organisms/Carousels/Carousel/Carousel.d.ts

@@ -1,4 +1,6 @@
 import { FunctionComponent } from 'react';
 import { ICarouselProps } from '../../../../types/carousel';
-declare const Carousel: FunctionComponent<ICarouselProps>;
+declare const Carousel: FunctionComponent<ICarouselProps & Partial<{
+    titleFontFamily: 'Victor' | 'Grey' | undefined;
+}>>;
 export default Carousel;

package/dist/components/organisms/Carousels/HighlightsCarousel/HighlightsCarousel.d.ts

@@ -1,4 +1,6 @@
 import { FunctionComponent } from 'react';
 import { IHighlightsCarouselProps } from '../../../../types/carousel';
-declare const HighlightsCarousel: FunctionComponent<IHighlightsCarouselProps>;
+declare const HighlightsCarousel: FunctionComponent<IHighlightsCarouselProps & Partial<{
+    titleFontFamily: 'Victor' | 'Grey' | undefined;
+}>>;
 export default HighlightsCarousel;

package/dist/harmonic.cjs.development.js

@@ -217,7 +217,8 @@ var HarmonicHeader = function HarmonicHeader(_ref2) {
     em = _ref2.em,
     _ref2$color = _ref2.color,
     color = _ref2$color === void 0 ? 'inherit' : _ref2$color,
-    serif = _ref2.serif,
+    _ref2$serif = _ref2.serif,
+    serif = _ref2$serif === void 0 ? false : _ref2$serif,
     hierarchy = _ref2.hierarchy,
     tag = _ref2.tag,
     className = _ref2.className,
@@ -12789,7 +12790,8 @@ var Carousel = function Carousel(_ref) {
     _ref$infinite = _ref.infinite,
     infinite = _ref$infinite === void 0 ? true : _ref$infinite,
     _ref$useOffset = _ref.useOffset,
-    useOffset = _ref$useOffset === void 0 ? true : _ref$useOffset;
+    useOffset = _ref$useOffset === void 0 ? true : _ref$useOffset,
+    titleFontFamily = _ref.titleFontFamily;
   var _useState = React.useState(false),
     isFullscreen = _useState[0],
     setIsFullscreen = _useState[1];
@@ -12939,6 +12941,7 @@ var Carousel = function Carousel(_ref) {
   var carouselTitleId = "carousel-title-" + title;
   var titleSemanticLevelValue = titleSemanticLevel ? "h" + titleSemanticLevel : 'h2';
   var Wrapper = type === exports.CarouselType.Image ? ImageCarouselWrapper : CardsCarouselWrapper;
+  var isVictorTitleFont = titleFontFamily === 'Victor';
   return /*#__PURE__*/React__default.createElement(Wrapper, {
     className: className,
     type: type,
@@ -12962,7 +12965,7 @@ var Carousel = function Carousel(_ref) {
     isDescriptionPresent: !!description
   }, /*#__PURE__*/React__default.createElement(TitleText$1, {
     size: "medium",
-    serif: true,
+    serif: isVictorTitleFont,
     hierarchy: titleSemanticLevelValue
   }, title)), /*#__PURE__*/React__default.createElement(BodyCopyHarmonic, {
     size: "large"
@@ -13192,7 +13195,8 @@ var HighlightsCarousel = function HighlightsCarousel(_ref) {
     carouselTitle = _ref.carouselTitle,
     slides = _ref.slides,
     titleSemanticLevel = _ref.titleSemanticLevel,
-    className = _ref.className;
+    className = _ref.className,
+    titleFontFamily = _ref.titleFontFamily;
   var slidesMedia = React.useMemo(function () {
     return slides.map(function (_ref2) {
       var mediaContent = _ref2.mediaContent;
@@ -13223,6 +13227,7 @@ var HighlightsCarousel = function HighlightsCarousel(_ref) {
   var handleClickInside = function handleClickInside(e) {
     e.stopPropagation();
   };
+  var isVictorTitleFont = titleFontFamily === 'Victor';
   return /*#__PURE__*/React__default.createElement(HighlightsGrid$1, {
     role: "region",
     "aria-labelledby": carouselTitleId,
@@ -13235,7 +13240,7 @@ var HighlightsCarousel = function HighlightsCarousel(_ref) {
   }, /*#__PURE__*/React__default.createElement(HarmonicHeader, {
     className: TYPOGRAPHY_CLASS_NAME,
     size: "medium",
-    serif: true,
+    serif: isVictorTitleFont,
     hierarchy: titleSemanticLevelValue
   }, carouselTitle))), hasMultipleSlides && (/*#__PURE__*/React__default.createElement(RotatorButtonsWrapperMobile$1, null, /*#__PURE__*/React__default.createElement(RotatorButtons, {
     onClickNext: onNext,