import { EventName } from '@lit/react'; import { default as Component } from '../../components/chip/chip.component.js'; import { DdsRemoveEvent, DdsSelectEvent } from '../../events/events'; export type { DdsRemoveEvent } from '../../events/events'; export type { DdsSelectEvent } from '../../events/events'; /** * `dap-ds-chip` * @summary A chip is a small status descriptor for UI elements. * @element dap-ds-chip * @title - Chip * * @property { 'sm' | 'lg' } size - The size of the chip. Default is `sm`. * @property {string} sizeMap - Responsive size map (e.g. "md:lg"). * * @event {{ value: string }} dds-remove - Fired when the chip is removed * @event {{ value?: string, selected: boolean }} dds-select - Fired when the chip is selected * * @csspart base - The base part * @csspart content-container - The container for the content * @csspart remove-button - The remove button * @csspart remove-icon - The icon of the remove icon * @csspart remove-icon-base - The base of the remove icon * @csspart remove-icon-base-base - The base of the remove icon base * * @cssproperty --dds-chip-border - Border of the chip (default: var(--dds-border-width-base) solid var(--dds-transparent-black-base)) * @cssproperty --dds-chip-border-radius - Border radius of the chip (default: var(--dds-radius-small)) * @cssproperty --dds-chip-font-weight - Font weight of the chip (default: var(--dds-font-weight-bold)) * @cssproperty --dds-chip-line-height - Line height of the chip (default: 1.5) * @cssproperty --dds-chip-transition - Transition timing for chip interactions (default: all 0.2s ease-in-out) * @cssproperty --dds-chip-padding-sm - Padding for small chip size (default: var(--dds-spacing-100) var(--dds-spacing-200)) * @cssproperty --dds-chip-padding-lg - Padding for large chip size (default: var(--dds-spacing-200) var(--dds-spacing-300)) * @cssproperty --dds-chip-font-size-sm - Font size for small chip size (default: var(--dds-font-xs)) * @cssproperty --dds-chip-font-size-lg - Font size for large chip size (default: var(--dds-font-xs)) * @cssproperty --dds-chip-background-color - Background color of the chip (default: var(--dds-background-neutral-base)) * @cssproperty --dds-chip-text-color - Text color of the chip (default: var(--dds-text-neutral-base)) * @cssproperty --dds-chip-hover-background-color - Background color of the chip on hover (default: var(--dds-background-neutral-medium)) * @cssproperty --dds-chip-active-background-color - Background color of the chip when active (default: var(--dds-background-neutral-strong)) * @cssproperty --dds-chip-selected-background-color - Background color of the selected chip (default: var(--dds-background-brand-medium)) * @cssproperty --dds-chip-selected-text-color - Text color of the selected chip (default: var(--dds-text-brand-subtle)) * @cssproperty --dds-chip-selected-border-color - Border color of the selected chip (default: var(--dds-border-brand-base)) * @cssproperty --dds-chip-disabled-background-color - Background color of the disabled chip (default: var(--dds-background-neutral-medium)) * @cssproperty --dds-chip-disabled-text-color - Text color of the disabled chip (default: var(--dds-text-neutral-subtle)) * */ declare const reactWrapper: import('@lit/react').ReactWebComponent; onDdsSelect: EventName; }>; export default reactWrapper;