@vibe/core 4.0.0-alpha.1 → 4.0.0-alpha.2

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

@@ -1,64 +1,64 @@
-import { type IconType } from "@vibe/icon";
-import { type ReactElement } from "react";
-import { type SliderSize, type SliderColor as SliderColorType, type SliderLabelPosition, type SliderLabelColor } from "./Slider.types";
-export declare const BEM_PREFIX = "monday";
-export declare const COMPONENT_ID = "slider";
-export declare const UPDATE_SLIDER_SIZE_DEBOUNCE = 200;
-export declare const TOOLTIP_SHOW_DELAY = 300;
-export type SliderContextSelection = {
-    max: number;
-    min: number;
-    ranged: boolean;
-    step: number;
-    value: number | number[];
-    valueText: string | string[];
-};
-export type SliderContextUI = {
-    active: number;
-    "aria-label": string;
-    "aria-labelledby": string;
-    color: SliderColorType;
-    disabled: boolean;
-    dragging: number;
-    focused: number;
-    size: SliderSize;
-    shapeTestId: (subElement: string) => string;
-    showValue: boolean;
-    valueLabelPosition: SliderLabelPosition;
-    valueLabelColor: SliderLabelColor;
-};
-export type SliderContextActions = {
-    setActive: (value: number) => void;
-    setFocused: (value: number) => void;
-    setDragging: (value: number) => void;
-    changeThumbValue: (newValue: number | string, thumbIndex?: number, cancelFocus?: boolean) => void;
-    drugThumb: (newValue: number | number[]) => void;
-    decreaseValue: (consumerStep?: number) => void;
-    increaseValue: (consumerStep?: number) => void;
-};
-export type SliderContextInfix = {
-    /**
-     * Show selected from Slider range value
-     */
-    indicateSelection?: boolean;
-    /**
-     * Options for initial/start/prefix element, it can be one of:
-     *  - Any Component (react component, node, text, number etc.)
-     *  - Or it can be an object of options for Icons component (see Icon components props)
-     *  - Or it can be an object for Label (Icon, Heading - and other components)
-     *  - Or it can be Render Props Function witch are getting value and valueText
-     */
-    prefix?: {
-        icon: IconType;
-    } | string | ((value: number | number[], valueText: string | string[]) => ReactElement) | ReactElement;
-    /**
-     * Options for postfix/end/finishing element. Same as prefix element.
-     */
-    postfix?: {
-        icon: IconType;
-    } | string | ((value: number | number[], valueText: string | string[]) => ReactElement) | ReactElement;
-    /**
-     * Width of SelectionIndicator (i.e. TextField)
-     */
-    selectionIndicatorWidth?: string;
-};
+import { type IconType } from "@vibe/icon";
+import { type ReactElement } from "react";
+import { type SliderSize, type SliderColor as SliderColorType, type SliderLabelPosition, type SliderLabelColor } from "./Slider.types";
+export declare const BEM_PREFIX = "monday";
+export declare const COMPONENT_ID = "slider";
+export declare const UPDATE_SLIDER_SIZE_DEBOUNCE = 200;
+export declare const TOOLTIP_SHOW_DELAY = 300;
+export type SliderContextSelection = {
+    max: number;
+    min: number;
+    ranged: boolean;
+    step: number;
+    value: number | number[];
+    valueText: string | string[];
+};
+export type SliderContextUI = {
+    active: number;
+    "aria-label": string;
+    "aria-labelledby": string;
+    color: SliderColorType;
+    disabled: boolean;
+    dragging: number;
+    focused: number;
+    size: SliderSize;
+    shapeTestId: (subElement: string) => string;
+    showValue: boolean;
+    valueLabelPosition: SliderLabelPosition;
+    valueLabelColor: SliderLabelColor;
+};
+export type SliderContextActions = {
+    setActive: (value: number) => void;
+    setFocused: (value: number) => void;
+    setDragging: (value: number) => void;
+    changeThumbValue: (newValue: number | string, thumbIndex?: number, cancelFocus?: boolean) => void;
+    drugThumb: (newValue: number | number[]) => void;
+    decreaseValue: (consumerStep?: number) => void;
+    increaseValue: (consumerStep?: number) => void;
+};
+export type SliderContextInfix = {
+    /**
+     * Show selected from Slider range value
+     */
+    indicateSelection?: boolean;
+    /**
+     * Options for initial/start/prefix element, it can be one of:
+     *  - Any Component (react component, node, text, number etc.)
+     *  - Or it can be an object of options for Icons component (see Icon components props)
+     *  - Or it can be an object for Label (Icon, Heading - and other components)
+     *  - Or it can be Render Props Function witch are getting value and valueText
+     */
+    prefix?: {
+        icon: IconType;
+    } | string | ((value: number | number[], valueText: string | string[]) => ReactElement) | ReactElement;
+    /**
+     * Options for postfix/end/finishing element. Same as prefix element.
+     */
+    postfix?: {
+        icon: IconType;
+    } | string | ((value: number | number[], valueText: string | string[]) => ReactElement) | ReactElement;
+    /**
+     * Width of SelectionIndicator (i.e. TextField)
+     */
+    selectionIndicatorWidth?: string;
+};

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

