@cimpress/react-components/dist/src/CurrencySelector/CurrencySelector.d.ts

React components to support the MCP styleguide

import { PureComponent, ReactNode } from 'react';
import { StylesConfig, GroupBase } from 'react-select';
import { PublicComponentProps } from '../types';
type IsMulti = boolean;
type Group = GroupBase<unknown>;
/** The callback argument to the `onChange` event of a `CurrencySelector`. */
export interface CurrencyChangeArg {
    /** The ISO 4217 code for the selected currency. */
    value: string;
    /** The name of the selected currency's originating country or region. */
    label: string;
    /** An image of the flag of the selected currency's country or region. */
    flag: ReactNode;
    /** The symbol representing the currency. For example, '$'. */
    symbol: string;
    /** The name of the currency's originating country or region. */
    country: string;
    /** The ISO 3611-1 Alpha-2 code for the currency's originating country or region. */
    iso2: string;
}
/** The properties used to initialize a `CurrencySelector` component. */
interface BaseCurrencySelectorProps extends PublicComponentProps {
    /** Array of strings representing the currently selected currency code(s). */
    currency?: string | string[];
    /** Boolean determining whether to disable the selector. */
    isDisabled?: boolean;
    /** A list of ISO 4217 3-letter currency codes to disable. If this prop is used, the passed currencies will be visible but not selectable. */
    disabledCurrencies?: string[];
    /** A list of ISO 4217 3-letter currency codes to restrict to. If this prop is used only the passed currencies will be displayed */
    allowedCurrencies?: string[];
    /** The label for the currency selector. */
    label?: string;
    /** Boolean determining whether to display full currency names or 3-character currency codes. */
    displayFullName?: boolean;
    /** Boolean determining whether the Select element is clearable. */
    isClearable?: boolean;
    /** Inline styles to be applied to the root currency selector div. */
    styles?: StylesConfig<unknown, IsMulti, Group>;
}
interface MultiCurrencySelectorProps extends BaseCurrencySelectorProps {
    /** Boolean determining whether the currency selector allows multiple values to be selected. */
    isMulti: true;
    /** Array of strings representing the currently selected currency code(s). */
    currency?: string[];
    /** Callback function that is fired when a user selects a currency. */
    /** When isMulti is true, this will be called with a list of currencies. */
    onChange?: (e: CurrencyChangeArg[]) => void;
}
interface SingleCurrencySelectorProps extends BaseCurrencySelectorProps {
    /** Boolean determining whether the currency selector allows multiple values to be selected. */
    isMulti?: false;
    /** String representing the currently selected currency code(s). */
    currency?: string;
    /** Callback function that is fired when a user selects a currency. */
    /** When isMulti is false, this will be called with a single currency. */
    onChange?: (e: CurrencyChangeArg) => void;
}
export type CurrencySelectorProps = SingleCurrencySelectorProps | MultiCurrencySelectorProps;
export declare class CurrencySelector extends PureComponent<CurrencySelectorProps> {
    static defaultProps: CurrencySelectorProps;
    onChangeCurrency: (currency: any) => void;
    getCurrencyCodes: import("memoize-one").MemoizedFn<(disabledCurrencies: string[] | undefined, allowedCurrencies: string[] | undefined) => {
        value: string;
        flag: string;
        label: string;
        country: string;
        symbol: string;
        iso2: string;
    }[]>;
    getCurrencyValue: (codeOptions: CurrencyChangeArg[]) => CurrencyChangeArg | CurrencyChangeArg[];
    render(): JSX.Element;
}
export {};
//# sourceMappingURL=CurrencySelector.d.ts.map