import { EventName } from '@lit/react';
import { default as Component } from '../../components/switch/switch.component.js';
import { DdsChangeEvent, DdsBlurEvent, DdsFocusEvent, DdsInputEvent } from '../../events/events';
export type { DdsChangeEvent } from '../../events/events';
export type { DdsBlurEvent } from '../../events/events';
export type { DdsFocusEvent } from '../../events/events';
export type { DdsInputEvent } from '../../events/events';
/**
* `dap-ds-switch`
* @summary A switch is a graphical control element that allows the user to toggle between two states.
* @element dap-ds-switch
* @title - Switch
*
* @property {string} name - The name of the switch.
* @property {string} value - The value of the switch.
* @property {string} label - The label of the switch.
* @property {string} description - The description of the switch.
* @property {boolean} checked - The checked state of the switch.
* @property {'xs' | 'sm' | 'lg'} size - The size of the switch.
* @property {boolean} disabled - The disabled state of the switch.
* @property {boolean} readonly - Whether the switch is readonly (cannot be changed but value is submitted with form).
* @property {boolean} required - The required state of the switch.
* @property {'left' | 'right'} labelPlacement - The placement of the label.
* @property {'top' | 'bottom'} descriptionPlacement - The placement of the description.
* @property {boolean} subtle - The weight of the label.
* @property {string} feedback - The feedback of the switch.
* @property {'negative' | 'positive' | 'warning'} feedbackType - The feedback type of the switch.
* @property {boolean} optional - The optional state of the switch.
* @property {string} optionalLabel - The optional label of the switch.
*
* @cssProperty --dds-switch-width - Width of the switch control (default: var(--dds-spacing-1000)
* @cssProperty --dds-switch-height - Height of the switch control (default: var(--dds-spacing-600))
* @cssProperty --dds-switch-thumb-width - Width of the switch thumb (default: var(--dds-spacing-500))
* @cssProperty --dds-switch-thumb-height - Height of the switch thumb (default: var(--dds-spacing-500))
* @cssProperty --dds-switch-thumb-margin - Margin around the switch thumb (default: 0.125rem)
* @cssProperty --dds-switch-thumb-color - Color of the switch thumb (default: var(--dds-button-primary-icon-enabled))
* @cssProperty --dds-switch-unchecked-bg - Background color of the switch when unchecked (default: var(--dds-background-neutral-base-inverted))
* @cssProperty --dds-switch-checked-bg - Background color of the switch when checked (default: var(--dds-background-brand-base-inverted))
* @cssProperty --dds-switch-invalid-bg - Background color of the switch when invalid (default: var(--dds-background-negative-base-inverted))
* @cssProperty --dds-switch-disabled-bg - Background color of the switch when disabled (default: var(--dds-background-neutral-disabled))
* @cssProperty --dds-switch-readonly-bg - Background color of the switch when readonly (default: var(--dds-background-neutral-disabled))
* @cssProperty --dds-switch-wrapper-padding - Padding of the switch wrapper (default: var(--dds-spacing-400))
* @cssProperty --dds-switch-wrapper-bg - Background color of the switch wrapper (default: var(--dds-background-neutral-subtle))
* @cssProperty --dds-switch-border-color - Border color of the switch (default: var(--dds-border-neutral-subtle))
* @cssProperty --dds-switch-high-contrast-border-color - Border color of the switch in high contrast mode (default: var(--dds-border-neutral-transparent-interactive, #fff500))
*
* @event {{ value: string }} dds-change - Fired when the input value changes.
* @event {{ void }} dds-blur - Emitted when the input loses focus.
* @event {{ void }} dds-focus - Emitted when the input gains focus.
* @event {{ value: string }} dds-input - Emitted when the input receives input.
*
* @csspart base - The main switch container.
* @csspart baselabel - The main label container
* @csspart label - The label of the switch.
* @csspart input - The native input of the switch.
* @csspart control - The control of the switch.
* @csspart description - The description of the switch.
*/
declare const reactWrapper: import('@lit/react').ReactWebComponent<Component, {
    onDdsChange: EventName<DdsChangeEvent>;
    onDdsBlur: EventName<DdsBlurEvent>;
    onDdsFocus: EventName<DdsFocusEvent>;
    onDdsInput: EventName<DdsInputEvent>;
}>;
export default reactWrapper;