@@ -1,43 +1,43 @@
-import React, { type ReactElement } from "react";
-import { type SliderProps } from "./Slider";
-import { type SliderContextActions, type SliderContextInfix, type SliderContextSelection, type SliderContextUI } from "./SliderConstants";
-import { type IconType } from "@vibe/icon";
-export interface SliderProviderProps extends SliderProps {
-    /**
-     * The child elements inside the slider provider.
-     */
-    children?: ReactElement | ReactElement[];
-    /**
-     * Configuration options for prefix, postfix, and selection indicator.
-     */
-    infixOptions?: {
-        /**
-         * If true, displays the selected value from the slider range.
-         */
-        indicateSelection?: boolean;
-        /**
-         * Configuration for the prefix (start) element, which can be:
-         * - A React component, text, number, or node.
-         * - An object with an icon.
-         * - A function that receives the value and valueText.
-         */
-        prefix?: {
-            icon: IconType;
-        } | string | ((value: number, valueText: string) => void) | ReactElement;
-        /**
-         * Configuration for the postfix (end) element, similar to prefix.
-         */
-        postfix?: {
-            icon: IconType;
-        } | string | ((value: number, valueText: string) => void) | ReactElement;
-        /**
-         * The width of the selection indicator.
-         */
-        selectionIndicatorWidth?: string;
-    };
-}
-export declare function SliderProvider({ children, "aria-label": ariaLabel, "aria-labelledby": ariaLabelledby, color, "data-testid": dataTestId, defaultValue, disabled, max, min, onChange, ranged, showValue, valueLabelPosition, valueLabelColor, size, step, value, valueFormatter, valueText, infixOptions }: SliderProviderProps): React.JSX.Element;
-export declare function useSliderUi(): SliderContextUI;
-export declare function useSliderInfix(): SliderContextInfix;
-export declare function useSliderSelection(): SliderContextSelection;
-export declare function useSliderActions(): SliderContextActions;
+import React, { type ReactElement } from "react";
+import { type SliderProps } from "./Slider";
+import { type SliderContextActions, type SliderContextInfix, type SliderContextSelection, type SliderContextUI } from "./SliderConstants";
+import { type IconType } from "@vibe/icon";
+export interface SliderProviderProps extends SliderProps {
+    /**
+     * The child elements inside the slider provider.
+     */
+    children?: ReactElement | ReactElement[];
+    /**
+     * Configuration options for prefix, postfix, and selection indicator.
+     */
+    infixOptions?: {
+        /**
+         * If true, displays the selected value from the slider range.
+         */
+        indicateSelection?: boolean;
+        /**
+         * Configuration for the prefix (start) element, which can be:
+         * - A React component, text, number, or node.
+         * - An object with an icon.
+         * - A function that receives the value and valueText.
+         */
+        prefix?: {
+            icon: IconType;
+        } | string | ((value: number, valueText: string) => void) | ReactElement;
+        /**
+         * Configuration for the postfix (end) element, similar to prefix.
+         */
+        postfix?: {
+            icon: IconType;
+        } | string | ((value: number, valueText: string) => void) | ReactElement;
+        /**
+         * The width of the selection indicator.
+         */
+        selectionIndicatorWidth?: string;
+    };
+}
+export declare function SliderProvider({ children, "aria-label": ariaLabel, "aria-labelledby": ariaLabelledby, color, "data-testid": dataTestId, defaultValue, disabled, max, min, onChange, ranged, showValue, valueLabelPosition, valueLabelColor, size, step, value, valueFormatter, valueText, infixOptions }: SliderProviderProps): React.JSX.Element;
+export declare function useSliderUi(): SliderContextUI;
+export declare function useSliderInfix(): SliderContextInfix;
+export declare function useSliderSelection(): SliderContextSelection;
+export declare function useSliderActions(): SliderContextActions;

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

