payzli-ui-aryan
Version:
A custom react components library
150 lines (149 loc) • 4.59 kB
TypeScript
import { ISelectInput } from ".";
export interface IMaskInputProps {
type?: "number" | "tel" | "date";
mask?: string;
format?: string;
id: string;
value: string | number;
onChange: any;
className: string;
required: boolean;
optional?: boolean;
formSubmitted: boolean;
name: string;
label: string;
errorMessage?: string;
formClass?: string;
prefix?: string;
suffix?: string;
disableCopyPaste?: boolean;
onFocus?: any;
onBlur?: any;
disabled?: boolean;
placeholder?: string;
isError?: (err: {
[name: string]: string;
}) => void;
onCopy?: any;
onCut?: any;
onContextMenu?: any;
inputType?: "number-password";
allowNegative?: boolean;
skipValidation?: boolean;
skipValidationWithErrorIntact?: boolean;
transformPhrase?: (phrase: string, UiLanguage: string, params: any) => string;
UiLanguage?: string;
tooltip?: string;
hintText?: string;
sectionType?: "left" | "right" | "both" | "none";
sectionLeftIcon?: React.ReactNode;
sectionRightIcon?: React.ReactNode;
leftIconClass?: string;
inputMode?: "none" | "tel" | "numeric" | "decimal";
customValidator?: (value: string) => boolean;
maxLength?: number;
minLength?: number;
labelClass?: string;
tooltipIcon?: React.ReactNode;
autoComplete?: string;
}
export interface IPasswordInputProps {
inputType?: "password" | "text";
/** The ID of the input field. */
id: string;
name: string;
/** The value of the input field. */
value: string;
/** Callback function triggered when the input value changes. */
onChange: (e: React.ChangeEvent<HTMLInputElement>) => void;
/** The CSS class for the input field. */
className?: string;
/** The CSS class for the form group wrapping the input. */
formClass?: string;
/** The label for the input field. */
label?: string;
/** Placeholder text for the input field. */
placeholder?: string;
/** Error message to display when validation fails. */
errorMessage?: string;
/** Hint text to display below the input field. */
hintText?: string;
/** Disables copy-paste functionality if set to true. */
disableCopyPaste?: boolean;
/** Indicates whether the input is required. */
required?: boolean;
/** Indicates whether the form has been submitted. */
formSubmitted?: boolean;
/** Callback function triggered when the input gains focus. */
onFocus?: (e: React.FocusEvent<HTMLInputElement>) => void;
/** Callback function triggered when the input loses focus. */
onBlur?: (e: React.FocusEvent<HTMLInputElement>) => void;
/** Disables the input field if set to true. */
disabled?: boolean;
/** Translates phrases based on the UI language. */
transformPhrase?: (phrase: string, language: string, options?: object) => string;
/** Language for UI translations. */
UiLanguage?: string;
}
export interface IPhoneInput {
handleSelectCountryCode: (value: ISelectInput) => void;
countryCodeOptions: ISelectInput[];
selectedCountryCode: ISelectInput;
popupParentClass?: string;
isLoading?: boolean;
disableCurrency?: boolean;
id: string;
value: string | number;
onChange: any;
className: string;
required: boolean;
formSubmitted: boolean;
name: string;
label: string;
errorMessage?: string;
formClass?: string;
onFocus?: any;
onBlur?: any;
disabled?: boolean;
placeholder?: string;
isError?: (err: {
[name: string]: string;
}) => void;
skipValidation?: boolean;
transformPhrase?: (phrase: string, UiLanguage: string, params: any) => string;
UiLanguage?: string;
tooltip?: string;
hintText?: string;
mask?: string;
}
export interface ICardInputProps {
cardIcon?: React.ReactNode;
id: string;
value: string | number;
onChange: any;
className: string;
required: boolean;
formSubmitted: boolean;
name: string;
label: string;
errorMessage?: string;
formClass?: string;
disableCopyPaste?: boolean;
onFocus?: any;
onBlur?: any;
disabled?: boolean;
placeholder?: string;
isError?: (err: {
[name: string]: string;
}) => void;
onCopy?: any;
onCut?: any;
onContextMenu?: any;
skipValidation?: boolean;
transformPhrase?: (phrase: string, UiLanguage: string, params: any) => string;
UiLanguage?: string;
tooltip?: string;
hintText?: string;
mask?: string;
format?: string;
}