@nimbus-ds/components 5.51.0 → 5.52.0

package/dist/index.d.ts

@@ -23,7 +23,7 @@ export interface SkeletonProperties {
 }
 export type SkeletonProps = SkeletonProperties & HTMLAttributes<HTMLDivElement>;
 export declare const Skeleton: React.FC<SkeletonProps>;
-export type BadgeSkeletonProperties = Partial<Pick<SkeletonProps, "width">> & Partial<Pick<SkeletonProps, "height">> & {
+export type BadgeSkeletonProperties = Partial<Pick<SkeletonProps, "width" | "height" | "className">> & {
 	/**
 	 * This is an attribute used to identify a DOM node for testing purposes.
 	 */
@@ -2380,7 +2380,7 @@ export interface BoxProperties extends BoxSprinkle {
 export type BoxBaseProps = BoxProperties & Omit<HTMLAttributes<HTMLElement>, "color">;
 export declare const Box: PolymorphicForwardRefComponent<"div", BoxBaseProps>;
 export type BoxProps = ComponentPropsWithRef<typeof Box>;
-export type ButtonSkeletonProperties = Partial<Pick<SkeletonProps, "width" | "data-testid">>;
+export type ButtonSkeletonProperties = Partial<Pick<SkeletonProps, "width" | "className" | "data-testid">>;
 export type ButtonSkeletonProps = ButtonSkeletonProperties;
 declare const ButtonSkeleton: React.FC<ButtonSkeletonProps>;
 export interface ButtonComponents {
@@ -2416,7 +2416,7 @@ export interface ButtonProperties {
 export type ButtonBaseProps = ButtonProperties & ButtonHTMLAttributes<HTMLButtonElement>;
 export declare const Button: PolymorphicForwardRefComponent<"button" | "a", ButtonBaseProps> & ButtonComponents;
 export type ButtonProps = ComponentPropsWithRef<typeof Button>;
-export type CheckboxSkeletonProperties = Partial<Pick<SkeletonProps, "width" | "data-testid">>;
+export type CheckboxSkeletonProperties = Partial<Pick<SkeletonProps, "width" | "className" | "data-testid">>;
 export type CheckboxSkeletonProps = CheckboxSkeletonProperties;
 declare const CheckboxSkeleton: React.FC<CheckboxSkeletonProps>;
 export interface CheckboxComponents {
@@ -2458,7 +2458,7 @@ export interface CheckboxProperties {
 }
 export type CheckboxProps = CheckboxProperties & InputHTMLAttributes<HTMLInputElement>;
 export declare const Checkbox: React.FC<CheckboxProps> & CheckboxComponents;
-export type ChipSkeletonProperties = Partial<Pick<SkeletonProps, "width">> & Partial<Pick<SkeletonProps, "height">> & {
+export type ChipSkeletonProperties = Partial<Pick<SkeletonProps, "width" | "height" | "className">> & {
 	/**
 	 * This is an attribute used to identify a DOM node for testing purposes.
 	 */
@@ -2491,7 +2491,7 @@ export interface ChipProperties {
 }
 export type ChipProps = ChipProperties & ButtonHTMLAttributes<HTMLButtonElement | HTMLDivElement>;
 export declare const Chip: React.FC<ChipProps> & ChipComponents;
-export type FileUploaderSkeletonProperties = Partial<Pick<SkeletonProps, "width">> & Partial<Pick<SkeletonProps, "height">> & Partial<Pick<FileUploaderProps, "aspectRatio">> & {
+export type FileUploaderSkeletonProperties = Partial<Pick<SkeletonProps, "width" | "height" | "className">> & Partial<Pick<FileUploaderProps, "aspectRatio">> & {
 	/**
 	 * This is an attribute used to identify a DOM node for testing purposes.
 	 */
@@ -2612,7 +2612,7 @@ export type FileUploaderProps = FileUploaderProperties & {
 	dragOverlay?: ReactElement<FileUploaderOverlayProps>;
 } & InputHTMLAttributes<HTMLInputElement>;
 export declare const FileUploader: React.FC<FileUploaderProps> & FileUploaderComponents;
-export type IconSkeletonProperties = Partial<Pick<SkeletonProps, "width">> & Partial<Pick<SkeletonProps, "height">> & {
+export type IconSkeletonProperties = Partial<Pick<SkeletonProps, "width" | "height" | "className">> & {
 	/**
 	 * This is an attribute used to identify a DOM node for testing purposes.
 	 */
@@ -2665,7 +2665,7 @@ export declare const isGradient: (color: string) => boolean;
  * Collection of known gradient color values
  */
 export declare const GRADIENT_COLORS: Set<string>;
-export type IconButtonSkeletonProperties = Partial<Pick<SkeletonProps, "width" | "height">> & {
+export type IconButtonSkeletonProperties = Partial<Pick<SkeletonProps, "width" | "height" | "className">> & {
 	/**
 	 * This is an attribute used to identify a DOM node for testing purposes.
 	 */
@@ -2704,7 +2704,7 @@ export type InputPasswordProperties = Pick<InputBaseProps, "appearance" | "disab
 declare const InputPassword: React.ForwardRefExoticComponent<InputPasswordProperties & React.InputHTMLAttributes<HTMLInputElement> & React.RefAttributes<HTMLInputElement>>;
 export type InputSearchProperties = Pick<InputBaseProps, "appearance" | "disabled" | "aiGenerated">;
 declare const InputSearch: React.ForwardRefExoticComponent<InputSearchProperties & React.InputHTMLAttributes<HTMLInputElement> & React.RefAttributes<HTMLInputElement>>;
-export type InputSkeletonProperties = Partial<Pick<SkeletonProps, "width" | "data-testid">>;
+export type InputSkeletonProperties = Partial<Pick<SkeletonProps, "width" | "className" | "data-testid">>;
 export type InputSkeletonProps = InputSkeletonProperties;
 declare const InputSkeleton: React.FC<InputSkeletonProps>;
 export interface InputComponents {
@@ -2745,7 +2745,7 @@ export interface InputProperties {
 export type InputBaseProps = InputProperties & InputHTMLAttributes<HTMLInputElement>;
 export declare const Input: React.ForwardRefExoticComponent<InputProperties & React.InputHTMLAttributes<HTMLInputElement> & React.RefAttributes<HTMLInputElement>> & InputComponents;
 export type InputProps = ComponentPropsWithRef<typeof Input>;
-export type LabelSkeletonProperties = Partial<Pick<SkeletonProps, "width">> & Partial<Pick<SkeletonProps, "height">> & {
+export type LabelSkeletonProperties = Partial<Pick<SkeletonProps, "width" | "height" | "className">> & {
 	/**
 	 * This is an attribute used to identify a DOM node for testing purposes.
 	 */
@@ -2774,7 +2774,7 @@ export interface LabelProperties {
 }
 export type LabelProps = LabelProperties & HTMLAttributes<HTMLElement>;
 export declare const Label: React.FC<LabelProps> & LabelComponents;
-export type LinkSkeletonProperties = Partial<Pick<SkeletonProps, "width" | "data-testid">>;
+export type LinkSkeletonProperties = Partial<Pick<SkeletonProps, "width" | "className" | "data-testid">>;
 export type LinkSkeletonProps = LinkSkeletonProperties;
 declare const LinkSkeleton: React.FC<LinkSkeletonProps>;
 export interface LinkComponents {
@@ -2864,7 +2864,7 @@ export interface ListProperties {
 }
 export type ListProps = ListProperties & HTMLAttributes<HTMLUListElement | HTMLOListElement>;
 export declare const List: React.FC<ListProps> & ListComponents;
-export type MultiSelectSkeletonProperties = Partial<Pick<SkeletonProps, "width" | "data-testid">>;
+export type MultiSelectSkeletonProperties = Partial<Pick<SkeletonProps, "width" | "className" | "data-testid">>;
 export type MultiSelectSkeletonProps = MultiSelectSkeletonProperties & HTMLAttributes<HTMLDivElement>;
 declare const MultiSelectSkeleton: React.FC<MultiSelectSkeletonProps>;
 export interface MultiSelectComponents {
@@ -2981,7 +2981,7 @@ export interface PopoverProperties extends PopoverSprinkle {
 }
 export type PopoverProps = PopoverProperties & Omit<HTMLAttributes<HTMLDivElement>, "children" | "content">;
 export declare const Popover: React.FC<PopoverProps>;
-export type RadioSkeletonProperties = Partial<Pick<SkeletonProps, "width">> & Partial<Pick<RadioProps, "as">> & {
+export type RadioSkeletonProperties = Partial<Pick<SkeletonProps, "width" | "className">> & Partial<Pick<RadioProps, "as">> & {
 	/**
 	 * This is an attribute used to identify a DOM node for testing purposes.
 	 */
@@ -3042,7 +3042,7 @@ export interface SelectOptionProperties {
 }
 export type SelectOptionProps = SelectOptionProperties & OptionHTMLAttributes<HTMLOptionElement>;
 declare const SelectOption: React.FC<SelectOptionProps>;
-export type SelectSkeletonProperties = Partial<Pick<SkeletonProps, "width" | "data-testid">>;
+export type SelectSkeletonProperties = Partial<Pick<SkeletonProps, "width" | "className" | "data-testid">>;
 export type SelectSkeletonProps = SelectSkeletonProperties;
 declare const SelectSkeleton: React.FC<SelectSkeletonProps>;
 export interface SelectComponents {
@@ -3196,14 +3196,14 @@ export interface SliderRangeProperties extends SliderCommonProperties {
 /**
  * Props for single value slider mode.
  */
-export type SliderBaseProps = SliderProperties & Omit<HTMLAttributes<HTMLDivElement>, "onChange" | "className" | "style">;
+export type SliderBaseProps = SliderProperties & Omit<HTMLAttributes<HTMLDivElement>, "onChange" | "style">;
 /**
  * Props for range slider mode.
  */
 export type SliderRangeBaseProps = SliderRangeProperties & Omit<HTMLAttributes<HTMLDivElement>, "onChange" | "className" | "style">;
 declare const SliderRange: React.ForwardRefExoticComponent<SliderRangeProperties & Omit<React.HTMLAttributes<HTMLDivElement>, "className" | "style" | "onChange"> & React.RefAttributes<HTMLDivElement>>;
 export type SliderRangeProps = ComponentPropsWithRef<typeof SliderRange>;
-declare const SliderBase: React.ForwardRefExoticComponent<SliderProperties & Omit<React.HTMLAttributes<HTMLDivElement>, "className" | "style" | "onChange"> & React.RefAttributes<HTMLDivElement>>;
+declare const SliderBase: React.ForwardRefExoticComponent<SliderProperties & Omit<React.HTMLAttributes<HTMLDivElement>, "style" | "onChange"> & React.RefAttributes<HTMLDivElement>>;
 /**
  * Slider component with Range subcomponent.
  *
@@ -3215,11 +3215,11 @@ declare const SliderBase: React.ForwardRefExoticComponent<SliderProperties & Omi
  * // Range slider
  * <Slider.Range minValue={25} maxValue={75} onChange={(min, max) => console.log(min, max)} />
  */
-export declare const Slider: React.ForwardRefExoticComponent<SliderProperties & Omit<React.HTMLAttributes<HTMLDivElement>, "className" | "style" | "onChange"> & React.RefAttributes<HTMLDivElement>> & {
+export declare const Slider: React.ForwardRefExoticComponent<SliderProperties & Omit<React.HTMLAttributes<HTMLDivElement>, "style" | "onChange"> & React.RefAttributes<HTMLDivElement>> & {
 	Range: React.ForwardRefExoticComponent<SliderRangeProperties & Omit<React.HTMLAttributes<HTMLDivElement>, "className" | "style" | "onChange"> & React.RefAttributes<HTMLDivElement>>;
 };
 export type SliderProps = ComponentPropsWithRef<typeof SliderBase>;
-export type TagSkeletonProperties = Partial<Pick<SkeletonProps, "width">> & Partial<Pick<SkeletonProps, "height">> & {
+export type TagSkeletonProperties = Partial<Pick<SkeletonProps, "width" | "height" | "className">> & {
 	/**
 	 * This is an attribute used to identify a DOM node for testing purposes.
 	 */
@@ -3246,7 +3246,7 @@ export type TagProps = TagProperties & HTMLAttributes<HTMLDivElement>;
 export declare const Tag: React.FC<TagProps> & TagComponents;
 export type TextSkeletonProperties = {
 	fontSize?: keyof typeof text.properties.fontSize;
-} & Partial<Pick<SkeletonProps, "width" | "height" | "data-testid">>;
+} & Partial<Pick<SkeletonProps, "width" | "height" | "className" | "data-testid">>;
 export type TextSkeletonProps = TextSkeletonProperties;
 declare const TextSkeleton: React.FC<TextSkeletonProps>;
 export interface TextComponents {
@@ -3266,7 +3266,7 @@ export interface TextProperties extends Omit<TextSprinkle, "WebkitLineClamp"> {
 }
 export type TextProps = TextProperties & Omit<TextSprinkle, "WebkitLineClamp"> & HTMLAttributes<HTMLParagraphElement>;
 export declare const Text: React.FC<TextProps> & TextComponents;
-export type TextareaSkeletonProperties = Partial<Pick<SkeletonProps, "width" | "data-testid">>;
+export type TextareaSkeletonProperties = Partial<Pick<SkeletonProps, "width" | "className" | "data-testid">>;
 export type TextareaSkeletonProps = TextareaSkeletonProperties;
 declare const TextareaSkeleton: React.FC<TextareaSkeletonProps>;
 export interface TextareaComponents {
@@ -3316,7 +3316,7 @@ export interface TextareaProperties {
 }
 export declare const Textarea: React.ForwardRefExoticComponent<TextareaProperties & React.TextareaHTMLAttributes<HTMLTextAreaElement> & React.InputHTMLAttributes<HTMLTextAreaElement> & React.RefAttributes<HTMLTextAreaElement>> & TextareaComponents;
 export type TextareaProps = ComponentPropsWithRef<typeof Textarea>;
-export type ThumbnailSkeletonProperties = Partial<Pick<ThumbnailProps, "aspectRatio">> & Partial<Pick<SkeletonProps, "width" | "data-testid">>;
+export type ThumbnailSkeletonProperties = Partial<Pick<ThumbnailProps, "aspectRatio">> & Partial<Pick<SkeletonProps, "width" | "className" | "data-testid">>;
 export type ThumbnailSkeletonProps = ThumbnailSkeletonProperties;
 declare const ThumbnailSkeleton: React.FC<ThumbnailSkeletonProps>;
 export interface ThumbnailComponents {
@@ -3345,7 +3345,7 @@ export interface ThumbnailProperties {
 }
 export type ThumbnailProps = ThumbnailProperties & ImgHTMLAttributes<HTMLImageElement>;
 export declare const Thumbnail: React.FC<ThumbnailProps> & ThumbnailComponents;
-export type TitleSkeletonProperties = Pick<TitleProps, "as"> & Partial<Pick<SkeletonProps, "width" | "height" | "data-testid">>;
+export type TitleSkeletonProperties = Pick<TitleProps, "as"> & Partial<Pick<SkeletonProps, "width" | "height" | "className" | "data-testid">>;
 export type TitleSkeletonProps = TitleSkeletonProperties;
 declare const TitleSkeleton: React.FC<TitleSkeletonProps>;
 export interface TitleComponents {
@@ -3421,7 +3421,7 @@ export interface ToastContextProps {
 	addToast: (toast: Omit<ToastProps, "autoClose">) => void;
 }
 export declare const useToast: () => ToastContextProps;
-export type ToggleSkeletonProperties = Partial<Pick<SkeletonProps, "width" | "data-testid">>;
+export type ToggleSkeletonProperties = Partial<Pick<SkeletonProps, "width" | "className" | "data-testid">>;
 export type ToggleSkeletonProps = ToggleSkeletonProperties;
 declare const ToggleSkeleton: React.FC<ToggleSkeletonProps>;
 export interface ToggleComponents {
@@ -3466,7 +3466,7 @@ export interface TooltipProperties extends TooltipSprinkle {
 }
 export type TooltipProps = TooltipProperties & HTMLAttributes<HTMLDivElement>;
 export declare const Tooltip: React.FC<TooltipProps>;
-export type ProgressBarSkeletonProperties = Partial<Pick<SkeletonProps, "width" | "height" | "data-testid">>;
+export type ProgressBarSkeletonProperties = Partial<Pick<SkeletonProps, "width" | "height" | "className" | "data-testid">>;
 declare const ProgressBarSkeleton: React.FC<ProgressBarSkeletonProperties>;
 export interface ProgressBarComponents {
 	Skeleton: typeof ProgressBarSkeleton;
@@ -3637,7 +3637,7 @@ export interface ControlledAccordionProperties extends AccordionBaseProperties {
 export type AccordionProps = (UncontrolledAccordionProperties | ControlledAccordionProperties) & Omit<HTMLAttributes<HTMLElement>, "onItemSelect" | "selectedItem">;
 export type AccordionProperties = AccordionBaseProperties & UncontrolledAccordionProperties & ControlledAccordionProperties;
 export declare const Accordion: React.FC<AccordionProps> & AccordionComponents;
-export type AlertSkeletonProperties = Partial<Pick<SkeletonProps, "width" | "height" | "data-testid">>;
+export type AlertSkeletonProperties = Partial<Pick<SkeletonProps, "width" | "height" | "className" | "data-testid">>;
 export type AlertSkeletonProps = AlertSkeletonProperties;
 declare const AlertSkeleton: React.FC<AlertSkeletonProps>;
 export interface AlertComponents {
@@ -4141,6 +4141,7 @@ export interface StepperItemProperties {
 }
 export type StepperItemProps = StepperItemProperties & HTMLAttributes<HTMLDivElement>;
 export interface StepperCardProperties {
+	className?: string;
 	/**
 	 * The content to be rendered inside the card container
 	 * @TJS-type React.ReactNode
@@ -4419,6 +4420,8 @@ export interface SegmentedControlButtonSkeletonProps {
 	width?: string;
 	/** Height of the skeleton button */
 	height?: string;
+	/** Additional CSS class name */
+	className?: string;
 }
 export type SegmentedControlButtonProperties = PropsWithChildren<{
 	/**
@@ -4534,7 +4537,7 @@ export interface SplitButtonActionProperties {
 	 */
 	disabled?: boolean;
 }
-export type SplitButtonActionProps = SplitButtonActionProperties & Pick<BoxProps, "backgroundColor" | "borderWidth" | "display" | "alignItems" | "gap" | "p" | "borderRadius">;
+export type SplitButtonActionProps = SplitButtonActionProperties & Pick<BoxProps, "className" | "backgroundColor" | "borderWidth" | "display" | "alignItems" | "gap" | "p" | "borderRadius">;
 declare const SplitButtonAction: React.FC<SplitButtonActionProps>;
 export interface SplitButtonPrimaryProperties {
 	/**