@@ -1,14 +1,14 @@
-export declare function _calcDimension(max: number, min: number, value: number): [number, number];
-export declare function calcDimensions(max: number, min: number, ranged: boolean, value: number | number[]): {
-    dimension: number;
-    offset: number;
-    positions: number[];
-    thumbKeys: string[];
-};
-export declare function calculatePageStep(max: number, min: number, step: number): number;
-export declare function ensureDefaultValue(defaultValue: number | number[], min: number, max: number, ranged: boolean): number | number[];
-export declare function ensureValueText(valueText: string, value: number | number[], formatter: (value: number) => string): string | string[];
-export declare function getNearest(newValue: number, ranged: boolean, value: number | number[]): 0 | 1;
-export declare function moveToPx(offsetInPx: number, min: number, max: number, railCoords: {
-    width: number;
-}, step: number): number;
+export declare function _calcDimension(max: number, min: number, value: number): [number, number];
+export declare function calcDimensions(max: number, min: number, ranged: boolean, value: number | number[]): {
+    dimension: number;
+    offset: number;
+    positions: number[];
+    thumbKeys: string[];
+};
+export declare function calculatePageStep(max: number, min: number, step: number): number;
+export declare function ensureDefaultValue(defaultValue: number | number[], min: number, max: number, ranged: boolean): number | number[];
+export declare function ensureValueText(valueText: string, value: number | number[], formatter: (value: number) => string): string | string[];
+export declare function getNearest(newValue: number, ranged: boolean, value: number | number[]): 0 | 1;
+export declare function moveToPx(offsetInPx: number, min: number, max: number, railCoords: {
+    width: number;
+}, step: number): number;

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

@@ -1,26 +1,25 @@
-/// <reference types="react" />
-export declare function useSliderActionsContextValue(actualValue: number | number[], focused: number, getDragging: () => number, getSelectedValue: () => number | number[], max: number, min: number, onChange: (value: number | number[]) => void, ranged: boolean, setActive: (value: number) => void, setFocused: (value: number) => void, setDragging: (value: number) => void, setSelectedValue: (value: number | number[]) => void, step: number): {
-    changeThumbValue: (newValue: number | string, thumbIndex?: number, cancelFocus?: boolean) => void;
-    decreaseValue: (consumerStep: number) => void;
-    drugThumb: (newValue: number | number[]) => void;
-    increaseValue: (consumerStep?: number) => void;
-    setActive: (value: number) => void;
-    setDragging: (value: number) => void;
-    setFocused: (value: number) => void;
-};
-export declare function useDragging(): [number, (value: number) => void, () => number];
-export declare function useSliderRail(): {
-    railCoords: {
-        left: number;
-        right: number;
-        width: number;
-    };
-    railRef: import("react").MutableRefObject<any>;
-};
-export declare function useSliderValues(defaultValue: number | number[], value: number | number[], valueFormatter: (value: number) => string, valueText: string): {
-    actualValue: number | number[];
-    actualValueText: string | string[];
-    getSelectedValue: () => number | number[];
-    isControlled: boolean;
-    setSelectedValue: (value: number) => void;
-};
+export declare function useSliderActionsContextValue(actualValue: number | number[], focused: number, getDragging: () => number, getSelectedValue: () => number | number[], max: number, min: number, onChange: (value: number | number[]) => void, ranged: boolean, setActive: (value: number) => void, setFocused: (value: number) => void, setDragging: (value: number) => void, setSelectedValue: (value: number | number[]) => void, step: number): {
+    changeThumbValue: (newValue: number | string, thumbIndex?: number, cancelFocus?: boolean) => void;
+    decreaseValue: (consumerStep: number) => void;
+    drugThumb: (newValue: number | number[]) => void;
+    increaseValue: (consumerStep?: number) => void;
+    setActive: (value: number) => void;
+    setDragging: (value: number) => void;
+    setFocused: (value: number) => void;
+};
+export declare function useDragging(): [number, (value: number) => void, () => number];
+export declare function useSliderRail(): {
+    railCoords: {
+        left: number;
+        right: number;
+        width: number;
+    };
+    railRef: import("react").MutableRefObject<any>;
+};
+export declare function useSliderValues(defaultValue: number | number[], value: number | number[], valueFormatter: (value: number) => string, valueText: string): {
+    actualValue: number | number[];
+    actualValueText: string | string[];
+    getSelectedValue: () => number | number[];
+    isControlled: boolean;
+    setSelectedValue: (value: number) => void;
+};

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

