@orangesk/orange-design-system 2.0.0-beta.2 → 2.0.0-beta.21

package/build/components/types/src/components/Link/Link.d.ts

@@ -8,11 +8,11 @@ export interface LinkProps {
     className?: string;
     /** link content */
     children?: React.ReactNode;
-    /** color scheme for link: dark (white text) or light (black text) */
-    colorScheme?: "dark" | "light";
     /** whether the link should be underlined */
     isUnderline?: boolean;
     /** whether the link should have normal font weight */
     isNormal?: boolean;
+    /** when true, adds the .no-accent modifier to disable orange accent color on hover (useful for dark backgrounds) */
+    noAccent?: boolean;
 }
 export declare const Link: React.FC<LinkProps & React.HTMLAttributes<HTMLElement>>;

package/build/components/types/src/components/Megamenu/Megamenu.d.ts

@@ -1 +1,6 @@
-export declare const Megamenu: ({ className }: any) => import("react").JSX.Element;
+export declare const list: string[];
+export type MegamenuProps = {
+    className?: string;
+    searchEmpty?: boolean;
+};
+export declare const Megamenu: ({ className, searchEmpty }: MegamenuProps) => import("react/jsx-runtime").JSX.Element;

package/build/components/types/src/components/Megamenu/MegamenuBlog.d.ts

@@ -1 +1,2 @@
-export declare const MegamenuBlog: ({ className }: any) => import("react").JSX.Element;
+import { MegamenuProps } from "./Megamenu";
+export declare const MegamenuBlog: ({ className, searchEmpty }: MegamenuProps) => import("react/jsx-runtime").JSX.Element;

package/build/components/types/src/components/Megamenu/constants.d.ts

@@ -21,6 +21,8 @@ export declare const CLASS_NAV_DROPDOWN = "megamenu__nav-dropdown";
 export declare const CLASS_SUBNAV = "megamenu__subnav";
 export declare const CLASS_SUBNAV_ITEM = "megamenu__subnav-item";
 export declare const CLASS_OVERLAY = "megamenu__overlay";
+export declare const CLASS_SPACER = "megamenu-spacer";
+export declare const CLASS_SPACER_SMALL = "megamenu-spacer--small";
 export declare const CLASS_TEXT_LARGE = "megamenu__text--large";
 export declare const CLASS_HIDE_MD_DOWN = "megamenu--hide-md-down";
 export declare const CLASS_HIDE_LG_UP = "megamenu--hide-lg-up";
@@ -40,6 +42,8 @@ export declare const CLASS_ACCORDION_BODY = "megamenu__accordion-body";
 export declare const CLASS_INPUT = "megamenu__input";
 export declare const CLASS_INPUT_SEARCH_ICON_WITH_PLACEHOLDER = "megamenu__input--search-icon-with-placeholder";
 export declare const CLASS_TAG = "megamenu__tag";
+export declare const CLASS_TAG_ORANGE = "megamenu__tag--orange";
+export declare const CLASS_TAG_SMALL = "megamenu__tag--small";
 export declare const CLASS_TAG_TRANSPARENT = "megamenu__tag--transparent";
 export declare const CLASS_TAG_LARGE = "megamenu__tag--large";
 export declare const CLASS_LIST_INLINE = "megamenu__list--inline";

package/build/components/types/src/components/Megamenu/static.d.ts

@@ -1,5 +1,4 @@
 import Megamenu from "./Megamenu.static";
-import { initModulesWithin, destroyModulesWithin } from "../../scripts/lib/moduleFactory";
 import "./styles/style.scss";
 export declare const customMegamenuModuleSelectorPairs: {
     Module: typeof Megamenu;
@@ -13,8 +12,8 @@ declare global {
             instances: Megamenu[];
             init: () => void;
             destroy: () => void;
-            initModulesWithin: typeof initModulesWithin;
-            destroyModulesWithin: typeof destroyModulesWithin;
+            initModulesWithin: (container: any) => {};
+            destroyModulesWithin: (container: any, removeOrphanedNodes?: boolean | undefined) => {};
         };
     }
 }

