@snowball-tech/fractal/dist/InputPhone/InputPhone.types.d.ts

Fractal's (Snowball's design system) React component library based on RadixUI and PandaCSS

import { CountryCode } from 'libphonenumber-js';
import { HTMLAttributes, ReactNode } from 'react';
import { SelectProps, CombinedRefs as CombinedRefs$1 } from '../Select/Select.types.js';
import '@radix-ui/react-select';

type CountryDetails = {
    countryCode: CountryCode;
    countryName: string;
    flag: string;
    prefix: string;
};
type PhoneNumber = {
    number: string;
    countryCode?: CountryCode | undefined;
};
type Prefix = {
    prefix: string;
    countryCode?: CountryCode | undefined;
};
type CombinedRefs = {
    phone: HTMLInputElement | null;
    prefix: CombinedRefs$1 | null;
    searchPrefixInput: HTMLInputElement | null;
};
interface InputPhoneProps extends Omit<HTMLAttributes<HTMLDivElement>, 'defaultValue' | 'onChange' | 'placeholder'> {
    autoFocus?: boolean;
    defaultValue?: PhoneNumber;
    description?: ReactNode;
    disabled?: boolean;
    emptyPrefixLabel?: ReactNode;
    error?: Error | ReactNode;
    fullWidth?: boolean;
    id?: string;
    label?: ReactNode;
    labelElement?: keyof HTMLElementTagNameMap;
    name?: string;
    placeholder?: string;
    prefixSelect?: Omit<Partial<SelectProps>, 'children' | 'defaultValue' | 'id' | 'required' | 'value'>;
    readOnly?: boolean;
    required?: boolean;
    searchPlaceholder?: string;
    success?: ReactNode;
    updateOnInvalid?: boolean;
    value?: PhoneNumber;
    withPrefix?: boolean;
    onChange?: (newPhoneNumber: PhoneNumber, isValid?: boolean) => void;
}

export type { CombinedRefs, CountryDetails, InputPhoneProps, PhoneNumber, Prefix };