@@ -1,11 +1,11 @@
-import { type FC } from "react";
-import { type VibeComponentProps } from "../../types";
-import { type InfixKind } from "./Slider.types";
-export interface SliderInfixProps extends VibeComponentProps {
-    /**
-     * Specifies the type of infix (prefix or postfix).
-     */
-    kind?: InfixKind;
-}
-declare const SliderInfix: FC<SliderInfixProps>;
-export default SliderInfix;
+import { type FC } from "react";
+import { type VibeComponentProps } from "../../types";
+import { type InfixKind } from "./Slider.types";
+export interface SliderInfixProps extends VibeComponentProps {
+    /**
+     * Specifies the type of infix (prefix or postfix).
+     */
+    kind?: InfixKind;
+}
+declare const SliderInfix: FC<SliderInfixProps>;
+export default SliderInfix;

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

@@ -1,3 +1,3 @@
-import { type CSSProperties, type ReactElement } from "react";
-import { type InfixKind } from "./Slider.types";
-export declare function useSliderInfixComponent(kind: InfixKind): [boolean, string[], ReactElement, CSSProperties];
+import { type CSSProperties, type ReactElement } from "react";
+import { type InfixKind } from "./Slider.types";
+export declare function useSliderInfixComponent(kind: InfixKind): [boolean, string[], ReactElement, CSSProperties];

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

@@ -1,2 +1,2 @@
-export { default as Slider, type SliderProps } from "./Slider";
-export * from "./Slider.types";
+export { default as Slider, type SliderProps } from "./Slider";
+export * from "./Slider.types";

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

@@ -1,44 +1,44 @@
-import React, { type ReactElement } from "react";
-import { type SplitButtonSecondaryContentPositionType } from "./SplitButtonConstants";
-import { type ButtonProps } from "@vibe/button";
-import { type DialogSize } from "@vibe/dialog";
-export interface SplitButtonProps extends ButtonProps {
-    /**
-     * The element or renderer that is displayed inside the dialog opened by clicking the secondary button.
-     */
-    secondaryDialogContent?: ReactElement | (() => string | ReactElement);
-    /**
-     * Callback fired when the secondary dialog is shown.
-     */
-    onSecondaryDialogDidShow?: () => void;
-    /**
-     * Callback fired when the secondary dialog is hidden.
-     */
-    onSecondaryDialogDidHide?: () => void;
-    /**
-     * The z-index applied to the secondary dialog.
-     */
-    zIndex?: number;
-    /**
-     * Class name applied to the wrapper of the secondary dialog.
-     */
-    secondaryDialogClassName?: string;
-    /**
-     * The position of the secondary dialog.
-     */
-    secondaryDialogPosition?: SplitButtonSecondaryContentPositionType;
-    /**
-     * The padding size inside the secondary dialog.
-     */
-    dialogPaddingSize?: DialogSize;
-    /**
-     * The CSS selector of the container where the dialog should be rendered.
-     */
-    dialogContainerSelector?: string;
-    /**
-     * If true, clicking inside the dialog will close it.
-     */
-    shouldCloseOnClickInsideDialog?: boolean;
-}
-declare const SplitButton: ({ secondaryDialogContent, onSecondaryDialogDidShow, onSecondaryDialogDidHide, shouldCloseOnClickInsideDialog, zIndex, secondaryDialogClassName, secondaryDialogPosition, dialogContainerSelector, dialogPaddingSize, disabled, success, loading, kind, color, className, leftIcon, rightIcon, onClick, children, marginLeft, marginRight, active, id, "data-testid": dataTestId, ...buttonProps }: SplitButtonProps) => React.JSX.Element;
-export default SplitButton;
+import React, { type ReactElement } from "react";
+import { type SplitButtonSecondaryContentPositionType } from "./SplitButtonConstants";
+import { type ButtonProps } from "@vibe/button";
+import { type DialogSize } from "@vibe/dialog";
+export interface SplitButtonProps extends ButtonProps {
+    /**
+     * The element or renderer that is displayed inside the dialog opened by clicking the secondary button.
+     */
+    secondaryDialogContent?: ReactElement | (() => string | ReactElement);
+    /**
+     * Callback fired when the secondary dialog is shown.
+     */
+    onSecondaryDialogDidShow?: () => void;
+    /**
+     * Callback fired when the secondary dialog is hidden.
+     */
+    onSecondaryDialogDidHide?: () => void;
+    /**
+     * The z-index applied to the secondary dialog.
+     */
+    zIndex?: number;
+    /**
+     * Class name applied to the wrapper of the secondary dialog.
+     */
+    secondaryDialogClassName?: string;
+    /**
+     * The position of the secondary dialog.
+     */
+    secondaryDialogPosition?: SplitButtonSecondaryContentPositionType;
+    /**
+     * The padding size inside the secondary dialog.
+     */
+    dialogPaddingSize?: DialogSize;
+    /**
+     * The CSS selector of the container where the dialog should be rendered.
+     */
+    dialogContainerSelector?: string;
+    /**
+     * If true, clicking inside the dialog will close it.
+     */
+    shouldCloseOnClickInsideDialog?: boolean;
+}
+declare const SplitButton: ({ secondaryDialogContent, onSecondaryDialogDidShow, onSecondaryDialogDidHide, shouldCloseOnClickInsideDialog, zIndex, secondaryDialogClassName, secondaryDialogPosition, dialogContainerSelector, dialogPaddingSize, disabled, success, loading, kind, color, className, leftIcon, rightIcon, onClick, children, marginLeft, marginRight, active, id, "data-testid": dataTestId, ...buttonProps }: SplitButtonProps) => React.JSX.Element;
+export default SplitButton;

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

