@arc-ui/components 12.0.0-alpha.0 → 12.0.0-beta.10

package/dist/types/components/{SiteHeader → SiteHeaderV2}/components/NavItem/NavItem.d.ts

@@ -2,8 +2,8 @@ import { FC, ReactNode } from "react";
 export declare const NavItem: FC<NavItemProps>;
 export interface NavItemProps {
     /**
-     * Contents of the NavItem. Must be SiteHeader.ItemGroup or
-     * SiteHeader.Column components.
+     * Contents of the NavItem. Must be SiteHeaderV2.ItemGroup or
+     * SiteHeaderV2.Column components.
      */
     children?: ReactNode;
     /**
@@ -21,10 +21,6 @@ export interface NavItemProps {
      * `children` are not present (and `href` is present).
      */
     isCurrent?: boolean;
-    /**
-     * Content to display in the NavItem panel promo area.
-     */
-    promo?: ReactNode;
     /**
      * Top-level text to display in the NavItem.
      */
@@ -39,4 +35,7 @@ export interface NavItemProps {
      * On click handler.
      */
     onClick?: () => void;
+    isPrimary?: boolean;
+    opensFirstWithPanel?: boolean;
+    subTitle?: string;
 }

package/dist/types/components/{SiteHeader → SiteHeaderV2}/components/NavItem/NavItemWithSubNav.d.ts

@@ -12,19 +12,26 @@ export interface NavItemWithSubNavProps {
     href?: string;
     /**
      * Content to be displayed in the first slot of the NavItemWithSubNav. Must be
-     * a single SiteHeader.SubNavItem component.
+     * a single SiteHeaderV2.SubNavItem component.
      */
     slot1: ReactElement;
     /**
      * Content to be displayed in the second slot of the NavItemWithSubNav. Must
-     * be a single SiteHeader.SubNavItem component.
+     * be a single SiteHeaderV2.SubNavItem component.
      */
-    slot2: ReactNode;
+    slot2?: ReactNode;
     /**
      * Content to be displayed in the third slot of the NavItemWithSubNav. Must be
-     * a single SiteHeader.SubNavItem component.
+     * a single SiteHeaderV2.SubNavItem component.
      */
     slot3?: ReactNode;
+    /**
+     * Content to be displayed in the fourth slot of the NavItemWithSubNav. Must be
+     * a single SiteHeaderV2.SubNavItem component.
+     */
+    slot4?: ReactNode;
+    slot5?: ReactNode;
+    slot6?: ReactNode;
     /**
      * Title text to display inside the NavItemWithSubNav panel.
      */
@@ -43,5 +50,7 @@ export interface NavItemWithSubNavProps {
      * view all click handler.
      */
     onViewAllClick?: () => void;
+    isPrimary?: boolean;
+    opensFirstWithPanel?: boolean;
 }
 export { Context as NavItemContext };

package/dist/types/components/SiteHeaderV2/components/NavItem/index.d.ts

@@ -0,0 +1,2 @@
+export { NavItem } from "./NavItem";
+export { NavItemWithSubNav } from "./NavItemWithSubNav";

package/dist/types/components/{SiteHeader → SiteHeaderV2}/components/NodeItem/NodeItem.d.ts

@@ -2,7 +2,7 @@ import { FC, ReactNode } from "react";
 export declare const NodeItem: FC<NodeItemProps>;
 export interface NodeItemProps {
     /**
-     * Content to display with `SiteHeader.NodeItem`
+     * Content to display with `SiteHeaderV2.NodeItem`
      */
     children?: ReactNode;
 }

package/dist/types/components/{SiteHeader → SiteHeaderV2}/components/Panel/Panel.d.ts

@@ -5,18 +5,24 @@ export declare const Panel: FC<PanelProps> & {
 export declare const ViewAll: FC<ViewAllProps>;
 export interface ViewAllProps {
     href: string;
-    title: string;
+    title?: string;
     onClick?: () => void;
+    buttonStyle: "primary" | "secondary" | "tertiary" | "warning" | undefined;
 }
 export interface PanelProps {
     children: ReactNode;
     navItemRef: React.MutableRefObject<HTMLElement> | null;
+    isNavItem: boolean;
     open: boolean;
-    promo?: ReactNode;
     setOpen: (arg0: boolean) => any;
+    setOpenPanelOnFirstClick: (arg0: boolean) => any;
     subNavItemRef?: React.MutableRefObject<HTMLElement>;
     subNavLink?: string;
+    navLink?: string;
     title?: ReactNode;
     viewAll?: ReactElement;
     withSubNav?: boolean;
+    subtitle?: ReactNode;
+    fade?: boolean;
+    isPrimary?: boolean;
 }

package/dist/types/components/{SiteHeader → SiteHeaderV2}/components/SubNavItem/SubNavItem.d.ts

@@ -1,14 +1,15 @@
 import { FC, ReactNode } from "react";
+import { ArcIcon } from "../../../../types/arc-icon";
 export declare const SubNavItem: FC<SubNavItemProps>;
 export interface SubNavItemProps {
     /**
-     * Contents of the SubNavItem. Must be SiteHeader.ItemGroup or
-     * SiteHeader.Column components.
+     * Contents of the SubNavItem. Must be SiteHeaderV2.ItemGroup or
+     * SiteHeaderV2.Column components.
      */
     children?: ReactNode;
     /**
      * Should the SubNavItem be the default open item in a
-     * SiteHeader.NavItemWithSubNav? If not specified, the default open item will
+     * SiteHeaderV2.NavItemWithSubNav? If not specified, the default open item will
      * be set automatically.
      */
     isDefaultItem?: boolean;
@@ -17,10 +18,6 @@ export interface SubNavItemProps {
      * to close off any empty space between items due to content size.
      */
     offsetXL?: "24" | "48";
-    /**
-     * Content to display in the SubNavItem panel promo area.
-     */
-    promo?: ReactNode;
     /**
      * A URL to link to when the SubNavItem is clicked or touched. Only applies if
      * `children` are not present.
@@ -40,6 +37,7 @@ export interface SubNavItemProps {
      * provided, top-level link text will be automatically generated from `title`.
      */
     viewAllTitle?: string;
+    icon?: ArcIcon;
     /**
      * On click handler.
      */

package/dist/types/components/SiteHeaderV2/components/SubNavItem/index.d.ts

@@ -0,0 +1 @@
+export { SubNavItem } from "./SubNavItem";

package/dist/types/components/SiteHeaderV2/components/VerticalDivider/VerticalDivider.d.ts

@@ -0,0 +1,2 @@
+/// <reference types="react" />
+export declare const VerticalDivider: () => JSX.Element;

package/dist/types/components/SiteHeaderV2/components/VerticalDivider/index.d.ts

@@ -0,0 +1 @@
+export { VerticalDivider } from "./VerticalDivider";

package/dist/types/components/SiteHeaderV2/index.d.ts

@@ -0,0 +1 @@
+export { SiteHeaderV2 } from "./SiteHeaderV2";

package/dist/types/components/SkipLink/SkipLink.d.ts

@@ -0,0 +1,12 @@
+import { FC, ReactNode } from "react";
+import { SkipLinkItem } from "./SkipLinkItem/SkipLinkItem";
+/** Use `SkipLink` to help keyboard-only users skip to the main content on a page. */
+export declare const SkipLink: FC<SkipLinkProps> & {
+    Item: typeof SkipLinkItem;
+};
+export interface SkipLinkProps {
+    /**
+     * Links to display in the SkipLink.Item.
+     */
+    children?: ReactNode;
+}

package/dist/types/components/SkipLink/SkipLinkItem/SkipLinkItem.d.ts

@@ -0,0 +1,16 @@
+import { FC } from "react";
+export declare const SkipLinkItem: FC<SkipLinkItemProps>;
+export interface SkipLinkItemProps {
+    /**
+     * The label to display for SkipLink.Item.
+     */
+    label: string;
+    /**
+     * The URL the skip link navigates to.
+     */
+    href?: string;
+    /**
+     * The ID attribute of the target element the skip link navigates to.
+     */
+    id?: string;
+}

package/dist/types/components/SkipLink/index.d.ts

@@ -0,0 +1 @@
+export { SkipLink } from "./SkipLink";

package/dist/types/components/Spinner/Spinner.d.ts

@@ -0,0 +1,16 @@
+import { FC } from "react";
+/**
+ * Use `Spinner` to display a loading state.
+ */
+export declare const Spinner: FC<SpinnerProps>;
+export type SpinnerSize = "s" | "m" | "l" | "xl" | "xxl";
+export interface SpinnerProps {
+    /**
+     * Colour options. If no `color` option defined, the colour will use currentColor.
+     */
+    color?: "light" | "dark" | undefined;
+    /**
+     * Set sizes of spinner `s`, `m`, `l`, `xl`, `xxl` or a custom number value e.g. `100`px.
+     */
+    size?: SpinnerSize | number | null;
+}

package/dist/types/components/Spinner/index.d.ts

@@ -0,0 +1 @@
+export { Spinner } from "./Spinner";

package/dist/types/components/Surface/Surface.d.ts

@@ -7,16 +7,20 @@ declare const Context: React.Context<{
  * Use `Surface` to compose content using the Arc system.
  */
 export declare const Surface: FC<SurfaceProps>;
-export declare const backgrounds: readonly ["black", "brand", "brand-flat", "dark", "darker", "coral", "turquoise", "light", "lighter", "white"];
-export declare const backgroundsBT: readonly ["black", "brand", "brand-flat", "dark", "darker", "coral", "turquoise", "light", "lighter", "white"];
+export declare const backgrounds: readonly ["dark-black", "dark-brand-01", "dark-brand-02", "dark-neutral-01", "dark-neutral-02", "light-brand-01", "light-brand-02", "light-neutral-01", "light-neutral-02", "light-white"];
+export declare const backgroundsBT: readonly ["dark-black", "dark-brand-01", "dark-brand-02", "dark-neutral-01", "dark-neutral-02", "light-brand-01", "light-brand-02", "light-neutral-01", "light-neutral-02", "light-white"];
 export type SurfacePadding = "8" | "12" | "16" | "24" | "32" | "48" | "64";
-export type SurfaceBackgroundColor = "black" | "brand" | "brand-flat" | "dark" | "darker" | "coral" | "turquoise" | "light" | "lighter" | "white";
+export type SurfaceBackgroundColor = "dark-black" | "dark-brand-01" | "dark-brand-02" | "dark-neutral-01" | "dark-neutral-02" | "light-brand-01" | "light-brand-02" | "light-neutral-01" | "light-neutral-02" | "light-white";
 export interface SurfaceProps extends HTMLAttributes<HTMLElement> {
     /**
      * Background colour of the Surface. Contents will change colour to meet
      * accessibility requirements.
      */
     background?: SurfaceBackgroundColor;
+    /**
+     * Should the Surface be transparent? When true, no background colour will be applied.
+     */
+    isTransparent?: boolean;
     /**
      * Content to display on the Surface.
      */

package/dist/types/components/Switch/Switch.d.ts

@@ -1,9 +1,9 @@
 import { FC } from "react";
 import { SwitchProps as RadixSwitchProps } from "@radix-ui/react-switch";
 import { FormControlProps } from "../FormControl/FormControl";
-/** Use `Switch` to toggle between checked and not checked. */
+/** Use `Switch` to allow users to immediately toggle between two states. */
 export declare const Switch: FC<SwitchProps>;
-export interface SwitchProps extends Omit<FormControlProps, "children" | "elementType" | "htmlFor" | "requirementStatus" | "disclosureText" | "disclosureTitle" | "onClickDisclosure" | "helper" | "supplementaryInfo"> {
+export interface SwitchProps extends Omit<FormControlProps, "children" | "elementType" | "htmlFor" | "requirementStatus" | "disclosureText" | "disclosureTitle" | "onClickDisclosure" | "helper" | "helpUnderLabel" | "supplementaryInfo"> {
     /**
      * Hide Label above toggle?
      */
@@ -32,6 +32,10 @@ export interface SwitchProps extends Omit<FormControlProps, "children" | "elemen
      * name for the hidden checkbox if within a form
      */
     name?: RadixSwitchProps["name"];
+    /**
+     * Aria label to add a description to the switch button
+     */
+    ariaLabel?: string;
     /**
      * callback for when the switch is toggled
      */

package/dist/types/components/Tabs/Tabs.d.ts

@@ -2,6 +2,7 @@ import { FC, ReactNode } from "react";
 import { Tab } from "./Tab/Tab";
 import { TabContent } from "./TabContent";
 import { TabsList } from "./TabsList";
+/** Use `Tabs` to allow users to navigate between different sections of relevant content. */
 export declare const Tabs: FC<TabsProps> & {
     Tab: typeof Tab;
     Content: typeof TabContent;

package/dist/types/components/Tabs/TabsList/TabsList.d.ts

@@ -1,4 +1,5 @@
 import { FC, ReactNode } from "react";
+import { SurfaceBackgroundColor } from "../../Surface";
 export declare const TabsList: FC<TabsListProps>;
 export interface TabsListProps {
     /**
@@ -17,4 +18,8 @@ export interface TabsListProps {
      * Determine a accessible label for `Tabs`
      */
     ariaLabel?: string;
+    /**
+     * Background color for the overlap gradient.
+     */
+    overflowGradient?: SurfaceBackgroundColor;
 }

package/dist/types/components/Tag/Tag.d.ts

@@ -1,7 +1,7 @@
 import { FC, ReactNode } from "react";
 import { ArcIcon } from "../../types/arc-icon";
 /**
- * use `Tag` to promote features and manage filtering.
+ * Use `Tag` to promote features and manage filtering.
  */
 export declare const Tag: FC<TagProps>;
 export interface TagProps {
@@ -29,4 +29,8 @@ export interface TagProps {
      * Execute function on remove
      */
     onRemove?: () => void;
+    /**
+     * Specify extra information about the Tag.
+     */
+    title?: string;
 }

package/dist/types/components/Text/Text.d.ts

@@ -34,4 +34,8 @@ export interface TextProps {
      * Id for the Text.
      */
     id?: string;
+    /**
+     * Element type for text component. Default value is span
+     */
+    elementType?: "span" | "p";
 }

package/dist/types/components/TextArea/TextArea.d.ts

@@ -1,5 +1,6 @@
 import React from "react";
 import { FormControlProps } from "../FormControl/FormControl";
+import { AutoCompleteTypes } from "../../types/auto-complete-types";
 type EventType = React.ChangeEvent<HTMLTextAreaElement>;
 /** Use `TextArea` to allow custom user text entry via keyboard, for long-form and multi-line descriptions */
 export declare const TextArea: React.ForwardRefExoticComponent<TextAreaProps & React.RefAttributes<HTMLTextAreaElement>>;
@@ -59,5 +60,21 @@ export interface TextAreaProps extends Omit<FormControlProps, "children" | "elem
      * `onChange` callback function. Otherwise, use `defaultValue` (or `isReadOnly`).
      */
     value?: string;
+    /**
+     * Sets the width of the TextArea.
+     */
+    width?: string;
+    /**
+     *  Sets autoComplete value for TextArea.
+     */
+    autoComplete?: AutoCompleteTypes;
+    /**
+     *  Sets minimum height value for TextArea.
+     */
+    minHeight?: string;
+    /**
+     *  Sets max-height value for TextArea.
+     */
+    maxHeight?: string;
 }
 export {};

package/dist/types/components/TextInput/TextInput.d.ts

@@ -1,11 +1,15 @@
-import React, { FC } from "react";
+import React from "react";
 import { FormControlProps } from "../FormControl/FormControl";
+import { AutoCompleteTypes } from "../../types/auto-complete-types";
+import { ThemeIconNames } from "../ThemeIcon";
 type EventType = React.ChangeEvent<HTMLInputElement>;
+type Ref = React.Ref<HTMLInputElement>;
 /**
- * Use `TextInput` to allow custom user text entry with a keyboard.
+ * Use `TextInput` to allow users to enter short form text.
  */
-export declare const TextInput: FC<TextInputProps>;
-export interface TextInputProps extends Omit<FormControlProps, "children" | "elementType" | "htmlFor" | "requirementStatus" | "helperUnderLabel" | "supplementaryInfo"> {
+export declare const TextInput: React.ForwardRefExoticComponent<Omit<TextInputProps, "ref"> & React.RefAttributes<HTMLInputElement>>;
+export declare const TextInputWithPlaceHolder: React.ForwardRefExoticComponent<Omit<TextInputComponentProps, "ref"> & React.RefAttributes<HTMLInputElement>>;
+export interface TextInputComponentProps extends Omit<FormControlProps, "children" | "elementType" | "htmlFor" | "requirementStatus" | "helperUnderLabel" | "supplementaryInfo"> {
     /**
      * Uncontrolled default value of the TextInput. If the TextInput is controlled
      * via `value`/`onChange`, `defaultValue` will be ignored.
@@ -48,7 +52,7 @@ export interface TextInputProps extends Omit<FormControlProps, "children" | "ele
     /**
      * Function to call when the TextInput loses focus.
      */
-    onBlur?: (e: EventType) => void;
+    onBlur?: (e: React.FocusEvent<HTMLInputElement, Element>) => void;
     /**
      * Callback function commonly used to update the TextInput's controlled
      * `value`, for example `e => setValue(e.target.value)`.
@@ -63,9 +67,20 @@ export interface TextInputProps extends Omit<FormControlProps, "children" | "ele
      */
     inputSize?: "s" | "m" | "l";
     /**
-     * Enable button to toggle TextInput type from `Selected Type` to `Text`
+     * Determine the alignment of the text within the input
+     */
+    inputAlignment?: "left" | "right";
+    /**
+     * Enable button to toggle TextInput type from `Selected Type` to `Text`. This will override any `suffix` elements
      */
     showPassword?: boolean;
+    /**
+     * Add a prefixed value within `TextInput`
+     */
+    prefix?: string;
+    /**
+     * Add a suffixed value within `TextInput`. If `showPassword` is true, suffix will not be displayed   */
+    suffix?: string;
     /**
      * Type for the input. `number` will be changed to `text` and set the `numeric` inputMode.
      */
@@ -75,5 +90,30 @@ export interface TextInputProps extends Omit<FormControlProps, "children" | "ele
      * `onChange` callback function. Otherwise, use `defaultValue` (or `isReadOnly`).
      */
     value?: string;
+    /**
+     * Placeholder for the input
+     */
+    placeholder?: string;
+    /**
+     * Icon button to show at the end of the input
+     */
+    iconButton?: {
+        ref?: React.Ref<HTMLButtonElement>;
+        onFocus?: React.FocusEventHandler<HTMLButtonElement>;
+        onClick: () => void;
+        label: string;
+        icon: ThemeIconNames;
+    };
+    /**
+     * Sets the width of the TextInput.
+     */
+    width?: string;
+    /**
+     *  Sets autoComplete value for TextInput.
+     */
+    autoComplete?: AutoCompleteTypes;
+    ref?: Ref;
 }
+export type TextInputProps = Omit<TextInputComponentProps, "placeholder">;
+export type TextInputWithPlaceholderProps = TextInputComponentProps;
 export {};

package/dist/types/components/Theme/Theme.d.ts

@@ -1,11 +1,19 @@
 import { FC } from "react";
+/**
+ * Use `Theme` component to apply a specific theme to its children.
+ */
 export declare const Theme: FC<ThemeProps>;
-export declare const themes: readonly ["arc-11", "ee"];
+export declare const themes: readonly ["bt-enterprise", "bt-business", "ee"];
+export type ThemeType = "bt-enterprise" | "bt-business" | "ee";
 export interface ThemeProps {
     /**
-     * Theme to apply to all children. Should be one of "arc-11"
+     * Theme to apply to all children. Should be one of "bt-enterprise"
      */
-    theme?: "arc-11" | "ee";
+    theme?: ThemeType;
+    /**
+     * Applies a style reset to everything within theme component, defaults to true.
+     */
+    resetCssStyles?: boolean;
     /**
      * Content to display inside Theme.
      */

package/dist/types/components/Theme/index.d.ts

@@ -1 +1 @@
-export { Theme, themes } from "./Theme";
+export { Theme, themes, type ThemeType } from "./Theme";

package/dist/types/components/ThemeIcon/icon-names.d.ts

@@ -1 +1 @@
-export declare const iconNames: readonly ["alertDismiss", "alertError", "alertGeneral", "alertSuccess", "alertWarning", "breadcrumbLeft", "breadcrumbRight", "buttonLeft", "buttonRight", "cardButton", "checkboxChecked", "checkboxError", "disclosureExpand", "disclosureMiniExpand", "formControlAlert", "modalClose", "paginationPrevious", "paginationNext", "paginationSimplePrevious", "paginationSimpleNext", "progressBarSuccess", "progressBarError", "progressBarRefresh", "progressStepperComplete", "progressStepperCurrent", "progressStepperWarning", "progressStepperError", "scrollToTop", "selectTrigger", "selectScrollUp", "selectScrollDown", "selectIndicator", "siteFooterExpand", "siteHeaderBack", "siteHeaderLink", "siteHeaderItemGroupExpand", "siteHeaderNavItemExpand", "siteHeaderNavItemExpandAlt", "siteHeaderViewAll", "siteHeaderSubNavOpen", "switchToggle", "tabsNext", "tabsPrevious", "tagRemove", "tagRemoveInteractive", "toastGeneral", "toastSuccess", "toastWarning", "toastError", "toastDismiss"];
+export declare const iconNames: readonly ["alertDismiss", "alertError", "alertGeneral", "alertSuccess", "alertWarning", "avatarUser", "breadcrumbLeft", "breadcrumbRight", "buttonLeft", "buttonRight", "cardButton", "carouselRight", "carouselLeft", "checkboxChecked", "checkboxError", "datePickerCalendar", "disclosureExpand", "disclosureMiniExpand", "downloadFile", "downloadAccessibility", "formControlAlert", "modalClose", "paginationPrevious", "paginationNext", "paginationSimplePrevious", "paginationSimpleNext", "progressBarSuccess", "progressBarError", "progressBarRefresh", "progressStepperComplete", "progressStepperCurrent", "progressStepperWarning", "progressStepperError", "scrollToTop", "selectTrigger", "selectScrollUp", "selectScrollDown", "selectIndicator", "siteFooterExpand", "siteHeaderBack", "siteHeaderLink", "siteHeaderItemGroupExpand", "siteHeaderNavItemExpand", "siteHeaderNavItemExpandAlt", "siteHeaderViewAll", "siteHeaderSubNavOpen", "switchToggle", "tabsNext", "tabsPrevious", "toastGeneral", "toastSuccess", "toastWarning", "toastError", "toastDismiss", "videoPlayerTranscript"];

package/dist/types/components/Toast/Toast.d.ts

@@ -1,6 +1,6 @@
 import React, { FC } from "react";
 import { ToastNotification } from "./ToastNotification";
-/** Use `Toast` to display temporary messages at the bottom of the viewport. */
+/** Use `Toast` to display temporary messages at the bottom of the screen. */
 export declare const Toast: FC<ToastProps> & {
     Notification: typeof ToastNotification;
 };

package/dist/types/components/Truncate/Truncate.d.ts

@@ -13,5 +13,5 @@ export interface TruncateProps {
     /**
      * Set max width of visible content within `Truncate`. Default is `100%`.
      */
-    maxWidth?: number;
+    maxWidth?: string;
 }

package/dist/types/components/TypographyCard/TypographyCard.d.ts

@@ -0,0 +1,58 @@
+import React, { FC } from "react";
+import { type HeadingLevel } from "../Heading/Heading";
+import { type CardHeadingSize } from "../CardHeading";
+import { type CardFooterProps } from "../CardFooter";
+/** Use `TypographyCard` for content that benefits from larger and energetic typography. */
+export declare const TypographyCard: FC<TypographyCardProps>;
+type TypographyCardIcon = "play" | "arrow";
+type TypographyCardPathway = "light" | "dark";
+export interface TypographyCardProps {
+    /**
+     * Heading for the TypographyCard.
+     */
+    heading: string;
+    /**
+     * Heading size for the ImpactCard.
+     */
+    headingSize?: CardHeadingSize;
+    /**
+     * Url for the TypographyCard.
+     */
+    url: string;
+    /**
+     * Sets a dark or light background for the TypographyCard.
+     */
+    pathway?: TypographyCardPathway;
+    /**
+     * Icon for the TypographyCard Cta button.
+     */
+    buttonIcon?: TypographyCardIcon;
+    /**
+     * Heading level for the TypographyCard heading.
+     */
+    headingLevel?: HeadingLevel;
+    /**
+     * Uppercase label for the TypographyCard.
+     */
+    label?: string;
+    /**
+     * Click handler for the TypographyCard.
+     */
+    onClick?: (e: React.MouseEvent<HTMLAnchorElement>) => void;
+    /**
+     * Text to show adjacent to the cta, can be either a date or text. Its recommended to pass dates as Date objects so the component can render them correctly.
+     */
+    metaText?: CardFooterProps["metaText"];
+    /**
+     * Sets a minimum height for the TypographyCard.
+     */
+    minHeight?: number;
+    /**
+     * Object of `data-` attributes to render on internal anchor element, e.g.
+     * `{ data-analytics-link: "My link"}` => `<a data-analytics-link="My link">`.
+     */
+    linkData?: {
+        [key: string]: string;
+    };
+}
+export {};

package/dist/types/components/TypographyCard/index.d.ts

@@ -0,0 +1 @@
+export { TypographyCard, type TypographyCardProps } from "./TypographyCard";

package/dist/types/components/UniversalHeader/UniversalHeader.d.ts

@@ -22,4 +22,8 @@ export interface UniversalHeaderProps {
      * UniversalHeader.Item components.
      */
     children: ReactNode;
+    /**
+     * A Slot to accept react node. Any content with this slot will be aligned right.
+     */
+    ContentSlot?: ReactNode;
 }

package/dist/types/components/VideoPlayer/VideoPlayer.d.ts

@@ -0,0 +1,27 @@
+import React from "react";
+import { type ReactPlayerProps } from "react-player";
+/**
+ * Use `VideoPlayer` to embed videos from YouTube or Vimeo.
+ */
+export declare const VideoPlayer: React.FC<VideoPlayerProps>;
+export interface VideoPlayerProps extends Pick<ReactPlayerProps, "onReady" | "onPlay" | "onStart" | "onPause" | "onEnded" | "onError" | "light"> {
+    url: string;
+    title: string;
+    description: string;
+    isBorderRadius?: boolean;
+    transcriptLink?: {
+        url: string;
+        text: string;
+        fileSize: string;
+        format: string;
+    };
+    transcriptContent?: {
+        heading: string;
+        description: string;
+        content: {
+            heading?: string;
+            text?: string;
+        }[];
+    };
+    isSupportingTextHidden?: boolean;
+}

package/dist/types/components/VideoPlayer/index.d.ts

@@ -0,0 +1 @@
+export { VideoPlayer, type VideoPlayerProps } from "./VideoPlayer";

package/dist/types/components/Visible/Visible.d.ts

@@ -0,0 +1,11 @@
+import React from "react";
+export declare const Visible: React.FC<VisibleProps>;
+interface VisibleProps {
+    xs?: boolean;
+    s?: boolean;
+    m?: boolean;
+    l?: boolean;
+    xl?: boolean;
+    children: React.ReactNode;
+}
+export {};

package/dist/types/components/Visible/index.d.ts

@@ -0,0 +1 @@
+export { Visible } from "./Visible";

package/dist/types/components/VisuallyHidden/VisuallyHidden.d.ts

@@ -1,6 +1,6 @@
 import { FC, ReactNode } from "react";
 /**
- * Provides text for screen readers that is visually hidden.
+ * Use `VisuallyHidden` to provide text for screen readers that is visually hidden on screen.
  */
 export declare const VisuallyHidden: FC<VisuallyHiddenProps>;
 export interface VisuallyHiddenProps {