// Generated by dts-bundle-generator v7.2.0

import React from 'react';
import { ButtonHTMLAttributes, HTMLAttributes, ReactNode } from 'react';

export interface Conditions<T> {
	xs?: T;
	md?: T;
	lg?: T;
	xl?: T;
	xxl?: T;
}
export type Cursor = "auto" | "pointer" | "not-allowed" | "grab" | "inherit";
declare const icon: {
	sprinkle: ((props: {
		color?: "currentColor" | "primary-interactive" | "primary-surface" | "primary-textLow" | "success-textLow" | "success-surface" | "warning-interactive" | "warning-surface" | "warning-textLow" | "danger-interactive" | "danger-surface" | "danger-textLow" | "neutral-background" | "neutral-interactive" | "neutral-surface" | "neutral-textLow" | "neutral-textHigh" | "success-interactive" | "ai-generative" | "primary-textHigh" | "success-interactivePressed" | "success-textHigh" | "warning-textHigh" | "danger-textHigh" | "neutral-textDisabled" | "ai-gradientPurpleHigh" | undefined;
		cursor?: Cursor | undefined;
	}) => string) & {
		properties: Set<"color" | "cursor">;
	};
	properties: {
		color: {
			currentColor: string;
			"primary-surface": `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
			"primary-interactive": `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
			"primary-textLow": `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
			"primary-textHigh": `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
			"success-surface": `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
			"success-interactive": `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
			"success-interactivePressed": `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
			"success-textLow": `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
			"success-textHigh": `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
			"warning-surface": `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
			"warning-interactive": `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
			"warning-textLow": `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
			"warning-textHigh": `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
			"danger-surface": `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
			"danger-interactive": `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
			"danger-textLow": `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
			"danger-textHigh": `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
			"neutral-background": `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
			"neutral-surface": `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
			"neutral-interactive": `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
			"neutral-textLow": `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
			"neutral-textDisabled": `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
			"neutral-textHigh": `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
			"ai-gradientPurpleHigh": `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
			"ai-generative": string;
		};
		cursor: Cursor[];
	};
	classnames: {
		base: string;
	};
};
declare const propertiesIconButton: {
	backgroundColor: {
		transparent: string;
		"neutral-surface": `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
		"neutral-interactive": `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
		"neutral-surfaceHighlight": `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
		"ai-generativeSurface": `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
	};
	borderColor: {
		"neutral-interactive": `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
		"neutral-interactiveHover": `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
		"neutral-interactivePressed": `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
		"primary-interactive": `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
		transparent: string;
		"neutral-surface": `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
		"neutral-surfaceHighlight": `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
		"ai-generativeSurface": `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
	};
};
export type IconButtonBackgroundColorProperties = keyof typeof propertiesIconButton.backgroundColor;
export type IconButtonBorderColorProperties = keyof typeof propertiesIconButton.borderColor;
export interface IconButtonConditions<T> extends Conditions<T> {
	focus?: T;
	active?: T;
	hover?: T;
}
export interface IconButtonSprinkle {
	/**
	 * The size of the component.
	 * @default 2.75rem
	 */
	size?: string | IconButtonConditions<string>;
	/**
	 * The borderColor property sets the color of the icon button's four borders.
	 * @default { xs: "neutral-interactive", active: "neutral-interactivePressed", hover: "neutral-interactiveHover", focus: "primary-interactive" }
	 */
	borderColor?: IconButtonBorderColorProperties | IconButtonConditions<IconButtonBorderColorProperties>;
	/**
	 * The backgroundColor property sets the background color of the icon button.
	 * @default {  xs: "neutral-surface", active: "neutral-interactive", hover: "neutral-surfaceHighlight" }
	 */
	backgroundColor?: IconButtonBackgroundColorProperties | IconButtonConditions<IconButtonBackgroundColorProperties>;
}
export interface SkeletonProperties {
	/**
	 * Width of the skeleton. Useful when the skeleton is inside an inline element with no width of its own.
	 */
	width: string;
	/**
	 * Height of the skeleton. Useful when you don't want to adapt the skeleton to a text element but for instance a card.
	 */
	height: string;
	/**
	 * The border radius of the skeleton.
	 */
	borderRadius?: string;
	/**
	 * This is an attribute used to identify a DOM node for testing purposes.
	 */
	"data-testid"?: string;
}
export type SkeletonProps = SkeletonProperties & HTMLAttributes<HTMLDivElement>;
export interface IconProperties {
	/**
	 * The SVG contents to display in the Icon.
	 * @TJS-type React.ReactNode
	 */
	source: ReactNode;
	/**
	 * Set the color for the SVG fill.
	 * Use "ai-generative" to apply the Nimbus AI generative gradient.
	 * @default neutral-textLow
	 */
	color?: keyof typeof icon.properties.color | "ai-generative";
	/**
	 * The cursor property specifies the mouse cursor to be displayed when pointing over an element.
	 * @default inherit
	 */
	cursor?: (typeof icon.properties.cursor)[number];
}
export type IconProps = IconProperties & HTMLAttributes<HTMLDivElement>;
export type IconButtonSkeletonProperties = Partial<Pick<SkeletonProps, "width" | "height" | "className">> & {
	/**
	 * This is an attribute used to identify a DOM node for testing purposes.
	 */
	"data-testid"?: string;
};
export type IconButtonSkeletonProps = IconButtonSkeletonProperties;
export declare const IconButtonSkeleton: React.FC<IconButtonSkeletonProps>;
export interface IconButtonComponents {
	Skeleton: typeof IconButtonSkeleton;
}
export interface IconButtonProperties extends IconButtonSprinkle {
	/**
	 * Type of html tag to create for the Icon Button component.
	 * @default button
	 */
	as?: "button" | "div";
	/**
	 * The SVG contents to display in the Icon button.
	 * @TJS-type React.ReactNode
	 */
	source: ReactNode;
	/**
	 * Set the color for the inner Icon fill.
	 * @default neutral-textHigh
	 */
	color?: IconProps["color"];
	/**
	 * AI gradient background appearance for the button container.
	 * When provided, container color/border sprinkles are ignored in favor of gradient styles.
	 */
	appearance?: "ai-generative";
}
export type IconButtonProps = IconButtonProperties & ButtonHTMLAttributes<HTMLButtonElement | HTMLDivElement>;
export declare const IconButton: React.FC<IconButtonProps> & IconButtonComponents;

export {};