@vibe/core 3.38.0-alpha-fff13.0 → 3.39.0

package/dist/mocked_classnames/components/Skeleton/Skeleton.d.ts

@@ -28,7 +28,23 @@ export interface SkeletonProps extends VibeComponentProps {
      */
     fullWidth?: boolean;
 }
-declare const _default: (React.ComponentType<SkeletonProps> | React.ForwardRefExoticComponent<SkeletonProps & React.RefAttributes<HTMLElement>>) & {
+declare const _default: ((import("../../types/VibeComponent").default<SkeletonProps, unknown> & Partial<{
+    types: typeof SkeletonTypeEnum;
+    sizes: {
+        CUSTOM: string;
+        CIRCLE: {};
+        RECTANGLE: {};
+        TEXT: typeof TextSkeletonSizeEnum;
+    };
+}>) | (React.FC<SkeletonProps> & Partial<{
+    types: typeof SkeletonTypeEnum;
+    sizes: {
+        CUSTOM: string;
+        CIRCLE: {};
+        RECTANGLE: {};
+        TEXT: typeof TextSkeletonSizeEnum;
+    };
+}>)) & {
     types: typeof SkeletonTypeEnum;
     sizes: {
         CUSTOM: string;

package/dist/mocked_classnames/components/Slider/Slider.d.ts

@@ -117,7 +117,21 @@ export type SliderProps = {
      */
     selectionIndicatorWidth?: string;
 };
-declare const _default: (React.ForwardRefExoticComponent<SliderProps & React.RefAttributes<HTMLElement>> | React.ComponentType<SliderProps>) & {
+declare const _default: ((import("../../types/VibeComponent").default<SliderProps, unknown> & Partial<{
+    sizes: {
+        readonly SMALL: "small";
+        readonly MEDIUM: "medium";
+        readonly LARGE: "large";
+    };
+    colors: typeof SliderColorEnum;
+}>) | (React.FC<SliderProps> & Partial<{
+    sizes: {
+        readonly SMALL: "small";
+        readonly MEDIUM: "medium";
+        readonly LARGE: "large";
+    };
+    colors: typeof SliderColorEnum;
+}>)) & {
     sizes: {
         readonly SMALL: "small";
         readonly MEDIUM: "medium";

package/dist/mocked_classnames/components/Slider/SliderInfix.d.ts

@@ -8,7 +8,11 @@ export interface SliderInfixProps extends VibeComponentProps {
      */
     kind?: InfixKind;
 }
-declare const _default: (React.ComponentType<SliderInfixProps> | React.ForwardRefExoticComponent<SliderInfixProps & React.RefAttributes<HTMLElement>>) & {
+declare const _default: ((import("../../types/VibeComponent").default<SliderInfixProps, unknown> & Partial<{
+    kinds: typeof InfixKindEnum;
+}>) | (React.FC<SliderInfixProps> & Partial<{
+    kinds: typeof InfixKindEnum;
+}>)) & {
     kinds: typeof InfixKindEnum;
 };
 export default _default;

package/dist/mocked_classnames/components/SplitButton/SplitButton.d.ts

@@ -40,7 +40,51 @@ export interface SplitButtonProps extends ButtonProps {
      */
     shouldCloseOnClickInsideDialog?: boolean;
 }
-declare const _default: (React.ComponentType<SplitButtonProps> | React.ForwardRefExoticComponent<SplitButtonProps & React.RefAttributes<HTMLElement>>) & {
+declare const _default: ((import("../../types/VibeComponent").default<SplitButtonProps, unknown> & Partial<{
+    secondaryPositions: {
+        readonly BOTTOM_START: "bottom-start";
+        readonly BOTTOM_MIDDLE: "bottom";
+        readonly BOTTOM_END: "bottom-end";
+    };
+    secondaryDialogPositions: {
+        readonly BOTTOM_START: "bottom-start";
+        readonly BOTTOM_MIDDLE: "bottom";
+        readonly BOTTOM_END: "bottom-end";
+    };
+    sizes: {
+        readonly SMALL: "small";
+        readonly MEDIUM: "medium";
+        readonly LARGE: "large";
+        readonly XXS: "xxs";
+        readonly XS: "xs";
+    };
+    colors: typeof import("../Button/ButtonConstants").ButtonColor;
+    kinds: typeof import("../Button/ButtonConstants").ButtonType;
+    inputTags: typeof import("../Button/ButtonConstants").ButtonInputType;
+    dialogPaddingSizes: typeof import("../Dialog/DialogConstants").DialogSize;
+}>) | (React.FC<SplitButtonProps> & Partial<{
+    secondaryPositions: {
+        readonly BOTTOM_START: "bottom-start";
+        readonly BOTTOM_MIDDLE: "bottom";
+        readonly BOTTOM_END: "bottom-end";
+    };
+    secondaryDialogPositions: {
+        readonly BOTTOM_START: "bottom-start";
+        readonly BOTTOM_MIDDLE: "bottom";
+        readonly BOTTOM_END: "bottom-end";
+    };
+    sizes: {
+        readonly SMALL: "small";
+        readonly MEDIUM: "medium";
+        readonly LARGE: "large";
+        readonly XXS: "xxs";
+        readonly XS: "xs";
+    };
+    colors: typeof import("../Button/ButtonConstants").ButtonColor;
+    kinds: typeof import("../Button/ButtonConstants").ButtonType;
+    inputTags: typeof import("../Button/ButtonConstants").ButtonInputType;
+    dialogPaddingSizes: typeof import("../Dialog/DialogConstants").DialogSize;
+}>)) & {
     secondaryPositions: {
         readonly BOTTOM_START: "bottom-start";
         readonly BOTTOM_MIDDLE: "bottom";

package/dist/mocked_classnames/components/SplitButton/SplitButtonMenu/SplitButtonMenu.d.ts

@@ -1,9 +1,8 @@
 import React from "react";
+import VibeComponent from "../../../types/VibeComponent";
 import { MenuProps } from "../../Menu/Menu/Menu";
 export type SplitButtonMenuProps = Omit<MenuProps, "focusItemIndexOnMount"> & {
     children: React.ReactNode;
 };
-declare const SplitButtonMenu: React.ForwardRefExoticComponent<Omit<MenuProps, "focusItemIndexOnMount"> & {
-    children: React.ReactNode;
-} & React.RefAttributes<HTMLElement>>;
+declare const SplitButtonMenu: VibeComponent<SplitButtonMenuProps>;
 export default SplitButtonMenu;

package/dist/mocked_classnames/components/Steps/Steps.d.ts

@@ -1,8 +1,8 @@
 import React, { ReactElement } from "react";
 import { StepsColor as StepsColorEnum, StepsType as StepsTypeEnum } from "./StepsConstants";
 import { StepsColor, StepsType } from "./Steps.types";
-import { ButtonProps } from "../Button";
-import { VibeComponentProps } from "../../types";
+import { ButtonProps } from "../Button/Button";
+import { VibeComponent, VibeComponentProps } from "../../types";
 export interface StepsProps extends VibeComponentProps {
     /**
      * The index of the currently active step.
@@ -53,7 +53,13 @@ export interface StepsProps extends VibeComponentProps {
      */
     onFinish?: (e: React.MouseEvent | React.KeyboardEvent) => void;
 }
-declare const _default: (React.ForwardRefExoticComponent<StepsProps & React.RefAttributes<HTMLElement>> | React.ComponentType<StepsProps>) & {
+declare const _default: ((VibeComponent<StepsProps & React.RefAttributes<HTMLElement>, HTMLElement> & Partial<{
+    types: typeof StepsTypeEnum;
+    colors: typeof StepsColorEnum;
+}>) | (React.FC<StepsProps & React.RefAttributes<HTMLElement>> & Partial<{
+    types: typeof StepsTypeEnum;
+    colors: typeof StepsColorEnum;
+}>)) & {
     types: typeof StepsTypeEnum;
     colors: typeof StepsColorEnum;
 };

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

@@ -1,5 +1,5 @@
-import React, { ChangeEvent, ReactElement } from "react";
-import { VibeComponentProps } from "../../types";
+import { ChangeEvent, ReactElement } from "react";
+import { VibeComponent, VibeComponentProps } from "../../types";
 import { MockToggleProps } from "../Toggle/MockToggle";
 export interface SwitchProps extends VibeComponentProps {
     /**
@@ -55,5 +55,4 @@ export interface SwitchProps extends VibeComponentProps {
      */
     wrapperClassName?: string;
 }
-declare const Switch: React.ForwardRefExoticComponent<SwitchProps & React.RefAttributes<HTMLInputElement>>;
-export default Switch;
+export declare const Switch: VibeComponent<SwitchProps, HTMLInputElement>;

package/dist/mocked_classnames/components/Switch/index.d.ts

@@ -1 +1 @@
-export { default as Switch, SwitchProps } from "./Switch";
+export { Switch, SwitchProps } from "./Switch";

package/dist/mocked_classnames/components/Table/Table/Table.d.ts

@@ -1,5 +1,5 @@
 import React, { ReactElement } from "react";
-import { SubIcon, VibeComponentProps } from "../../../types";
+import { SubIcon, VibeComponent, VibeComponentProps } from "../../../types";
 import { TableHeaderProps } from "../TableHeader/TableHeader";
 import { TableBodyProps } from "../TableBody/TableBody";
 import { RowSizes as RowSizesEnum } from "./TableConsts";
@@ -72,7 +72,11 @@ export interface TableProps extends VibeComponentProps {
      */
     withoutBorder?: boolean;
 }
-declare const _default: (React.ComponentType<TableProps> | React.ForwardRefExoticComponent<TableProps & React.RefAttributes<HTMLElement>>) & {
+declare const _default: ((VibeComponent<TableProps & React.RefAttributes<HTMLDivElement>, HTMLDivElement> & Partial<{
+    sizes: typeof RowSizesEnum;
+}>) | (React.FC<TableProps & React.RefAttributes<HTMLDivElement>> & Partial<{
+    sizes: typeof RowSizesEnum;
+}>)) & {
     sizes: typeof RowSizesEnum;
 };
 export default _default;

package/dist/mocked_classnames/components/Table/TableBody/TableBody.d.ts

@@ -1,5 +1,5 @@
-import React, { ReactElement, ComponentProps } from "react";
-import { VibeComponentProps } from "../../../types";
+import { ReactElement, ComponentProps } from "react";
+import { VibeComponent, VibeComponentProps } from "../../../types";
 import { TableRowProps } from "../TableRow/TableRow";
 import VirtualizedList from "../../VirtualizedList/VirtualizedList";
 export interface TableBodyProps extends VibeComponentProps {
@@ -8,5 +8,5 @@ export interface TableBodyProps extends VibeComponentProps {
      */
     children?: ReactElement<TableRowProps> | ReactElement<TableRowProps>[] | ReactElement<ComponentProps<typeof VirtualizedList>>;
 }
-declare const TableBody: React.ForwardRefExoticComponent<TableBodyProps & React.RefAttributes<HTMLDivElement>>;
+declare const TableBody: VibeComponent<TableBodyProps, HTMLDivElement>;
 export default TableBody;

package/dist/mocked_classnames/components/Table/TableCell/TableCell.d.ts

@@ -1,5 +1,5 @@
 import React from "react";
-import { VibeComponentProps } from "../../../types";
+import { VibeComponent, VibeComponentProps } from "../../../types";
 export interface TableCellProps extends VibeComponentProps {
     /**
      * The content inside the table cell.
@@ -10,5 +10,5 @@ export interface TableCellProps extends VibeComponentProps {
      */
     sticky?: boolean;
 }
-declare const TableCell: React.ForwardRefExoticComponent<TableCellProps & React.RefAttributes<HTMLDivElement>>;
+declare const TableCell: VibeComponent<TableCellProps, HTMLDivElement>;
 export default TableCell;

package/dist/mocked_classnames/components/Table/TableHeader/TableHeader.d.ts

@@ -1,5 +1,5 @@
 import React from "react";
-import { VibeComponentProps } from "../../../types";
+import { VibeComponent, VibeComponentProps } from "../../../types";
 import { TableHeaderCellProps } from "../TableHeaderCell/TableHeaderCell";
 export interface TableHeaderProps extends VibeComponentProps {
     /**
@@ -7,5 +7,5 @@ export interface TableHeaderProps extends VibeComponentProps {
      */
     children?: React.ReactElement<TableHeaderCellProps> | React.ReactElement<TableHeaderCellProps>[];
 }
-declare const TableHeader: React.ForwardRefExoticComponent<TableHeaderProps & React.RefAttributes<HTMLDivElement>>;
+declare const TableHeader: VibeComponent<TableHeaderProps, HTMLDivElement>;
 export default TableHeader;

package/dist/mocked_classnames/components/Table/TableHeaderCell/TableHeaderCell.d.ts

@@ -1,5 +1,5 @@
 import React from "react";
-import { SubIcon, VibeComponentProps } from "../../../types";
+import { SubIcon, VibeComponent, VibeComponentProps } from "../../../types";
 export interface TableHeaderCellProps extends VibeComponentProps {
     /**
      * The title of the column, displayed inside the header cell.
@@ -30,5 +30,5 @@ export interface TableHeaderCellProps extends VibeComponentProps {
      */
     sticky?: boolean;
 }
-declare const TableHeaderCell: React.ForwardRefExoticComponent<TableHeaderCellProps & React.RefAttributes<HTMLDivElement>>;
+declare const TableHeaderCell: VibeComponent<TableHeaderCellProps, HTMLDivElement>;
 export default TableHeaderCell;

package/dist/mocked_classnames/components/Table/TableRow/TableRow.d.ts

@@ -1,5 +1,5 @@
 import React from "react";
-import { VibeComponentProps } from "../../../types";
+import { VibeComponent, VibeComponentProps } from "../../../types";
 import { TableCellProps } from "../TableCell/TableCell";
 export interface TableRowProps extends VibeComponentProps {
     /**
@@ -15,5 +15,5 @@ export interface TableRowProps extends VibeComponentProps {
      */
     style?: React.CSSProperties;
 }
-declare const TableRow: React.ForwardRefExoticComponent<TableRowProps & React.RefAttributes<HTMLDivElement>>;
+declare const TableRow: VibeComponent<TableRowProps, HTMLDivElement>;
 export default TableRow;

package/dist/mocked_classnames/components/Tabs/TabPanels/TabPanels.d.ts

@@ -1,8 +1,8 @@
 import React, { ReactElement } from "react";
+import VibeComponentProps from "../../../types/VibeComponentProps";
 import { TabPanelsAnimationDirection as TabPanelsAnimationDirectionEnum } from "./TabPanelsConstants";
 import { TabPanelsAnimationDirection } from "./TabPanels.types";
 import { TabPanelProps } from "../TabPanel/TabPanel";
-import { VibeComponentProps } from "../../../types";
 export interface TabPanelsProps extends VibeComponentProps {
     /**
      * The index of the currently active tab panel.
@@ -17,7 +17,11 @@ export interface TabPanelsProps extends VibeComponentProps {
      */
     children?: ReactElement<TabPanelProps> | ReactElement<TabPanelProps>[];
 }
-declare const _default: (React.ForwardRefExoticComponent<TabPanelsProps & React.RefAttributes<HTMLElement>> | React.ComponentType<TabPanelsProps>) & {
+declare const _default: ((import("../../../types/VibeComponent").default<TabPanelsProps, unknown> & Partial<{
+    animationDirections: typeof TabPanelsAnimationDirectionEnum;
+}>) | (React.FC<TabPanelsProps> & Partial<{
+    animationDirections: typeof TabPanelsAnimationDirectionEnum;
+}>)) & {
     animationDirections: typeof TabPanelsAnimationDirectionEnum;
 };
 export default _default;

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

@@ -1,4 +1,5 @@
 import React, { ReactNode } from "react";
+import VibeComponent from "../../types/VibeComponent";
 import { TextType as TextTypeEnum, TextWeight as TextWeightEnum } from "./TextConstants";
 import { TypographyProps } from "../Typography/Typography";
 import { TypographyAlign as TypographyAlignEnum, TypographyColor as TypographyColorEnum } from "../Typography/TypographyConstants";
@@ -17,7 +18,17 @@ export interface TextProps extends TypographyProps {
      */
     children: ReactNode;
 }
-declare const _default: (React.ForwardRefExoticComponent<TextProps & React.RefAttributes<HTMLElement>> | React.ComponentType<TextProps>) & {
+declare const _default: ((VibeComponent<TextProps & React.RefAttributes<HTMLElement>, HTMLElement> & Partial<{
+    types: typeof TextTypeEnum;
+    weights: typeof TextWeightEnum;
+    colors: typeof TypographyColorEnum;
+    align: typeof TypographyAlignEnum;
+}>) | (React.FC<TextProps & React.RefAttributes<HTMLElement>> & Partial<{
+    types: typeof TextTypeEnum;
+    weights: typeof TextWeightEnum;
+    colors: typeof TypographyColorEnum;
+    align: typeof TypographyAlignEnum;
+}>)) & {
     types: typeof TextTypeEnum;
     weights: typeof TextWeightEnum;
     colors: typeof TypographyColorEnum;

package/dist/mocked_classnames/components/TextField/TextField.d.ts

@@ -1,7 +1,7 @@
 import React from "react";
 import { TextFieldFeedbackState as TextFieldFeedbackStateEnum, TextFieldTextType as TextFieldTextTypeEnum } from "./TextFieldConstants";
 import { TextFieldType, TextFieldSize } from "./TextField.types";
-import { VibeComponentProps } from "../../types";
+import { VibeComponentProps, VibeComponent } from "../../types";
 export interface TextFieldProps extends VibeComponentProps {
     /**
      * The placeholder text displayed when the input is empty.
@@ -182,13 +182,29 @@ export interface TextFieldProps extends VibeComponentProps {
      */
     dir?: "ltr" | "rtl" | "auto";
 }
-declare const _default: (React.ComponentType<TextFieldProps> | React.ForwardRefExoticComponent<TextFieldProps & React.RefAttributes<HTMLElement>>) & {
+declare const _default: ((VibeComponent<TextFieldProps & React.RefAttributes<unknown>, unknown> & Partial<{
     sizes: {
         readonly SMALL: "small";
         readonly MEDIUM: "medium";
         readonly LARGE: "large";
     };
+    feedbacks: typeof TextFieldFeedbackStateEnum;
+    types: typeof TextFieldTextTypeEnum;
+}>) | (React.FC<TextFieldProps & React.RefAttributes<unknown>> & Partial<{
+    sizes: {
+        readonly SMALL: "small";
+        readonly MEDIUM: "medium";
+        readonly LARGE: "large";
+    };
+    feedbacks: typeof TextFieldFeedbackStateEnum;
     types: typeof TextFieldTextTypeEnum;
+}>)) & {
+    sizes: {
+        readonly SMALL: "small";
+        readonly MEDIUM: "medium";
+        readonly LARGE: "large";
+    };
     feedbacks: typeof TextFieldFeedbackStateEnum;
+    types: typeof TextFieldTextTypeEnum;
 };
 export default _default;

package/dist/mocked_classnames/components/ThemeProvider/ThemeProvider.d.ts

@@ -26,7 +26,13 @@ export interface ThemeProviderProps {
      */
     className?: string;
 }
-declare const _default: (React.ComponentType<ThemeProviderProps> | React.ForwardRefExoticComponent<ThemeProviderProps & React.RefAttributes<HTMLElement>>) & {
+declare const _default: ((import("../../types/VibeComponent").default<ThemeProviderProps, unknown> & Partial<{
+    systemThemes: typeof SystemThemeEnum;
+    colors: typeof ThemeColorEnum;
+}>) | (React.FC<ThemeProviderProps> & Partial<{
+    systemThemes: typeof SystemThemeEnum;
+    colors: typeof ThemeColorEnum;
+}>)) & {
     systemThemes: typeof SystemThemeEnum;
     colors: typeof ThemeColorEnum;
 };

package/dist/mocked_classnames/components/Tipseen/Tipseen.d.ts

@@ -3,7 +3,7 @@ import { AnimationType as AnimationTypeEnum, HideShowEvent as HideShowEventEnum
 import { DialogAnimationType, DialogTriggerEvent } from "../Dialog/Dialog.types";
 import { TipseenCloseButtonTheme as TipseenCloseButtonThemeEnum, TipseenColor as TipseenColorEnum } from "./TipseenConstants";
 import { TipseenCloseButtonTheme, TipseenColor } from "./Tipseen.types";
-import { ElementContent, VibeComponentProps } from "../../types";
+import { ElementContent, VibeComponent, VibeComponentProps } from "../../types";
 import { MoveBy } from "../../types/MoveBy";
 import { Modifier } from "react-popper";
 import React from "react";
@@ -109,7 +109,19 @@ export interface TipseenProps extends VibeComponentProps {
     color?: TipseenColor;
 }
 export declare const TipseenContext: React.Context<TipseenColor>;
-declare const _default: (React.ForwardRefExoticComponent<TipseenProps & React.RefAttributes<HTMLElement>> | React.ComponentType<TipseenProps>) & {
+declare const _default: ((VibeComponent<TipseenProps & React.RefAttributes<HTMLElement>, HTMLElement> & Partial<{
+    closeButtonThemes: typeof TipseenCloseButtonThemeEnum;
+    animationTypes: typeof AnimationTypeEnum;
+    hideShowTriggers: typeof HideShowEventEnum;
+    colors: typeof TipseenColorEnum;
+    positions: typeof TooltipPositionsEnum;
+}>) | (React.FC<TipseenProps & React.RefAttributes<HTMLElement>> & Partial<{
+    closeButtonThemes: typeof TipseenCloseButtonThemeEnum;
+    animationTypes: typeof AnimationTypeEnum;
+    hideShowTriggers: typeof HideShowEventEnum;
+    colors: typeof TipseenColorEnum;
+    positions: typeof TooltipPositionsEnum;
+}>)) & {
     closeButtonThemes: typeof TipseenCloseButtonThemeEnum;
     animationTypes: typeof AnimationTypeEnum;
     hideShowTriggers: typeof HideShowEventEnum;

package/dist/mocked_classnames/components/Tipseen/TipseenMedia/TipseenMedia.d.ts

@@ -1,10 +1,11 @@
-import React, { PropsWithChildren, ReactNode } from "react";
-import { VibeComponentProps } from "../../../types";
+import { PropsWithChildren, ReactNode } from "react";
+import VibeComponentProps from "../../../types/VibeComponentProps";
+import VibeComponent from "../../../types/VibeComponent";
 export interface TipseenMediaProps extends PropsWithChildren<VibeComponentProps> {
     /**
      * The media content displayed inside the Tipseen.
      */
     children: ReactNode;
 }
-declare const TipseenMedia: React.ForwardRefExoticComponent<TipseenMediaProps & React.RefAttributes<HTMLElement>>;
+declare const TipseenMedia: VibeComponent<TipseenMediaProps, HTMLElement>;
 export default TipseenMedia;

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

@@ -54,7 +54,13 @@ export interface ToastProps extends VibeComponentProps {
      */
     closeButtonAriaLabel?: string;
 }
-declare const _default: (React.ComponentType<ToastProps> | React.ForwardRefExoticComponent<ToastProps & React.RefAttributes<HTMLElement>>) & {
+declare const _default: ((import("../../types/VibeComponent").default<ToastProps, unknown> & Partial<{
+    types: typeof ToastTypeEnum;
+    actionTypes: typeof ToastActionTypeEnum;
+}>) | (React.FC<ToastProps> & Partial<{
+    types: typeof ToastTypeEnum;
+    actionTypes: typeof ToastActionTypeEnum;
+}>)) & {
     types: typeof ToastTypeEnum;
     actionTypes: typeof ToastActionTypeEnum;
 };

package/dist/mocked_classnames/components/Toggle/Toggle.d.ts

@@ -1,5 +1,5 @@
-import React, { ChangeEvent } from "react";
-import { VibeComponentProps } from "../../types";
+import { ChangeEvent } from "react";
+import { VibeComponent, VibeComponentProps } from "../../types";
 import { ToggleSize } from "./Toggle.types";
 export interface ToggleProps extends VibeComponentProps {
     /**
@@ -55,5 +55,5 @@ export interface ToggleProps extends VibeComponentProps {
      */
     size?: ToggleSize;
 }
-declare const Toggle: React.ForwardRefExoticComponent<ToggleProps & React.RefAttributes<HTMLInputElement>>;
+declare const Toggle: VibeComponent<ToggleProps, HTMLInputElement>;
 export default Toggle;

package/dist/mocked_classnames/components/Typography/Typography.d.ts

@@ -1,5 +1,6 @@
-import React, { HTMLAttributes } from "react";
-import { VibeComponentProps } from "../../types";
+import { HTMLAttributes } from "react";
+import VibeComponentProps from "../../types/VibeComponentProps";
+import VibeComponent from "../../types/VibeComponent";
 import { ElementContent } from "../../types";
 import { TypographyAlign, TypographyColor } from "./Typography.types";
 import { TooltipProps } from "../Tooltip/Tooltip";
@@ -37,5 +38,5 @@ export interface TypographyProps extends VibeComponentProps, HTMLAttributes<HTML
      */
     withoutTooltip?: boolean;
 }
-declare const Typography: React.ForwardRefExoticComponent<TypographyProps & React.RefAttributes<HTMLElement>>;
+declare const Typography: VibeComponent<TypographyProps, HTMLElement>;
 export default Typography;

package/dist/mocked_classnames/components/VirtualizedGrid/VirtualizedGrid.d.ts

@@ -1,6 +1,7 @@
-import React, { CSSProperties } from "react";
+import { CSSProperties } from "react";
 import { GridChildComponentProps, ScrollDirection } from "react-window";
-import { VibeComponentProps } from "../../types";
+import VibeComponentProps from "src/types/VibeComponentProps";
+import { VibeComponent } from "../../types";
 import { VirtualizedGridItemType as ItemType } from "./VirtualizedGrid.types";
 export interface VirtualizedGridProps extends VibeComponentProps {
     /**
@@ -63,5 +64,5 @@ export interface VirtualizedGridProps extends VibeComponentProps {
      */
     scrollableClassName?: string;
 }
-declare const VirtualizedGrid: React.ForwardRefExoticComponent<VirtualizedGridProps & React.RefAttributes<HTMLElement>>;
+declare const VirtualizedGrid: VibeComponent<VirtualizedGridProps>;
 export default VirtualizedGrid;

package/dist/mocked_classnames/components/VirtualizedList/VirtualizedList.d.ts

@@ -1,5 +1,6 @@
-import React, { CSSProperties, ForwardedRef, ReactElement } from "react";
-import { VibeComponentProps } from "../../types";
+import { CSSProperties, ForwardedRef, ReactElement } from "react";
+import VibeComponentProps from "src/types/VibeComponentProps";
+import VibeComponent from "../../types/VibeComponent";
 import { VirtualizedListItem, VirtualizedListLayout, VirtualizedListScrollDirection } from "./VirtualizedList.types";
 export interface VirtualizedListProps extends VibeComponentProps {
     /**
@@ -94,5 +95,5 @@ export interface VirtualizedListProps extends VibeComponentProps {
      */
     onScroll?: (horizontalScrollDirection: VirtualizedListScrollDirection, scrollTop: number, scrollUpdateWasRequested: boolean) => void;
 }
-declare const VirtualizedList: React.ForwardRefExoticComponent<VirtualizedListProps & React.RefAttributes<HTMLElement>>;
+declare const VirtualizedList: VibeComponent<VirtualizedListProps>;
 export default VirtualizedList;

package/dist/mocked_classnames/src/components/Accordion/Accordion/Accordion.js.map

@@ -1 +1 @@
-{"version":3,"file":"Accordion.js","sources":["../../../../../../src/components/Accordion/Accordion/Accordion.tsx"],"sourcesContent":["import cx from \"classnames\";\nimport React, { forwardRef, ReactElement, useCallback, useMemo, useRef, useState } from \"react\";\nimport useMergeRef from \"../../../hooks/useMergeRef\";\nimport { VibeComponentProps } from \"../../../types\";\nimport styles from \"./Accordion.module.scss\";\nimport { ComponentVibeId } from \"../../../tests/constants\";\n\nconst COMPONENT_ID = \"monday-accordion\";\n\nfunction defineChildId(index: number, props: { id: string }, accordionId: string) {\n  if (props.id) {\n    return props.id;\n  }\n  if (accordionId) {\n    return `${accordionId}--item-${index}`;\n  }\n  return `${COMPONENT_ID}--item-${index}`;\n}\n\nexport interface AccordionProps extends VibeComponentProps {\n  /**\n   * The content of the accordion (`AccordionItem` components).\n   */\n  children?: Array<ReactElement> | ReactElement;\n  /**\n   * If true, multiple accordion items can be expanded at the same time.\n   */\n  allowMultiple?: boolean;\n  /**\n   * An array of initially expanded item indexes.\n   */\n  defaultIndex?: Array<number>;\n}\n\nconst Accordion = forwardRef(\n  (\n    {\n      children: originalChildren = null,\n      allowMultiple = false,\n      \"data-testid\": dataTestId = COMPONENT_ID,\n      defaultIndex = [],\n      className = \"\",\n      id\n    }: AccordionProps,\n    ref: React.ForwardedRef<unknown>\n  ) => {\n    const componentRef = useRef(null);\n    const mergedRef = useMergeRef(ref, componentRef);\n\n    const [expandedItems, setExpandedItems] = useState(defaultIndex);\n\n    const children = useMemo(() => React.Children.toArray(originalChildren), [originalChildren]);\n\n    const isChildExpanded = useCallback(\n      (itemIndex: number) => {\n        return expandedItems.includes(itemIndex);\n      },\n      [expandedItems]\n    );\n\n    const onChildClick = useCallback(\n      (itemIndex: number) => {\n        if (allowMultiple) {\n          const newExpandedItems = [...expandedItems];\n          if (isChildExpanded(itemIndex)) {\n            const index = newExpandedItems.indexOf(itemIndex);\n            if (index > -1) {\n              newExpandedItems.splice(index, 1);\n            }\n          } else {\n            newExpandedItems.push(itemIndex);\n          }\n          setExpandedItems(newExpandedItems);\n          return;\n        }\n\n        if (isChildExpanded(itemIndex)) {\n          setExpandedItems([]);\n        } else {\n          setExpandedItems([itemIndex]);\n        }\n      },\n      [isChildExpanded, expandedItems, allowMultiple]\n    );\n\n    const renderChildElements = useMemo(() => {\n      return React.Children.map(children, (child: ReactElement, itemIndex) => {\n        const originalProps = { ...child?.props };\n        const childId = defineChildId(itemIndex, originalProps, id);\n        return React.cloneElement(child, {\n          ...originalProps,\n          id: childId,\n          onClickAccordionCallback: () => {\n            onChildClick(itemIndex);\n          },\n          open: isChildExpanded(itemIndex),\n          expandCollapseComponentClassName: cx(styles.accordionItemExpandCollapse, {\n            [styles.accordionItemExpandCollapseLast]: itemIndex === children.length - 1\n          })\n        });\n      });\n    }, [children, id, isChildExpanded, onChildClick]);\n\n    return (\n      <div\n        ref={mergedRef}\n        className={cx(styles.accordion, className)}\n        data-testid={dataTestId}\n        data-vibe={ComponentVibeId.ACCORDION}\n        id={id}\n      >\n        {children && renderChildElements}\n      </div>\n    );\n  }\n);\n\nexport default Accordion;\n"],"names":["COMPONENT_ID","Accordion","forwardRef","_ref","ref","_ref$children","children","originalChildren","_ref$allowMultiple","allowMultiple","_ref$dataTestid","dataTestId","_ref$defaultIndex","defaultIndex","_ref$className","className","id","componentRef","useRef","mergedRef","useMergeRef","_useState","useState","_useState2","_slicedToArray","expandedItems","setExpandedItems","useMemo","React","Children","toArray","isChildExpanded","useCallback","itemIndex","includes","onChildClick","newExpandedItems","_toConsumableArray","index","indexOf","splice","push","renderChildElements","map","child","props","accordionId","originalProps","Object","assign","childId","concat","cloneElement","onClickAccordionCallback","open","expandCollapseComponentClassName","cx","styles","accordionItemExpandCollapse","_defineProperty","accordionItemExpandCollapseLast","length","createElement","accordion","ComponentVibeId","ACCORDION"],"mappings":"0YAOA,IAAMA,EAAe,mBA2BfC,IAAAA,EAAYC,GAChB,SAAAC,EASEC,GACE,IAAAC,EAAAF,EARAG,SAAUC,OAAmB,IAAHF,EAAG,KAAIA,EAAAG,EAAAL,EACjCM,cAAAA,OAAgB,IAAHD,GAAQA,EAAAE,EAAAP,EACrB,eAAeQ,OAAaX,IAAHU,EAAGV,EAAYU,EAAAE,EAAAT,EACxCU,aAAAA,OAAe,IAAHD,EAAG,GAAEA,EAAAE,EAAAX,EACjBY,UAAAA,OAAY,IAAHD,EAAG,GAAEA,EACdE,EAAEb,EAAFa,GAIIC,EAAeC,EAAO,MACtBC,EAAYC,EAAYhB,EAAKa,GAEnCI,EAA0CC,EAAST,GAAaU,EAAAC,EAAAH,EAAA,GAAzDI,EAAaF,EAAA,GAAEG,EAAgBH,EAAA,GAEhCjB,EAAWqB,GAAQ,WAAA,OAAMC,EAAMC,SAASC,QAAQvB,KAAmB,CAACA,IAEpEwB,EAAkBC,GACtB,SAACC,GACC,OAAOR,EAAcS,SAASD,EAChC,GACA,CAACR,IAGGU,EAAeH,GACnB,SAACC,GACC,GAAIxB,EAAJ,CACE,IAAM2B,EAAgBC,EAAOZ,GAC7B,GAAIM,EAAgBE,GAAY,CAC9B,IAAMK,EAAQF,EAAiBG,QAAQN,GACnCK,GAAS,GACXF,EAAiBI,OAAOF,EAAO,EAElC,MACCF,EAAiBK,KAAKR,GAExBP,EAAiBU,EAElB,MAEGL,EAAgBE,GAClBP,EAAiB,IAEjBA,EAAiB,CAACO,GAErB,GACD,CAACF,EAAiBN,EAAehB,IAG7BiC,EAAsBf,GAAQ,WAClC,OAAOC,EAAMC,SAASc,IAAIrC,GAAU,SAACsC,EAAqBX,GACxD,IA9EeK,EAAeO,EAAuBC,EA8E/CC,EAAqBC,OAAAC,OAAA,CAAA,EAAAL,eAAAA,EAAOC,OAC5BK,GA/ESZ,EA+EeL,EA/EuBa,EA+EG9B,GA/E1B6B,EA+EWE,GA9ErC/B,GACD6B,EAAM7B,GAEX8B,EACF,GAAAK,OAAUL,EAAWK,WAAAA,OAAUb,GAEjC,GAAAa,OAAUnD,EAAYmD,WAAAA,OAAUb,IAyE1B,OAAOV,EAAMwB,aAAaR,EACrBI,OAAAC,OAAAD,OAAAC,OAAA,GAAAF,GACH,CAAA/B,GAAIkC,EACJG,yBAA0B,WACxBlB,EAAaF,EACd,EACDqB,KAAMvB,EAAgBE,GACtBsB,iCAAkCC,EAAGC,EAAOC,4BAA2BC,EACpEF,CAAAA,EAAAA,EAAOG,gCAAkC3B,IAAc3B,EAASuD,OAAS,MAGhF,GACD,GAAE,CAACvD,EAAUU,EAAIe,EAAiBI,IAEnC,OACEP,EAAAkC,cAAA,MAAA,CACE1D,IAAKe,EACLJ,UAAWyC,EAAGC,EAAOM,UAAWhD,GACnB,cAAAJ,EACF,YAAAqD,EAAgBC,UAC3BjD,GAAIA,GAEHV,GAAYoC,EAGnB"}
+{"version":3,"file":"Accordion.js","sources":["../../../../../../src/components/Accordion/Accordion/Accordion.tsx"],"sourcesContent":["import cx from \"classnames\";\nimport React, { forwardRef, ReactElement, useCallback, useMemo, useRef, useState } from \"react\";\nimport useMergeRef from \"../../../hooks/useMergeRef\";\nimport { VibeComponent, VibeComponentProps } from \"../../../types\";\nimport styles from \"./Accordion.module.scss\";\nimport { ComponentVibeId } from \"../../../tests/constants\";\n\nconst COMPONENT_ID = \"monday-accordion\";\n\nfunction defineChildId(index: number, props: { id: string }, accordionId: string) {\n  if (props.id) {\n    return props.id;\n  }\n  if (accordionId) {\n    return `${accordionId}--item-${index}`;\n  }\n  return `${COMPONENT_ID}--item-${index}`;\n}\n\nexport interface AccordionProps extends VibeComponentProps {\n  /**\n   * The content of the accordion (`AccordionItem` components).\n   */\n  children?: Array<ReactElement> | ReactElement;\n  /**\n   * If true, multiple accordion items can be expanded at the same time.\n   */\n  allowMultiple?: boolean;\n  /**\n   * An array of initially expanded item indexes.\n   */\n  defaultIndex?: Array<number>;\n}\n\nconst Accordion: VibeComponent<AccordionProps, unknown> & object = forwardRef(\n  (\n    {\n      children: originalChildren = null,\n      allowMultiple = false,\n      \"data-testid\": dataTestId = COMPONENT_ID,\n      defaultIndex = [],\n      className = \"\",\n      id\n    }: AccordionProps,\n    ref\n  ) => {\n    const componentRef = useRef(null);\n    const mergedRef = useMergeRef(ref, componentRef);\n\n    const [expandedItems, setExpandedItems] = useState(defaultIndex);\n\n    const children = useMemo(() => React.Children.toArray(originalChildren), [originalChildren]);\n\n    const isChildExpanded = useCallback(\n      (itemIndex: number) => {\n        return expandedItems.includes(itemIndex);\n      },\n      [expandedItems]\n    );\n\n    const onChildClick = useCallback(\n      (itemIndex: number) => {\n        if (allowMultiple) {\n          const newExpandedItems = [...expandedItems];\n          if (isChildExpanded(itemIndex)) {\n            const index = newExpandedItems.indexOf(itemIndex);\n            if (index > -1) {\n              newExpandedItems.splice(index, 1);\n            }\n          } else {\n            newExpandedItems.push(itemIndex);\n          }\n          setExpandedItems(newExpandedItems);\n          return;\n        }\n\n        if (isChildExpanded(itemIndex)) {\n          setExpandedItems([]);\n        } else {\n          setExpandedItems([itemIndex]);\n        }\n      },\n      [isChildExpanded, expandedItems, allowMultiple]\n    );\n\n    const renderChildElements = useMemo(() => {\n      return React.Children.map(children, (child: ReactElement, itemIndex) => {\n        const originalProps = { ...child?.props };\n        const childId = defineChildId(itemIndex, originalProps, id);\n        return React.cloneElement(child, {\n          ...originalProps,\n          id: childId,\n          onClickAccordionCallback: () => {\n            onChildClick(itemIndex);\n          },\n          open: isChildExpanded(itemIndex),\n          expandCollapseComponentClassName: cx(styles.accordionItemExpandCollapse, {\n            [styles.accordionItemExpandCollapseLast]: itemIndex === children.length - 1\n          })\n        });\n      });\n    }, [children, id, isChildExpanded, onChildClick]);\n\n    return (\n      <div\n        ref={mergedRef}\n        className={cx(styles.accordion, className)}\n        data-testid={dataTestId}\n        data-vibe={ComponentVibeId.ACCORDION}\n        id={id}\n      >\n        {children && renderChildElements}\n      </div>\n    );\n  }\n);\n\nexport default Accordion;\n"],"names":["COMPONENT_ID","Accordion","forwardRef","_ref","ref","_ref$children","children","originalChildren","_ref$allowMultiple","allowMultiple","_ref$dataTestid","dataTestId","_ref$defaultIndex","defaultIndex","_ref$className","className","id","componentRef","useRef","mergedRef","useMergeRef","_useState","useState","_useState2","_slicedToArray","expandedItems","setExpandedItems","useMemo","React","Children","toArray","isChildExpanded","useCallback","itemIndex","includes","onChildClick","newExpandedItems","_toConsumableArray","index","indexOf","splice","push","renderChildElements","map","child","props","accordionId","originalProps","Object","assign","childId","concat","cloneElement","onClickAccordionCallback","open","expandCollapseComponentClassName","cx","styles","accordionItemExpandCollapse","_defineProperty","accordionItemExpandCollapseLast","length","createElement","accordion","ComponentVibeId","ACCORDION"],"mappings":"0YAOA,IAAMA,EAAe,mBA2BfC,IAAAA,EAA6DC,GACjE,SAAAC,EASEC,GACE,IAAAC,EAAAF,EARAG,SAAUC,OAAmB,IAAHF,EAAG,KAAIA,EAAAG,EAAAL,EACjCM,cAAAA,OAAgB,IAAHD,GAAQA,EAAAE,EAAAP,EACrB,eAAeQ,OAAaX,IAAHU,EAAGV,EAAYU,EAAAE,EAAAT,EACxCU,aAAAA,OAAe,IAAHD,EAAG,GAAEA,EAAAE,EAAAX,EACjBY,UAAAA,OAAY,IAAHD,EAAG,GAAEA,EACdE,EAAEb,EAAFa,GAIIC,EAAeC,EAAO,MACtBC,EAAYC,EAAYhB,EAAKa,GAEnCI,EAA0CC,EAAST,GAAaU,EAAAC,EAAAH,EAAA,GAAzDI,EAAaF,EAAA,GAAEG,EAAgBH,EAAA,GAEhCjB,EAAWqB,GAAQ,WAAA,OAAMC,EAAMC,SAASC,QAAQvB,KAAmB,CAACA,IAEpEwB,EAAkBC,GACtB,SAACC,GACC,OAAOR,EAAcS,SAASD,EAChC,GACA,CAACR,IAGGU,EAAeH,GACnB,SAACC,GACC,GAAIxB,EAAJ,CACE,IAAM2B,EAAgBC,EAAOZ,GAC7B,GAAIM,EAAgBE,GAAY,CAC9B,IAAMK,EAAQF,EAAiBG,QAAQN,GACnCK,GAAS,GACXF,EAAiBI,OAAOF,EAAO,EAElC,MACCF,EAAiBK,KAAKR,GAExBP,EAAiBU,EAElB,MAEGL,EAAgBE,GAClBP,EAAiB,IAEjBA,EAAiB,CAACO,GAErB,GACD,CAACF,EAAiBN,EAAehB,IAG7BiC,EAAsBf,GAAQ,WAClC,OAAOC,EAAMC,SAASc,IAAIrC,GAAU,SAACsC,EAAqBX,GACxD,IA9EeK,EAAeO,EAAuBC,EA8E/CC,EAAqBC,OAAAC,OAAA,CAAA,EAAAL,eAAAA,EAAOC,OAC5BK,GA/ESZ,EA+EeL,EA/EuBa,EA+EG9B,GA/E1B6B,EA+EWE,GA9ErC/B,GACD6B,EAAM7B,GAEX8B,EACF,GAAAK,OAAUL,EAAWK,WAAAA,OAAUb,GAEjC,GAAAa,OAAUnD,EAAYmD,WAAAA,OAAUb,IAyE1B,OAAOV,EAAMwB,aAAaR,EACrBI,OAAAC,OAAAD,OAAAC,OAAA,GAAAF,GACH,CAAA/B,GAAIkC,EACJG,yBAA0B,WACxBlB,EAAaF,EACd,EACDqB,KAAMvB,EAAgBE,GACtBsB,iCAAkCC,EAAGC,EAAOC,4BAA2BC,EACpEF,CAAAA,EAAAA,EAAOG,gCAAkC3B,IAAc3B,EAASuD,OAAS,MAGhF,GACD,GAAE,CAACvD,EAAUU,EAAIe,EAAiBI,IAEnC,OACEP,EAAAkC,cAAA,MAAA,CACE1D,IAAKe,EACLJ,UAAWyC,EAAGC,EAAOM,UAAWhD,GACnB,cAAAJ,EACF,YAAAqD,EAAgBC,UAC3BjD,GAAIA,GAEHV,GAAYoC,EAGnB"}

package/dist/mocked_classnames/src/components/Accordion/Accordion/Accordion.module.scss.js

@@ -1,2 +1,2 @@
-var e={accordion:"accordion",accordionItemExpandCollapse:"accordionItemExpandCollapse",accordionItemExpandCollapseLast:"accordionItemExpandCollapseLast"};!function(e){const o="s_id-e9215f4fd1c6_3_37_0";if("undefined"!=typeof document){const n=document.head||document.getElementsByTagName("head")[0];if(n.querySelector("#"+o))return;const r=document.createElement("style");r.id=o,n.firstChild?n.insertBefore(r,n.firstChild):n.appendChild(r),r.appendChild(document.createTextNode(e))}else globalThis.injectedStyles&&(globalThis.injectedStyles[o]=e)}(".accordion {\n  height: fit-content;\n  border: 1px solid var(--ui-border-color);\n  box-sizing: border-box;\n  border-radius: var(--border-radius-small);\n}\n\n.accordion .accordionItemExpandCollapse {\n  border-radius: 0;\n  border-top: none;\n  border-left: none;\n  border-right: none;\n  border-color: var(--ui-border-color);\n}\n\n.accordion .accordionItemExpandCollapseLast {\n  border-bottom: none;\n}");export{e as default};
+var e={accordion:"accordion",accordionItemExpandCollapse:"accordionItemExpandCollapse",accordionItemExpandCollapseLast:"accordionItemExpandCollapseLast"};!function(e){const o="s_id-e9215f4fd1c6_3_38_0";if("undefined"!=typeof document){const n=document.head||document.getElementsByTagName("head")[0];if(n.querySelector("#"+o))return;const r=document.createElement("style");r.id=o,n.firstChild?n.insertBefore(r,n.firstChild):n.appendChild(r),r.appendChild(document.createTextNode(e))}else globalThis.injectedStyles&&(globalThis.injectedStyles[o]=e)}(".accordion {\n  height: fit-content;\n  border: 1px solid var(--ui-border-color);\n  box-sizing: border-box;\n  border-radius: var(--border-radius-small);\n}\n\n.accordion .accordionItemExpandCollapse {\n  border-radius: 0;\n  border-top: none;\n  border-left: none;\n  border-right: none;\n  border-color: var(--ui-border-color);\n}\n\n.accordion .accordionItemExpandCollapseLast {\n  border-bottom: none;\n}");export{e as default};
 //# sourceMappingURL=Accordion.module.scss.js.map

package/dist/mocked_classnames/src/components/AlertBanner/AlertBanner.js.map

@@ -1 +1 @@
-{"version":3,"file":"AlertBanner.js","sources":["../../../../../src/components/AlertBanner/AlertBanner.tsx"],"sourcesContent":["import { getStyle } from \"../../helpers/typesciptCssModulesHelper\";\nimport cx from \"classnames\";\nimport React, { ForwardedRef, forwardRef, ReactElement, useMemo } from \"react\";\nimport IconButton from \"../../components/IconButton/IconButton\";\nimport { CloseSmall } from \"@vibe/icons\";\nimport { AlertBannerBackgroundColor as AlertBannerBackgroundColorEnum } from \"./AlertBannerConstants\";\nimport { AlertBannerBackgroundColor } from \"./AlertBanner.types\";\nimport { NOOP } from \"../../utils/function-utils\";\nimport { AlertBannerLinkProps } from \"./AlertBannerLink/AlertBannerLink\";\nimport { AlertBannerButtonProps } from \"./AlertBannerButton/AlertBannerButton\";\nimport { AlertBannerTextProps } from \"./AlertBannerText/AlertBannerText\";\nimport { ComponentDefaultTestId } from \"../../tests/constants\";\nimport { getTestId } from \"../../tests/test-ids-utils\";\nimport { VibeComponentProps, withStaticProps } from \"../../types\";\nimport styles from \"./AlertBanner.module.scss\";\nimport Text from \"../Text/Text\";\nimport { AlertBannerContext } from \"./AlertBannerContext\";\n\ntype ChildrenType = ReactElement<AlertBannerButtonProps | AlertBannerLinkProps | AlertBannerTextProps>;\n\nexport interface AlertBannerProps extends VibeComponentProps {\n  /**\n   * The background color of the alert banner.\n   */\n  backgroundColor?: AlertBannerBackgroundColor;\n  /**\n   * If true, the close button is hidden.\n   */\n  isCloseHidden?: boolean;\n  /**\n   * The ARIA label of the alert banner for accessibility.\n   */\n  ariaLabel?: string;\n  /**\n   * The ARIA label of the close button for accessibility.\n   */\n  closeButtonAriaLabel?: string;\n  /**\n   * Callback fired when the close button is clicked.\n   */\n  onClose?: (event: React.MouseEvent<HTMLButtonElement>) => void;\n  /**\n   * The content of the alert banner.\n   */\n  children?: ChildrenType | ChildrenType[];\n}\n\nconst AlertBanner = forwardRef(\n  (\n    {\n      children: originalChildren,\n      className,\n      backgroundColor = \"primary\",\n      onClose = NOOP,\n      ariaLabel = \"\",\n      closeButtonAriaLabel = \"Close\",\n      isCloseHidden = false,\n      id,\n      \"data-testid\": dataTestId\n    }: AlertBannerProps,\n    ref: ForwardedRef<HTMLDivElement>\n  ) => {\n    const classNames = useMemo(() => {\n      return cx(className, styles.alertBanner, getStyle(styles, backgroundColor));\n    }, [className, backgroundColor]);\n\n    const isDarkBackground = backgroundColor === \"dark\";\n    const isFixedColor = backgroundColor === \"warning\";\n    const textColor = useMemo(() => {\n      if (isFixedColor) {\n        return \"fixedDark\";\n      }\n      return isDarkBackground ? \"onInverted\" : \"onPrimary\";\n    }, [isDarkBackground, isFixedColor]);\n    const children = useMemo(() => {\n      const allChildren = React.Children.toArray(originalChildren) as ReactElement[];\n      const filteredChildren = allChildren.filter(\n        (\n          child: ReactElement & {\n            type: Record<string, unknown>;\n          }\n        ) => {\n          if (child.type.isAlertBannerItem || child.type.displayName === \"MDXCreateElement\") return true;\n          console.error(\n            \"Alert banner child is not supported. Please use AlertBannerText, AlertBannerLink or AlertBannerButton.\",\n            child\n          );\n          return false;\n        }\n      );\n\n      return filteredChildren.map((child, index) => {\n        return React.cloneElement(child, {\n          ...child?.props,\n          marginLeft: index > 0,\n          isDarkBackground\n        });\n      });\n    }, [originalChildren, isDarkBackground]);\n\n    return (\n      <Text\n        type=\"text2\"\n        color={textColor}\n        ref={ref}\n        className={classNames}\n        role=\"banner\"\n        aria-label={ariaLabel || \"banner\"}\n        id={id}\n        data-testid={dataTestId || getTestId(ComponentDefaultTestId.ALERT_BANNER, id)}\n      >\n        <AlertBannerContext.Provider value={{ textColor }}>\n          <div className={cx(styles.content)}>\n            {children.map(\n              (\n                child: ReactElement & {\n                  type: Record<string, unknown>;\n                },\n                index\n              ) => {\n                const childTypeIsAlertBannerText = child.type.isAlertBannerText;\n                return (\n                  <div\n                    key={index}\n                    className={cx(styles.contentItem, {\n                      [styles.contentItemText]: childTypeIsAlertBannerText\n                    })}\n                  >\n                    {childTypeIsAlertBannerText ? <div className={cx(styles.ellipsis)}>{child}</div> : child}\n                  </div>\n                );\n              }\n            )}\n          </div>\n        </AlertBannerContext.Provider>\n        <div className={cx(styles.closeButtonWrapper)}>\n          {isCloseHidden ? null : (\n            <IconButton\n              data-testid=\"alert-banner-close-button\"\n              icon={CloseSmall}\n              className={cx(styles.closeBtn)}\n              hideTooltip\n              onClick={onClose}\n              size=\"small\"\n              kind=\"tertiary\"\n              color={isDarkBackground ? \"on-inverted-background\" : \"on-primary-color\"}\n              ariaLabel={closeButtonAriaLabel}\n            />\n          )}\n        </div>\n      </Text>\n    );\n  }\n);\n\ninterface AlertBannerStaticProps {\n  backgroundColors: typeof AlertBannerBackgroundColorEnum;\n}\n\nexport default withStaticProps<AlertBannerProps, AlertBannerStaticProps>(AlertBanner, {\n  backgroundColors: AlertBannerBackgroundColorEnum\n});\n"],"names":["withStaticProps","forwardRef","_ref","ref","originalChildren","children","className","_ref$backgroundColor","backgroundColor","_ref$onClose","onClose","NOOP","_ref$ariaLabel","ariaLabel","_ref$closeButtonAriaL","closeButtonAriaLabel","_ref$isCloseHidden","isCloseHidden","id","dataTestId","classNames","useMemo","cx","styles","alertBanner","getStyle","isDarkBackground","isFixedColor","textColor","React","Children","toArray","filter","child","type","isAlertBannerItem","displayName","console","error","map","index","cloneElement","Object","assign","props","marginLeft","createElement","Text","color","role","getTestId","ComponentDefaultTestId","ALERT_BANNER","AlertBannerContext","Provider","value","content","childTypeIsAlertBannerText","isAlertBannerText","key","contentItem","_defineProperty","contentItemText","ellipsis","closeButtonWrapper","IconButton","icon","CloseSmall","closeBtn","hideTooltip","onClick","size","kind","backgroundColors","AlertBannerBackgroundColorEnum"],"mappings":"syBA+CA,IAgHeA,EAAAA,EAhHKC,GAClB,SAAAC,EAYEC,GACE,IAXUC,EAAgBF,EAA1BG,SACAC,EAASJ,EAATI,UAASC,EAAAL,EACTM,gBAAAA,OAAkB,IAAHD,EAAG,UAASA,EAAAE,EAAAP,EAC3BQ,QAAAA,OAAUC,IAAHF,EAAGE,EAAIF,EAAAG,EAAAV,EACdW,UAAAA,OAAY,IAAHD,EAAG,GAAEA,EAAAE,EAAAZ,EACda,qBAAAA,OAAuB,IAAHD,EAAG,QAAOA,EAAAE,EAAAd,EAC9Be,cAAAA,OAAgB,IAAHD,GAAQA,EACrBE,EAAEhB,EAAFgB,GACeC,EAAUjB,EAAzB,eAIIkB,EAAaC,GAAQ,WACzB,OAAOC,EAAGhB,EAAWiB,EAAOC,YAAaC,EAASF,EAAQf,GAC5D,GAAG,CAACF,EAAWE,IAETkB,EAAuC,SAApBlB,EACnBmB,EAAmC,YAApBnB,EACfoB,EAAYP,GAAQ,WACxB,OAAIM,EACK,YAEFD,EAAmB,aAAe,WAC3C,GAAG,CAACA,EAAkBC,IAChBtB,EAAWgB,GAAQ,WAiBvB,OAhBoBQ,EAAMC,SAASC,QAAQ3B,GACN4B,QACnC,SACEC,GAIA,SAAIA,EAAMC,KAAKC,mBAAgD,qBAA3BF,EAAMC,KAAKE,eAC/CC,QAAQC,MACN,yGACAL,IAEK,EACT,IAGsBM,KAAI,SAACN,EAAOO,GAClC,OAAOX,EAAMY,aAAaR,EACrBS,OAAAC,OAAAD,OAAAC,OAAA,CAAA,EAAAV,aAAA,EAAAA,EAAOW,OAAK,CACfC,WAAYL,EAAQ,EACpBd,iBAAAA,IAEJ,GACF,GAAG,CAACtB,EAAkBsB,IAEtB,OACEG,EAACiB,cAAAC,GACCb,KAAK,QACLc,MAAOpB,EACPzB,IAAKA,EACLG,UAAWc,EACX6B,KAAK,SACO,aAAApC,GAAa,SACzBK,GAAIA,gBACSC,GAAc+B,EAAUC,EAAuBC,aAAclC,IAE1EW,EAACiB,cAAAO,EAAmBC,SAAQ,CAACC,MAAO,CAAE3B,UAAAA,IACpCC,EAAAiB,cAAA,MAAA,CAAKxC,UAAWgB,EAAGC,EAAOiC,UACvBnD,EAASkC,KACR,SACEN,EAGAO,GAEA,IAAMiB,EAA6BxB,EAAMC,KAAKwB,kBAC9C,OACE7B,EAAAiB,cAAA,MAAA,CACEa,IAAKnB,EACLlC,UAAWgB,EAAGC,EAAOqC,YAAWC,EAAA,CAAA,EAC7BtC,EAAOuC,gBAAkBL,KAG3BA,EAA6B5B,EAAKiB,cAAA,MAAA,CAAAxC,UAAWgB,EAAGC,EAAOwC,WAAY9B,GAAeA,EAGxF,MAIPJ,EAAAiB,cAAA,MAAA,CAAKxC,UAAWgB,EAAGC,EAAOyC,qBACvB/C,EAAgB,KACfY,EAACiB,cAAAmB,EACa,CAAA,cAAA,4BACZC,KAAMC,EACN7D,UAAWgB,EAAGC,EAAO6C,UACrBC,aACA,EAAAC,QAAS5D,EACT6D,KAAK,QACLC,KAAK,WACLxB,MAAOtB,EAAmB,yBAA2B,mBACrDb,UAAWE,KAMvB,IAOoF,CACpF0D,iBAAkBC"}
+{"version":3,"file":"AlertBanner.js","sources":["../../../../../src/components/AlertBanner/AlertBanner.tsx"],"sourcesContent":["import { getStyle } from \"../../helpers/typesciptCssModulesHelper\";\nimport cx from \"classnames\";\nimport React, { ForwardedRef, forwardRef, ReactElement, useMemo } from \"react\";\nimport IconButton from \"../../components/IconButton/IconButton\";\nimport { CloseSmall } from \"@vibe/icons\";\nimport { AlertBannerBackgroundColor as AlertBannerBackgroundColorEnum } from \"./AlertBannerConstants\";\nimport { AlertBannerBackgroundColor } from \"./AlertBanner.types\";\nimport { NOOP } from \"../../utils/function-utils\";\nimport VibeComponentProps from \"../../types/VibeComponentProps\";\nimport { AlertBannerLinkProps } from \"./AlertBannerLink/AlertBannerLink\";\nimport { AlertBannerButtonProps } from \"./AlertBannerButton/AlertBannerButton\";\nimport { AlertBannerTextProps } from \"./AlertBannerText/AlertBannerText\";\nimport { ComponentDefaultTestId } from \"../../tests/constants\";\nimport { getTestId } from \"../../tests/test-ids-utils\";\nimport { VibeComponent, withStaticProps } from \"../../types\";\nimport styles from \"./AlertBanner.module.scss\";\nimport Text from \"../Text/Text\";\nimport { AlertBannerContext } from \"./AlertBannerContext\";\n\ntype ChildrenType = ReactElement<AlertBannerButtonProps | AlertBannerLinkProps | AlertBannerTextProps>;\n\nexport interface AlertBannerProps extends VibeComponentProps {\n  /**\n   * The background color of the alert banner.\n   */\n  backgroundColor?: AlertBannerBackgroundColor;\n  /**\n   * If true, the close button is hidden.\n   */\n  isCloseHidden?: boolean;\n  /**\n   * The ARIA label of the alert banner for accessibility.\n   */\n  ariaLabel?: string;\n  /**\n   * The ARIA label of the close button for accessibility.\n   */\n  closeButtonAriaLabel?: string;\n  /**\n   * Callback fired when the close button is clicked.\n   */\n  onClose?: (event: React.MouseEvent<HTMLButtonElement>) => void;\n  /**\n   * The content of the alert banner.\n   */\n  children?: ChildrenType | ChildrenType[];\n}\n\nconst AlertBanner: VibeComponent<AlertBannerProps> & {\n  backgroundColors?: typeof AlertBannerBackgroundColorEnum;\n} = forwardRef(\n  (\n    {\n      children: originalChildren,\n      className,\n      backgroundColor = \"primary\",\n      onClose = NOOP,\n      ariaLabel = \"\",\n      closeButtonAriaLabel = \"Close\",\n      isCloseHidden = false,\n      id,\n      \"data-testid\": dataTestId\n    }: AlertBannerProps,\n    ref: ForwardedRef<HTMLDivElement>\n  ) => {\n    const classNames = useMemo(() => {\n      return cx(className, styles.alertBanner, getStyle(styles, backgroundColor));\n    }, [className, backgroundColor]);\n\n    const isDarkBackground = backgroundColor === \"dark\";\n    const isFixedColor = backgroundColor === \"warning\";\n    const textColor = useMemo(() => {\n      if (isFixedColor) {\n        return \"fixedDark\";\n      }\n      return isDarkBackground ? \"onInverted\" : \"onPrimary\";\n    }, [isDarkBackground, isFixedColor]);\n    const children = useMemo(() => {\n      const allChildren = React.Children.toArray(originalChildren) as ReactElement[];\n      const filteredChildren = allChildren.filter(\n        (\n          child: ReactElement & {\n            type: Record<string, unknown>;\n          }\n        ) => {\n          if (child.type.isAlertBannerItem || child.type.displayName === \"MDXCreateElement\") return true;\n          console.error(\n            \"Alert banner child is not supported. Please use AlertBannerText, AlertBannerLink or AlertBannerButton.\",\n            child\n          );\n          return false;\n        }\n      );\n\n      return filteredChildren.map((child, index) => {\n        return React.cloneElement(child, {\n          ...child?.props,\n          marginLeft: index > 0,\n          isDarkBackground\n        });\n      });\n    }, [originalChildren, isDarkBackground]);\n\n    return (\n      <Text\n        type=\"text2\"\n        color={textColor}\n        ref={ref}\n        className={classNames}\n        role=\"banner\"\n        aria-label={ariaLabel || \"banner\"}\n        id={id}\n        data-testid={dataTestId || getTestId(ComponentDefaultTestId.ALERT_BANNER, id)}\n      >\n        <AlertBannerContext.Provider value={{ textColor }}>\n          <div className={cx(styles.content)}>\n            {children.map(\n              (\n                child: ReactElement & {\n                  type: Record<string, unknown>;\n                },\n                index\n              ) => {\n                const childTypeIsAlertBannerText = child.type.isAlertBannerText;\n                return (\n                  <div\n                    key={index}\n                    className={cx(styles.contentItem, {\n                      [styles.contentItemText]: childTypeIsAlertBannerText\n                    })}\n                  >\n                    {childTypeIsAlertBannerText ? <div className={cx(styles.ellipsis)}>{child}</div> : child}\n                  </div>\n                );\n              }\n            )}\n          </div>\n        </AlertBannerContext.Provider>\n        <div className={cx(styles.closeButtonWrapper)}>\n          {isCloseHidden ? null : (\n            <IconButton\n              data-testid=\"alert-banner-close-button\"\n              icon={CloseSmall}\n              className={cx(styles.closeBtn)}\n              hideTooltip\n              onClick={onClose}\n              size=\"small\"\n              kind=\"tertiary\"\n              color={isDarkBackground ? \"on-inverted-background\" : \"on-primary-color\"}\n              ariaLabel={closeButtonAriaLabel}\n            />\n          )}\n        </div>\n      </Text>\n    );\n  }\n);\n\nexport default withStaticProps(AlertBanner, { backgroundColors: AlertBannerBackgroundColorEnum });\n"],"names":["withStaticProps","forwardRef","_ref","ref","originalChildren","children","className","_ref$backgroundColor","backgroundColor","_ref$onClose","onClose","NOOP","_ref$ariaLabel","ariaLabel","_ref$closeButtonAriaL","closeButtonAriaLabel","_ref$isCloseHidden","isCloseHidden","id","dataTestId","classNames","useMemo","cx","styles","alertBanner","getStyle","isDarkBackground","isFixedColor","textColor","React","Children","toArray","filter","child","type","isAlertBannerItem","displayName","console","error","map","index","cloneElement","Object","assign","props","marginLeft","createElement","Text","color","role","getTestId","ComponentDefaultTestId","ALERT_BANNER","AlertBannerContext","Provider","value","content","childTypeIsAlertBannerText","isAlertBannerText","key","contentItem","_defineProperty","contentItemText","ellipsis","closeButtonWrapper","IconButton","icon","CloseSmall","closeBtn","hideTooltip","onClick","size","kind","backgroundColors","AlertBannerBackgroundColorEnum"],"mappings":"syBAgDA,IA8GeA,EAAAA,EA5GXC,GACF,SAAAC,EAYEC,GACE,IAXUC,EAAgBF,EAA1BG,SACAC,EAASJ,EAATI,UAASC,EAAAL,EACTM,gBAAAA,OAAkB,IAAHD,EAAG,UAASA,EAAAE,EAAAP,EAC3BQ,QAAAA,OAAUC,IAAHF,EAAGE,EAAIF,EAAAG,EAAAV,EACdW,UAAAA,OAAY,IAAHD,EAAG,GAAEA,EAAAE,EAAAZ,EACda,qBAAAA,OAAuB,IAAHD,EAAG,QAAOA,EAAAE,EAAAd,EAC9Be,cAAAA,OAAgB,IAAHD,GAAQA,EACrBE,EAAEhB,EAAFgB,GACeC,EAAUjB,EAAzB,eAIIkB,EAAaC,GAAQ,WACzB,OAAOC,EAAGhB,EAAWiB,EAAOC,YAAaC,EAASF,EAAQf,GAC5D,GAAG,CAACF,EAAWE,IAETkB,EAAuC,SAApBlB,EACnBmB,EAAmC,YAApBnB,EACfoB,EAAYP,GAAQ,WACxB,OAAIM,EACK,YAEFD,EAAmB,aAAe,WAC3C,GAAG,CAACA,EAAkBC,IAChBtB,EAAWgB,GAAQ,WAiBvB,OAhBoBQ,EAAMC,SAASC,QAAQ3B,GACN4B,QACnC,SACEC,GAIA,SAAIA,EAAMC,KAAKC,mBAAgD,qBAA3BF,EAAMC,KAAKE,eAC/CC,QAAQC,MACN,yGACAL,IAEK,EACT,IAGsBM,KAAI,SAACN,EAAOO,GAClC,OAAOX,EAAMY,aAAaR,EACrBS,OAAAC,OAAAD,OAAAC,OAAA,CAAA,EAAAV,aAAA,EAAAA,EAAOW,OAAK,CACfC,WAAYL,EAAQ,EACpBd,iBAAAA,IAEJ,GACF,GAAG,CAACtB,EAAkBsB,IAEtB,OACEG,EAACiB,cAAAC,GACCb,KAAK,QACLc,MAAOpB,EACPzB,IAAKA,EACLG,UAAWc,EACX6B,KAAK,SACO,aAAApC,GAAa,SACzBK,GAAIA,gBACSC,GAAc+B,EAAUC,EAAuBC,aAAclC,IAE1EW,EAACiB,cAAAO,EAAmBC,SAAQ,CAACC,MAAO,CAAE3B,UAAAA,IACpCC,EAAAiB,cAAA,MAAA,CAAKxC,UAAWgB,EAAGC,EAAOiC,UACvBnD,EAASkC,KACR,SACEN,EAGAO,GAEA,IAAMiB,EAA6BxB,EAAMC,KAAKwB,kBAC9C,OACE7B,EAAAiB,cAAA,MAAA,CACEa,IAAKnB,EACLlC,UAAWgB,EAAGC,EAAOqC,YAAWC,EAAA,CAAA,EAC7BtC,EAAOuC,gBAAkBL,KAG3BA,EAA6B5B,EAAKiB,cAAA,MAAA,CAAAxC,UAAWgB,EAAGC,EAAOwC,WAAY9B,GAAeA,EAGxF,MAIPJ,EAAAiB,cAAA,MAAA,CAAKxC,UAAWgB,EAAGC,EAAOyC,qBACvB/C,EAAgB,KACfY,EAACiB,cAAAmB,EACa,CAAA,cAAA,4BACZC,KAAMC,EACN7D,UAAWgB,EAAGC,EAAO6C,UACrBC,aACA,EAAAC,QAAS5D,EACT6D,KAAK,QACLC,KAAK,WACLxB,MAAOtB,EAAmB,yBAA2B,mBACrDb,UAAWE,KAMvB,IAG0C,CAAE0D,iBAAkBC"}

package/dist/mocked_classnames/src/components/AlertBanner/AlertBanner.module.scss.js

@@ -1,2 +1,2 @@
-var n={alertBanner:"alertBanner",primary:"primary",positive:"positive",negative:"negative",dark:"dark",warning:"warning",closeBtn:"closeBtn",content:"content",closeButtonWrapper:"closeButtonWrapper",ellipsis:"ellipsis",contentItem:"contentItem",contentItemText:"contentItemText"};!function(n){const e="s_id-2b16d36a7fd0_3_37_0";if("undefined"!=typeof document){const t=document.head||document.getElementsByTagName("head")[0];if(t.querySelector("#"+e))return;const o=document.createElement("style");o.id=e,t.firstChild?t.insertBefore(o,t.firstChild):t.appendChild(o),o.appendChild(document.createTextNode(n))}else globalThis.injectedStyles&&(globalThis.injectedStyles[e]=n)}(".alertBanner {\n  height: 40px;\n  display: flex;\n  align-items: center;\n  justify-content: center;\n  width: 100%;\n}\n\n.primary {\n  background-color: var(--primary-color);\n}\n\n.positive {\n  background-color: var(--positive-color);\n}\n\n.negative {\n  background-color: var(--negative-color);\n}\n\n.dark {\n  background-color: var(--inverted-color-background);\n}\n\n.warning {\n  background-color: var(--warning-color);\n  color: var(--fixed-dark-color);\n}\n\n.warning .closeBtn {\n  color: var(--fixed-dark-color);\n}\n\n.content {\n  flex: 1 1 auto;\n  display: flex;\n  height: 100%;\n  min-width: 0;\n  align-items: center;\n  justify-content: center;\n  padding-left: var(--spacing-medium);\n}\n\n.closeButtonWrapper {\n  flex: 0 0 40px;\n  position: relative;\n  height: 100%;\n  min-width: 0;\n}\n\n.closeBtn {\n  position: absolute;\n  right: 4px;\n  top: 4px;\n}\n\n.ellipsis {\n  flex: 0 1 auto;\n}\n\n.contentItem {\n  flex: 0 0 auto;\n  min-width: 0;\n}\n\n.contentItemText {\n  flex: 0 1 auto;\n  min-width: 0;\n}");export{n as default};
+var n={alertBanner:"alertBanner",primary:"primary",positive:"positive",negative:"negative",dark:"dark",warning:"warning",closeBtn:"closeBtn",content:"content",closeButtonWrapper:"closeButtonWrapper",ellipsis:"ellipsis",contentItem:"contentItem",contentItemText:"contentItemText"};!function(n){const e="s_id-2b16d36a7fd0_3_38_0";if("undefined"!=typeof document){const t=document.head||document.getElementsByTagName("head")[0];if(t.querySelector("#"+e))return;const o=document.createElement("style");o.id=e,t.firstChild?t.insertBefore(o,t.firstChild):t.appendChild(o),o.appendChild(document.createTextNode(n))}else globalThis.injectedStyles&&(globalThis.injectedStyles[e]=n)}(".alertBanner {\n  height: 40px;\n  display: flex;\n  align-items: center;\n  justify-content: center;\n  width: 100%;\n}\n\n.primary {\n  background-color: var(--primary-color);\n}\n\n.positive {\n  background-color: var(--positive-color);\n}\n\n.negative {\n  background-color: var(--negative-color);\n}\n\n.dark {\n  background-color: var(--inverted-color-background);\n}\n\n.warning {\n  background-color: var(--warning-color);\n  color: var(--fixed-dark-color);\n}\n\n.warning .closeBtn {\n  color: var(--fixed-dark-color);\n}\n\n.content {\n  flex: 1 1 auto;\n  display: flex;\n  height: 100%;\n  min-width: 0;\n  align-items: center;\n  justify-content: center;\n  padding-left: var(--spacing-medium);\n}\n\n.closeButtonWrapper {\n  flex: 0 0 40px;\n  position: relative;\n  height: 100%;\n  min-width: 0;\n}\n\n.closeBtn {\n  position: absolute;\n  right: 4px;\n  top: 4px;\n}\n\n.ellipsis {\n  flex: 0 1 auto;\n}\n\n.contentItem {\n  flex: 0 0 auto;\n  min-width: 0;\n}\n\n.contentItemText {\n  flex: 0 1 auto;\n  min-width: 0;\n}");export{n as default};
 //# sourceMappingURL=AlertBanner.module.scss.js.map