package/build/components/types/src/components/Modal/Modal.d.ts

@@ -30,12 +30,8 @@ interface ModalProps extends React.HTMLAttributes<HTMLDivElement> {
     children?: React.ReactNode;
     /** Additional CSS classes */
     className?: string;
-    /** Color scheme for the modal */
-    colorScheme?: "dark" | "light";
     /** Disables header paddings */
     disableHeaderSpacing?: boolean;
-    /** Disables body paddings */
-    disableBodySpacing?: boolean;
     /** Disables footer paddings */
     disableFooterSpacing?: boolean;
 }

package/build/components/types/src/components/Modal/ModalBody.d.ts

@@ -1,8 +1,8 @@
 import React from "react";
-export declare const colors: readonly ["white", "gray", "orange", "orange-dark", "black", "blue", "green", "pink", "violet", "yellow"];
-export type BodyColor = (typeof colors)[number];
+export declare const modalBodyColors: readonly ["background-primary", "background-secondary", "background-contrast", "background-accent", "background-accent1-blog", "background-accent2-blog", "surface-primary", "surface-secondary", "surface-tertiary", "surface-subtle", "surface-moderate", "surface-contrast", "surface-accent", "fill-subtle", "fill-accent1", "fill-accent2", "fill-accent3", "fill-accent4", "fill-accent5"];
+export type ModalBodyColor = (typeof modalBodyColors)[number];
 interface ModalBodyProps extends React.HTMLAttributes<HTMLDivElement> {
-    color?: BodyColor;
+    color?: ModalBodyColor;
     className?: string;
     children?: React.ReactNode;
     withTopPadding?: boolean;

package/build/components/types/src/components/Modal/ModalProductHeader.d.ts

@@ -3,6 +3,8 @@ interface ModalProductHeaderProps extends React.HTMLAttributes<HTMLDivElement> {
     image?: React.ReactNode;
     /** Use small spacing */
     space?: "small";
+    /** Optional id for accessibility (e.g., for aria-labelledby) */
+    titleId?: string;
 }
 export declare const CLASS_ROOT = "modal__product";
 declare const ModalProductHeader: React.ForwardRefExoticComponent<ModalProductHeaderProps & React.RefAttributes<HTMLDivElement>>;

package/build/components/types/src/components/Modal/index.d.ts

@@ -4,4 +4,3 @@ export { ModalTitle } from "./ModalTitle";
 export { ModalCloseButton } from "./ModalCloseButton";
 export { ModalProductHeader } from "./ModalProductHeader";
 export { ModalProductFooter } from "./ModalProductFooter";
-export { ModalProductBody } from "./ModalProductBody";

package/build/components/types/src/components/Pagination/Pagination.d.ts

@@ -1,6 +1,5 @@
 import React from "react";
-import { PaginationItem } from "./PaginationItem";
-interface PaginationItem {
+interface PaginationItemProps {
     /** Page link href */
     href: string;
     /** Text label inside page item */
@@ -13,10 +12,8 @@ interface PaginationItem {
 interface PaginationProps {
     /** Collapsed version */
     isCompact?: boolean;
-    /** Dark theme */
-    colorScheme?: "light" | "dark";
     /** All pagination items - buttons & numbers */
-    items: PaginationItem[];
+    items: PaginationItemProps[];
     /** Accessibility label */
     label?: string;
     /** Additional CSS class name */

package/build/components/types/src/components/Pagination/Separator.d.ts

@@ -1,6 +1,6 @@
-import React, { HTMLAttributes } from "react";
+import { HTMLAttributes } from "react";
 declare const Separator: {
-    (props: HTMLAttributes<HTMLLIElement>): React.JSX.Element;
+    (props: HTMLAttributes<HTMLLIElement>): import("react/jsx-runtime").JSX.Element;
     displayName: string;
 };
 export default Separator;

package/build/components/types/src/components/Pill/Pill.d.ts

@@ -1,8 +1,10 @@
 import React, { ReactNode, HTMLAttributes } from "react";
+export declare const pillColors: readonly ["surface-primary", "surface-secondary", "surface-tertiary", "surface-subtle", "surface-moderate", "surface-contrast", "surface-accent", "fill-moderate", "fill-disabled", "transparent"];
+export type PillColor = (typeof pillColors)[number];
 interface PillProps extends HTMLAttributes<HTMLSpanElement> {
     className?: string;
     children?: ReactNode;
-    colorScheme?: "dark" | "light" | "transparent";
+    color?: PillColor;
     size?: "small" | "medium" | "large" | "xlarge" | "xxlarge";
 }
 declare const Pill: React.FC<PillProps>;

package/build/components/types/src/components/Preview/Preview.d.ts

@@ -5,5 +5,5 @@ type PreviewProps = React.ComponentProps<typeof PreviewGenerator> & {
     codeJSXOptions?: Record<string, any>;
     children: ReactNode;
 };
-export declare function Preview({ children, codeJSXOptions, codeTypes, ...rest }: PreviewProps): React.JSX.Element;
+export declare function Preview({ children, codeJSXOptions, codeTypes, ...rest }: PreviewProps): import("react/jsx-runtime").JSX.Element;
 export {};

package/build/components/types/src/components/Preview/PreviewGenerator.d.ts

@@ -1,6 +1,7 @@
 import { ReactNode, FunctionComponent } from "react";
 import "./styles/style.scss";
 interface PreviewProps {
+    isDark?: boolean;
     bgTheme?: string | boolean;
     bgThemeColors?: Record<string, string>;
     bgThemeExcludedColors?: string[];

package/build/components/types/src/components/Preview/index.d.ts

@@ -5,5 +5,5 @@ interface ThemedPreviewProps {
     [key: string]: any;
 }
 declare const ThemedPreview: React.FC<ThemedPreviewProps>;
-export declare const PreviewSpacing: ({ children, spacePreviewConfig }: any) => React.JSX.Element;
+export declare const PreviewSpacing: ({ children, spacePreviewConfig }: any) => import("react/jsx-runtime").JSX.Element;
 export { ThemedPreview as Preview };

package/build/components/types/src/components/Progress/Progress.d.ts

@@ -10,6 +10,5 @@ export interface ProgressProps {
     width?: number;
     className?: string;
     children?: React.ReactNode;
-    colorMode?: "light" | "dark";
 }
 export declare const Progress: React.FC<ProgressProps>;

package/build/components/types/src/components/PromoBanner/PromoBanner.d.ts

@@ -1,12 +1,15 @@
 import React from "react";
 interface PromoBannerProps {
-    colorScheme?: "light" | "dark";
     className?: string;
-    title: string;
-    secondaryTitle?: string;
-    description: string;
-    buttonText: string;
     image?: string;
+    alignImage?: "bottom" | "top";
+    imageFullWidth?: boolean;
+    /** Make image extend to the edge of viewport even when inside container */
+    bleedImage?: boolean;
+    children?: React.ReactNode;
+    itemClassName?: string;
+    imageClassName?: string;
+    variant?: "vertical" | "reverse";
 }
-export declare const PromoBanner: ({ title, secondaryTitle, description, buttonText, image, colorScheme, className, }: PromoBannerProps) => React.JSX.Element;
+export declare const PromoBanner: ({ image, className, alignImage, bleedImage, children, itemClassName, imageClassName, variant, imageFullWidth, }: PromoBannerProps) => import("react/jsx-runtime").JSX.Element;
 export {};

package/build/components/types/src/components/PromotionCard/PromotionCard.d.ts

@@ -1,9 +1,9 @@
-import React from 'react';
+import React from "react";
+import { CardColor } from "../Card";
 export interface PromotionCardProps {
-    /** Inverse colors */
-    colorScheme?: 'light' | 'dark';
     className?: string;
     children?: React.ReactNode;
+    color?: CardColor;
     [key: string]: any;
 }
 export declare const PromotionCard: React.FC<PromotionCardProps>;

package/build/components/types/src/components/Section/Section.d.ts

@@ -1,5 +1,6 @@
 import React from "react";
-export type SectionColor = "white" | "gray" | "black" | "orange" | "accent1-blog" | "accent2-blog";
+export declare const sectionColors: readonly ["background-secondary", "background-contrast", "background-accent", "background-accent1-blog", "background-accent2-blog", "background-none", "surface-subtle"];
+export type SectionColor = (typeof sectionColors)[number];
 export type SectionSpacing = "default" | "small" | "xsmall";
 export interface SectionProps {
     /** Background color of section */
@@ -19,5 +20,7 @@ export interface SectionProps {
     className?: string;
     /** Section content */
     children?: React.ReactNode;
+    /** Additional classes passed to the container */
+    containerClassName?: string;
 }
 export declare const Section: React.FC<SectionProps>;

package/build/components/types/src/components/SocialButton/SocialButton.d.ts

@@ -0,0 +1,13 @@
+import React from "react";
+export type SocialName = "x" | "facebook-2" | "linkedin-2" | "instagram" | "pinterest" | "snapchat" | "tiktok" | "whatsapp" | "youtube" | "email";
+type CommonProps = {
+    name: SocialName;
+    className?: string;
+};
+type ButtonProps = CommonProps & Omit<React.ButtonHTMLAttributes<HTMLButtonElement>, "type" | keyof CommonProps>;
+type LinkProps = CommonProps & Omit<React.AnchorHTMLAttributes<HTMLAnchorElement>, keyof CommonProps> & {
+    href: string;
+};
+export type SocialButtonProps = ButtonProps | LinkProps;
+export declare const SocialButton: React.ForwardRefExoticComponent<SocialButtonProps & React.RefAttributes<HTMLAnchorElement | HTMLButtonElement>>;
+export {};

package/build/components/types/src/components/SocialButton/index.d.ts

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

package/build/components/types/src/components/Stepbar/Stepbar.d.ts

@@ -14,8 +14,6 @@ export interface StepbarProps extends React.HTMLAttributes<HTMLElement> {
     showTitlesFrom?: ShowTitlesFrom;
     /** Array of step objects */
     steps: StepbarStep[];
-    /** Visual variant of the stepbar */
-    colorScheme?: "dark" | "light";
 }
 declare const Stepbar: React.FC<StepbarProps>;
 export { Stepbar };

package/build/components/types/src/components/Table/Row.d.ts

@@ -1,10 +1,9 @@
-import React from "react";
 import { TableRow } from "./types";
 interface RowProps {
     row: TableRow;
 }
 declare const Row: {
-    ({ row }: RowProps): React.JSX.Element[];
+    ({ row }: RowProps): import("react/jsx-runtime").JSX.Element[];
     displayName: string;
 };
 export { Row };

package/build/components/types/src/components/Table/Table.d.ts

@@ -10,6 +10,8 @@ interface TableProps extends React.TableHTMLAttributes<HTMLTableElement> {
     headers: TableHeader[];
     /** Compact table only takes spaced needed to display its content */
     isCompact?: boolean;
+    /** Enable responsive card layout below md breakpoint for better accessibility */
+    isResponsive?: boolean;
     /** If table has horizontal scrollbar */
     isScrollable?: boolean;
     /** Different colors for even and odd rows. */
@@ -17,8 +19,6 @@ interface TableProps extends React.TableHTMLAttributes<HTMLTableElement> {
     /** rows to print out in the table. */
     rows: TableRow[];
     className?: string;
-    /** Sets color scheme */
-    colorScheme?: "dark" | "light";
 }
 declare const Table: React.FC<TableProps>;
 export { Table };

package/build/components/types/src/components/Table/docsData.d.ts

@@ -36,4 +36,6 @@ export declare const shrinkHeaders: TableHeader[];
 export declare const shrinkRows: TableRow[];
 export declare const fillHeaders: TableHeader[];
 export declare const fillRows: TableRow[];
+export declare const responsiveHeaders: TableHeader[];
+export declare const responsiveRows: TableRow[];
 export {};

package/build/components/types/src/components/Table/types.d.ts

@@ -31,4 +31,5 @@ export interface TableContextType {
     rows: TableRow[];
     footers?: TableRow[];
     expandableRows?: ExpandableRows;
+    isResponsive?: boolean;
 }

package/build/components/types/src/components/Tabs/Tabs.d.ts

@@ -7,8 +7,6 @@ interface TabsProps extends React.HTMLAttributes<HTMLUListElement> {
     activeTabIndex?: number;
     /** Additional classes for tabs header. */
     classesTabNav?: string;
-    /** Color theme for the tabs */
-    colorScheme?: "dark" | "light";
     /** All tabs have equal width inside a full-width container */
     hasEqualTabWidth?: boolean;
     /** Fullwidth container */

package/build/components/types/src/components/Tag/Tag.d.ts

@@ -6,8 +6,6 @@ export type TagSize = "small" | "large";
 interface CommonProps {
     color?: TagColor;
     size?: TagSize;
-    /** @deprecated */
-    isInverse?: boolean;
     isDisabled?: boolean;
     className?: string;
     children?: React.ReactNode;

package/build/components/types/src/components/Tile/Tile.d.ts

@@ -1,6 +1,7 @@
 import React, { ReactNode } from "react";
 import { Image } from "../Image";
-export type TileColor = "default" | "white";
+export declare const tileColors: readonly ["surface-primary", "surface-subtle", "surface-contrast"];
+export type TileColor = (typeof tileColors)[number];
 export type TileHAlign = "center";
 export type TileVAlign = "center" | "end" | "space-between";
 export interface TileProps extends React.HTMLAttributes<HTMLDivElement> {

package/build/components/types/src/components/Tooltip/Tooltip.d.ts

@@ -19,7 +19,6 @@ export interface TooltipProps extends React.HTMLAttributes<HTMLElement> {
     /** Additional CSS classes */
     className?: string;
     children?: React.ReactNode;
-    colorScheme?: "dark" | "light";
 }
 declare const Tooltip: React.FC<TooltipProps>;
 export { Tooltip };

package/build/components/types/src/components/Tooltip/tests/BaseWrapper.d.ts

@@ -1,3 +1,3 @@
 import React from "react";
-declare const Base: (props: React.HTMLAttributes<HTMLDivElement>) => React.JSX.Element;
+declare const Base: (props: React.HTMLAttributes<HTMLDivElement>) => import("react/jsx-runtime").JSX.Element;
 export default Base;

package/build/components/types/src/components/index.d.ts

@@ -1,6 +1,6 @@
-import "../styles/before-components.scss";
 import { Accordion, AccordionItem } from "./Accordion";
 import { Alert } from "./Alert";
+import { AnchorNavigation } from "./AnchorNavigation";
 import { Tag, TagButton } from "./Tag";
 import { Bar, BarBreak, BarItem } from "./Bar";
 import { BlockAction, BlockActionControl, BlockActionIndicator, BlockActionOverride } from "./BlockAction";
@@ -9,6 +9,7 @@ import { Breadcrumbs } from "./Breadcrumbs";
 import { Button, ButtonFill, ButtonGhost, ButtonPrimary, IconButton } from "./Button";
 import { Buttons } from "./Buttons";
 import { Carousel } from "./Carousel";
+import { CarouselHero, CarouselHeroItem } from "./CarouselHero";
 import { CarouselPromotions } from "./CarouselPromotions";
 import { CartTable } from "./CartTable";
 import { Container } from "./Container";
@@ -17,7 +18,6 @@ import { Divider } from "./Divider";
 import { Dropdown, DropdownDivider, DropdownItem, DropdownToggleButton } from "./Dropdown";
 import { Expander } from "./Expander/Expander";
 import { FeatureAccordion, FeatureAccordionItem } from "./FeatureAccordion";
-import { Footer } from "./Footer";
 import { Card, CardSection, CardProductHeader } from "./Card";
 import { Icon, Pictogram } from "./Icon";
 import { Gauge } from "./Gauge";
@@ -25,7 +25,7 @@ import { Grid, GridCol } from "./Grid";
 import { Image } from "./Image";
 import { Link } from "./Link";
 import { Loader } from "./Loader";
-import { Modal, ModalBody, ModalCloseButton, ModalTitle, ModalProductHeader } from "./Modal";
+import { Modal, ModalBody, ModalCloseButton, ModalTitle, ModalProductHeader, ModalProductFooter } from "./Modal";
 import { Section } from "./Section";
 import { Sticker } from "./Sticker";
 import { SkipLink } from "./SkipLink";
@@ -42,9 +42,9 @@ import { Tab, TabPanel, Tabs } from "./Tabs";
 import { Table } from "./Table";
 import { Tile } from "./Tile";
 import { Tooltip, InfoTooltip } from "./Tooltip";
-import "../styles/after-components.scss";
 import { Cover } from "./Cover";
 import { Testimonial } from "./Testimonial";
 import { Hero } from "./Hero";
 import { IconList, Item } from "./IconList";
-export { Accordion, AccordionItem, Alert, Autocomplete, Bar, BarBreak, BarItem, BlockAction, BlockActionControl, BlockActionIndicator, BlockActionOverride, BodyBanner, Breadcrumbs, Button, ButtonFill, ButtonGhost, ButtonPrimary, Buttons, Card, CardProductHeader, CardSection, Carousel, CarouselPromotions, CartTable, Checkbox, Container, Controls, Cover, Divider, Dropdown, DropdownDivider, DropdownItem, DropdownToggleButton, Expander, FeatureAccordion, FeatureAccordionItem, Field, Fieldset, File, Footer, Gauge, Grid, GridCol, Group, Hero, Hint, Icon, IconButton, IconList, Image, InfoTooltip, InputStepper, Item, Label, Link, List, ListItem, Loader, Message, Modal, ModalBody, ModalCloseButton, ModalProductHeader, ModalTitle, Pagination, Pictogram, Pill, Progress, PromoBanner, PromotionCard, PromotionCardContent, PromotionCardImageWrapper, PromotionCardSection, PromotionCardTitle, Radio, RangeSlider, Section, Select, Skeleton, SkipLink, Stepbar, Sticker, Tab, Table, TabPanel, Tabs, Tag, TagButton, Testimonial, TextArea, TextInput, Tile, Tooltip, };
+import { SocialButton } from "./SocialButton";
+export { Accordion, AccordionItem, Alert, AnchorNavigation, Autocomplete, Bar, BarBreak, BarItem, BlockAction, BlockActionControl, BlockActionIndicator, BlockActionOverride, BodyBanner, Breadcrumbs, Button, ButtonFill, ButtonGhost, ButtonPrimary, Buttons, Card, CardProductHeader, CardSection, Carousel, CarouselHero, CarouselHeroItem, CarouselPromotions, CartTable, Checkbox, Container, Controls, Cover, Divider, Dropdown, DropdownDivider, DropdownItem, DropdownToggleButton, Expander, FeatureAccordion, FeatureAccordionItem, Field, Fieldset, File, Gauge, Grid, GridCol, Group, Hero, Hint, Icon, IconButton, IconList, Image, InfoTooltip, InputStepper, Item, Label, Link, List, ListItem, Loader, Message, Modal, ModalBody, ModalCloseButton, ModalProductFooter, ModalProductHeader, ModalTitle, Pagination, Pictogram, Pill, Progress, PromoBanner, PromotionCard, PromotionCardContent, PromotionCardImageWrapper, PromotionCardSection, PromotionCardTitle, Radio, RangeSlider, Section, Select, Skeleton, SkipLink, SocialButton, Stepbar, Sticker, Tab, Table, TabPanel, Tabs, Tag, TagButton, Testimonial, TextArea, TextInput, Tile, Tooltip, };

package/build/components/types/src/docs/utils/SpacePreview.d.ts

@@ -1,3 +1,2 @@
-import React from "react";
-declare const SpacePreview: ({ children, config, ...other }: any) => React.JSX.Element;
+declare const SpacePreview: ({ children, config, ...other }: any) => import("react/jsx-runtime").JSX.Element;
 export default SpacePreview;

package/build/components/types/src/scripts/index.d.ts

@@ -1,8 +1,10 @@
 import Accordion from "../components/Accordion/Accordion.static";
+import AnchorNavigation from "../components/AnchorNavigation/AnchorNavigation.static";
 import Autocomplete from "../components/Forms/Autocomplete/Autocomplete.static";
 import DatePicker from "../components/Forms/DatePicker/DatePicker.static";
 import BlockAction from "../components/BlockAction/BlockAction.static";
 import Carousel from "../components/Carousel/Carousel.static";
+import CarouselHero from "../components/CarouselHero/CarouselHero.static";
 import CarouselPromotions from "../components/CarouselPromotions/CarouselPromotions.static";
 import Dropdown from "../components/Dropdown/Dropdown.static";
 import Expander from "../components/Expander/Expander.static";
@@ -15,13 +17,16 @@ import Table from "../components/Table/Table.static";
 import Tabs from "../components/Tabs/Tabs.static";
 import Tooltip from "../components/Tooltip/Tooltip.static";
 import InputStepper from "../components/Forms/InputStepper/InputStepper.static";
-import { initModulesWithin, destroyModulesWithin } from "./lib/moduleFactory";
 import Toggle from "./modules/Toggle";
 import SameHeight from "./modules/SameHeight";
 export declare const moduleSelectorPairs: ({
     Module: typeof Accordion;
     name: string;
     selector: string;
+} | {
+    Module: typeof AnchorNavigation;
+    name: string;
+    selector: string;
 } | {
     Module: typeof Autocomplete;
     name: string;
@@ -46,6 +51,10 @@ export declare const moduleSelectorPairs: ({
     Module: typeof Carousel;
     name: string;
     selector: string;
+} | {
+    Module: typeof CarouselHero;
+    name: string;
+    selector: string;
 } | {
     Module: typeof CarouselPromotions;
     name: string;
@@ -105,8 +114,8 @@ declare global {
                 Module: any;
                 selector: string;
             }>;
-            initModulesWithin: typeof initModulesWithin;
-            destroyModulesWithin: typeof destroyModulesWithin;
+            initModulesWithin: (container: any) => {};
+            destroyModulesWithin: (container: any, removeOrphanedNodes?: boolean | undefined) => {};
         };
     }
 }

package/build/components/types/src/scripts/modules/SameHeight.d.ts

@@ -8,6 +8,9 @@ export default class SameHeight {
     temporarilyShowHiddenElements(): void;
     originalDisplayStates: any[] | undefined;
     restoreHiddenElements(): void;
+    getCarouselElement(): any;
+    isInsideOrIsCarousel(): any;
+    getCarouselSlides(): any;
     groupElementsByTypeAndPosition(elements: any): {};
     init(): void;
     update(): void;

package/build/components/types/src/styles/export/color.d.ts

@@ -0,0 +1,105 @@
+export const exports: {
+    "light-background-primary": string;
+    "light-background-secondary": string;
+    "light-background-contrast": string;
+    "light-background-accent": string;
+    "light-background-accent1-blog": string;
+    "light-background-accent2-blog": string;
+    "light-surface-primary": string;
+    "light-surface-secondary": string;
+    "light-surface-tertiary": string;
+    "light-surface-subtle": string;
+    "light-surface-moderate": string;
+    "light-surface-contrast": string;
+    "light-surface-accent": string;
+    "light-fill-primary": string;
+    "light-fill-secondary": string;
+    "light-fill-tertiary": string;
+    "light-fill-subtle": string;
+    "light-fill-moderate": string;
+    "light-fill-disabled": string;
+    "light-fill-contrast": string;
+    "light-fill-accent1": string;
+    "light-fill-accent2": string;
+    "light-fill-accent3": string;
+    "light-fill-accent4": string;
+    "light-fill-accent5": string;
+    "light-fill-information": string;
+    "light-fill-positive": string;
+    "light-fill-warning": string;
+    "light-fill-negative": string;
+    "light-border-subtle": string;
+    "light-border-strong": string;
+    "light-border-contrast": string;
+    "light-border-accent": string;
+    "light-border-information": string;
+    "light-border-positive": string;
+    "light-border-warning": string;
+    "light-border-negative": string;
+    "light-icon-default": string;
+    "light-icon-inverse": string;
+    "light-icon-brand": string;
+    "light-icon-accent": string;
+    "light-icon-disabled": string;
+    "light-icon-information": string;
+    "light-icon-positive": string;
+    "light-icon-warning": string;
+    "light-icon-negative": string;
+    "light-text-default": string;
+    "light-text-secondary": string;
+    "light-text-disabled": string;
+    "light-text-inverse": string;
+    "light-text-accent": string;
+    "dark-background-primary": string;
+    "dark-background-secondary": string;
+    "dark-background-contrast": string;
+    "dark-background-accent": string;
+    "dark-background-accent1-blog": string;
+    "dark-background-accent2-blog": string;
+    "dark-surface-primary": string;
+    "dark-surface-secondary": string;
+    "dark-surface-tertiary": string;
+    "dark-surface-subtle": string;
+    "dark-surface-moderate": string;
+    "dark-surface-contrast": string;
+    "dark-surface-accent": string;
+    "dark-fill-primary": string;
+    "dark-fill-secondary": string;
+    "dark-fill-tertiary": string;
+    "dark-fill-subtle": string;
+    "dark-fill-moderate": string;
+    "dark-fill-disabled": string;
+    "dark-fill-contrast": string;
+    "dark-fill-accent1": string;
+    "dark-fill-accent2": string;
+    "dark-fill-accent3": string;
+    "dark-fill-accent4": string;
+    "dark-fill-accent5": string;
+    "dark-fill-information": string;
+    "dark-fill-positive": string;
+    "dark-fill-warning": string;
+    "dark-fill-negative": string;
+    "dark-border-subtle": string;
+    "dark-border-strong": string;
+    "dark-border-contrast": string;
+    "dark-border-accent": string;
+    "dark-border-information": string;
+    "dark-border-positive": string;
+    "dark-border-warning": string;
+    "dark-border-negative": string;
+    "dark-icon-default": string;
+    "dark-icon-inverse": string;
+    "dark-icon-brand": string;
+    "dark-icon-accent": string;
+    "dark-icon-disabled": string;
+    "dark-icon-information": string;
+    "dark-icon-positive": string;
+    "dark-icon-warning": string;
+    "dark-icon-negative": string;
+    "dark-text-default": string;
+    "dark-text-secondary": string;
+    "dark-text-disabled": string;
+    "dark-text-inverse": string;
+    "dark-text-accent": string;
+};
+export default exports;