@xsolla/xui-input-payment 0.64.0-pr56.1768440195

package/native/index.d.mts

@@ -0,0 +1,83 @@
+import React, { InputHTMLAttributes, ReactNode } from 'react';
+
+/**
+ * Supported payment system keys
+ */
+type PaymentSystemKey = "visa" | "mastercard" | "amex" | "diners" | "maestro" | "unionpay" | "discover" | "jcb" | "aura" | "cartesbancaires" | "cirrus" | "dankort" | "elo" | "hipercard" | "mir" | "naranja" | "paypal" | "sodexo" | "uatp";
+interface InputPaymentProps extends Omit<InputHTMLAttributes<HTMLInputElement>, "size" | "onChange"> {
+    /**
+     * Property for specifying the value of the control.
+     */
+    value?: string;
+    /**
+     * Property to display the icon to the left of the content.
+     */
+    icon?: ReactNode;
+    /**
+     * Property for specifying the placeholder of the control.
+     */
+    placeholder?: string;
+    /**
+     * Event handler when the value changes (for controlled mode).
+     */
+    onChange?: (e: React.ChangeEvent<HTMLInputElement>) => void;
+    /**
+     * Event handler when the text changes (alternative to onChange).
+     */
+    onChangeText?: (text: string) => void;
+    /**
+     * Property for changing the size of the input.
+     */
+    size?: "xl" | "l" | "m" | "s" | "xs";
+    /**
+     * Property for specifying the name of the control.
+     */
+    name?: string;
+    /**
+     * Property for disabling the control and highlighting it as an inactive state.
+     */
+    disabled?: boolean;
+    /**
+     * Property for displaying an error message and highlighting the control as invalid.
+     */
+    errorMessage?: string;
+    /**
+     * Property for displaying an error and highlighting the control as invalid.
+     */
+    error?: boolean;
+    /**
+     * Property to specify the possible payment systems displayed on the right.
+     */
+    possiblePayments?: PaymentSystemKey[];
+    /**
+     * Property to set the maximum number of visible possible payment systems at the same time on the right side of the input.
+     */
+    maxVisiblePossiblePayments?: number;
+    /**
+     * Property to show the recognized payment system (all possible payment systems are hidden and only the current one passed by this prop is displayed).
+     */
+    recognizedPayment?: PaymentSystemKey;
+    /**
+     * Callback when card type is auto-detected from the input value.
+     */
+    onRecognizedPaymentChange?: (payment: PaymentSystemKey | null) => void;
+    /**
+     * Property to enable automatic payment system detection from input value.
+     */
+    autoDetect?: boolean;
+    /**
+     * Unique identifier for the input element. Used for accessibility linking.
+     */
+    id?: string;
+    /**
+     * Accessible label for screen readers when no visible label is present.
+     */
+    "aria-label"?: string;
+    /**
+     * Test identifier for the component.
+     */
+    testID?: string;
+}
+declare const InputPayment: React.ForwardRefExoticComponent<InputPaymentProps & React.RefAttributes<HTMLInputElement>>;
+
+export { InputPayment, type InputPaymentProps, type PaymentSystemKey };

package/native/index.d.ts

@@ -0,0 +1,83 @@
+import React, { InputHTMLAttributes, ReactNode } from 'react';
+
+/**
+ * Supported payment system keys
+ */
+type PaymentSystemKey = "visa" | "mastercard" | "amex" | "diners" | "maestro" | "unionpay" | "discover" | "jcb" | "aura" | "cartesbancaires" | "cirrus" | "dankort" | "elo" | "hipercard" | "mir" | "naranja" | "paypal" | "sodexo" | "uatp";
+interface InputPaymentProps extends Omit<InputHTMLAttributes<HTMLInputElement>, "size" | "onChange"> {
+    /**
+     * Property for specifying the value of the control.
+     */
+    value?: string;
+    /**
+     * Property to display the icon to the left of the content.
+     */
+    icon?: ReactNode;
+    /**
+     * Property for specifying the placeholder of the control.
+     */
+    placeholder?: string;
+    /**
+     * Event handler when the value changes (for controlled mode).
+     */
+    onChange?: (e: React.ChangeEvent<HTMLInputElement>) => void;
+    /**
+     * Event handler when the text changes (alternative to onChange).
+     */
+    onChangeText?: (text: string) => void;
+    /**
+     * Property for changing the size of the input.
+     */
+    size?: "xl" | "l" | "m" | "s" | "xs";
+    /**
+     * Property for specifying the name of the control.
+     */
+    name?: string;
+    /**
+     * Property for disabling the control and highlighting it as an inactive state.
+     */
+    disabled?: boolean;
+    /**
+     * Property for displaying an error message and highlighting the control as invalid.
+     */
+    errorMessage?: string;
+    /**
+     * Property for displaying an error and highlighting the control as invalid.
+     */
+    error?: boolean;
+    /**
+     * Property to specify the possible payment systems displayed on the right.
+     */
+    possiblePayments?: PaymentSystemKey[];
+    /**
+     * Property to set the maximum number of visible possible payment systems at the same time on the right side of the input.
+     */
+    maxVisiblePossiblePayments?: number;
+    /**
+     * Property to show the recognized payment system (all possible payment systems are hidden and only the current one passed by this prop is displayed).
+     */
+    recognizedPayment?: PaymentSystemKey;
+    /**
+     * Callback when card type is auto-detected from the input value.
+     */
+    onRecognizedPaymentChange?: (payment: PaymentSystemKey | null) => void;
+    /**
+     * Property to enable automatic payment system detection from input value.
+     */
+    autoDetect?: boolean;
+    /**
+     * Unique identifier for the input element. Used for accessibility linking.
+     */
+    id?: string;
+    /**
+     * Accessible label for screen readers when no visible label is present.
+     */
+    "aria-label"?: string;
+    /**
+     * Test identifier for the component.
+     */
+    testID?: string;
+}
+declare const InputPayment: React.ForwardRefExoticComponent<InputPaymentProps & React.RefAttributes<HTMLInputElement>>;
+
+export { InputPayment, type InputPaymentProps, type PaymentSystemKey };