import { EventName } from '@lit/react';
import { default as Component } from '../../components/button/button.component.js';
import { DdsLoadingTimeoutEvent } from '../../events/events';
export type { DdsLoadingTimeoutEvent } from '../../events/events';
/**
* `dap-ds-button` is a versatile button component for triggering actions and navigation.
* @element dap-ds-button
* @summary A button is a clickable element that can be used to trigger an action, submit forms, or navigate to other pages.
* @title - Button
*
* @example Basic Usage
* ```html
* <dap-ds-button>Click me</dap-ds-button>
* <dap-ds-button variant="outline">Secondary action</dap-ds-button>
* <dap-ds-button href="/dashboard">Navigate</dap-ds-button>
* ```
*
* @example Form Integration
* ```html
* <form>
*   <dap-ds-button htmlType="submit">Submit Form</dap-ds-button>
*   <dap-ds-button htmlType="reset" variant="outline">Reset</dap-ds-button>
* </form>
* ```
*
* @example Accessibility
* ```html
* <!-- Icon-only buttons require aria-label -->
* <dap-ds-button aria-label="Close dialog" shape="circle">
*   <dap-ds-icon name="close-line"></dap-ds-icon>
* </dap-ds-button>
* ```
*
* @property {string} sizeMap - The size map of the button.
* @example
* ```html
* <dap-ds-button sizeMap="sm:lg,xs:xs">Small</dap-ds-button>
* ```
*
* @event dds-loading-timeout - Emitted when the loading timeout is reached
*
* @slot - The content of the button. Can contain text, icons, or other elements.
*
* @csspart base - The main button container.
* @csspart high-contrast - The high contrast part of the button.
* @csspart content - The content wrapper inside the button.
*
* @cssproperty --dds-button-padding-x - Horizontal padding of the button (default: var(--dds-spacing-300))
* @cssproperty --dds-button-padding-y - Vertical padding of the button (default: var(--dds-spacing-300))
* @cssproperty --dds-button-border-radius - Border radius of the button (default: var(--dds-radius-rounded))
* @cssproperty --dds-button-font-weight - Font weight of the button (default: 700)
* @cssproperty --dds-button-line-height - Line height of the button (default: var(--dds-font-line-height-large))
* @cssproperty --dds-button-transition - Transition property of the button (default: all 0.2s ease-in-out)
* @cssproperty --dds-button-disabled-opacity - Opacity of disabled button (default: 0.5)
*
* @cssproperty --dds-button-size-lg - Size of large button (default: var(--dds-spacing-1200))
* @cssproperty --dds-button-size-md - Size of medium button (default: var(--dds-spacing-1000))
* @cssproperty --dds-button-size-sm - Size of small button (default: var(--dds-spacing-800))
* @cssproperty --dds-button-size-xs - Size of extra small button (default: var(--dds-spacing-600))
*
* @cssproperty --dds-button-circle-lg - Size of large circle button (default: var(--dds-spacing-1200))
* @cssproperty --dds-button-circle-md - Size of medium circle button (default: var(--dds-spacing-1000))
* @cssproperty --dds-button-circle-sm - Size of small circle button (default: var(--dds-spacing-800))
* @cssproperty --dds-button-circle-xs - Size of extra small circle button (default: var(--dds-spacing-600))
*
* Primary button properties:
* @cssproperty --dds-button-primary-color-bg - Background color of primary button (default: var(--dds-button-primary-background-enabled))
* @cssproperty --dds-button-primary-color-bg-hover - Background color of primary button on hover (default: var(--dds-button-primary-background-hover))
* @cssproperty --dds-button-primary-color-bg-active - Background color of primary button when active (default: var(--dds-button-primary-background-pressed))
* @cssproperty --dds-button-primary-color-bg-disabled - Background color of disabled primary button (default: var(--dds-button-primary-background-disabled))
* @cssproperty --dds-button-primary-color-text - Text color of primary button (default: var(--dds-button-primary-text-enabled))
* @cssproperty --dds-button-primary-color-text-disabled - Text color of disabled primary button (default: var(--dds-button-primary-text-disabled))
*
* Primary inverted button properties:
* @cssproperty --dds-button-primary-inverted-color-bg - Background color of primary inverted button (default: var(--dds-button-primary-background-inverted-enabled))
* @cssproperty --dds-button-primary-inverted-color-bg-hover - Background color of primary inverted button on hover (default: var(--dds-button-primary-background-inverted-hover))
* @cssproperty --dds-button-primary-inverted-color-bg-active - Background color of primary inverted button when active (default: var(--dds-button-primary-background-inverted-pressed))
* @cssproperty --dds-button-primary-inverted-color-bg-disabled - Background color of disabled primary inverted button (default: var(--dds-button-primary-background-inverted-disabled))
* @cssproperty --dds-button-primary-inverted-color-text - Text color of primary inverted button (default: var(--dds-button-primary-text-inverted))
* @cssproperty --dds-button-primary-inverted-color-text-disabled - Text color of disabled primary inverted button (default: var(--dds-button-primary-text-inverted-disabled))
*
* Outline button properties:
* @cssproperty --dds-button-outline-color-border - Border color of outline button (default: var(--dds-button-outline-border-enabled))
* @cssproperty --dds-button-outline-color-border-hover - Border color of outline button on hover (default: var(--dds-button-outline-border-hover))
* @cssproperty --dds-button-outline-color-border-active - Border color of outline button when active (default: var(--dds-button-outline-border-pressed))
* @cssproperty --dds-button-outline-color-border-disabled - Border color of disabled outline button (default: var(--dds-button-outline-border-disabled))
* @cssproperty --dds-button-outline-color-text - Text color of outline button (default: var(--dds-button-outline-text-enabled))
* @cssproperty --dds-button-outline-color-text-hover - Text color of outline button on hover (default: var(--dds-button-outline-text-hover))
* @cssproperty --dds-button-outline-color-text-active - Text color of outline button when active (default: var(--dds-button-outline-text-pressed))
* @cssproperty --dds-button-outline-color-text-disabled - Text color of disabled outline button (default: var(--dds-button-outline-text-disabled))
*
* Outline inverted button properties:
* @cssproperty --dds-button-outline-inverted-color-border - Border color of outline inverted button (default: var(--dds-button-outline-border-inverted-enabled))
* @cssproperty --dds-button-outline-inverted-color-border-hover - Border color of outline inverted button on hover (default: var(--dds-button-outline-border-inverted-hover))
* @cssproperty --dds-button-outline-inverted-color-border-active - Border color of outline inverted button when active (default: var(--dds-button-outline-border-inverted-pressed))
* @cssproperty --dds-button-outline-inverted-color-border-disabled - Border color of disabled outline inverted button (default: var(--dds-button-outline-border-inverted-disabled))
* @cssproperty --dds-button-outline-inverted-color-text - Text color of outline inverted button (default: var(--dds-button-outline-text-inverted-enabled))
* @cssproperty --dds-button-outline-inverted-color-text-hover - Text color of outline inverted button on hover (default: var(--dds-button-outline-text-inverted-hover))
* @cssproperty --dds-button-outline-inverted-color-text-active - Text color of outline inverted button when active (default: var(--dds-button-outline-text-inverted-pressed))
* @cssproperty --dds-button-outline-inverted-color-text-disabled - Text color of disabled outline inverted button (default: var(--dds-button-outline-text-inverted-disabled))
*
* Subtle button properties:
* @cssproperty --dds-button-subtle-color-bg - Background color of subtle button (default: var(--dds-button-subtle-background-enabled))
* @cssproperty --dds-button-subtle-color-bg-hover - Background color of subtle button on hover (default: var(--dds-button-subtle-background-hover))
* @cssproperty --dds-button-subtle-color-bg-active - Background color of subtle button when active (default: var(--dds-button-subtle-background-pressed))
* @cssproperty --dds-button-subtle-color-bg-disabled - Background color of disabled subtle button (default: var(--dds-button-subtle-background-disabled))
* @cssproperty --dds-button-subtle-color-border - Border color of subtle button (default: var(--dds-button-subtle-border-enabled))
* @cssproperty --dds-button-subtle-color-border-hover - Border color of subtle button on hover (default: var(--dds-button-subtle-border-hover))
* @cssproperty --dds-button-subtle-color-border-active - Border color of subtle button when active (default: var(--dds-button-subtle-border-pressed))
* @cssproperty --dds-button-subtle-color-border-disabled - Border color of disabled subtle button (default: var(--dds-button-subtle-border-disabled))
* @cssproperty --dds-button-subtle-color-text - Text color of subtle button (default: var(--dds-button-subtle-text-enabled))
* @cssproperty --dds-button-subtle-color-text-hover - Text color of subtle button on hover (default: var(--dds-button-subtle-text-hover))
* @cssproperty --dds-button-subtle-color-text-active - Text color of subtle button when active (default: var(--dds-button-subtle-text-pressed))
* @cssproperty --dds-button-subtle-color-text-disabled - Text color of disabled subtle button (default: var(--dds-button-subtle-text-disabled))
*
* Clean button properties:
* @cssproperty --dds-button-clean-color-text - Text color of clean button (default: var(--dds-text-link-base))
* @cssproperty --dds-button-clean-color-text-hover - Text color of clean button on hover (default: var(--dds-text-link-hover))
* @cssproperty --dds-button-clean-color-text-active - Text color of clean button when active (default: var(--dds-text-link-pressed))
* @cssproperty --dds-button-clean-color-text-disabled - Text color of disabled clean button (default: var(--dds-text-neutral-disabled))
*
* Clean inverted button properties:
* @cssproperty --dds-button-clean-inverted-color-text - Text color of clean inverted button (default: var(--dds-button-primary-text-inverted))
* @cssproperty --dds-button-clean-inverted-color-text-hover - Text color of clean inverted button on hover (default: var(--dds-button-primary-text-inverted))
* @cssproperty --dds-button-clean-inverted-color-text-active - Text color of clean inverted button when active (default: var(--dds-button-primary-text-inverted))
* @cssproperty --dds-button-clean-inverted-color-text-disabled - Text color of disabled clean inverted button (default: var(--dds-text-neutral-disabled))
*
* Danger button properties:
* @cssproperty --dds-button-danger-color-bg - Background color of danger button (default: var(--dds-button-primary-background-destructive-enabled))
* @cssproperty --dds-button-danger-color-bg-hover - Background color of danger button on hover (default: var(--dds-button-primary-background-destructive-hover))
* @cssproperty --dds-button-danger-color-bg-active - Background color of danger button when active (default: var(--dds-button-primary-background-destructive-pressed))
* @cssproperty --dds-button-danger-color-text - Text color of danger button (default: var(--dds-button-primary-text-enabled))
* @cssproperty --dds-button-danger-outline-color-border - Border color of danger outline button (default: var(--dds-button-outline-border-destructive-enabled))
* @cssproperty --dds-button-danger-outline-color-border-hover - Border color of danger outline button on hover (default: var(--dds-button-outline-border-destructive-hover))
* @cssproperty --dds-button-danger-outline-color-border-active - Border color of danger outline button when active (default: var(--dds-button-outline-border-destructive-pressed))
* @cssproperty --dds-button-danger-outline-color-text - Text color of danger outline button (default: var(--dds-button-outline-text-destructive-enabled))
* @cssproperty --dds-button-danger-outline-color-text-hover - Text color of danger outline button on hover (default: var(--dds-button-outline-text-destructive-hover))
* @cssproperty --dds-button-danger-outline-color-text-active - Text color of danger outline button when active (default: var(--dds-button-outline-text-destructive-pressed))
* @cssproperty --dds-button-danger-subtle-color-bg - Background color of danger subtle button (default: var(--dds-button-subtle-background-destructive-enabled))
* @cssproperty --dds-button-danger-subtle-color-bg-hover - Background color of danger subtle button on hover (default: var(--dds-button-subtle-background-destructive-hover))
* @cssproperty --dds-button-danger-subtle-color-bg-active - Background color of danger subtle button when active (default: var(--dds-button-subtle-background-destructive-pressed))
* @cssproperty --dds-button-danger-subtle-color-text - Text color of danger subtle button (default: var(--dds-button-subtle-text-destructive-enabled))
* @cssproperty --dds-button-danger-subtle-color-text-hover - Text color of danger subtle button on hover (default: var(--dds-button-subtle-text-destructive-hover))
* @cssproperty --dds-button-danger-subtle-color-text-active - Text color of danger subtle button when active (default: var(--dds-button-subtle-text-destructive-pressed))
* @cssproperty --dds-button-danger-clean-color-text - Text color of danger clean button (default: var(--dds-text-negative-subtle))
* @cssproperty --dds-button-danger-clean-color-text-hover - Text color of danger clean button on hover (default: var(--dds-text-negative-base))
* @cssproperty --dds-button-danger-clean-color-text-active - Text color of danger clean button when active (default: var(--dds-text-negative-strong))
*/
declare const reactWrapper: import('@lit/react').ReactWebComponent<Component, {
    onDdsLoadingTimeout: EventName<DdsLoadingTimeoutEvent>;
}>;
export default reactWrapper;