@royaloperahouse/harmonic 0.17.2-b → 0.17.3

package/dist/index.d.ts

@@ -1,4 +1,4 @@
-import { Accordion, Accordions, AnchorBar, AnnouncementBanner, AltHeader, AnchorTabBar, AuxiliaryNav, BodyText, Card, Cards, Carousel, CinemaBadge, ContactCard, ContentSummary, ControlledDropdown, CreditListing, Editorial, Footer, GlobalStyles, Grid, GridItem, Header, HighlightsCarousel, HighlightsCarouselCinema, HighlightsCarouselCore, HighlightsCarouselStream, HotFilters, Icon, ImageAspectRatioWrapper, ImageWithCaption, Information, Navigation, MinimalCarousel, Overline, PageHeading, PageHeadingCompact, PageHeadingImpact, PageHeadingPanel, PageHeadingHighlight, PageHeadingPromo, PageHeadingHighlightCarousel, Pagination, PasswordStrength, Paywall, PeopleListing, PrimaryButton, Progress, PromoWithTags, PromoWithTitle, Radio, Radio2, RadioGroup, RadioGroup2, ReadMore, RotatorButtons, StatusBanner, SearchBar, SecondaryButton, SecondaryLogo, SectionSplitter, SectionTitle, Select, Select2, Select2Async, SignUpForm, Sponsorship, StickyBar, Stepper, StreamBadge, Subtitle, TertiaryButton, ThemeProvider, TitleWithCTA, Tab, Table, TabLink, Tabs, TextArea, TextField, TextFieldLegacy, TextLink, Tickbox, Tickbox2, Timer, TypeTags, UpsellCard, UpsellSection, VideoControls, VideoWithControls } from './components';
+import { Accordion, Accordions, AnchorBar, AnnouncementBanner, AltHeader, AnchorTabBar, AuxiliaryNav, BodyText, Card, Cards, Carousel, CinemaBadge, ContactCard, ContentSummary, ControlledDropdown, CreditListing, Editorial, Footer, GlobalStyles, Grid, GridItem, Header, HighlightsCarousel, HighlightsCarouselCinema, HighlightsCarouselCore, HighlightsCarouselStream, HotFilters, Icon, ImageAspectRatioWrapper, ImageWithCaption, Information, Navigation, MinimalCarousel, Overline, PageHeading, PageHeadingCompact, PageHeadingImpact, PageHeadingPanel, PageHeadingHighlight, PageHeadingPromo, Pagination, PasswordStrength, Paywall, PeopleListing, PrimaryButton, Progress, PromoWithTags, PromoWithTitle, Radio, Radio2, RadioGroup, RadioGroup2, ReadMore, RotatorButtons, StatusBanner, SearchBar, SecondaryButton, SecondaryLogo, SectionSplitter, SectionTitle, Select, Select2, Select2Async, SignUpForm, Sponsorship, StickyBar, Stepper, StreamBadge, Subtitle, TertiaryButton, ThemeProvider, TitleWithCTA, Tab, Table, TabLink, Tabs, TextArea, TextField, TextFieldLegacy, TextLink, Tickbox, Tickbox2, Timer, TypeTags, UpsellCard, UpsellSection, VideoControls, VideoWithControls } from './components';
 import BodyContent from './components/molecules/BodyContent';
 import Quote from './components/molecules/Quote';
 import { devices, breakpoints } from './styles/viewports';
