
"use client";
import { UniversalSelectProps } from "../../../types/dist/index.js";
import { IconPropsWithSVGProps } from "../../../tokens/types.js";
import { SelectTriggerProps } from "./SelectTrigger.js";
import * as _$react from "react";
import { SelectProviderProps } from "@ariakit/react";

//#region src/components/client/Select/Select.d.ts
type DataAttributes = {
  [name: `data-${string}`]: string;
};
interface SelectProps extends Pick<UniversalSelectProps, 'label' | 'disabled' | 'required' | 'helpText' | 'helperTextIcon' | 'hasError' | 'size' | 'startIcon' | 'endIcon' | 'reduceMotion' | 'readOnly' | 'width'>, Omit<SelectProviderProps, 'children' | 'setValue'> {
  children?: React.ReactNode;
  /** Placeholder text shown when no value is selected. */
  placeholder?: string;
  /** Native form field name. Renders a hidden `<select>` for form submission. */
  name?: string;
  className?: string;
  style?: React.CSSProperties;
  /** Called when the selected value changes. Alias for Ariakit `setValue`. */
  onChange?: (value: string) => void;
  setValue?: SelectProviderProps['setValue'];
  slotProps?: {
    root?: Partial<React.HTMLAttributes<HTMLDivElement> & DataAttributes>;
    label?: Partial<React.LabelHTMLAttributes<HTMLLabelElement> & DataAttributes>;
    trigger?: SelectTriggerProps['slotProps'];
    helperText?: Partial<React.HTMLAttributes<HTMLSpanElement> & DataAttributes>;
    helperTextIcon?: Partial<IconPropsWithSVGProps & DataAttributes>;
  };
}
/**
 * **⚙️ A composable Select component**
 *
 * @componentType Client component
 *
 * @description
 * Select lets users pick one value from a list. Compose with `SelectContent` and
 * `SelectItem`, similar to `Tabs` with `TabList` and `Tab`.
 *
 * @example
 * ```tsx
 * 'use client';
 * import { Select, SelectContent, SelectItem } from '@yahoo/uds';
 *
 * <Select label="Country" placeholder="Select a country" defaultValue="us">
 *   <SelectContent>
 *     <SelectItem value="us">United States</SelectItem>
 *     <SelectItem value="ca">Canada</SelectItem>
 *   </SelectContent>
 * </Select>
 * ```
 */
declare const Select: _$react.ForwardRefExoticComponent<SelectProps & _$react.RefAttributes<HTMLButtonElement>>;
//#endregion
export { Select, type SelectProps };