@@ -1,22 +1,22 @@
-import type { DialogTriggerEvent } from "@vibe/dialog";
-export declare const DIALOG_MOVE_BY: {
-    main: number;
-    secondary: number;
-};
-export declare const DEFAULT_DIALOG_SHOW_TRIGGER: DialogTriggerEvent[];
-export declare const DEFAULT_DIALOG_HIDE_TRIGGER: DialogTriggerEvent[];
-export declare const SECONDARY_BUTTON_WRAPPER_CLASSNAME = "monday-style-split-button__secondary-button-wrapper";
-export declare const EMPTY_ARR: string[];
-export declare const ENTER_KEYS: string[];
-export declare const DialogPosition: {
-    readonly BOTTOM: "bottom";
-    readonly BOTTOM_START: "bottom-start";
-    readonly BOTTOM_END: "bottom-end";
-};
-export declare const SplitButtonSecondaryContentPosition: {
-    readonly BOTTOM_START: "bottom-start";
-    readonly BOTTOM_MIDDLE: "bottom";
-    readonly BOTTOM_END: "bottom-end";
-};
-export type SplitButtonSecondaryContentPositionType = (typeof SplitButtonSecondaryContentPosition)[keyof typeof SplitButtonSecondaryContentPosition];
-export declare const SECONDARY_BUTTON_ARIA_LABEL = "additional actions";
+import type { DialogTriggerEvent } from "@vibe/dialog";
+export declare const DIALOG_MOVE_BY: {
+    main: number;
+    secondary: number;
+};
+export declare const DEFAULT_DIALOG_SHOW_TRIGGER: DialogTriggerEvent[];
+export declare const DEFAULT_DIALOG_HIDE_TRIGGER: DialogTriggerEvent[];
+export declare const SECONDARY_BUTTON_WRAPPER_CLASSNAME = "monday-style-split-button__secondary-button-wrapper";
+export declare const EMPTY_ARR: string[];
+export declare const ENTER_KEYS: string[];
+export declare const DialogPosition: {
+    readonly BOTTOM: "bottom";
+    readonly BOTTOM_START: "bottom-start";
+    readonly BOTTOM_END: "bottom-end";
+};
+export declare const SplitButtonSecondaryContentPosition: {
+    readonly BOTTOM_START: "bottom-start";
+    readonly BOTTOM_MIDDLE: "bottom";
+    readonly BOTTOM_END: "bottom-end";
+};
+export type SplitButtonSecondaryContentPositionType = (typeof SplitButtonSecondaryContentPosition)[keyof typeof SplitButtonSecondaryContentPosition];
+export declare const SECONDARY_BUTTON_ARIA_LABEL = "additional actions";

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

