@payfit/unity-components/dist/esm/components/phone-number/TanstackPhoneNumberInput.d.ts

import { PhoneNumberInputProps } from './PhoneNumberInput.js';
export type TanstackPhoneNumberInputProps = Omit<PhoneNumberInputProps, 'value' | 'isInvalid'>;
/**
 * The `TanstackPhoneNumberInput` component renders a phone number input field
 * wired to the TanStack Form context. It manages state and accessibility via the
 * context provided by `useTanstackUnityForm` and `<form.AppField name="…">`.
 *
 * Behavior:
 * - Displays a phone number input with integrated country selector and automatic formatting.
 * - The field value and invalid state are derived from the TanStack form context.
 * - Supports searchable country dropdown and full keyboard navigation.
 *
 * Accessibility:
 * - Automatically wires `aria-labelledby`, `aria-describedby` (helper/feedback), and
 *   `aria-details` using identifiers from the `a11y` context.
 *
 * Key props:
 * - `defaultCountry?: CountryIso2` — default country code (ISO 3166-1 alpha-2).
 * - `placeholder?: string` — placeholder text displayed when the field is empty.
 * - `prefix?: string` — prefix character for phone numbers (default: '+').
 * - `onChange?: (phone: string) => void` — callback when phone number changes.
 * - `onClearButtonPress?: () => void` — callback when clear button is pressed.
 * - Inherits all props from `PhoneNumberInputProps` except `value` and `isInvalid`.
 * @example
 * ```tsx
 * import { TanstackPhoneNumberInput } from '@/components/phone-number/TanstackPhoneNumberInput'
 * import { useTanstackUnityForm } from '@/hooks/use-tanstack-form'
 * import * as z from 'zod'
 *
 * function Example() {
 *   const schema = z.object({
 *     phoneNumber: z.e164({ message: 'Invalid phone number' }),
 *   })
 *
 *   const form = useTanstackUnityForm({
 *     validators: {
 *       onBlur: schema,
 *     },
 *   })
 *
 *   return (
 *     <form.AppForm>
 *       <form.Form>
 *         <form.AppField name="phoneNumber">
 *           {field => (
 *             <field.PhoneNumberInput
 *               aria-label="Phone number"
 *               defaultCountry="fr"
 *               placeholder="+33 6 12 34 56 78"
 *             />
 *           )}
 *         </form.AppField>
 *       </form.Form>
 *     </form.AppForm>
 *   )
 * }
 * ```
 * @remarks Migration from `PhoneNumberInput` (non‑TanStack):
 * - Do not pass `value` or `isInvalid` props: these are derived from the TanStack form context.
 * - Use `<form.AppField name="…">` to provide the field context.
 * @see Storybook docs: https://unity-components.payfit.io/?path=/docs/forms-field-components-phonenumber--docs
 */
declare const TanstackPhoneNumberInput: import('react').ForwardRefExoticComponent<TanstackPhoneNumberInputProps & import('react').RefAttributes<HTMLInputElement>>;
export { TanstackPhoneNumberInput };