@@ -7,9 +7,8 @@ import { AspectRatio, ButtonType, CarouselType, Colors, IconNameType, Integrated
 import { MiniCard } from './components/molecules';
 import { ModalWindow } from './components/organisms';
 import AuxiliaryButton from './components/atoms/Buttons/Auxiliary/AuxiliaryButton';
-import PersonCard from './components/molecules/PersonCard';
 import HarmonicThemeProvider, { useHarmonicTheme } from './styles/HarmonicThemeProvider';
 import { HarmonicSize } from './types/typography';
 import { HarmonicHeader, HarmonicSubtitle, BodyCopyHarmonic, HarmonicOverline, ButtonText, Caption, NavigationText } from './components/Typography';
 export { useHarmonicTheme };
-export { Accordion, Accordions, AnchorBar, AnnouncementBanner, AltHeader, AnchorTabBar, AuxiliaryButton, AuxiliaryNav, AspectRatio, BodyContent, BodyText, breakpoints, ButtonType, Card, Cards, CarouselType, Carousel, CinemaBadge, Colors, ContactCard, ContentSummary, ControlledDropdown, CreditListing, devices, Editorial, EditorialLink, Footer, GlobalStyles, Grid, GridItem, HarmonicSize, HarmonicThemeProvider, Header, HighlightsCarousel, HighlightsCarouselCinema, HighlightsCarouselCore, HighlightsCarouselStream, HotFilters, Icon, IconNameType, ImageAspectRatioWrapper, ImageWithCaption, Information, IInformationCTAProps, IInformationTitleProps, ITimerProps, IntegratedTimerProps, MinimalCarousel, MiniCard, ModalWindow, Navigation, Overline, PageHeading, PageHeadingCompact, PageHeadingImpact, PageHeadingPanel, PageHeadingHighlight, PageHeadingPromo, PageHeadingHighlightCarousel, Pagination, PasswordStrength, PersonCard, Paywall, PeopleListing, PrimaryButton, Progress, PromoWithTags, PromoWithTitle, Radio, Radio2, RadioGroup, RadioGroup2, ReadMore, RotatorButtons, StatusBanner, SearchBar, SecondaryButton, SecondaryLogo, SectionSplitter, SectionTitle, Select, Select2, Select2Async, SignUpForm, Sponsorship, StickyBar, Stepper, StreamBadge, Subtitle, Tab, Table, TabLink, Tabs, TertiaryButton, TextArea, TextField, TextFieldLegacy, TextLink, ThemeColor, ThemeProvider, ThemeType, TitleWithCTA, Tickbox, Tickbox2, TickboxMode, Timer, TypeTags, UpsellCard, UpsellSection, Quote, VideoControls, VideoWithControls, zIndexes, HarmonicHeader, HarmonicSubtitle, BodyCopyHarmonic, HarmonicOverline, ButtonText, Caption, NavigationText, };
+export { Accordion, Accordions, AnchorBar, AnnouncementBanner, AltHeader, AnchorTabBar, AuxiliaryButton, AuxiliaryNav, AspectRatio, BodyContent, BodyText, breakpoints, ButtonType, Card, Cards, CarouselType, Carousel, CinemaBadge, Colors, ContactCard, ContentSummary, ControlledDropdown, CreditListing, devices, Editorial, EditorialLink, Footer, GlobalStyles, Grid, GridItem, HarmonicSize, HarmonicThemeProvider, Header, HighlightsCarousel, HighlightsCarouselCinema, HighlightsCarouselCore, HighlightsCarouselStream, HotFilters, Icon, IconNameType, ImageAspectRatioWrapper, ImageWithCaption, Information, IInformationCTAProps, IInformationTitleProps, ITimerProps, IntegratedTimerProps, MinimalCarousel, MiniCard, ModalWindow, Navigation, Overline, PageHeading, PageHeadingCompact, PageHeadingImpact, PageHeadingPanel, PageHeadingHighlight, PageHeadingPromo, Pagination, PasswordStrength, Paywall, PeopleListing, PrimaryButton, Progress, PromoWithTags, PromoWithTitle, Radio, Radio2, RadioGroup, RadioGroup2, ReadMore, RotatorButtons, StatusBanner, SearchBar, SecondaryButton, SecondaryLogo, SectionSplitter, SectionTitle, Select, Select2, Select2Async, SignUpForm, Sponsorship, StickyBar, Stepper, StreamBadge, Subtitle, Tab, Table, TabLink, Tabs, TertiaryButton, TextArea, TextField, TextFieldLegacy, TextLink, ThemeColor, ThemeProvider, ThemeType, TitleWithCTA, Tickbox, Tickbox2, TickboxMode, Timer, TypeTags, UpsellCard, UpsellSection, Quote, VideoControls, VideoWithControls, zIndexes, HarmonicHeader, HarmonicSubtitle, BodyCopyHarmonic, HarmonicOverline, ButtonText, Caption, NavigationText, };

package/dist/styles/HarmonicThemeProvider/HarmonicThemeProvider.d.ts

@@ -1,7 +1,6 @@
 import React from 'react';
 import { ThemeType } from '../../types';
 import './theme/fonts.css';
-import './theme/typography.css';
 export declare const DEFAULT_THEME = ThemeType.Core;
 interface HarmonicThemeProviderProps {
     theme: ThemeType;

package/dist/types/buttonTypes.d.ts

@@ -41,7 +41,6 @@ export declare type AuxiliaryButtonProps = ButtonProps & Pick<StyleProps, 'textC
 export declare type PrimaryButtonProps = ButtonProps & Pick<StyleProps, 'textColor' | 'backgroundColor' | 'hoveredColor' | 'pressedColor' | 'disabled'>;
 export declare type SecondaryButtonProps = ButtonProps & Pick<StyleProps, 'textColor' | 'borderColor' | 'hoveredColor' | 'pressedColor' | 'disabled'>;
 export declare type TertiaryButtonProps = BaseProps & AnchorHTMLAttributes<HTMLAnchorElement> & Pick<StyleProps, 'textColor' | 'disabled'>;
-export declare type RotatorButtonSize = 'small' | 'default';
 export declare type RotatorButtonsProps = {
     /** Enable/disable prev button */
     availablePrev?: boolean;
@@ -57,8 +56,6 @@ export declare type RotatorButtonsProps = {
     onClickFullscreen?: () => void;
     /** Is in fullscreen mode */
     isFullscreen?: boolean;
-    /** Size of the rotator buttons */
-    size?: RotatorButtonSize;
     /** Custom CSS classes */
     className?: string;
 };

package/dist/types/card.d.ts

@@ -2,7 +2,6 @@ import { StyledProps } from 'styled-components';
 import { Colors, EditorialLink, IconNameType, ThemeColor } from '.';
 import { PromoLinks } from './editorial';
 import { DirectionType } from './iconTypes';
-import { ListingRole } from './types';
 export interface CardLabelProps {
     /**
      * Label text
@@ -139,9 +138,3 @@ export interface ICardButtonContainerProps {
      */
     fullWidth?: boolean;
 }
-export interface RoleComponentProps {
-    /** The role of the person in the listing */
-    role: ListingRole;
-    /** Custom CSS classes */
-    className?: string;
-}

package/dist/types/carousel.d.ts

@@ -8,8 +8,7 @@ import { TypographyLevel } from './typography';
 export declare enum CarouselType {
     Image = "image",
     SmallCard = "SmallCard",
-    LargeCard = "LargeCard",
-    PersonCard = "PersonCard"
+    LargeCard = "LargeCard"
 }
 export interface ICarouselProps {
     /**

package/dist/types/image.d.ts

@@ -1,4 +1,5 @@
-import React from 'react';
+import { ReactElement, ReactNode } from 'react';
+import { StyledProps } from 'styled-components';
 export declare enum AspectRatio {
     '1:1' = "1 / 1",
     '3:4' = "3 / 4",
@@ -43,18 +44,13 @@ export interface IImageWithCaptionProps {
     caption: string;
     /** Alternative text describing the image content for accessibility purposes. */
     altText?: string;
-    /** Image source */
-    src: string;
-    /** Optional srcSet for responsive images */
-    srcSet?: string;
-    /** Optional sizes for responsive images */
-    sizes?: string;
-    /** Optional loading strategy */
-    loading?: 'lazy' | 'eager';
-    /** Custom CSS classes */
-    className?: string;
+    /** Image element */
+    children: ReactElement<HTMLImageElement>;
 }
-export interface IImageWithCaptionWrapperProps {
+export interface IImageWithCaptionWrapperProps extends StyledProps<{
+    aspectRatio?: AspectRatio;
+    height: number;
+}> {
     /**
      * Aspect ratio of the contained image
      */
@@ -62,11 +58,11 @@ export interface IImageWithCaptionWrapperProps {
     /**
      * Height of the wrapper
      */
-    height?: number;
+    height: number;
 }
-export interface ImageAspectRatioWrapperProps extends IImageAspectRatioWrapperProps, React.HTMLAttributes<HTMLDivElement> {
+export interface ImageAspectRatioWrapperProps extends IImageAspectRatioWrapperProps {
     /**
      * Image elements
      */
-    children: React.ReactNode;
+    children: ReactNode;
 }

package/dist/types/types.d.ts

@@ -1,6 +1,6 @@
 import { ReactNode, AnchorHTMLAttributes, MouseEventHandler, ReactElement } from 'react';
 import { StyledProps } from 'styled-components';
-import { IconNameType, DirectionType, IIconProps } from './iconTypes';
+import { IconNameType, DirectionType } from './iconTypes';
 import type { ExternalLink } from './links';
 export declare enum Colors {
     White = "white",
@@ -147,10 +147,6 @@ export interface ITabProps {
      * Additional CSS class names to apply to the navigation component.
      */
     className?: string;
-    /**
-     * The unique ID to assign to the link element.
-     */
-    tabLinkId?: string;
     /**
      * Defines the ARIA role of the element for accessibility purposes.
      */
@@ -226,11 +222,7 @@ export interface IDropdownProps {
      */
     ariaLabel?: string;
     /**
-     * The unique ID to assign to the link element inside the tab.
-     */
-    tabLinkId?: string;
-    /**
-     * Defines if it is needed to trim the text of the Tab and add 3 dots in the end
+     *  Defines if it is needed to trim the text of the Tab and add 3 dots in the end
      */
     trimTabText?: boolean;
 }
@@ -354,10 +346,10 @@ export declare type ListingRole = {
     dataROH?: string;
 };
 export interface IPeopleListing {
-    /** List of roles to be displayed */
+    /**
+     * List of roles to be displayed
+     */
     roles: ListingRole[];
-    /** Custom CSS classes */
-    className?: string;
 }
 export interface IPagination {
     /**
@@ -552,10 +544,6 @@ export interface IBodyContentProps {
     columnSpanDevice?: number;
     /** Custom CSS classes */
     className?: string;
-    /** Set to true to wrap the content in a Grid component */
-    renderGrid?: boolean;
-    /** Set to true to render the GridItem component */
-    renderGridItem?: boolean;
 }
 export declare type SectionTitleSize = 'small' | 'large';
 export interface ISectionTitleProps {
@@ -599,10 +587,6 @@ export interface IAccordionProps {
     initOpen?: boolean;
     /** Custom CSS classes */
     className?: string;
-    /** Harmonic icon name and direction for expanded state. Default is 'Detract' */
-    expandedStateIcon?: IIconProps;
-    /** Harmonic icon name and direction for collapsed state. Default is 'Expand' */
-    collapsedStateIcon?: IIconProps;
 }
 export interface IAccordionsProps {
     /** Array of Accordion component */

package/dist/types/upsell.d.ts

@@ -68,16 +68,24 @@ export interface IUpsellCardsProps {
     theme?: ThemeType;
 }
 export interface IUpsellSectionProps {
-    /** Upsell Section title */
+    /**
+     * Upsell Section title
+     */
     title?: string;
-    /** Richtext section */
+    /**
+     * Richtext section
+     */
     richText?: string;
-    /** CTA link. Eg. for sign in. */
+    /**
+     * CTA link. Eg. for sign in.
+     */
     link?: EditorialLink;
-    /** Array of upsellCards */
+    /**
+     * Array of upsellCards
+     */
     upsellCards?: IUpsellCardProps[];
-    /** Theme options */
+    /**
+     * Theme options
+     */
     theme?: ThemeType;
-    /** Custom CSS classes */
-    className?: string;
 }

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@royaloperahouse/harmonic",
-  "version": "0.17.2-b",
+  "version": "0.17.3",
   "author": "Royal Opera House",
   "license": "MIT",
   "main": "dist/index.js",
@@ -142,5 +142,6 @@
       "npx eslint src --fix ",
       "npx prettier src --write --uncommitted"
     ]
-  }
+  },
+  "packageManager": "yarn@1.22.22+sha512.a6b2f7906b721bba3d67d4aff083df04dad64c399707841b7acf00f6b133b7ac24255f2652fa22ae3534329dc6180534e98d17432037ff6fd140556e2bb3137e"
 }

package/dist/components/atoms/Person/Person.style.d.ts

@@ -1,2 +0,0 @@
-export declare const PersonLink: import("styled-components").StyledComponent<"a", any, {}, never>;
-export declare const ReplacementContent: import("styled-components").StyledComponent<"span", any, {}, never>;

package/dist/components/atoms/Person/index.d.ts

@@ -1,2 +0,0 @@
-import Person from './Person';
-export default Person;

package/dist/components/molecules/PageHeading/HighlightCarousel/HighlightCarousel.d.ts

@@ -1,4 +0,0 @@
-import { FunctionComponent } from 'react';
-import { IHighlightsHeaderProps } from '../../../../types/editorial';
-declare const PageHeadingHighlightCarousel: FunctionComponent<IHighlightsHeaderProps>;
-export default PageHeadingHighlightCarousel;

package/dist/components/molecules/PageHeading/HighlightCarousel/HighlightCarousel.style.d.ts

@@ -1,14 +0,0 @@
-interface HighlightsInfoWrapperProps {
-    hasImages: boolean;
-}
-interface HighlightsCarouselWrapperProps {
-    hasMultipleImages: boolean;
-}
-export declare const HighlightsGrid: import("styled-components").StyledComponent<"div", any, {}, never>;
-export declare const HighlightTitleWrapper: import("styled-components").StyledComponent<"div", any, {}, never>;
-export declare const HighlightTextWrapper: import("styled-components").StyledComponent<"div", any, {}, never>;
-export declare const HighlightsInfoWrapper: import("styled-components").StyledComponent<"div", any, HighlightsInfoWrapperProps, never>;
-export declare const HighlightsCarouselWrapper: import("styled-components").StyledComponent<"div", any, HighlightsCarouselWrapperProps, never>;
-export declare const RotatorButtonsWrapperMobile: import("styled-components").StyledComponent<"div", any, {}, never>;
-export declare const RotatorButtonsWrapper: import("styled-components").StyledComponent<"div", any, {}, never>;
-export {};

package/dist/components/molecules/PageHeading/HighlightCarousel/index.d.ts

@@ -1,2 +0,0 @@
-import PageTitleHighlightCarousel from './HighlightCarousel';
-export default PageTitleHighlightCarousel;

package/dist/components/molecules/PeopleListing/fixtures.d.ts

@@ -1,4 +0,0 @@
-import { ListingRole } from '../../../types/types';
-export declare const peopleRoles: ListingRole[];
-export declare const peopleRolesWithLinks: ListingRole[];
-export declare const peopleRolesWithHeadshot: ListingRole[];

package/dist/components/molecules/PersonCard/PersonCard.d.ts

@@ -1,4 +0,0 @@
-import React from 'react';
-import { RoleComponentProps } from '../../../types/card';
-declare const PersonCard: React.FC<RoleComponentProps>;
-export default PersonCard;

package/dist/components/molecules/PersonCard/PersonCard.style.d.ts

@@ -1,2 +0,0 @@
-export declare const PersonWrapper: import("styled-components").StyledComponent<"div", any, {}, never>;
-export declare const HeadshotWrapper: import("styled-components").StyledComponent<"div", any, {}, never>;

package/dist/components/molecules/PersonCard/index.d.ts

@@ -1,2 +0,0 @@
-import PersonCard from './PersonCard';
-export default PersonCard;

package/dist/components/molecules/PersonDetails/PersonDetails.d.ts

@@ -1,4 +0,0 @@
-import React from 'react';
-import { RoleComponentProps } from '../../../types/card';
-declare const PersonDetails: React.FC<RoleComponentProps>;
-export default PersonDetails;

package/dist/components/molecules/PersonDetails/PersonDetails.style.d.ts

@@ -1,2 +0,0 @@
-export declare const TextWrapper: import("styled-components").StyledComponent<"div", any, {}, never>;
-export declare const RoleContent: import("styled-components").StyledComponent<({ children, size, color, className, tag: Tag, }: import("../../../types/typography").ITaggedTypographyProps) => import("react").JSX.Element, any, {}, never>;

package/dist/components/molecules/PersonDetails/index.d.ts

@@ -1,2 +0,0 @@
-import PersonDetails from './PersonDetails';
-export default PersonDetails;