@@ -1,9 +1,9 @@
-import React from "react";
-import { type 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>>;
-export default SplitButtonMenu;
+import React from "react";
+import { type 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>>;
+export default SplitButtonMenu;

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

@@ -1,2 +1,2 @@
-export { default as SplitButton, type SplitButtonProps } from "./SplitButton";
-export { default as SplitButtonMenu, type SplitButtonMenuProps } from "./SplitButtonMenu/SplitButtonMenu";
+export { default as SplitButton, type SplitButtonProps } from "./SplitButton";
+export { default as SplitButtonMenu, type SplitButtonMenuProps } from "./SplitButtonMenu/SplitButtonMenu";

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

@@ -1,56 +1,56 @@
-import React, { type ReactElement } from "react";
-import { type StepsColor, type StepsType } from "./Steps.types";
-import { type ButtonProps } from "@vibe/button";
-import { type VibeComponentProps } from "../../types";
-export interface StepsProps extends VibeComponentProps {
-    /**
-     * The index of the currently active step.
-     */
-    activeStepIndex?: number;
-    /**
-     * Callback fired when the active step changes.
-     */
-    onChangeActiveStep?: (e: React.MouseEvent, stepIndex: number) => void;
-    /**
-     * If true, hides the navigation buttons.
-     */
-    areNavigationButtonsHidden?: boolean;
-    /**
-     * The list of steps in the steps component.
-     */
-    steps?: ReactElement[];
-    /**
-     * The visual style of the steps component.
-     */
-    type?: StepsType;
-    /**
-     * The color theme of the steps component.
-     */
-    color?: StepsColor;
-    /**
-     * If true, the content is displayed above the step navigation.
-     */
-    isContentOnTop?: boolean;
-    /**
-     * If true, hides the icons in the navigation buttons.
-     */
-    areButtonsIconsHidden?: boolean;
-    /**
-     * Props applied to the back button.
-     */
-    backButtonProps?: Partial<ButtonProps>;
-    /**
-     * Props applied to the next button.
-     */
-    nextButtonProps?: Partial<ButtonProps>;
-    /**
-     * Props applied to the finish button.
-     */
-    finishButtonProps?: Partial<ButtonProps>;
-    /**
-     * Callback fired when the finish button is clicked.
-     */
-    onFinish?: (e: React.MouseEvent | React.KeyboardEvent) => void;
-}
-declare const Steps: React.ForwardRefExoticComponent<StepsProps & React.RefAttributes<HTMLElement>>;
-export default Steps;
+import React, { type ReactElement } from "react";
+import { type StepsColor, type StepsType } from "./Steps.types";
+import { type ButtonProps } from "@vibe/button";
+import { type VibeComponentProps } from "../../types";
+export interface StepsProps extends VibeComponentProps {
+    /**
+     * The index of the currently active step.
+     */
+    activeStepIndex?: number;
+    /**
+     * Callback fired when the active step changes.
+     */
+    onChangeActiveStep?: (e: React.MouseEvent, stepIndex: number) => void;
+    /**
+     * If true, hides the navigation buttons.
+     */
+    areNavigationButtonsHidden?: boolean;
+    /**
+     * The list of steps in the steps component.
+     */
+    steps?: ReactElement[];
+    /**
+     * The visual style of the steps component.
+     */
+    type?: StepsType;
+    /**
+     * The color theme of the steps component.
+     */
+    color?: StepsColor;
+    /**
+     * If true, the content is displayed above the step navigation.
+     */
+    isContentOnTop?: boolean;
+    /**
+     * If true, hides the icons in the navigation buttons.
+     */
+    areButtonsIconsHidden?: boolean;
+    /**
+     * Props applied to the back button.
+     */
+    backButtonProps?: Partial<ButtonProps>;
+    /**
+     * Props applied to the next button.
+     */
+    nextButtonProps?: Partial<ButtonProps>;
+    /**
+     * Props applied to the finish button.
+     */
+    finishButtonProps?: Partial<ButtonProps>;
+    /**
+     * Callback fired when the finish button is clicked.
+     */
+    onFinish?: (e: React.MouseEvent | React.KeyboardEvent) => void;
+}
+declare const Steps: React.ForwardRefExoticComponent<StepsProps & React.RefAttributes<HTMLElement>>;
+export default Steps;

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

@@ -1,3 +1,3 @@
-export type StepsType = "numbers" | "gallery";
-export type StepsDotAriaCurrent = "page" | "step" | "location" | "date" | "time";
-export type StepsColor = "primary" | "on-primary-color" | "on-inverted-background";
+export type StepsType = "numbers" | "gallery";
+export type StepsDotAriaCurrent = "page" | "step" | "location" | "date" | "time";
+export type StepsColor = "primary" | "on-primary-color" | "on-inverted-background";